/* Minification failed. Returning unminified contents.
(113,15): run-time error CSS1030: Expected identifier, found '#survey-banner'
(113,30): run-time error CSS1031: Expected selector, found ')'
(113,30): run-time error CSS1025: Expected comma or open brace, found ')'
(16059,15): run-time error CSS1030: Expected identifier, found '#survey-banner'
(16059,30): run-time error CSS1031: Expected selector, found ')'
(16059,30): run-time error CSS1025: Expected comma or open brace, found ')'
 */
@keyframes menuNotificationGrowUp {
  0% {
    left: 0;
    top: 0;
    right: 0;
    bottom: 0;
    border-width: 1px;
    opacity: 1;
  }
  100% {
    left: -7px;
    top: -7px;
    right: -7px;
    bottom: -7px;
    border-width: 14px;
    opacity: 0;
  }
}
.badge-new {
  padding: 2px 6px;
  min-width: 20px;
  max-height: 20px;
  box-sizing: border-box;
  display: flex;
  align-items: center;
  justify-content: center;
  background-color: #ff9000;
  border-radius: 50px;
  font-size: 14px;
  line-height: 18px;
  color: white;
  position: relative;
}
.badge-new:after {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  border: 2px solid #ff9000;
  border-radius: 50px;
  animation: menuNotificationGrowUp 2s;
  animation-iteration-count: 3;
}
.indicator-new {
  width: 24px;
  height: 24px;
  background: url('/Content/images/indicator-new.svg') no-repeat;
}
body {
  text-size-adjust: 100%;
}
body.full-screen-demo {
  max-width: none;
}
body.full-screen-demo > .page-wrapper:after {
  content: "";
  display: block;
  height: 0;
}
body.full-screen-demo > .page-wrapper .simulator-wrapper .top-content {
  display: none;
}
body.full-screen-demo > .page-wrapper .description,
body.full-screen-demo > .page-wrapper .axe-block,
body.full-screen-demo > .page-wrapper .second-description {
  display: none;
}
body.full-screen-demo > .page-wrapper .content .demo-details {
  display: none;
}
body.full-screen-demo .content .doc-content {
  margin: -40px 0 0 0;
  padding: 0;
  display: block;
}
body.full-screen-demo .content .doc-content .simulators #git-demo-frame,
body.full-screen-demo .content .doc-content .simulators .demo-frame {
  min-height: 90vh;
}
body.full-screen-demo .content .doc-content .simulators .dx-loadpanel-content {
  position: absolute;
  margin: auto;
  top: 0;
  left: 0;
  bottom: 0;
  right: 0;
}
body.full-screen-demo .content .demo-nav-links button#fullScreenLink .link-button#open-full-screen {
  display: none;
}
body.full-screen-demo .content .demo-nav-links button#fullScreenLink .link-button#close-full-screen {
  display: block;
}
body.full-screen-demo footer.footer {
  display: none;
}
body.hidden-menu .menu-state-button .opened {
  display: none;
}
body.hidden-menu .menu-state-button .closed {
  display: flex;
  align-items: center;
}
body:not(.hidden-menu) .menu-state-button .opened {
  display: flex;
  align-items: center;
}
body:not(.hidden-menu) .menu-state-button .closed {
  display: none;
}
body:not(:has(#survey-banner)) .body-container.content-width {
  padding-bottom: 0;
}
@media (min-width: 1400px) {
  .components-list-container {
    column-count: 5;
    gap: unset;
  }
}
@media (max-width: 1400px) {
  .components-list-container {
    gap: 32px;
  }
  body:not(.hidden-menu) .components-list-container {
    column-count: 4;
  }
  .hidden-menu .components-list-container {
    column-count: 5;
  }
}
@media (max-width: 1200px) {
  body:not(.hidden-menu) .components-list-container {
    column-count: 3;
  }
  .hidden-menu .components-list-container {
    column-count: 4;
  }
}
@media (max-width: 992px) {
  body:not(.hidden-menu) .components-list-container {
    column-count: 2;
  }
  .hidden-menu .components-list-container {
    column-count: 3;
  }
}
@media (max-width: 576px) {
  .hidden-menu .components-list-container {
    column-count: 2;
  }
}
/* banner */

body.dx-swatch-dark .content .doc-content .simulators .demo-device .demo-display .load-panel .load-panel-banner-wrapper .load-panel-banner {
  border-color: #cc7300;
}
body.dx-swatch-dark .content .doc-content .simulators .demo-device .demo-display .load-panel .load-panel-banner-wrapper .load-panel-banner p {
  color: #fafafa;
}
body.dx-swatch-dark .content .doc-content .simulators .demo-device .demo-display .load-panel .load-panel-banner-wrapper .load-panel-banner a {
  color: white;
}
/* banner */

.dx-swatch-dark .theme-toogle.light {
  margin-right: -24px;
}
.hidden-menu #menu .menu-state-button {
  margin-left: 0;
}
.hidden-menu #menu .breadcrumbs-dropdown.active ul {
  padding-left: 95px;
}
.hidden-menu .left-menu {
  display: none;
}
.full-screen-demo header,
.full-screen-demo #menu,
.full-screen-demo .left-menu {
  display: none;
}
.full-screen-demo .body-container.content-width {
  padding: 0;
  max-width: none;
}
html,
body {
  padding: 0;
  margin: 0;
  height: 100%;
  min-width: 400px;
  font-family: 'Roboto', sans-serif;
}
body.hidden-menu .menu-wrapper {
  padding-left: 24px;
}
@media only screen and (max-width: 1500px) {
  body.hidden-menu .menu-wrapper {
    padding-left: 18px;
  }
}
body {
  font-family: 'Roboto', sans-serif;
}
body a:focus {
  outline: auto;
}
body .btn.btn {
  box-sizing: border-box;
  display: flex;
  align-items: center;
  padding: 10px 20px;
  border-radius: 40px;
  text-decoration: none;
  justify-content: center;
  color: white;
  font-family: 'Roboto', sans-serif;
  font-size: 18px;
  line-height: 24px;
  font-weight: 500;
  min-width: 220px;
  max-width: fit-content;
  border: 2px solid;
  cursor: pointer;
}
body .btn.btn-shadow {
  box-shadow: 0px 4px 12px rgba(0, 0, 0, 0.16);
}
body .btn.btn-icon {
  gap: 8px;
}
body .btn.btn-hidden {
  display: none;
}
body .btn.btn-blue-outline {
  cursor: pointer;
}
body .btn.btn-blue-outline:focus-visible {
  outline: 2px solid;
}
body .btn.btn-blue-outline:visited {
  color: white;
}
body .btn.btn-blue-outline:hover {
  color: white !important;
}
body .btn.btn-orange {
  border-radius: 999px;
  outline-offset: 0px;
  border: none;
}
body .btn.btn-orange:focus {
  outline: none;
}
body .btn.btn-orange:focus-visible {
  outline: 2px solid;
}
body .btn.btn svg {
  width: 24px;
  height: 24px;
}
body .tbs {
  width: 100%;
  display: inline-flex;
  align-items: center;
  flex-wrap: nowrap;
  flex-direction: row;
  justify-content: center;
  border-bottom: 1px solid;
}
body .tbs-item-container {
  display: inline-flex;
  align-items: center;
  padding: 19px 12px;
}
body .tbs-item {
  text-align: center;
  font-style: normal;
  font-weight: 400;
  font-size: 16px;
  line-height: 135%;
  cursor: pointer;
  border: none;
  text-decoration: none;
}
body .duo-card {
  margin-top: 16px;
  display: flex;
  justify-content: center;
  padding: 4px;
  width: fit-content;
  border-radius: 40px;
}
body .duo-card .wrapper-card {
  position: relative;
  cursor: pointer;
}
body .duo-card .wrapper-card svg {
  position: absolute;
  left: 12px;
  top: 10px;
  width: 18px;
  height: 18px;
}
body .duo-card .wrapper-card.active input,
body .duo-card input.active {
  box-shadow: 0px 2px 6px rgba(0, 0, 0, 0.16);
}
body .duo-card input {
  background-color: transparent;
  border: none;
  border-radius: 4px;
  margin: 0;
  padding: 10px 12px;
  border-radius: 40px;
  font-weight: 400;
  font-size: 16px;
  line-height: 18px;
}
body .duo-card input:hover {
  cursor: pointer;
}
body .duo-card svg + input {
  padding: 10px 12px 10px 38px;
}
body .content-width {
  max-width: 1900px;
  margin: 0 auto;
  padding: 64px 0;
  position: relative;
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
}
body .switch {
  display: inline-flex;
  padding: 0 16px;
  gap: 8px;
  align-items: center;
  position: relative;
}
body .switch-toogle {
  position: relative;
  display: inline-block;
  width: 56px;
  height: 28px;
}
body .switch-toogle input {
  opacity: 0;
  width: 0;
  height: 0;
}
body .switch-toogle input:checked + .switch-slider::before {
  transform: translateX(28px);
}
body .switch-slider {
  position: absolute;
  cursor: pointer;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  transition: 0.4s;
  border-radius: 34px;
  border: 1px solid;
}
body .switch-slider::before {
  position: absolute;
  content: "";
  height: 20px;
  width: 20px;
  left: 4px;
  top: 3px;
  -webkit-transition: 0.4s;
  transition: 0.4s;
  border-radius: 50%;
}
body .switch-label {
  white-space: nowrap;
}
@media only screen and (max-width: 1400px) {
  body .content-width {
    padding-top: 32px;
    padding-bottom: 32px;
  }
}
@media only screen and (max-width: 768px) {
  body .content-width {
    padding-left: 0;
    padding-right: 0;
  }
  body .btn.btn {
    min-width: 180px;
  }
  body .tbs {
    overflow-x: scroll;
    justify-content: flex-start;
    -ms-overflow-style: none;
    scrollbar-width: none;
  }
  body .tbs-item {
    width: auto;
    white-space: nowrap;
  }
  body .tbs::-webkit-scrollbar {
    display: none;
  }
}
body .btn.btn {
  box-sizing: border-box;
  display: flex;
  align-items: center;
  padding: 10px 20px;
  border-radius: 40px;
  text-decoration: none;
  justify-content: center;
  color: white;
  font-family: 'Roboto', sans-serif;
  font-size: 18px;
  line-height: 24px;
  font-weight: 500;
  min-width: 220px;
  max-width: fit-content;
  border: 2px solid;
  cursor: pointer;
}
body .btn.btn-shadow {
  box-shadow: 0px 4px 12px rgba(0, 0, 0, 0.16);
}
body .btn.btn-icon {
  gap: 8px;
}
body .btn.btn-hidden {
  display: none;
}
body .btn.btn-blue-outline {
  cursor: pointer;
}
body .btn.btn-blue-outline:focus-visible {
  outline: 2px solid;
}
body .btn.btn-blue-outline:visited {
  color: white;
}
body .btn.btn-blue-outline:hover {
  color: white !important;
}
body .btn.btn-orange {
  border-radius: 999px;
  outline-offset: 0px;
  border: none;
}
body .btn.btn-orange:focus {
  outline: none;
}
body .btn.btn-orange:focus-visible {
  outline: 2px solid;
}
body .btn.btn svg {
  width: 24px;
  height: 24px;
}
body .tbs {
  width: 100%;
  display: inline-flex;
  align-items: center;
  flex-wrap: nowrap;
  flex-direction: row;
  justify-content: center;
  border-bottom: 1px solid;
}
body .tbs-item-container {
  display: inline-flex;
  align-items: center;
  padding: 19px 12px;
}
body .tbs-item {
  text-align: center;
  font-style: normal;
  font-weight: 400;
  font-size: 16px;
  line-height: 135%;
  cursor: pointer;
  border: none;
  text-decoration: none;
}
body .duo-card {
  margin-top: 16px;
  display: flex;
  justify-content: center;
  padding: 4px;
  width: fit-content;
  border-radius: 40px;
}
body .duo-card .wrapper-card {
  position: relative;
  cursor: pointer;
}
body .duo-card .wrapper-card svg {
  position: absolute;
  left: 12px;
  top: 10px;
  width: 18px;
  height: 18px;
}
body .duo-card .wrapper-card.active input,
body .duo-card input.active {
  box-shadow: 0px 2px 6px rgba(0, 0, 0, 0.16);
}
body .duo-card input {
  background-color: transparent;
  border: none;
  border-radius: 4px;
  margin: 0;
  padding: 10px 12px;
  border-radius: 40px;
  font-weight: 400;
  font-size: 16px;
  line-height: 18px;
}
body .duo-card input:hover {
  cursor: pointer;
}
body .duo-card svg + input {
  padding: 10px 12px 10px 38px;
}
body .content-width {
  max-width: 1900px;
  margin: 0 auto;
  padding: 64px 0;
  position: relative;
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
}
body .switch {
  display: inline-flex;
  padding: 0 16px;
  gap: 8px;
  align-items: center;
  position: relative;
}
body .switch-toogle {
  position: relative;
  display: inline-block;
  width: 56px;
  height: 28px;
}
body .switch-toogle input {
  opacity: 0;
  width: 0;
  height: 0;
}
body .switch-toogle input:checked + .switch-slider::before {
  transform: translateX(28px);
}
body .switch-slider {
  position: absolute;
  cursor: pointer;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  transition: 0.4s;
  border-radius: 34px;
  border: 1px solid;
}
body .switch-slider::before {
  position: absolute;
  content: "";
  height: 20px;
  width: 20px;
  left: 4px;
  top: 3px;
  -webkit-transition: 0.4s;
  transition: 0.4s;
  border-radius: 50%;
}
body .switch-label {
  white-space: nowrap;
}
@media only screen and (max-width: 1400px) {
  body .content-width {
    padding-top: 32px;
    padding-bottom: 32px;
  }
}
@media only screen and (max-width: 768px) {
  body .content-width {
    padding-left: 0;
    padding-right: 0;
  }
  body .btn.btn {
    min-width: 180px;
  }
  body .tbs {
    overflow-x: scroll;
    justify-content: flex-start;
    -ms-overflow-style: none;
    scrollbar-width: none;
  }
  body .tbs-item {
    width: auto;
    white-space: nowrap;
  }
  body .tbs::-webkit-scrollbar {
    display: none;
  }
}
body .btn.btn {
  box-sizing: border-box;
  display: flex;
  align-items: center;
  padding: 10px 20px;
  border-radius: 40px;
  text-decoration: none;
  justify-content: center;
  color: white;
  font-family: 'Roboto', sans-serif;
  font-size: 18px;
  line-height: 24px;
  font-weight: 500;
  min-width: 220px;
  max-width: fit-content;
  border: 2px solid;
  cursor: pointer;
}
body .btn.btn-shadow {
  box-shadow: 0px 4px 12px rgba(0, 0, 0, 0.16);
}
body .btn.btn-icon {
  gap: 8px;
}
body .btn.btn-hidden {
  display: none;
}
body .btn.btn-blue-outline {
  cursor: pointer;
}
body .btn.btn-blue-outline:focus-visible {
  outline: 2px solid;
}
body .btn.btn-blue-outline:visited {
  color: white;
}
body .btn.btn-blue-outline:hover {
  color: white !important;
}
body .btn.btn-orange {
  border-radius: 999px;
  outline-offset: 0px;
  border: none;
}
body .btn.btn-orange:focus {
  outline: none;
}
body .btn.btn-orange:focus-visible {
  outline: 2px solid;
}
body .btn.btn svg {
  width: 24px;
  height: 24px;
}
body .tbs {
  width: 100%;
  display: inline-flex;
  align-items: center;
  flex-wrap: nowrap;
  flex-direction: row;
  justify-content: center;
  border-bottom: 1px solid;
}
body .tbs-item-container {
  display: inline-flex;
  align-items: center;
  padding: 19px 12px;
}
body .tbs-item {
  text-align: center;
  font-style: normal;
  font-weight: 400;
  font-size: 16px;
  line-height: 135%;
  cursor: pointer;
  border: none;
  text-decoration: none;
}
body .duo-card {
  margin-top: 16px;
  display: flex;
  justify-content: center;
  padding: 4px;
  width: fit-content;
  border-radius: 40px;
}
body .duo-card .wrapper-card {
  position: relative;
  cursor: pointer;
}
body .duo-card .wrapper-card svg {
  position: absolute;
  left: 12px;
  top: 10px;
  width: 18px;
  height: 18px;
}
body .duo-card .wrapper-card.active input,
body .duo-card input.active {
  box-shadow: 0px 2px 6px rgba(0, 0, 0, 0.16);
}
body .duo-card input {
  background-color: transparent;
  border: none;
  border-radius: 4px;
  margin: 0;
  padding: 10px 12px;
  border-radius: 40px;
  font-weight: 400;
  font-size: 16px;
  line-height: 18px;
}
body .duo-card input:hover {
  cursor: pointer;
}
body .duo-card svg + input {
  padding: 10px 12px 10px 38px;
}
body .content-width {
  max-width: 1900px;
  margin: 0 auto;
  padding: 64px 0;
  position: relative;
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
}
body .switch {
  display: inline-flex;
  padding: 0 16px;
  gap: 8px;
  align-items: center;
  position: relative;
}
body .switch-toogle {
  position: relative;
  display: inline-block;
  width: 56px;
  height: 28px;
}
body .switch-toogle input {
  opacity: 0;
  width: 0;
  height: 0;
}
body .switch-toogle input:checked + .switch-slider::before {
  transform: translateX(28px);
}
body .switch-slider {
  position: absolute;
  cursor: pointer;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  transition: 0.4s;
  border-radius: 34px;
  border: 1px solid;
}
body .switch-slider::before {
  position: absolute;
  content: "";
  height: 20px;
  width: 20px;
  left: 4px;
  top: 3px;
  -webkit-transition: 0.4s;
  transition: 0.4s;
  border-radius: 50%;
}
body .switch-label {
  white-space: nowrap;
}
@media only screen and (max-width: 1400px) {
  body .content-width {
    padding-top: 32px;
    padding-bottom: 32px;
  }
}
@media only screen and (max-width: 768px) {
  body .content-width {
    padding-left: 0;
    padding-right: 0;
  }
  body .btn.btn {
    min-width: 180px;
  }
  body .tbs {
    overflow-x: scroll;
    justify-content: flex-start;
    -ms-overflow-style: none;
    scrollbar-width: none;
  }
  body .tbs-item {
    width: auto;
    white-space: nowrap;
  }
  body .tbs::-webkit-scrollbar {
    display: none;
  }
}
body .btn.btn {
  box-sizing: border-box;
  display: flex;
  align-items: center;
  padding: 10px 20px;
  border-radius: 40px;
  text-decoration: none;
  justify-content: center;
  color: white;
  font-family: 'Roboto', sans-serif;
  font-size: 18px;
  line-height: 24px;
  font-weight: 500;
  min-width: 220px;
  max-width: fit-content;
  border: 2px solid;
  cursor: pointer;
}
body .btn.btn-shadow {
  box-shadow: 0px 4px 12px rgba(0, 0, 0, 0.16);
}
body .btn.btn-icon {
  gap: 8px;
}
body .btn.btn-hidden {
  display: none;
}
body .btn.btn-blue-outline {
  cursor: pointer;
}
body .btn.btn-blue-outline:focus-visible {
  outline: 2px solid;
}
body .btn.btn-blue-outline:visited {
  color: white;
}
body .btn.btn-blue-outline:hover {
  color: white !important;
}
body .btn.btn-orange {
  border-radius: 999px;
  outline-offset: 0px;
  border: none;
}
body .btn.btn-orange:focus {
  outline: none;
}
body .btn.btn-orange:focus-visible {
  outline: 2px solid;
}
body .btn.btn svg {
  width: 24px;
  height: 24px;
}
body .tbs {
  width: 100%;
  display: inline-flex;
  align-items: center;
  flex-wrap: nowrap;
  flex-direction: row;
  justify-content: center;
  border-bottom: 1px solid;
}
body .tbs-item-container {
  display: inline-flex;
  align-items: center;
  padding: 19px 12px;
}
body .tbs-item {
  text-align: center;
  font-style: normal;
  font-weight: 400;
  font-size: 16px;
  line-height: 135%;
  cursor: pointer;
  border: none;
  text-decoration: none;
}
body .duo-card {
  margin-top: 16px;
  display: flex;
  justify-content: center;
  padding: 4px;
  width: fit-content;
  border-radius: 40px;
}
body .duo-card .wrapper-card {
  position: relative;
  cursor: pointer;
}
body .duo-card .wrapper-card svg {
  position: absolute;
  left: 12px;
  top: 10px;
  width: 18px;
  height: 18px;
}
body .duo-card .wrapper-card.active input,
body .duo-card input.active {
  box-shadow: 0px 2px 6px rgba(0, 0, 0, 0.16);
}
body .duo-card input {
  background-color: transparent;
  border: none;
  border-radius: 4px;
  margin: 0;
  padding: 10px 12px;
  border-radius: 40px;
  font-weight: 400;
  font-size: 16px;
  line-height: 18px;
}
body .duo-card input:hover {
  cursor: pointer;
}
body .duo-card svg + input {
  padding: 10px 12px 10px 38px;
}
body .content-width {
  max-width: 1900px;
  margin: 0 auto;
  padding: 64px 0;
  position: relative;
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
}
body .switch {
  display: inline-flex;
  padding: 0 16px;
  gap: 8px;
  align-items: center;
  position: relative;
}
body .switch-toogle {
  position: relative;
  display: inline-block;
  width: 56px;
  height: 28px;
}
body .switch-toogle input {
  opacity: 0;
  width: 0;
  height: 0;
}
body .switch-toogle input:checked + .switch-slider::before {
  transform: translateX(28px);
}
body .switch-slider {
  position: absolute;
  cursor: pointer;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  transition: 0.4s;
  border-radius: 34px;
  border: 1px solid;
}
body .switch-slider::before {
  position: absolute;
  content: "";
  height: 20px;
  width: 20px;
  left: 4px;
  top: 3px;
  -webkit-transition: 0.4s;
  transition: 0.4s;
  border-radius: 50%;
}
body .switch-label {
  white-space: nowrap;
}
@media only screen and (max-width: 1400px) {
  body .content-width {
    padding-top: 32px;
    padding-bottom: 32px;
  }
}
@media only screen and (max-width: 768px) {
  body .content-width {
    padding-left: 0;
    padding-right: 0;
  }
  body .btn.btn {
    min-width: 180px;
  }
  body .tbs {
    overflow-x: scroll;
    justify-content: flex-start;
    -ms-overflow-style: none;
    scrollbar-width: none;
  }
  body .tbs-item {
    width: auto;
    white-space: nowrap;
  }
  body .tbs::-webkit-scrollbar {
    display: none;
  }
}
body .header-approach-selected {
  min-width: auto;
  padding: 0 8px 2px 8px;
  margin-bottom: 12px;
  font-size: 26px;
  line-height: 100%;
  font-weight: 700;
  font-stretch: 75%;
  font-family: 'Open Sans', sans-serif;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  border: 0;
  border-radius: 40px;
  cursor: pointer;
}
body .header-approach-selected::after {
  content: ' ';
  margin-top: 6px;
  transition: transform 0.4s;
}
body .header-approach-selected:focus {
  outline-color: initial;
  outline-style: solid;
  outline-width: 2px;
}
body .header-approach-list {
  z-index: 100001;
  box-sizing: border-box;
  display: none;
  box-shadow: 0 2px 8px 0 rgba(0, 0, 0, 0.12), 0 1px 2px 0 rgba(0, 0, 0, 0.06);
  border-radius: 8px;
  flex-direction: column;
  position: fixed;
  padding: 4px;
  gap: 2px;
}
body .header-approach-list.active {
  display: flex;
}
body .header-approach-list-item {
  border-radius: 4px;
  display: flex;
  align-items: center;
  box-sizing: border-box;
  height: 40px;
  padding: 8px 8px 8px 12px;
  text-align: left;
  text-decoration: none !important;
}
body .header-approach-list-item-content {
  flex: 1;
}
body .header-approach-list-item .indicator-new {
  margin-left: 8px;
}
body .header-approach-list {
  z-index: 100001;
  box-sizing: border-box;
  display: none;
  box-shadow: 0 2px 8px 0 rgba(0, 0, 0, 0.12), 0 1px 2px 0 rgba(0, 0, 0, 0.06);
  border-radius: 8px;
  flex-direction: column;
  position: fixed;
  padding: 4px;
  gap: 2px;
}
body .header-approach-list.active {
  display: flex;
}
body .header-approach-list-item {
  border-radius: 4px;
  display: flex;
  align-items: center;
  box-sizing: border-box;
  height: 40px;
  padding: 8px 8px 8px 12px;
  text-align: left;
  text-decoration: none !important;
}
body .header-approach-list-item-content {
  flex: 1;
}
body .header-approach-list-item .indicator-new {
  margin-left: 8px;
}
body .header-approach-list {
  width: 170px;
}
body .header-approach-selected {
  min-width: auto;
  padding: 0 8px 2px 8px;
  margin-bottom: 12px;
  font-size: 26px;
  line-height: 100%;
  font-weight: 700;
  font-stretch: 75%;
  font-family: 'Open Sans', sans-serif;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  border: 0;
  border-radius: 40px;
  cursor: pointer;
}
body .header-approach-selected::after {
  content: ' ';
  margin-top: 6px;
  transition: transform 0.4s;
}
body .header-approach-selected:focus {
  outline-color: initial;
  outline-style: solid;
  outline-width: 2px;
}
body .header-approach-list {
  z-index: 100001;
  box-sizing: border-box;
  display: none;
  box-shadow: 0 2px 8px 0 rgba(0, 0, 0, 0.12), 0 1px 2px 0 rgba(0, 0, 0, 0.06);
  border-radius: 8px;
  flex-direction: column;
  position: fixed;
  padding: 4px;
  gap: 2px;
}
body .header-approach-list.active {
  display: flex;
}
body .header-approach-list-item {
  border-radius: 4px;
  display: flex;
  align-items: center;
  box-sizing: border-box;
  height: 40px;
  padding: 8px 8px 8px 12px;
  text-align: left;
  text-decoration: none !important;
}
body .header-approach-list-item-content {
  flex: 1;
}
body .header-approach-list-item .indicator-new {
  margin-left: 8px;
}
body .header-approach-list {
  z-index: 100001;
  box-sizing: border-box;
  display: none;
  box-shadow: 0 2px 8px 0 rgba(0, 0, 0, 0.12), 0 1px 2px 0 rgba(0, 0, 0, 0.06);
  border-radius: 8px;
  flex-direction: column;
  position: fixed;
  padding: 4px;
  gap: 2px;
}
body .header-approach-list.active {
  display: flex;
}
body .header-approach-list-item {
  border-radius: 4px;
  display: flex;
  align-items: center;
  box-sizing: border-box;
  height: 40px;
  padding: 8px 8px 8px 12px;
  text-align: left;
  text-decoration: none !important;
}
body .header-approach-list-item-content {
  flex: 1;
}
body .header-approach-list-item .indicator-new {
  margin-left: 8px;
}
body .header-approach-list {
  width: 170px;
}
body .header-drawer {
  display: none;
}
body .header-drawer-toggle.btn {
  display: none;
  min-width: 40px;
  height: 40px;
  padding: 8px;
  margin-right: 6px;
}
body .header-drawer-toggle.btn .dx-icon {
  font-size: 18px;
}
body .drawer-menu-divider {
  display: none;
}
@media only screen and (max-width: 1500px) {
  body .header-drawer {
    position: fixed;
    top: 70px;
    width: 358px;
    height: 100vh;
    z-index: 100000;
    box-shadow: 0px 4px 8px rgba(0, 0, 0, 0.12);
    flex-direction: column;
  }
  body .header-drawer.active {
    display: flex;
  }
  body .header-drawer-toggle.btn {
    display: flex;
  }
  body .header-drawer .header-menu-items {
    flex-direction: column;
  }
  body .header-drawer-link-left {
    display: none;
  }
  body .header-drawer .header-link {
    padding: 8px 18px;
    border-top: 0;
    border-bottom: 0;
    border-left: 4px solid transparent;
  }
}
@media only screen and (max-width: 1160px) {
  body .header-drawer-link-left {
    display: block;
  }
  body .header-drawer .drawer-menu-divider {
    display: block;
    height: 1px;
    margin: 4px 12px;
  }
}
@media only screen and (max-width: 768px) {
  body .header-drawer {
    width: 100vw;
  }
  body .header-drawer .header-link {
    width: 100vw;
  }
}
body .header-drawer {
  display: none;
}
body .header-drawer-toggle.btn {
  display: none;
  min-width: 40px;
  height: 40px;
  padding: 8px;
  margin-right: 6px;
}
body .header-drawer-toggle.btn .dx-icon {
  font-size: 18px;
}
body .drawer-menu-divider {
  display: none;
}
@media only screen and (max-width: 1500px) {
  body .header-drawer {
    position: fixed;
    top: 70px;
    width: 358px;
    height: 100vh;
    z-index: 100000;
    box-shadow: 0px 4px 8px rgba(0, 0, 0, 0.12);
    flex-direction: column;
  }
  body .header-drawer.active {
    display: flex;
  }
  body .header-drawer-toggle.btn {
    display: flex;
  }
  body .header-drawer .header-menu-items {
    flex-direction: column;
  }
  body .header-drawer-link-left {
    display: none;
  }
  body .header-drawer .header-link {
    padding: 8px 18px;
    border-top: 0;
    border-bottom: 0;
    border-left: 4px solid transparent;
  }
}
@media only screen and (max-width: 1160px) {
  body .header-drawer-link-left {
    display: block;
  }
  body .header-drawer .drawer-menu-divider {
    display: block;
    height: 1px;
    margin: 4px 12px;
  }
}
@media only screen and (max-width: 768px) {
  body .header-drawer {
    width: 100vw;
  }
  body .header-drawer .header-link {
    width: 100vw;
  }
}
body .header.releases-has-news .badge-new {
  display: flex;
}
body .header.releases-has-news .blog-link .badge-new {
  display: none;
}
body .header .badge-new,
body .header-drawer .badge-new,
body .header .indicator-new,
body .header-drawer .indicator-new {
  display: none;
}
body .header.whats-new-has-news .whats-new-menu-item .badge-new,
body .header-drawer.whats-new-has-news .whats-new-menu-item .badge-new,
body .header.whats-new-has-news .whats-new-menu-item .indicator-new,
body .header-drawer.whats-new-has-news .whats-new-menu-item .indicator-new {
  display: flex;
}
body .header.roadmap-has-news .roadmap-menu-item .badge-new,
body .header-drawer.roadmap-has-news .roadmap-menu-item .badge-new,
body .header.roadmap-has-news .roadmap-menu-item .indicator-new,
body .header-drawer.roadmap-has-news .roadmap-menu-item .indicator-new {
  display: flex;
}
body header .header {
  position: fixed;
  z-index: 1500;
  width: 100%;
  height: 70px;
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.08);
}
body .header-logo {
  position: relative;
  text-decoration: none !important;
  display: flex;
  gap: 12px;
  align-items: center;
}
body .header-container {
  max-width: 1900px;
  height: inherit;
  padding-top: 0;
  padding-bottom: 0;
  display: flex;
  justify-content: space-between;
}
body .header-group {
  display: flex;
  align-items: center;
  gap: 40px;
}
body .header-group-logo {
  display: flex;
  align-items: center;
  gap: 4px;
}
body .header-menu-items {
  padding: 0;
  display: flex;
  gap: 0 12px;
}
body .header-menu-item {
  list-style: none;
}
body .header-menu-item .header-menu-list {
  z-index: 100001;
  box-sizing: border-box;
  display: none;
  box-shadow: 0 2px 8px 0 rgba(0, 0, 0, 0.12), 0 1px 2px 0 rgba(0, 0, 0, 0.06);
  border-radius: 8px;
  flex-direction: column;
  position: fixed;
  padding: 4px;
  gap: 2px;
}
body .header-menu-item .header-menu-list.active {
  display: flex;
}
body .header-menu-item .header-menu-list-item {
  border-radius: 4px;
  display: flex;
  align-items: center;
  box-sizing: border-box;
  height: 40px;
  padding: 8px 8px 8px 12px;
  text-align: left;
  text-decoration: none !important;
}
body .header-menu-item .header-menu-list-item-content {
  flex: 1;
}
body .header-menu-item .header-menu-list-item .indicator-new {
  margin-left: 8px;
}
body .header-menu-item .header-menu-list {
  z-index: 100001;
  box-sizing: border-box;
  display: none;
  box-shadow: 0 2px 8px 0 rgba(0, 0, 0, 0.12), 0 1px 2px 0 rgba(0, 0, 0, 0.06);
  border-radius: 8px;
  flex-direction: column;
  position: fixed;
  padding: 4px;
  gap: 2px;
}
body .header-menu-item .header-menu-list.active {
  display: flex;
}
body .header-menu-item .header-menu-list-item {
  border-radius: 4px;
  display: flex;
  align-items: center;
  box-sizing: border-box;
  height: 40px;
  padding: 8px 8px 8px 12px;
  text-align: left;
  text-decoration: none !important;
}
body .header-menu-item .header-menu-list-item-content {
  flex: 1;
}
body .header-menu-item .header-menu-list-item .indicator-new {
  margin-left: 8px;
}
body .header-menu-item .header-menu-list {
  width: 144px;
}
body .header-link {
  cursor: pointer;
  display: flex;
  align-items: center;
  box-sizing: border-box;
  height: 70px;
  padding: 0 12px;
  text-decoration: none !important;
  font-size: 18px;
  font-weight: 500;
  line-height: 100%;
}
body .header-link .badge-new {
  margin-left: 8px;
}
body .header-link.header-menu-button {
  border: none;
  position: relative;
}
body .header-link.header-menu-button .badge-new {
  margin-left: 4px;
}
body .header-buttons {
  display: inline-flex;
  gap: 10px;
}
body .header-button.btn {
  min-width: 150px;
  height: 44px;
  margin-bottom: 6px;
}
body .header-button.btn svg {
  height: 18px;
  width: 18px;
}
@media only screen and (min-width: 2000px) {
  body .header-container {
    padding-left: 24px;
    padding-right: 0;
  }
}
@media only screen and (max-width: 2000px) {
  body .header-container {
    padding-left: 24px;
    padding-right: 24px;
  }
}
@media only screen and (max-width: 1500px) {
  body .header-container {
    padding-right: 18px;
    padding-left: 18px;
  }
  body .header-container-right .header-menu-items {
    display: none;
  }
}
@media only screen and (max-width: 1160px) {
  body .header-container-left .header-menu-items {
    display: none;
  }
}
@media only screen and (max-width: 768px) {
  body .header-button.btn {
    min-width: 50px;
    height: 50px;
    padding: 14px;
  }
  body .header-button.btn span {
    display: none;
  }
  body .header-button.btn[title='Download'] {
    display: none;
  }
  body .header-logo-template {
    display: none;
  }
}
body.dx-swatch-dark header svg#devextreme-logo path {
  fill: white;
}
body .header-approach-selected {
  min-width: auto;
  padding: 0 8px 2px 8px;
  margin-bottom: 12px;
  font-size: 26px;
  line-height: 100%;
  font-weight: 700;
  font-stretch: 75%;
  font-family: 'Open Sans', sans-serif;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  border: 0;
  border-radius: 40px;
  cursor: pointer;
}
body .header-approach-selected::after {
  content: ' ';
  margin-top: 6px;
  transition: transform 0.4s;
}
body .header-approach-selected:focus {
  outline-color: initial;
  outline-style: solid;
  outline-width: 2px;
}
body .header-approach-list {
  z-index: 100001;
  box-sizing: border-box;
  display: none;
  box-shadow: 0 2px 8px 0 rgba(0, 0, 0, 0.12), 0 1px 2px 0 rgba(0, 0, 0, 0.06);
  border-radius: 8px;
  flex-direction: column;
  position: fixed;
  padding: 4px;
  gap: 2px;
}
body .header-approach-list.active {
  display: flex;
}
body .header-approach-list-item {
  border-radius: 4px;
  display: flex;
  align-items: center;
  box-sizing: border-box;
  height: 40px;
  padding: 8px 8px 8px 12px;
  text-align: left;
  text-decoration: none !important;
}
body .header-approach-list-item-content {
  flex: 1;
}
body .header-approach-list-item .indicator-new {
  margin-left: 8px;
}
body .header-approach-list {
  z-index: 100001;
  box-sizing: border-box;
  display: none;
  box-shadow: 0 2px 8px 0 rgba(0, 0, 0, 0.12), 0 1px 2px 0 rgba(0, 0, 0, 0.06);
  border-radius: 8px;
  flex-direction: column;
  position: fixed;
  padding: 4px;
  gap: 2px;
}
body .header-approach-list.active {
  display: flex;
}
body .header-approach-list-item {
  border-radius: 4px;
  display: flex;
  align-items: center;
  box-sizing: border-box;
  height: 40px;
  padding: 8px 8px 8px 12px;
  text-align: left;
  text-decoration: none !important;
}
body .header-approach-list-item-content {
  flex: 1;
}
body .header-approach-list-item .indicator-new {
  margin-left: 8px;
}
body .header-approach-list {
  width: 170px;
}
body .header-approach-selected {
  min-width: auto;
  padding: 0 8px 2px 8px;
  margin-bottom: 12px;
  font-size: 26px;
  line-height: 100%;
  font-weight: 700;
  font-stretch: 75%;
  font-family: 'Open Sans', sans-serif;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  border: 0;
  border-radius: 40px;
  cursor: pointer;
}
body .header-approach-selected::after {
  content: ' ';
  margin-top: 6px;
  transition: transform 0.4s;
}
body .header-approach-selected:focus {
  outline-color: initial;
  outline-style: solid;
  outline-width: 2px;
}
body .header-approach-list {
  z-index: 100001;
  box-sizing: border-box;
  display: none;
  box-shadow: 0 2px 8px 0 rgba(0, 0, 0, 0.12), 0 1px 2px 0 rgba(0, 0, 0, 0.06);
  border-radius: 8px;
  flex-direction: column;
  position: fixed;
  padding: 4px;
  gap: 2px;
}
body .header-approach-list.active {
  display: flex;
}
body .header-approach-list-item {
  border-radius: 4px;
  display: flex;
  align-items: center;
  box-sizing: border-box;
  height: 40px;
  padding: 8px 8px 8px 12px;
  text-align: left;
  text-decoration: none !important;
}
body .header-approach-list-item-content {
  flex: 1;
}
body .header-approach-list-item .indicator-new {
  margin-left: 8px;
}
body .header-approach-list {
  z-index: 100001;
  box-sizing: border-box;
  display: none;
  box-shadow: 0 2px 8px 0 rgba(0, 0, 0, 0.12), 0 1px 2px 0 rgba(0, 0, 0, 0.06);
  border-radius: 8px;
  flex-direction: column;
  position: fixed;
  padding: 4px;
  gap: 2px;
}
body .header-approach-list.active {
  display: flex;
}
body .header-approach-list-item {
  border-radius: 4px;
  display: flex;
  align-items: center;
  box-sizing: border-box;
  height: 40px;
  padding: 8px 8px 8px 12px;
  text-align: left;
  text-decoration: none !important;
}
body .header-approach-list-item-content {
  flex: 1;
}
body .header-approach-list-item .indicator-new {
  margin-left: 8px;
}
body .header-approach-list {
  width: 170px;
}
body .header-drawer {
  display: none;
}
body .header-drawer-toggle.btn {
  display: none;
  min-width: 40px;
  height: 40px;
  padding: 8px;
  margin-right: 6px;
}
body .header-drawer-toggle.btn .dx-icon {
  font-size: 18px;
}
body .drawer-menu-divider {
  display: none;
}
@media only screen and (max-width: 1500px) {
  body .header-drawer {
    position: fixed;
    top: 70px;
    width: 358px;
    height: 100vh;
    z-index: 100000;
    box-shadow: 0px 4px 8px rgba(0, 0, 0, 0.12);
    flex-direction: column;
  }
  body .header-drawer.active {
    display: flex;
  }
  body .header-drawer-toggle.btn {
    display: flex;
  }
  body .header-drawer .header-menu-items {
    flex-direction: column;
  }
  body .header-drawer-link-left {
    display: none;
  }
  body .header-drawer .header-link {
    padding: 8px 18px;
    border-top: 0;
    border-bottom: 0;
    border-left: 4px solid transparent;
  }
}
@media only screen and (max-width: 1160px) {
  body .header-drawer-link-left {
    display: block;
  }
  body .header-drawer .drawer-menu-divider {
    display: block;
    height: 1px;
    margin: 4px 12px;
  }
}
@media only screen and (max-width: 768px) {
  body .header-drawer {
    width: 100vw;
  }
  body .header-drawer .header-link {
    width: 100vw;
  }
}
body .header-drawer {
  display: none;
}
body .header-drawer-toggle.btn {
  display: none;
  min-width: 40px;
  height: 40px;
  padding: 8px;
  margin-right: 6px;
}
body .header-drawer-toggle.btn .dx-icon {
  font-size: 18px;
}
body .drawer-menu-divider {
  display: none;
}
@media only screen and (max-width: 1500px) {
  body .header-drawer {
    position: fixed;
    top: 70px;
    width: 358px;
    height: 100vh;
    z-index: 100000;
    box-shadow: 0px 4px 8px rgba(0, 0, 0, 0.12);
    flex-direction: column;
  }
  body .header-drawer.active {
    display: flex;
  }
  body .header-drawer-toggle.btn {
    display: flex;
  }
  body .header-drawer .header-menu-items {
    flex-direction: column;
  }
  body .header-drawer-link-left {
    display: none;
  }
  body .header-drawer .header-link {
    padding: 8px 18px;
    border-top: 0;
    border-bottom: 0;
    border-left: 4px solid transparent;
  }
}
@media only screen and (max-width: 1160px) {
  body .header-drawer-link-left {
    display: block;
  }
  body .header-drawer .drawer-menu-divider {
    display: block;
    height: 1px;
    margin: 4px 12px;
  }
}
@media only screen and (max-width: 768px) {
  body .header-drawer {
    width: 100vw;
  }
  body .header-drawer .header-link {
    width: 100vw;
  }
}
body .header.releases-has-news .badge-new {
  display: flex;
}
body .header.releases-has-news .blog-link .badge-new {
  display: none;
}
body .header .badge-new,
body .header-drawer .badge-new,
body .header .indicator-new,
body .header-drawer .indicator-new {
  display: none;
}
body .header.whats-new-has-news .whats-new-menu-item .badge-new,
body .header-drawer.whats-new-has-news .whats-new-menu-item .badge-new,
body .header.whats-new-has-news .whats-new-menu-item .indicator-new,
body .header-drawer.whats-new-has-news .whats-new-menu-item .indicator-new {
  display: flex;
}
body .header.roadmap-has-news .roadmap-menu-item .badge-new,
body .header-drawer.roadmap-has-news .roadmap-menu-item .badge-new,
body .header.roadmap-has-news .roadmap-menu-item .indicator-new,
body .header-drawer.roadmap-has-news .roadmap-menu-item .indicator-new {
  display: flex;
}
body header .header {
  position: fixed;
  z-index: 1500;
  width: 100%;
  height: 70px;
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.08);
}
body .header-logo {
  position: relative;
  text-decoration: none !important;
  display: flex;
  gap: 12px;
  align-items: center;
}
body .header-container {
  max-width: 1900px;
  height: inherit;
  padding-top: 0;
  padding-bottom: 0;
  display: flex;
  justify-content: space-between;
}
body .header-group {
  display: flex;
  align-items: center;
  gap: 40px;
}
body .header-group-logo {
  display: flex;
  align-items: center;
  gap: 4px;
}
body .header-menu-items {
  padding: 0;
  display: flex;
  gap: 0 12px;
}
body .header-menu-item {
  list-style: none;
}
body .header-menu-item .header-menu-list {
  z-index: 100001;
  box-sizing: border-box;
  display: none;
  box-shadow: 0 2px 8px 0 rgba(0, 0, 0, 0.12), 0 1px 2px 0 rgba(0, 0, 0, 0.06);
  border-radius: 8px;
  flex-direction: column;
  position: fixed;
  padding: 4px;
  gap: 2px;
}
body .header-menu-item .header-menu-list.active {
  display: flex;
}
body .header-menu-item .header-menu-list-item {
  border-radius: 4px;
  display: flex;
  align-items: center;
  box-sizing: border-box;
  height: 40px;
  padding: 8px 8px 8px 12px;
  text-align: left;
  text-decoration: none !important;
}
body .header-menu-item .header-menu-list-item-content {
  flex: 1;
}
body .header-menu-item .header-menu-list-item .indicator-new {
  margin-left: 8px;
}
body .header-menu-item .header-menu-list {
  z-index: 100001;
  box-sizing: border-box;
  display: none;
  box-shadow: 0 2px 8px 0 rgba(0, 0, 0, 0.12), 0 1px 2px 0 rgba(0, 0, 0, 0.06);
  border-radius: 8px;
  flex-direction: column;
  position: fixed;
  padding: 4px;
  gap: 2px;
}
body .header-menu-item .header-menu-list.active {
  display: flex;
}
body .header-menu-item .header-menu-list-item {
  border-radius: 4px;
  display: flex;
  align-items: center;
  box-sizing: border-box;
  height: 40px;
  padding: 8px 8px 8px 12px;
  text-align: left;
  text-decoration: none !important;
}
body .header-menu-item .header-menu-list-item-content {
  flex: 1;
}
body .header-menu-item .header-menu-list-item .indicator-new {
  margin-left: 8px;
}
body .header-menu-item .header-menu-list {
  width: 144px;
}
body .header-link {
  cursor: pointer;
  display: flex;
  align-items: center;
  box-sizing: border-box;
  height: 70px;
  padding: 0 12px;
  text-decoration: none !important;
  font-size: 18px;
  font-weight: 500;
  line-height: 100%;
}
body .header-link .badge-new {
  margin-left: 8px;
}
body .header-link.header-menu-button {
  border: none;
  position: relative;
}
body .header-link.header-menu-button .badge-new {
  margin-left: 4px;
}
body .header-buttons {
  display: inline-flex;
  gap: 10px;
}
body .header-button.btn {
  min-width: 150px;
  height: 44px;
  margin-bottom: 6px;
}
body .header-button.btn svg {
  height: 18px;
  width: 18px;
}
@media only screen and (min-width: 2000px) {
  body .header-container {
    padding-left: 24px;
    padding-right: 0;
  }
}
@media only screen and (max-width: 2000px) {
  body .header-container {
    padding-left: 24px;
    padding-right: 24px;
  }
}
@media only screen and (max-width: 1500px) {
  body .header-container {
    padding-right: 18px;
    padding-left: 18px;
  }
  body .header-container-right .header-menu-items {
    display: none;
  }
}
@media only screen and (max-width: 1160px) {
  body .header-container-left .header-menu-items {
    display: none;
  }
}
@media only screen and (max-width: 768px) {
  body .header-button.btn {
    min-width: 50px;
    height: 50px;
    padding: 14px;
  }
  body .header-button.btn span {
    display: none;
  }
  body .header-button.btn[title='Download'] {
    display: none;
  }
  body .header-logo-template {
    display: none;
  }
}
body.dx-swatch-dark header svg#devextreme-logo path {
  fill: white;
}
body #menu {
  top: 70px;
  height: 40px;
  width: 100%;
  position: fixed;
  z-index: 3;
  left: 0;
}
body #menu .menu-wrapper {
  height: inherit;
  padding-top: 0;
  padding-bottom: 0;
  display: flex;
  gap: 15px;
}
body #menu .menu-state-button {
  flex: 0 0 40px;
  margin-left: 340px;
  cursor: pointer;
  display: flex;
  justify-content: center;
}
body #menu .breadcrumbs-svg {
  min-width: 20px;
  max-width: 20px;
  height: inherit;
  padding-right: 6px;
}
body #menu .tools-panel {
  height: inherit;
  padding-right: 16px;
  width: 100%;
  display: flex;
  justify-content: space-between;
  gap: 15px;
}
body #menu .tools-panel .menu-dropdown-toogle {
  display: none;
}
body #menu .tools-panel .breadcrumbs {
  min-width: 230px;
  height: 40px;
  min-width: 260px;
  width: 50%;
  white-space: nowrap;
  text-overflow: ellipsis;
}
body #menu .tools-panel .breadcrumbs a:not([href]) {
  opacity: 0.6;
}
body #menu .tools-panel .breadcrumbs a[href] {
  text-decoration: underline;
}
body #menu .tools-panel .breadcrumbs .breadcrumbs-wrapper,
body #menu .tools-panel .breadcrumbs nav {
  height: inherit;
  padding: 0;
  display: inline-flex;
  align-items: center;
  list-style: none;
  position: absolute;
}
body #menu .tools-panel .breadcrumbs .breadcrumbs-wrapper li,
body #menu .tools-panel .breadcrumbs nav li {
  display: inline-block;
  padding-left: 2px;
}
body #menu .tools-panel .breadcrumbs .breadcrumbs-wrapper li.crumb,
body #menu .tools-panel .breadcrumbs nav li.crumb {
  visibility: hidden;
}
body #menu .tools-panel .breadcrumbs .breadcrumbs-wrapper li.crumb.no-hide,
body #menu .tools-panel .breadcrumbs nav li.crumb.no-hide {
  visibility: visible;
}
body #menu .tools-panel .breadcrumbs .breadcrumbs-wrapper li a,
body #menu .tools-panel .breadcrumbs nav li a,
body #menu .tools-panel .breadcrumbs .breadcrumbs-wrapper li span,
body #menu .tools-panel .breadcrumbs nav li span {
  padding: 0 1px;
  display: inline-block;
  font-weight: 400;
}
body #menu .tools-panel .breadcrumbs .breadcrumbs-wrapper li span,
body #menu .tools-panel .breadcrumbs nav li span {
  opacity: 0.5;
}
body #menu .tools-panel .breadcrumbs .breadcrumbs-wrapper li:not(:first-child)::before,
body #menu .tools-panel .breadcrumbs nav li:not(:first-child)::before {
  content: "\2192";
  padding: 0 4px;
}
body #menu .tools-panel .breadcrumbs .breadcrumbs-wrapper li.hidden,
body #menu .tools-panel .breadcrumbs nav li.hidden {
  display: none;
}
body #menu .tools-panel .breadcrumbs .breadcrumbs-wrapper li.hint,
body #menu .tools-panel .breadcrumbs nav li.hint {
  cursor: pointer;
  text-align: center;
}
body #menu .tools-panel .breadcrumbs .breadcrumbs-wrapper li.hint span,
body #menu .tools-panel .breadcrumbs nav li.hint span {
  width: 30px;
  font-size: 18px;
  font-weight: bold;
  position: relative;
  top: -3px;
  padding: 11px 0;
  margin-left: 4px;
}
body #menu .tools-panel .breadcrumbs .breadcrumbs-wrapper li.hint.active span,
body #menu .tools-panel .breadcrumbs nav li.hint.active span {
  opacity: 1;
}
body #menu .tools-panel .breadcrumbs-dropdown {
  display: none;
}
body #menu .tools-panel .breadcrumbs-dropdown.active {
  display: flex;
  align-items: center;
  top: 40px;
  left: 0;
  height: 40px;
  width: 100%;
  position: absolute;
  list-style: none;
}
body #menu .tools-panel .breadcrumbs-dropdown.active ul {
  display: block;
  padding-left: 400px;
}
body #menu .tools-panel .breadcrumbs-dropdown.active ul li {
  display: inline-block;
  padding: 2px 0;
}
body #menu .tools-panel .breadcrumbs-dropdown.active ul li a {
  text-decoration: underline;
  font-weight: normal;
}
body #menu .tools-panel .breadcrumbs-dropdown.active ul li:not(:last-child):after {
  content: "\2192";
  margin: 0 4px;
}
body #menu .tools-panel .tools-items {
  height: 40px;
  display: flex;
  gap: 0 16px;
  align-items: center;
}
body #menu .tools-panel .tools-items.toggle-button {
  display: none;
}
body #menu .tools-panel .tools-items .filter-item.toggle-button.search {
  display: none;
}
body.hidden-menu #menu .tools-panel .breadcrumbs-dropdown.active ul {
  padding-left: 100px;
}
body #menu {
  top: 70px;
  height: 40px;
  width: 100%;
  position: fixed;
  z-index: 3;
  left: 0;
}
body #menu .menu-wrapper {
  height: inherit;
  padding-top: 0;
  padding-bottom: 0;
  display: flex;
  gap: 15px;
}
body #menu .menu-state-button {
  flex: 0 0 40px;
  margin-left: 340px;
  cursor: pointer;
  display: flex;
  justify-content: center;
}
body #menu .breadcrumbs-svg {
  min-width: 20px;
  max-width: 20px;
  height: inherit;
  padding-right: 6px;
}
body #menu .tools-panel {
  height: inherit;
  padding-right: 16px;
  width: 100%;
  display: flex;
  justify-content: space-between;
  gap: 15px;
}
body #menu .tools-panel .menu-dropdown-toogle {
  display: none;
}
body #menu .tools-panel .breadcrumbs {
  min-width: 230px;
  height: 40px;
  min-width: 260px;
  width: 50%;
  white-space: nowrap;
  text-overflow: ellipsis;
}
body #menu .tools-panel .breadcrumbs a:not([href]) {
  opacity: 0.6;
}
body #menu .tools-panel .breadcrumbs a[href] {
  text-decoration: underline;
}
body #menu .tools-panel .breadcrumbs .breadcrumbs-wrapper,
body #menu .tools-panel .breadcrumbs nav {
  height: inherit;
  padding: 0;
  display: inline-flex;
  align-items: center;
  list-style: none;
  position: absolute;
}
body #menu .tools-panel .breadcrumbs .breadcrumbs-wrapper li,
body #menu .tools-panel .breadcrumbs nav li {
  display: inline-block;
  padding-left: 2px;
}
body #menu .tools-panel .breadcrumbs .breadcrumbs-wrapper li.crumb,
body #menu .tools-panel .breadcrumbs nav li.crumb {
  visibility: hidden;
}
body #menu .tools-panel .breadcrumbs .breadcrumbs-wrapper li.crumb.no-hide,
body #menu .tools-panel .breadcrumbs nav li.crumb.no-hide {
  visibility: visible;
}
body #menu .tools-panel .breadcrumbs .breadcrumbs-wrapper li a,
body #menu .tools-panel .breadcrumbs nav li a,
body #menu .tools-panel .breadcrumbs .breadcrumbs-wrapper li span,
body #menu .tools-panel .breadcrumbs nav li span {
  padding: 0 1px;
  display: inline-block;
  font-weight: 400;
}
body #menu .tools-panel .breadcrumbs .breadcrumbs-wrapper li span,
body #menu .tools-panel .breadcrumbs nav li span {
  opacity: 0.5;
}
body #menu .tools-panel .breadcrumbs .breadcrumbs-wrapper li:not(:first-child)::before,
body #menu .tools-panel .breadcrumbs nav li:not(:first-child)::before {
  content: "\2192";
  padding: 0 4px;
}
body #menu .tools-panel .breadcrumbs .breadcrumbs-wrapper li.hidden,
body #menu .tools-panel .breadcrumbs nav li.hidden {
  display: none;
}
body #menu .tools-panel .breadcrumbs .breadcrumbs-wrapper li.hint,
body #menu .tools-panel .breadcrumbs nav li.hint {
  cursor: pointer;
  text-align: center;
}
body #menu .tools-panel .breadcrumbs .breadcrumbs-wrapper li.hint span,
body #menu .tools-panel .breadcrumbs nav li.hint span {
  width: 30px;
  font-size: 18px;
  font-weight: bold;
  position: relative;
  top: -3px;
  padding: 11px 0;
  margin-left: 4px;
}
body #menu .tools-panel .breadcrumbs .breadcrumbs-wrapper li.hint.active span,
body #menu .tools-panel .breadcrumbs nav li.hint.active span {
  opacity: 1;
}
body #menu .tools-panel .breadcrumbs-dropdown {
  display: none;
}
body #menu .tools-panel .breadcrumbs-dropdown.active {
  display: flex;
  align-items: center;
  top: 40px;
  left: 0;
  height: 40px;
  width: 100%;
  position: absolute;
  list-style: none;
}
body #menu .tools-panel .breadcrumbs-dropdown.active ul {
  display: block;
  padding-left: 400px;
}
body #menu .tools-panel .breadcrumbs-dropdown.active ul li {
  display: inline-block;
  padding: 2px 0;
}
body #menu .tools-panel .breadcrumbs-dropdown.active ul li a {
  text-decoration: underline;
  font-weight: normal;
}
body #menu .tools-panel .breadcrumbs-dropdown.active ul li:not(:last-child):after {
  content: "\2192";
  margin: 0 4px;
}
body #menu .tools-panel .tools-items {
  height: 40px;
  display: flex;
  gap: 0 16px;
  align-items: center;
}
body #menu .tools-panel .tools-items.toggle-button {
  display: none;
}
body #menu .tools-panel .tools-items .filter-item.toggle-button.search {
  display: none;
}
body.hidden-menu #menu .tools-panel .breadcrumbs-dropdown.active ul {
  padding-left: 100px;
}
body .left-menu {
  -webkit-backface-visibility: hidden;
  -moz-backface-visibility: hidden;
  backface-visibility: hidden;
  position: fixed;
  z-index: 4;
  top: 110px;
  bottom: 0;
  width: 340px;
}
body .left-menu div.search {
  display: flex;
  align-items: baseline;
  padding-left: 23px;
}
body .left-menu div.search .left-menu-filter {
  flex: 1;
}
body .left-menu::after {
  content: '';
  position: absolute;
  top: -40px;
  right: 0;
  width: 1px;
  height: 100vh;
  z-index: -1;
}
body .left-menu > div:not(.left-menu-filter-wrapper) {
  box-sizing: border-box;
}
body .left-menu a {
  font-weight: 400;
  text-decoration: none;
}
body .left-menu a:focus-visible {
  outline-offset: -2px;
}
body .left-menu .left-menu-filter-wrapper {
  position: absolute;
  height: 40px;
  top: -40px;
  width: 100%;
  z-index: 1;
}
body .left-menu .left-menu-filter-wrapper .dx-icon-search {
  font-size: 16px;
}
body .left-menu .left-menu-filter-wrapper .left-menu-filter {
  width: 340px;
  height: 40px;
  padding-left: 8px;
}
body .left-menu .left-menu-filter-wrapper .left-menu-filter .dx-placeholder {
  font-size: 16px;
}
body .left-menu .left-menu-filter-wrapper .left-menu-filter .dx-placeholder:before {
  padding: 0;
}
body .left-menu .left-menu-filter-wrapper .left-menu-filter.dx-texteditor.dx-editor-outlined {
  border: none;
}
body .left-menu .left-menu-filter-wrapper .left-menu-filter.dx-texteditor .dx-texteditor-input {
  margin-right: 25px;
  padding: 12px 30px 12px 0;
  border-radius: 0;
}
body .left-menu .left-menu-filter-wrapper .left-menu-filter.dx-texteditor .dx-texteditor-buttons-container {
  position: absolute;
}
body .left-menu .left-menu-filter-wrapper .left-menu-filter.dx-texteditor .dx-texteditor-buttons-container .dx-icon-clear {
  top: 20px;
  left: 260px;
}
body .left-menu .widgets-menu {
  height: 100%;
}
body .left-menu .widgets-menu .site-search-suggestion {
  display: none;
  margin: 20px 20px 40px 25px;
  font-size: 15px;
}
body .left-menu .widgets-menu .hidden {
  display: none;
}
body .left-menu .widgets-menu.filter-empty .site-search-suggestion {
  display: block;
}
body .left-menu .widgets-menu.filter-empty > ul {
  display: none;
}
body .left-menu .widgets-menu ul {
  list-style: none;
  padding-left: 0;
}
body .left-menu .widgets-menu ul.first-level-list,
body .left-menu .widgets-menu ul.equivalents {
  padding-left: 0;
}
body .left-menu .widgets-menu ul.first-level-list > li.category > .first-level,
body .left-menu .widgets-menu ul.equivalents > li.category > .first-level {
  padding: 12px 12px 12px 24px;
}
body .left-menu .widgets-menu ul.first-level-list > li.category > ul,
body .left-menu .widgets-menu ul.equivalents > li.category > ul {
  padding: 8px 0;
}
body .left-menu .widgets-menu ul.first-level-list > li.category.Updated > .first-level .link-text:after,
body .left-menu .widgets-menu ul.equivalents > li.category.Updated > .first-level .link-text:after,
body .left-menu .widgets-menu ul.first-level-list > li.category.New > .first-level .link-text:after,
body .left-menu .widgets-menu ul.equivalents > li.category.New > .first-level .link-text:after,
body .left-menu .widgets-menu ul.first-level-list > li.category.Roadmap > .first-level .link-text:after,
body .left-menu .widgets-menu ul.equivalents > li.category.Roadmap > .first-level .link-text:after {
  display: none;
}
body .left-menu .widgets-menu ul.first-level-list > li.category > ul,
body .left-menu .widgets-menu ul.equivalents > li.category > ul {
  padding-left: 0;
}
body .left-menu .widgets-menu ul li:not(.category) .group-name {
  padding: 8px 12px 8px 20px;
}
body .left-menu .widgets-menu ul li:not(.category) .ajax-link {
  padding: 8px 12px 8px 46px;
}
body .left-menu .widgets-menu ul li:not(.category) li .group-name {
  padding-left: 40px;
}
body .left-menu .widgets-menu ul li:not(.category) li .ajax-link {
  padding-left: 66px;
}
body .left-menu .widgets-menu ul li:not(.category) li li .group-name {
  padding-left: 56px;
}
body .left-menu .widgets-menu ul li:not(.category) li li .ajax-link {
  padding-left: 82px;
}
body .left-menu .widgets-menu ul li:not(.category) li li li .group-name {
  padding-left: 72px;
}
body .left-menu .widgets-menu ul li:not(.category) li li li .ajax-link {
  padding-left: 98px;
}
body .left-menu .widgets-menu ul li .first-level {
  font-weight: 700;
  font-size: 16px;
  line-height: 24px;
}
body .left-menu .widgets-menu ul li .first-level::after {
  content: '';
  position: absolute;
  height: 0;
  bottom: 0;
  right: 12px;
  left: 24px;
  border-bottom-width: 1px;
  border-bottom-style: solid;
}
body .left-menu .widgets-menu ul li .first-level,
body .left-menu .widgets-menu ul li .ajax-link,
body .left-menu .widgets-menu ul li .group-name {
  cursor: pointer;
  line-height: 16px;
  height: 16px;
  position: relative;
  display: inline-flex;
  align-items: center;
  gap: 6px;
  width: -moz-available;
  width: -webkit-fill-available;
}
body .left-menu .widgets-menu ul li .first-level::before,
body .left-menu .widgets-menu ul li .ajax-link::before,
body .left-menu .widgets-menu ul li .group-name::before {
  transition: transform 0.2s;
  position: absolute;
  left: 0;
}
body .left-menu .widgets-menu ul li .first-level .expander,
body .left-menu .widgets-menu ul li .ajax-link .expander,
body .left-menu .widgets-menu ul li .group-name .expander {
  flex: 0;
  height: 24px;
}
body .left-menu .widgets-menu ul li .first-level:focus-visible,
body .left-menu .widgets-menu ul li .group-name:focus-visible {
  outline-offset: -3px;
}
body .left-menu .widgets-menu ul li .ajax-link,
body .left-menu .widgets-menu ul li .group-name {
  font-size: 15px;
}
body .left-menu .widgets-menu ul li > ul {
  display: none;
}
body .left-menu .widgets-menu ul li.opened > ul {
  display: block;
}
body .left-menu .widgets-menu ul .category.hidden {
  display: none;
}
body .left-menu .widgets-menu ul .category .link-text:after {
  position: absolute;
  right: 12px;
  display: inline-block;
  color: white;
  font-size: 14px;
  line-height: 20px;
  height: 20px;
  font-weight: 500;
  padding: 0 6px;
  margin-left: 6px;
  border-radius: 50px;
  text-decoration: none;
}
body .left-menu .widgets-menu ul .category.Updated .link-text:after,
body .left-menu .widgets-menu ul .category .Updated .link-text:after {
  content: "Upd";
  background-color: #42b883;
}
body .left-menu .widgets-menu ul .category.New .link-text:after,
body .left-menu .widgets-menu ul .category .New .link-text:after {
  content: "New";
  background-color: #dd1144;
}
body .left-menu .widgets-menu ul .category.Roadmap .link-text:after,
body .left-menu .widgets-menu ul .category .Roadmap .link-text:after {
  content: "In Progress";
  background-color: #ff9000;
}
body .left-menu .widgets-menu ul .category > ul {
  display: none;
}
body .left-menu .widgets-menu ul .category > ul .api-section {
  list-style: none;
}
body .left-menu .widgets-menu ul .api-section.None .link-text::after,
body .left-menu .widgets-menu ul .ajax-link.None .link-text::after {
  display: none;
}
body .left-menu .widgets-menu div.equivalents {
  margin: 20px 24px 0;
}
body .left-menu .widgets-menu ul.equivalent {
  margin: 20px 0;
}
body .left-menu .widgets-menu .equivalents-header {
  margin: 0 24px;
  padding-top: 12px;
}
body .left-menu .widgets-menu .equivalents-header.second {
  border-top: solid 1px;
}
body .left-menu {
  -webkit-backface-visibility: hidden;
  -moz-backface-visibility: hidden;
  backface-visibility: hidden;
  position: fixed;
  z-index: 4;
  top: 110px;
  bottom: 0;
  width: 340px;
}
body .left-menu div.search {
  display: flex;
  align-items: baseline;
  padding-left: 23px;
}
body .left-menu div.search .left-menu-filter {
  flex: 1;
}
body .left-menu::after {
  content: '';
  position: absolute;
  top: -40px;
  right: 0;
  width: 1px;
  height: 100vh;
  z-index: -1;
}
body .left-menu > div:not(.left-menu-filter-wrapper) {
  box-sizing: border-box;
}
body .left-menu a {
  font-weight: 400;
  text-decoration: none;
}
body .left-menu a:focus-visible {
  outline-offset: -2px;
}
body .left-menu .left-menu-filter-wrapper {
  position: absolute;
  height: 40px;
  top: -40px;
  width: 100%;
  z-index: 1;
}
body .left-menu .left-menu-filter-wrapper .dx-icon-search {
  font-size: 16px;
}
body .left-menu .left-menu-filter-wrapper .left-menu-filter {
  width: 340px;
  height: 40px;
  padding-left: 8px;
}
body .left-menu .left-menu-filter-wrapper .left-menu-filter .dx-placeholder {
  font-size: 16px;
}
body .left-menu .left-menu-filter-wrapper .left-menu-filter .dx-placeholder:before {
  padding: 0;
}
body .left-menu .left-menu-filter-wrapper .left-menu-filter.dx-texteditor.dx-editor-outlined {
  border: none;
}
body .left-menu .left-menu-filter-wrapper .left-menu-filter.dx-texteditor .dx-texteditor-input {
  margin-right: 25px;
  padding: 12px 30px 12px 0;
  border-radius: 0;
}
body .left-menu .left-menu-filter-wrapper .left-menu-filter.dx-texteditor .dx-texteditor-buttons-container {
  position: absolute;
}
body .left-menu .left-menu-filter-wrapper .left-menu-filter.dx-texteditor .dx-texteditor-buttons-container .dx-icon-clear {
  top: 20px;
  left: 260px;
}
body .left-menu .widgets-menu {
  height: 100%;
}
body .left-menu .widgets-menu .site-search-suggestion {
  display: none;
  margin: 20px 20px 40px 25px;
  font-size: 15px;
}
body .left-menu .widgets-menu .hidden {
  display: none;
}
body .left-menu .widgets-menu.filter-empty .site-search-suggestion {
  display: block;
}
body .left-menu .widgets-menu.filter-empty > ul {
  display: none;
}
body .left-menu .widgets-menu ul {
  list-style: none;
  padding-left: 0;
}
body .left-menu .widgets-menu ul.first-level-list,
body .left-menu .widgets-menu ul.equivalents {
  padding-left: 0;
}
body .left-menu .widgets-menu ul.first-level-list > li.category > .first-level,
body .left-menu .widgets-menu ul.equivalents > li.category > .first-level {
  padding: 12px 12px 12px 24px;
}
body .left-menu .widgets-menu ul.first-level-list > li.category > ul,
body .left-menu .widgets-menu ul.equivalents > li.category > ul {
  padding: 8px 0;
}
body .left-menu .widgets-menu ul.first-level-list > li.category.Updated > .first-level .link-text:after,
body .left-menu .widgets-menu ul.equivalents > li.category.Updated > .first-level .link-text:after,
body .left-menu .widgets-menu ul.first-level-list > li.category.New > .first-level .link-text:after,
body .left-menu .widgets-menu ul.equivalents > li.category.New > .first-level .link-text:after,
body .left-menu .widgets-menu ul.first-level-list > li.category.Roadmap > .first-level .link-text:after,
body .left-menu .widgets-menu ul.equivalents > li.category.Roadmap > .first-level .link-text:after {
  display: none;
}
body .left-menu .widgets-menu ul.first-level-list > li.category > ul,
body .left-menu .widgets-menu ul.equivalents > li.category > ul {
  padding-left: 0;
}
body .left-menu .widgets-menu ul li:not(.category) .group-name {
  padding: 8px 12px 8px 20px;
}
body .left-menu .widgets-menu ul li:not(.category) .ajax-link {
  padding: 8px 12px 8px 46px;
}
body .left-menu .widgets-menu ul li:not(.category) li .group-name {
  padding-left: 40px;
}
body .left-menu .widgets-menu ul li:not(.category) li .ajax-link {
  padding-left: 66px;
}
body .left-menu .widgets-menu ul li:not(.category) li li .group-name {
  padding-left: 56px;
}
body .left-menu .widgets-menu ul li:not(.category) li li .ajax-link {
  padding-left: 82px;
}
body .left-menu .widgets-menu ul li:not(.category) li li li .group-name {
  padding-left: 72px;
}
body .left-menu .widgets-menu ul li:not(.category) li li li .ajax-link {
  padding-left: 98px;
}
body .left-menu .widgets-menu ul li .first-level {
  font-weight: 700;
  font-size: 16px;
  line-height: 24px;
}
body .left-menu .widgets-menu ul li .first-level::after {
  content: '';
  position: absolute;
  height: 0;
  bottom: 0;
  right: 12px;
  left: 24px;
  border-bottom-width: 1px;
  border-bottom-style: solid;
}
body .left-menu .widgets-menu ul li .first-level,
body .left-menu .widgets-menu ul li .ajax-link,
body .left-menu .widgets-menu ul li .group-name {
  cursor: pointer;
  line-height: 16px;
  height: 16px;
  position: relative;
  display: inline-flex;
  align-items: center;
  gap: 6px;
  width: -moz-available;
  width: -webkit-fill-available;
}
body .left-menu .widgets-menu ul li .first-level::before,
body .left-menu .widgets-menu ul li .ajax-link::before,
body .left-menu .widgets-menu ul li .group-name::before {
  transition: transform 0.2s;
  position: absolute;
  left: 0;
}
body .left-menu .widgets-menu ul li .first-level .expander,
body .left-menu .widgets-menu ul li .ajax-link .expander,
body .left-menu .widgets-menu ul li .group-name .expander {
  flex: 0;
  height: 24px;
}
body .left-menu .widgets-menu ul li .first-level:focus-visible,
body .left-menu .widgets-menu ul li .group-name:focus-visible {
  outline-offset: -3px;
}
body .left-menu .widgets-menu ul li .ajax-link,
body .left-menu .widgets-menu ul li .group-name {
  font-size: 15px;
}
body .left-menu .widgets-menu ul li > ul {
  display: none;
}
body .left-menu .widgets-menu ul li.opened > ul {
  display: block;
}
body .left-menu .widgets-menu ul .category.hidden {
  display: none;
}
body .left-menu .widgets-menu ul .category .link-text:after {
  position: absolute;
  right: 12px;
  display: inline-block;
  color: white;
  font-size: 14px;
  line-height: 20px;
  height: 20px;
  font-weight: 500;
  padding: 0 6px;
  margin-left: 6px;
  border-radius: 50px;
  text-decoration: none;
}
body .left-menu .widgets-menu ul .category.Updated .link-text:after,
body .left-menu .widgets-menu ul .category .Updated .link-text:after {
  content: "Upd";
  background-color: #42b883;
}
body .left-menu .widgets-menu ul .category.New .link-text:after,
body .left-menu .widgets-menu ul .category .New .link-text:after {
  content: "New";
  background-color: #dd1144;
}
body .left-menu .widgets-menu ul .category.Roadmap .link-text:after,
body .left-menu .widgets-menu ul .category .Roadmap .link-text:after {
  content: "In Progress";
  background-color: #ff9000;
}
body .left-menu .widgets-menu ul .category > ul {
  display: none;
}
body .left-menu .widgets-menu ul .category > ul .api-section {
  list-style: none;
}
body .left-menu .widgets-menu ul .api-section.None .link-text::after,
body .left-menu .widgets-menu ul .ajax-link.None .link-text::after {
  display: none;
}
body .left-menu .widgets-menu div.equivalents {
  margin: 20px 24px 0;
}
body .left-menu .widgets-menu ul.equivalent {
  margin: 20px 0;
}
body .left-menu .widgets-menu .equivalents-header {
  margin: 0 24px;
  padding-top: 12px;
}
body .left-menu .widgets-menu .equivalents-header.second {
  border-top: solid 1px;
}
body.hidden-menu .widgets-menu-container {
  display: none;
}
body.hidden-menu .page-wrapper .doc-content {
  margin-left: 0;
}
body.hidden-menu .view-content {
  margin-left: 0;
}
body .body-container.content-width {
  padding-top: 70px;
}
body h1,
body h5 {
  font-family: 'Roboto', sans-serif;
  margin: 0;
}
body h2,
body h3,
body h4 {
  font-family: 'Roboto', sans-serif;
  margin: 0;
}
body h1 {
  font-weight: 700;
  font-size: 32px;
  padding: 0 0 16px 0;
}
body h2 {
  font-size: 24px;
  padding: 24px 0 12px 0;
}
body h3 {
  font-size: 20px;
  padding: 20px 0 10px 0;
}
body h4 {
  font-size: 20px;
  padding: 16px 0 8px 0;
}
body h5 {
  padding: 16px 0 8px 0;
}
body ul,
body li {
  margin: 0;
}
body .btn-text-overflow {
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
body .page-wrapper {
  position: relative;
  overflow: hidden;
  min-height: 100%;
  margin-bottom: -120px;
}
body .page-wrapper:after {
  content: '';
  display: block;
  height: 120px;
}
body .clear {
  clear: both;
}
body .dx-loadpanel-content {
  padding: 10px;
  border: 1px solid;
  text-align: center;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  -webkit-touch-callout: none;
  -webkit-user-drag: none;
  border-radius: 5px;
}
body .dx-overlay-wrapper.dx-loadpanel-wrapper {
  z-index: 1 !important;
}
body .dx-overlay-wrapper.dx-loadpanel-wrapper .dx-loadpanel-content.dx-loadpanel-pane-hidden {
  z-index: 1 !important;
}
body .dx-overlay-wrapper.dx-loadpanel-wrapper .dx-loadpanel-content.dx-loadpanel-pane-hidden .dx-loadindicator {
  width: 60px;
  height: 60px;
}
body .dx-overlay-wrapper.dx-loadpanel-wrapper .dx-loadpanel-content.dx-loadpanel-pane-hidden .dx-loadindicator .dx-loadindicator-icon .dx-loadindicator-segment {
  background: #7d8793;
}
body .dx-overlay-wrapper.dx-loadpanel-wrapper .dx-loadpanel-content.dx-loadpanel-pane-hidden .dx-loadpanel-message {
  color: #7d8793;
  font-size: 15px;
  line-height: 21px;
  margin-top: 10px;
}
body .whats-new-subpanel-container .space {
  display: none;
}
body .background-block p {
  font-size: 16px;
  line-height: 24px;
}
body .full-screen-demo .content .doc-content {
  display: none;
}
body .content {
  padding-top: 40px;
}
body .content .doc-content {
  width: auto;
  margin-left: 340px;
  margin-right: auto;
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  padding: 32px 40px;
}
body .content .doc-content.index {
  display: flex;
  flex-flow: column;
  gap: 40px;
}
body .content .doc-content.index p {
  margin: 0;
}
body .content .doc-content.index h1.page-title {
  padding: 0 0 16px 0;
}
body .content .doc-content.index h3.block-title {
  padding: 0;
}
body .content .doc-content.index h3.block-title + p {
  padding: 16px 0 0 0;
}
body .content .doc-content.index .page-block-header {
  padding: 0 0 40px 0;
}
body .content .doc-content.index .components-list-page-block .page-block-header {
  padding: 0;
}
body .content .doc-content.index .featured-components-container {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  gap: 20px;
  margin: 0;
}
body .content .doc-content.index .featured-components-container .component-container {
  padding: 8px;
  width: 120px;
  box-sizing: border-box;
  border-radius: 8px;
  display: flex;
  align-items: center;
  flex-direction: column;
  gap: 12px;
}
body .content .doc-content.index .featured-components-container .component-container .component-icon {
  width: 64px;
  height: 64px;
}
body .content .doc-content.index .featured-components-container .component-container .component-link {
  font-weight: normal;
  font-size: 16px;
  line-height: 24px;
  text-align: center;
}
body .content .doc-content.index .components-list-container {
  column-width: 200px;
  margin: 8px 0 32px 0;
}
body .content .doc-content.index .components-list-container .category-container {
  padding-top: 32px;
  break-inside: avoid;
  min-width: 200px;
}
body .content .doc-content.index .components-list-container .category-container .category-title {
  font-weight: 700;
  font-size: 14px;
  line-height: 20px;
  margin-bottom: 8px;
}
body .content .doc-content.index .components-list-container .category-container .demos-list {
  display: flex;
  flex-flow: column;
  gap: 8px;
}
body .content .doc-content.index .components-list-container .category-container .demos-list .link-container a {
  line-height: 20px;
  text-decoration: underline;
}
body .content .doc-content.index .components-list-container .category-container .demos-list .link-container:after {
  display: inline-block;
  color: white;
  font-size: 14px;
  line-height: 20px;
  height: 20px;
  font-weight: 500;
  padding: 0 6px;
  margin-left: 6px;
  border-radius: 50px;
  text-decoration: none;
}
body .content .doc-content.index .components-list-container .category-container .demos-list .link-container.Roadmap:after {
  content: "In Progress";
  background-color: #ff9000;
}
body .content .doc-content.index .components-list-container .category-container .demos-list .link-container.New:after {
  content: "New";
  background-color: #dd1144;
}
body .content .doc-content.index .components-list-container .category-container .demos-list .link-container.Updated:after {
  content: "Upd";
  background-color: #42b883;
}
body .content .doc-content .reference-button {
  font-size: 18px;
  padding: 4px 16px;
  margin-bottom: 16px;
}
body .content .doc-content .apiReferenceSection,
body .content .doc-content .documentationSection {
  padding-right: 30px;
  padding-top: 0;
  padding-bottom: 0;
  margin-top: 0;
  margin-bottom: 0;
}
body .content .doc-content .apiReferenceSection h2.api-header,
body .content .doc-content .documentationSection h2.api-header {
  font-size: 30px;
  font-family: 'Roboto', sans-serif;
  font-weight: bold;
  padding-top: 24px;
  padding-bottom: 12px;
  margin-top: 0;
  margin-bottom: 0;
}
body .content .doc-content .apiReferenceSection .short-description,
body .content .doc-content .documentationSection .short-description,
body .content .doc-content .apiReferenceSection .full-description-offset,
body .content .doc-content .documentationSection .full-description-offset,
body .content .doc-content .apiReferenceSection .parameter-description,
body .content .doc-content .documentationSection .parameter-description,
body .content .doc-content .apiReferenceSection .git-edit-paragraph,
body .content .doc-content .documentationSection .git-edit-paragraph {
  font-family: 'Roboto', sans-serif;
  font-size: 16px;
  line-height: 24px;
}
body .content .doc-content .apiReferenceSection .short-description:hover .git-edit-link,
body .content .doc-content .documentationSection .short-description:hover .git-edit-link,
body .content .doc-content .apiReferenceSection .full-description-offset:hover .git-edit-link,
body .content .doc-content .documentationSection .full-description-offset:hover .git-edit-link,
body .content .doc-content .apiReferenceSection .parameter-description:hover .git-edit-link,
body .content .doc-content .documentationSection .parameter-description:hover .git-edit-link,
body .content .doc-content .apiReferenceSection .git-edit-paragraph:hover .git-edit-link,
body .content .doc-content .documentationSection .git-edit-paragraph:hover .git-edit-link {
  visibility: visible;
}
body .content .doc-content p {
  margin: 0 0 16px 0;
}
body .content .doc-content li,
body .content .doc-content p {
  font-size: 16px;
  line-height: 24px;
  font-family: 'Roboto';
}
body .content .doc-content li p {
  margin: 0 0 4px 0;
}
body .content .doc-content .short-description {
  position: relative;
}
body .content .doc-content .api-example {
  padding-bottom: 15px;
}
body .content .doc-content .anchor {
  height: 110px;
  margin-top: -110px;
  visibility: hidden;
  display: block;
  position: absolute;
}
body .content .doc-content .note {
  padding: 16px;
  font-size: 16px;
  line-height: 24px;
  margin: 24px 0;
}
body .content .doc-content .note .note-text ul {
  padding-bottom: 0;
}
body .content .doc-content .note .note-text ul li:last-child p {
  margin-bottom: 0;
}
body .content .doc-content .note.note-important {
  line-height: 24px;
  padding: 16px;
}
body .content .doc-content .note.note-important .note-header {
  padding-bottom: 4px;
}
body .content .doc-content .note .note-header {
  font-weight: bold;
  padding-bottom: 4px;
}
body .content .doc-content ul {
  padding: 0 0 12px 18px;
}
body .content .doc-content ul ul {
  list-style-type: disc;
}
body .content .doc-content img {
  max-width: 100%;
}
body .content .doc-content video {
  max-width: 100%;
}
body .content .doc-content .libs {
  font-size: 16px;
  line-height: 24px;
}
body .content .doc-content .libs:last-child {
  padding-bottom: 20px;
}
body .content .doc-content .accordion-hidden-content {
  display: none;
}
body .content .doc-content .dx-accordion-item-selected,
body .content .doc-content .dx-accordion-item-opened {
  border-radius: 8px;
  margin-bottom: 7px;
}
body .content .doc-content .accordion-content .dx-accordion-item-closed {
  padding-bottom: 50px;
}
body .content .doc-content .accordion-content .dx-accordion-item {
  border: 1px solid transparent;
}
body .content .doc-content .accordion-content .dx-accordion-item-title,
body .content .doc-content .accordion-content .dx-accordion-item-body {
  padding: 8px 58px 8px 16px;
}
body .content .doc-content .accordion-content .dx-accordion-item-title {
  font-size: 20px;
  font-family: 'Roboto', sans-serif;
  padding-right: 22px;
  border-radius: 8px;
}
body .content .doc-content .accordion-content .dx-accordion-item-title:hover {
  height: 43px;
}
body .content .doc-content .accordion-content .dx-accordion-item-title:before {
  line-height: 28px;
}
body .content .doc-content .accordion-content .dx-accordion-item-title svg {
  height: 24px;
  width: 24px;
  vertical-align: bottom;
  margin-right: 8px;
}
body .content .doc-content .accordion-content .dx-accordion-item-body {
  padding-top: 0;
  border: none;
}
body .content .doc-content .accordion-content .dx-accordion-item-body .accordion-item-content > p:first-child {
  margin-bottom: 7px;
}
body .content .doc-content .accordion-content .dx-accordion-item-body .vote-text {
  line-height: 38px;
}
body .content .doc-content .accordion-content .dx-accordion-item-body .code-type,
body .content .doc-content .accordion-content .dx-accordion-item-body .numbers,
body .content .doc-content .accordion-content .dx-accordion-item-body pre {
  z-index: unset;
}
body .content .doc-content h5.see-also {
  font-size: 16px;
  line-height: 21px;
  font-family: 'Roboto', sans-serif;
  font-weight: 600;
  border-top: 1px solid;
  padding: 16px 0 8px 0;
  margin: 30px 0 0 0;
  font-weight: bold;
}
body .content .doc-content h5.see-also + ul,
body .content .doc-content h5.see-also + p {
  font-size: 16px;
  line-height: 24px;
  padding: 0 0 30px 0;
  margin: -8px 0 0 0;
}
body .content .doc-content h5.see-also + ul li {
  list-style-type: none;
  position: relative;
  padding: 8px 0 0 0;
}
body .content .doc-content h5.see-also + p {
  margin-top: 0;
  padding: 0 20px 20px 0;
}
body .content .doc-content .code-wrapper {
  position: relative;
  -moz-user-select: none;
  -ms-user-select: none;
  -webkit-user-select: none;
  user-select: none;
  border-spacing: 3px 0;
}
body .content .doc-content .code-wrapper.code-tabs {
  border-collapse: separate;
}
body .content .doc-content .code-wrapper.code-tabs .code-type {
  cursor: pointer;
  margin-right: 3px;
  display: table-cell;
  padding-left: 0.5rem;
  padding-right: 0.5rem;
  border-top-left-radius: 4px;
  border-top-right-radius: 4px;
  font-size: 14px;
}
body .content .doc-content .code-wrapper.code-tabs pre.prettyprint {
  display: none;
}
body .content .doc-content .code-wrapper.code-tabs pre.prettyprint.active {
  display: block;
}
body .content .doc-content .code-wrapper .code-type {
  border: 1px solid;
  border-bottom: none;
  display: table-cell;
  padding-left: 0.5rem;
  padding-right: 0.5rem;
  border-top-left-radius: 4px;
  border-top-right-radius: 4px;
  font-size: 14px;
}
body .content .doc-content .code-wrapper pre {
  margin: 0px;
  z-index: 2;
  position: relative;
  -webkit-border-radius: 4px;
  -moz-border-radius: 4px;
  -ms-border-radius: 4px;
  -o-border-radius: 4px;
  border-radius: 4px;
  border: 1px solid;
}
body .content .doc-content .code-wrapper pre.prettyprint {
  margin-bottom: 20px;
}
body .content .doc-content .code-wrapper pre.prettyprint ol.numbers li {
  font-size: 16px;
  color: #bebec5;
}
body .content .doc-content .code-wrapper ul.linenums {
  padding-bottom: 0;
}
body .content .doc-content .code-wrapper ul.linenums li {
  font-size: 16px;
  text-shadow: none;
}
body .content .doc-content div.download-code-button {
  padding-bottom: 20px;
}
body .content .doc-content .api-header {
  display: inline-block;
  font-size: 36px;
  font-family: 'Roboto', sans-serif;
  font-weight: bold;
}
body .content .doc-content .api-header a {
  font-size: 30px;
  font-family: 'Roboto', sans-serif;
  line-height: 35px;
}
body .content .doc-content .api-property-block .api-property {
  border-left: 3px solid;
  padding-left: 10px;
  font-size: 16px;
  line-height: 20px;
  margin-bottom: 16px;
}
body .content .doc-content .api-property-block .api-property:not(:last-child) {
  padding-bottom: 8px;
}
body .content .doc-content .api-property-block .api-property p {
  display: inline;
  white-space: nowrap;
  font-size: 16px;
}
body .content .doc-content .api-property-block .api-property.no-margin {
  margin-bottom: 0;
}
body .content .doc-content .api-property-block .api-property span.api-property-name {
  font-weight: normal;
}
body .content .doc-content .api-property-block .api-property .type-fields-offset {
  padding-left: 20px;
}
body .content .doc-content .api-property-block .api-property .type-offset {
  padding-left: 0px;
  padding-top: 8px;
}
body .content .doc-content .api-property-block .api-property .parameter-name:not(:first-child) {
  padding-top: 10px;
}
body .content .doc-content .api-property-block .api-property .parameter-name .deprecated {
  background: url(/Content/Images/Documentation/icon-attention-small.png) no-repeat center right;
  height: 12px;
  width: 16px;
  display: inline-block;
}
body .content .doc-content .api-property-block .api-property .parameter-description {
  padding-top: 8px;
  position: relative;
}
body .content .doc-content .api-property-block .api-property .parameter-description p {
  white-space: pre-wrap;
  font-size: 16px;
  margin: 0;
}
body .content .doc-content .api-property-block .api-property .parameter-description li {
  font-size: 16px;
}
body .content .doc-content .api-property-block .api-property .parameter-description ul {
  padding-bottom: 0;
}
body .content .doc-content .api-property-block .api-property .parameter-description ul li {
  font-size: 12px;
  text-shadow: none;
}
body .content .doc-content .full-description-offset {
  position: relative;
  margin-top: 15px;
}
body .content .doc-content .simple-table {
  font-size: 16px;
  margin-bottom: 20px;
}
body .content .doc-content .simple-table table {
  border-collapse: collapse;
}
body .content .doc-content .simple-table table td:first-child {
  text-align: center;
}
body .content .doc-content .simple-table:not(.normal-font-style) table td:first-child {
  font-style: italic;
}
body .content .doc-content .simple-table td,
body .content .doc-content .simple-table th {
  padding: 5px 20px;
  border: 2px solid;
}
body .content .doc-content .dx-table {
  border-collapse: collapse;
  font-size: 16px;
  margin-bottom: 20px;
  font-family: 'Roboto', sans-serif;
}
body .content .doc-content .dx-table tr th {
  text-align: left;
  font-weight: normal;
  border-bottom: 2px solid;
}
body .content .doc-content .dx-table tr td.member-name a {
  font-size: 16px;
}
body .content .doc-content .dx-table tr th,
body .content .doc-content .dx-table tr td {
  padding: 5px 20px;
}
body .content .doc-content .dx-table tr .parameter-name {
  width: 16%;
}
body .content .doc-content .dx-table tr .parameter-type {
  width: 20%;
}
body .content .doc-content .dx-table tr .parameter-description {
  position: relative;
}
body .content .doc-content .dx-table.full-width {
  width: 100%;
}
body .content .doc-content .dx-table.full-width tr > td:first-child {
  width: 20%;
}
body .content .doc-content .dx-table p {
  margin: 0;
}
body .content .doc-content .multicolumn-list tr > td {
  width: 33.3%;
  padding: 10px;
  vertical-align: text-top;
}
body .content .doc-content .multicolumn-list tr > td ul {
  list-style-position: outside;
}
body .content .doc-content .multicolumn-list tr > td ul li {
  padding: 4px;
}
body .content .doc-content .footnotes {
  width: 300px;
  margin-bottom: 30px;
  border-top: 1px solid;
}
body .content .doc-content .footnotes ol,
body .content .doc-content .footnotes ul {
  margin-top: 10px;
  padding: 0;
  list-style: none;
}
body .content .doc-content .footnotes ol li,
body .content .doc-content .footnotes ul li {
  font-size: 12px;
  counter-increment: custom;
}
body .content .doc-content .footnotes ol > li::before {
  font-size: 0.8em;
  vertical-align: text-top;
  content: counter(custom) " - ";
}
body .content .doc-content .footnotes ul > li::before {
  content: "* - ";
}
body .content .doc-content .three-col {
  -moz-column-count: 3;
  -moz-column-gap: 20px;
  -webkit-column-count: 3;
  -webkit-column-gap: 20px;
}
body .content .doc-content .documentation-gallery {
  position: relative;
  margin: 0 auto;
  margin-bottom: 50px;
}
body .content .doc-content .documentation-gallery .gallery-border {
  position: absolute;
  z-index: 2;
  border: solid 1px;
  bottom: 0;
  right: 0;
  left: 0;
  top: 0;
}
body .content .doc-content .documentation-gallery .gallery-border .arrow {
  width: 34px;
  height: 45px;
  position: absolute;
  top: 50%;
  margin-top: -23px;
  cursor: pointer;
  background-position: center;
  background-repeat: no-repeat;
  border: solid 1px;
  background-color: white;
}
body .content .doc-content .documentation-gallery .gallery-border .left-arrow {
  left: -17px;
  background-image: url('/Content/Images/Documentation/arrow-prev.svg');
}
body .content .doc-content .documentation-gallery .gallery-border .right-arrow {
  right: -17px;
  background-image: url('/Content/Images/Documentation/arrow-next.svg');
}
body .content .doc-content .documentation-gallery .dx-gallery-wrapper {
  position: absolute;
  bottom: -30px;
  top: 0;
  height: auto;
}
body .content .doc-content .documentation-gallery .dx-gallery-wrapper .gallery-content {
  padding-bottom: 30px;
}
body .content .doc-content .documentation-gallery .dx-gallery-wrapper .gallery-content h4 {
  font-size: 20px;
  font-family: 'Roboto', sans-serif;
  font-weight: bold;
  padding-top: 16px;
  padding-bottom: 8px;
}
body .content .doc-content .documentation-gallery .gallery-item .image {
  position: absolute;
  bottom: 100px;
  top: 0;
  width: 100%;
  background-repeat: no-repeat;
  background-position: center center;
  box-sizing: border-box;
  border-left: 15px solid;
  border-right: 15px solid;
}
body .content .doc-content .documentation-gallery .gallery-item .text {
  position: absolute;
  height: 90px;
  bottom: 30px;
  width: 100%;
  display: table;
}
body .content .doc-content .documentation-gallery .gallery-item .text div {
  vertical-align: middle;
  display: table-cell;
  height: 90px;
}
body .content .doc-content .api-example .show-text {
  color: #7f7f7f;
  padding-bottom: 3px;
  font-size: 16px;
}
body .content .doc-content .api-example .approach-tab-container:after {
  content: "";
  display: table;
  clear: both;
}
body .content .doc-content .api-example .approach-tab-container .button.approach-switcher {
  min-width: 90px;
  margin-right: -2px;
  display: block;
  float: left;
  white-space: normal;
  background-color: white;
  color: red;
}
body .content .doc-content .api-example .approach-tab-container .button.approach-switcher:after {
  border: 4px solid transparent;
  border-top: 4px solid;
  content: "";
  margin-top: 9px;
  float: right;
}
body .content .doc-content .api-example .approach-tab-container .button.approach-switcher.current:after {
  border-top: none;
  border-bottom: 4px solid;
}
body .content .doc-content .api-example .approach-tab {
  display: none;
}
body .content .doc-content .api-example .approach-tab.visible {
  display: block;
}
body .content .doc-content.search-page .header h1 {
  font-size: 36px;
  font-family: 'Roboto', sans-serif;
  font-weight: 700;
  margin-top: 0;
  margin-bottom: 0;
}
body .content .doc-content.search-page .header ul.search-counts {
  padding: 0 0 15px 0;
  list-style: none;
  border-bottom: 1px solid;
  white-space: nowrap;
}
body .content .doc-content.search-page .header ul.search-counts li {
  display: inline;
  padding: 0;
  margin-right: 30px;
}
body .content .doc-content.search-page .header ul.search-counts li .count {
  font-weight: bold;
}
body .content .doc-content.search-page .header ul.search-counts li.search-new-window a {
  background-image: url(/Content/Images/Documentation/icon-new-win.svg);
  background-repeat: no-repeat;
  background-position: 100% 75%;
  padding-right: 18px;
}
body .content .doc-content.search-page .header ul.search-counts li:first-child:not(.active) {
  padding-left: 0px;
}
body .content .doc-content.search-page .header ul.search-counts li.active {
  border-bottom: 2px solid;
  padding-bottom: 15px;
}
body .content .doc-content.search-page .header:after {
  content: '';
  display: block;
  clear: both;
}
body .content .doc-content.search-page h4 {
  font-size: 20px;
  font-family: 'Roboto', sans-serif;
  font-weight: bold;
  padding-top: 30px;
  padding-bottom: 10px;
  margin: 0;
}
body .content .doc-content.search-page h4 a {
  font-size: 24px;
}
body .content .doc-content.search-page .article-type {
  line-height: 24px;
}
body .content .doc-content.search-page .article-type p {
  margin: 10px 0;
}
body .content .doc-content.search-page .article-type:nth-last-of-type(1) {
  padding-bottom: 10px;
}
body .content .doc-content.search-page p {
  line-height: 24px;
}
body .content .doc-content.search-page .pagination {
  text-align: right;
  padding-bottom: 50px;
  padding-top: 10px;
}
body .content .doc-content.search-page .pagination .pagination-title {
  display: none;
}
body .content .doc-content.search-page .pagination .activeItem-item,
body .content .doc-content.search-page .pagination a {
  display: inline-block;
  height: 50px;
  width: 50px;
  border-radius: 25px;
  vertical-align: middle;
  text-align: center;
  line-height: 50px;
}
body .content .doc-content.search-page .pagination .activeItem-item.arrow-item,
body .content .doc-content.search-page .pagination a.arrow-item {
  background: no-repeat center;
}
body .content .doc-content.search-page .pagination .activeItem-item.arrow-item.left,
body .content .doc-content.search-page .pagination a.arrow-item.left {
  -webkit-mask-image: url('/Content/Images/Documentation/arrow-prev.svg');
  -webkit-mask-size: contain;
  -webkit-mask-repeat: no-repeat;
  -webkit-mask-position: center;
  background-color: #627789;
}
body .content .doc-content.search-page .pagination .activeItem-item.arrow-item.right,
body .content .doc-content.search-page .pagination a.arrow-item.right {
  -webkit-mask-image: url('/Content/Images/Documentation/arrow-next.svg');
  -webkit-mask-size: contain;
  -webkit-mask-repeat: no-repeat;
  -webkit-mask-position: center;
  background-color: #627789;
}
body .content .doc-content .api-header,
body .content .doc-content .article-section-header {
  position: relative;
  margin-left: -30px;
  padding-left: 30px;
}
body .content .doc-content .api-header .visible-anchor,
body .content .doc-content .article-section-header .visible-anchor {
  width: 20px;
  height: 20px;
  position: absolute;
  top: 50%;
  margin-left: -30px;
  padding-right: 10px;
  background-image: url(/Content/ImagesNew/Doc/link.svg);
  background-position: left center;
  background-repeat: no-repeat;
  visibility: hidden;
}
body .content .doc-content .api-header:hover .visible-anchor {
  visibility: visible;
  margin-top: -3px;
}
body .content .doc-content .article-section-header:hover .visible-anchor {
  visibility: visible;
}
body .content .doc-content .article-header,
body .content .doc-content .api-header {
  position: relative;
  font-family: 'Roboto', sans-serif;
  font-weight: bold;
}
body .content .doc-content .article-header .badge,
body .content .doc-content .api-header .badge {
  position: absolute;
  top: 0;
  margin-left: 5px;
  font-size: 11px;
  font-weight: bold;
  padding: 0 2px 0 2px;
  border-radius: 2px;
  line-height: 15px;
}
body .content .doc-content .axe-block {
  margin-bottom: 16px;
  min-width: 760px;
  width: 100%;
}
body .content .doc-content .axe-report {
  display: flex;
  flex-direction: row;
  padding: 16px 24px;
  gap: 16px;
  border: 1px solid;
  border-radius: 8px;
}
body .content .doc-content .axe-report svg {
  flex: 0 0 100px;
  align-self: center;
}
body .content .doc-content .axe-report .axe-header {
  font-family: Roboto;
  font-weight: 600;
  font-size: 20px;
  line-height: 24px;
}
body .content .doc-content .axe-report .axe-box-with-btn {
  display: flex;
  flex-direction: row;
  gap: 16px;
}
body .content .doc-content .axe-report .axe-box {
  display: flex;
  flex-direction: column;
  gap: 12px;
}
body .content .doc-content .axe-report .axe-text {
  font-family: Roboto;
  font-size: 14px;
  font-weight: 400;
  line-height: 20px;
  text-align: left;
}
body .content .doc-content .axe-report .axe-trademark {
  font-family: Roboto;
  font-size: 12px;
  font-weight: 400;
  line-height: 18px;
  text-align: left;
}
body .content .doc-content .axe-report .axe-button {
  display: block;
  padding: 10px 20px;
  border-radius: 40px;
  width: 190px;
  min-width: unset;
  white-space: nowrap;
  align-self: center;
  align-items: center;
  justify-content: center;
  box-shadow: 0px 2px 12px 0px #00000014, 0px 1px 4px 0px #0000000f;
  font-family: Roboto;
  font-size: 16px;
  font-weight: 500;
  line-height: 24px;
  cursor: pointer;
  border: none;
}
body .content .doc-content .axe-report .axe-button:focus,
body .content .doc-content .axe-report .axe-button:focus-visible {
  outline: none;
}
body .content .doc-content .axe-report sup {
  position: relative;
  font-size: 70%;
  line-height: 0;
  vertical-align: baseline;
  top: -0.8em;
}
body .content .doc-content .axe-note {
  height: 32px;
  margin-top: 16px;
  display: flex;
  flex: 0 0 1397px;
  justify-content: left;
  align-items: center;
  vertical-align: middle;
  padding: 4px 8px;
  gap: 8px;
  border-radius: 8px;
  font-family: Roboto;
  font-size: 14px;
  font-weight: 400;
  line-height: 18px;
  text-align: left;
}
body .content .doc-content .roadmap-survey-block {
  display: flex;
  flex-direction: row;
  gap: 32px;
  padding: 16px 24px;
  border: 1px solid;
  border-radius: 8px;
}
body .content .doc-content .roadmap-survey-text-block {
  display: flex;
  flex-direction: column;
  gap: 12px;
}
body .content .doc-content .roadmap-survey-header {
  display: flex;
  gap: 8px;
  font-family: Roboto;
  font-size: 20px;
  font-weight: 600;
  line-height: 24px;
  text-align: left;
}
body .content .doc-content .roadmap-survey-header svg {
  flex-shrink: 0;
}
body .content .doc-content .roadmap-survey-text {
  font-family: Roboto;
  font-size: 14px;
  font-weight: 400;
  line-height: 20px;
  text-align: left;
}
body .content .doc-content .roadmap-survey-button {
  height: 44px;
  align-self: center;
  padding: 10px 20px 10px 16px;
  min-width: unset;
  width: fit-content;
  white-space: nowrap;
}
body .content .doc-content .roadmap-image-block {
  max-height: 550px;
  border: 1px solid;
  border-radius: 8px;
  padding: 24px;
  display: flex;
  align-items: center;
  align-content: center;
}
body .content .doc-content .roadmap-image-block img {
  max-width: 75%;
  max-height: 550px;
  margin-left: auto;
  margin-right: auto;
}
body .content .doc-content .simulator-wrapper {
  min-width: 760px;
  width: 100%;
  margin-bottom: 32px;
}
body .content .doc-content .simulator-wrapper .simulator-content-box {
  width: 100%;
  display: flex;
  flex-direction: row;
  box-sizing: border-box;
  gap: 20px;
}
body .content .doc-content .simulator-wrapper .demo-panel-box {
  flex: 3 1 1000px;
}
body .content .doc-content .simulator-wrapper.surveyjs {
  padding-bottom: 0px;
  display: flex;
  flex-direction: column;
  gap: 32px;
  min-width: 360px;
}
body .content .doc-content .simulator-wrapper.surveyjs .description p:last-of-type {
  margin-bottom: 0px;
}
body .content .doc-content .simulator-wrapper.surveyjs .description,
body .content .doc-content .simulator-wrapper.surveyjs .second-description {
  margin: 0px;
  min-width: unset;
}
body .content .doc-content .description,
body .content .doc-content .second-description {
  box-sizing: border-box;
  position: relative;
  min-width: 760px;
  margin-bottom: 32px;
}
body .content .doc-content .description-expand,
body .content .doc-content .second-description-expand {
  z-index: 1;
  opacity: 1;
  height: auto;
}
body .content .doc-content .description code,
body .content .doc-content .second-description code {
  padding: 2px 4px;
  color: #dd1144;
  white-space: nowrap;
  border: 1px solid;
  display: inline;
  border-radius: 4px;
  font-size: 14px;
}
body .content .doc-content .description pre code,
body .content .doc-content .second-description pre code {
  border: none;
  display: inline-block;
  padding: 0;
  max-width: 900px;
  width: auto;
}
body .content .doc-content .description pre code .CodeMirror,
body .content .doc-content .second-description pre code .CodeMirror {
  border: 1px solid #e1e1e8;
  padding: 10px;
  border-radius: 4px;
  height: auto;
  z-index: 0;
}
body .content .doc-content .description pre code .CodeMirror pre,
body .content .doc-content .second-description pre code .CodeMirror pre {
  font-size: 12px;
}
body .content .doc-content .description pre code .CodeMirror-linenumber,
body .content .doc-content .second-description pre code .CodeMirror-linenumber {
  font-size: 12px;
}
body .content .doc-content .description .note,
body .content .doc-content .second-description .note {
  padding: 20px;
  font-size: 14px;
  margin-bottom: 10px;
}
body .content .doc-content .description .note .note-header,
body .content .doc-content .second-description .note .note-header {
  font-weight: bold;
}
body .content .doc-content .description p:last-of-type {
  margin-bottom: 8px;
}
body .content .doc-content .description-text a {
  text-decoration: underline;
}
body .content .doc-content .description-text p {
  text-size-adjust: 100%;
}
body .content .doc-content .simulators {
  min-height: 440px;
  border-radius: 0 0 6px 6px;
  border: 1px solid;
  border-top: none;
}
body .content .doc-content .simulators .demo-device {
  min-height: 440px;
  border-radius: 0 0 6px 6px;
}
body .content .doc-content .simulators .demo-device .demo-display {
  min-height: 440px;
  background: inherit;
  position: relative;
  border-radius: 0 0 6px 6px;
}
body .content .doc-content .simulators .demo-device .demo-display .demo-frame-container {
  height: 100%;
}
body .content .doc-content .simulators .demo-device .demo-display .demo-credits {
  text-align: right;
  font-size: 14px;
  color: #bfbfbf;
}
body .content .doc-content .simulators .demo-device .demo-display .load-panel {
  position: absolute;
  background: inherit;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  /* banner */

}
body .content .doc-content .simulators .demo-device .demo-display .load-panel .load-panel-banner-wrapper {
  display: flex;
  align-items: center;
  justify-content: center;
  height: 100%;
}
body .content .doc-content .simulators .demo-device .demo-display .load-panel .load-panel-banner-wrapper .load-panel-banner {
  max-width: 540px;
  box-sizing: border-box;
  padding: 20px;
  border: 1px solid #ffe4c2;
  border-radius: 8px;
  background-color: #ff900014;
}
body .content .doc-content .simulators .demo-device .demo-display .load-panel .load-panel-banner-wrapper .load-panel-banner p,
body .content .doc-content .simulators .demo-device .demo-display .load-panel .load-panel-banner-wrapper .load-panel-banner a {
  display: inline;
  font-size: 14px;
  line-height: 20px;
  font-weight: 400;
  color: #3f4d5a;
}
body .content .doc-content .simulators .demo-device .demo-display .load-panel .load-panel-banner-wrapper .load-panel-banner a {
  text-decoration: underline;
  color: #222930;
}
body .content .doc-content .simulators .demo-frame {
  width: 100%;
  min-height: 450px;
  margin: 0;
  padding: 0;
  border: 0;
  outline: 0;
  background-color: transparent;
  border-bottom-left-radius: 6px;
  border-bottom-right-radius: 6px;
}
body .content .doc-content .simulators .demo-frame-disabled {
  display: none;
}
body .content .doc-content .simulators #git-demo-frame {
  width: 100%;
  position: relative;
  z-index: 1;
  min-height: 440px;
}
body .content .doc-content .simulators.Mobile,
body .content .doc-content .simulators.TabletLandscape,
body .content .doc-content .simulators.TabletPortrait {
  box-shadow: none;
}
body .content .doc-content .simulators.Mobile .demo-device,
body .content .doc-content .simulators.TabletLandscape .demo-device,
body .content .doc-content .simulators.TabletPortrait .demo-device {
  border: 1px solid;
  border-radius: 15px;
}
body .content .doc-content .simulators.Mobile .demo-device .demo-display,
body .content .doc-content .simulators.TabletLandscape .demo-device .demo-display,
body .content .doc-content .simulators.TabletPortrait .demo-device .demo-display {
  border-radius: 2px;
  border: 1px solid;
}
body .content .doc-content .simulators.Mobile .demo-device .demo-display .demo-frame,
body .content .doc-content .simulators.TabletLandscape .demo-device .demo-display .demo-frame,
body .content .doc-content .simulators.TabletPortrait .demo-device .demo-display .demo-frame {
  height: 100%;
}
body .content .doc-content .simulators.TabletLandscape .demo-device {
  height: 511px;
  width: 780px;
  margin: 0 auto 0;
}
body .content .doc-content .simulators.TabletLandscape .demo-device .demo-display {
  margin-top: 14px;
  height: 480px;
  margin-left: 29px;
  width: 720px;
}
body .content .doc-content .simulators.TabletPortrait .demo-device {
  height: 780px;
  width: 511px;
  margin: 0 auto 0;
}
body .content .doc-content .simulators.TabletPortrait .demo-device .demo-display {
  margin-top: 29px;
  height: 720px;
  margin-left: 14px;
  width: 480px;
}
body .content .doc-content .simulators.Mobile .demo-device {
  height: 740px;
  width: 400px;
  margin: 10px auto 40px auto;
}
body .content .doc-content .simulators.Mobile .demo-device .demo-display {
  margin-top: 70px;
  height: 590px;
  margin-left: 20px;
  width: 360px;
}
body .content .doc-content .simulators.templates .demo-frame {
  min-height: 700px;
}
body .content .doc-content .simulators.simulators-no-border,
body .content .doc-content .simulators.simulators-no-border .demo-device,
body .content .doc-content .simulators.simulators-no-border .demo-device .demo-display {
  border: 0;
  padding: 0;
  box-shadow: none;
}
body .content .doc-content .title {
  padding-left: 40px;
}
body .content .marketing-demos .demos-container {
  padding: 32px;
  border-radius: 24px;
  display: flex;
  gap: 24px;
  flex-wrap: wrap;
}
body .content .marketing-demos .demo-link {
  flex: 1 350px;
  border-radius: 12px;
  box-shadow: 0px 2px 8px rgba(0, 0, 0, 0.12);
  display: grid;
  grid-template-rows: 1fr 1fr 1fr;
}
body .content .marketing-demos .demo-link:empty {
  visibility: hidden;
  height: none;
}
body .content .marketing-demos .demo-link-img {
  border-radius: 12px;
  grid-row-start: 1;
  grid-row-end: 5;
  grid-column: 1;
}
body .content .marketing-demos .demo-link-content {
  padding: 18px 24px;
  border-top: 1px solid;
  border-radius: 0 0 12px 12px;
  grid-row-start: 3;
  grid-row-end: 5;
  grid-column: 1;
}
body .content .marketing-demos .demo-link-content h5 {
  padding: 0 0 8px 0;
  font-style: normal;
  font-weight: 600;
  font-size: 20px;
  line-height: 125%;
}
body .content .marketing-demos .demo-link-content p {
  font-weight: 400;
  font-size: 16px;
  line-height: 135%;
}
body .content .top-content {
  position: relative;
  display: flex;
  gap: 32px;
  align-items: center;
}
body .content .top-content__expand {
  height: 36px;
  min-width: auto;
  border-width: 1px;
  padding: 6px 16px 6px 8px;
}
body .content .top-content__expand:focus-visible {
  outline-width: 0;
}
body .content .top-content__expand__svg {
  width: 24px;
  height: 24px;
}
body .content .top-content__expand__svg-visible,
body .content .top-content__expand__span-visible {
  display: block;
}
body .content .top-content__expand__svg-hide,
body .content .top-content__expand__span-hide {
  display: none;
}
body .content .top-content #report-design-btn {
  position: absolute;
  right: 0;
  height: 36px;
  top: 0;
}
body .content .top-content svg polygon,
body .content .top-content svg path,
body .content .top-content svg rect {
  fill: #8b949c;
}
body .content .top-content h1 {
  padding: 0;
}
body .content .top-content h1.New:after,
body .content .top-content h1.Updated:after,
body .content .top-content h1.Roadmap:after {
  left: -3px;
  font-size: 11px;
  padding: 2px 4px 3px 4px;
  font-family: 'Roboto', sans-serif;
  border-radius: 3px;
  position: relative;
  color: white;
  top: -13px;
  font-weight: 400;
}
body .content .top-content h1.New:after {
  content: "New";
  background-color: #f05b41;
}
body .content .top-content h1.Updated:after {
  content: "Updated";
  background-color: #1e70b9;
}
body .content .top-content h1.Roadmap:after {
  content: "In Progress";
  background-color: #a89cda;
}
body .content .demo-details {
  flex: 1 1 480px;
  align-items: stretch;
}
body .content .code {
  overflow: hidden;
  border: 1px solid;
  border-radius: 6px;
  max-height: calc(17%);
  height: calc(17%);
  min-height: 500px;
}
body .content .code .not-yet {
  height: 148px;
  font-size: 16px;
  text-align: center;
}
body .content .code .not-yet span {
  display: inline-block;
  margin-top: 64px;
}
body .content .code .tabs-container {
  display: flex;
  border-bottom: 1px solid;
  height: 60px;
}
body .content .code .tabs-container #code-tabs {
  width: 100%;
  display: inline-flex;
  justify-content: space-between;
}
body .content .code .tabs-container #code-tabs.has-arrow .tbs-arrows {
  display: flex;
  height: 100%;
}
body .content .code .tabs-container #code-tabs.has-arrow .tbs-children {
  overflow: hidden;
}
body .content .code .tabs-container #code-tabs.has-backend .switch {
  display: inline-flex;
}
body .content .code .tabs-container #code-tabs .switch {
  display: none;
}
body .content .code .tabs-container #code-tabs .switch::before {
  content: '';
  width: 1px;
  height: 100%;
  position: absolute;
  left: 0;
}
body .content .code .tabs-container #code-tabs .tbs-children-container {
  height: 60px;
}
body .content .code .tabs-container #code-tabs .tbs-arrows {
  display: none;
}
body .content .code .tabs-container #code-tabs .tbs-arrow {
  display: flex;
  min-width: 32px;
  height: 100%;
  padding: 0;
  border-radius: 0;
}
body .content .code .tabs-container #code-tabs .tbs-children {
  width: 100%;
  border: none;
  align-items: flex-start;
  justify-content: start;
}
body .content .code .tabs-container #code-tabs .tbs-children-container {
  position: relative;
  display: inline-flex;
  justify-content: flex-start;
}
body .content .code .tabs-container #code-tabs .tbs-item {
  white-space: nowrap;
}
body .content .code .tabs-container #code-tabs .tbs-item-container {
  position: relative;
}
body .content .code .tabs-container #code-tabs .tbs-item-container.active .tbs-item {
  width: inherit;
  position: relative;
}
body .content .code .tabs-container #code-tabs .tbs-item-container.active .tbs-item::after {
  content: "";
  position: absolute;
  right: 0;
  left: 0;
  width: 100%;
  height: 4px;
  bottom: -18px;
  border-top-right-radius: 8px;
  border-top-left-radius: 8px;
  border-bottom-right-radius: unset;
  border-bottom-left-radius: unset;
}
body .content .code .buttons-container {
  height: 52px;
  border-bottom: 1px solid;
}
body .content .code .buttons-container .buttons {
  height: inherit;
  display: flex;
  justify-content: space-between;
  gap: 8px;
  padding: 8px;
  box-sizing: border-box;
}
body .content .code .buttons-container .buttons-left {
  display: flex;
  gap: 8px;
}
body .content .code .buttons-container .buttons.fixed {
  position: fixed;
  z-index: 3;
  border-bottom: 1px solid;
}
body .content .code .buttons-container .btn.btn {
  height: 36px;
  min-width: auto;
  font-size: 16px;
  line-height: 24px;
}
body .content .code .source-block {
  margin: 10px;
  display: none;
  overflow: auto;
  height: 400px;
  min-height: 380px;
  scrollbar-width: thin;
}
body .content .code .source-block::-webkit-scrollbar {
  width: 8px;
}
body .content .code .source-block::-webkit-scrollbar-track {
  border-radius: 20px;
}
body .content .code .source-block::-webkit-scrollbar-thumb {
  border-radius: 20px;
}
body .content .code .source-block.active {
  display: block;
}
body .content .code .source-block.hidden {
  display: none;
}
body .content .code .source-block .CodeMirror {
  height: auto;
  font-size: 14px;
  z-index: 0;
}
body .content .code .source-block .CodeMirror .CodeMirror-scroll {
  overflow: hidden !important;
}
body .content .code .source-block .CodeMirror code,
body .content .code .source-block .CodeMirror pre {
  font-family: Monaco, Menlo, Consolas, "Courier New", monospace;
  display: block;
  font-size: 12px;
  line-height: 20px;
  word-break: break-all;
  word-wrap: break-word;
  white-space: pre;
  white-space: pre-wrap;
  -webkit-border-radius: 4px;
  -moz-border-radius: 4px;
  -ms-border-radius: 4px;
  -o-border-radius: 4px;
  border-radius: 4px;
}
body .content .code .source-block .CodeMirror code .prettyprint,
body .content .code .source-block .CodeMirror pre .prettyprint {
  margin-bottom: 20px;
}
body .content .code .source-block .CodeMirror code code,
body .content .code .source-block .CodeMirror pre code {
  padding: 0;
  white-space: pre;
  white-space: pre-wrap;
  border: 0;
}
body .content .code .source-block .CodeMirror code {
  padding: 2px 4px;
  white-space: nowrap;
  border: 1px solid;
  border-color: #e1e1e8;
  display: inline;
}
body .content .code .move-demo-container {
  display: flex;
  flex-direction: column;
  align-items: center;
  height: 200px;
}
body .content .code .move-demo-container .move-demo-text {
  padding: 15px;
  padding-bottom: 16px;
  font-size: 14px;
}
body .content .code .move-demo-container .move-demo-button {
  padding: 5px 15px;
  border: 1px solid;
  -webkit-border-radius: 5px;
  -moz-border-radius: 5px;
  -ms-border-radius: 5px;
  -o-border-radius: 5px;
  border-radius: 5px;
  margin: 0px;
  color: white;
  text-decoration: none;
}
body .content .code .move-demo-container .move-demo-button:hover {
  border: 1px solid;
}
body .content .code .move-demo-container .move-demo-button .move-demo-icon {
  display: inline;
  vertical-align: middle;
  margin-left: 5px;
  margin-bottom: 3px;
}
body .content .code .move-demo-container .move-demo-button .move-demo-icon path {
  stroke: white;
}
body .content .demo-nav-links {
  box-sizing: border-box;
  padding: 12px;
  height: 60px;
  display: flex;
  align-items: center;
  gap: 0 8px;
  position: relative;
  border-radius: 6px 6px 0 0;
  border: 1px solid;
  justify-content: right;
}
body .content .demo-nav-links a {
  text-decoration: none;
  display: flex;
  font-size: 16px;
  align-items: center;
  justify-content: center;
  height: 24px;
  width: 24px;
  border: none;
  padding: 6px;
}
body .content .demo-nav-links a:focus-visible {
  outline: 2px solid;
  outline-offset: 0px;
}
body .content .demo-nav-links a svg {
  height: 24px;
  width: 24px;
}
body .content .demo-nav-links a.adaptivity-switcher {
  width: auto;
}
body .content .demo-nav-links span.nav-border {
  width: 1px;
  height: 46px;
}
body .content .demo-nav-links button#fullScreenLink {
  display: flex;
  justify-content: center;
  align-items: center;
  padding: 6px;
  border: none;
  cursor: pointer;
}
body .content .demo-nav-links button#fullScreenLink #open-full-screen {
  display: block;
}
body .content .demo-nav-links button#fullScreenLink #close-full-screen {
  display: none;
}
body .content .demo-nav-links span.separator {
  width: 1px;
  height: 24px;
}
body .content .demo-nav-links a,
body .content .demo-nav-links button#fullScreenLink {
  border-radius: 50px;
}
body .content .demo-nav-links .justify-left {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  margin-right: auto;
  overflow-x: hidden;
}
body .content .demo-nav-links .justify-left svg {
  flex-shrink: 0;
}
body .content .demo-nav-links .uitg-button {
  padding: 6px 16px 6px 8px;
  min-width: unset;
  width: 70%;
  /*width: auto;*/
  height: 36px;
  overflow-x: hidden;
}
body .content .demo-nav-links .uitg-button:last-of-type {
  margin-right: auto;
}
body .content .demo-nav-links .themes-container .dx-texteditor.dx-editor-outlined {
  border: none;
}
body .content .demo-nav-links .demo-nav-arrows {
  display: flex;
}
body .content:not(.document__body) .doc-content h5.see-also + ul li:before {
  content: "";
  border-radius: 3px;
  border: 3px solid;
  display: inline-block;
  margin-right: 15px;
}
body .debug-invalid-model-popup {
  position: fixed;
  bottom: 80px;
  right: 0;
  padding: 10px;
  width: 300px;
  z-index: 9999;
}
body #docerror.error {
  position: static;
  height: auto;
  margin: 118px auto;
}
body a {
  outline: none;
  text-decoration: none;
}
body .doc-content.wide-demo {
  flex-direction: column;
}
body .doc-content.wide-demo .demo-details {
  max-width: inherit;
}
body .doc-content nav,
body .doc-content section {
  display: block;
}
body .doc-content .nav {
  margin-bottom: 20px;
  margin-left: 0;
  list-style: none;
}
body .doc-content .nav-tabs:after {
  clear: both;
}
body .doc-content .hide {
  display: none;
}
body .doc-content .tab-content {
  overflow: auto;
}
body .doc-content .tab-content > .tab-pane,
body .doc-content .pill-content > .pill-pane {
  display: none;
}
body .doc-content .tab-content > .active,
body .doc-content .pill-content > .active {
  display: block;
}
body .doc-content code .prettyprint,
body .doc-content pre .prettyprint {
  margin-bottom: 20px;
}
body .doc-content code code,
body .doc-content pre code {
  padding: 0;
  color: inherit;
  white-space: pre;
  white-space: pre-wrap;
  background-color: transparent;
  border: 0;
}
body .doc-content code {
  padding: 2px 4px;
  white-space: nowrap;
  border: 1px solid;
  display: inline;
}
body .doc-content .pre-scrollable {
  max-height: 340px;
  overflow-y: scroll;
}
body .doc-content .nav-tabs > .active > a,
body .doc-content .nav-tabs > .active > a:focus {
  cursor: default;
  border: 1px solid;
  border-bottom-color: transparent;
}
body .doc-content .codeTabs.nav.nav-tabs {
  padding: 20px 0 0 0;
  border-bottom: 2px solid;
}
body .doc-content .codeTabs.nav.nav-tabs li {
  float: none;
  display: inline-block;
}
body .doc-content .codeTabs.nav.nav-tabs li a {
  border: none;
  padding: 8px 12px;
  line-height: 36px;
  margin: 0;
}
body .doc-content .codeTabs.nav.nav-tabs li.active {
  border-top: 2px solid;
  border-left: 2px solid;
  border-right: 2px solid;
}
body .doc-content .codeTabs.nav.nav-tabs li.active a {
  padding-bottom: 12px;
}
body .button:not(.feedback__button) {
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  display: inline-block;
  font-size: 16px;
  font-family: 'Roboto', sans-serif;
  font-weight: normal;
  position: relative;
  text-decoration: none;
  text-align: center;
  white-space: nowrap;
  cursor: pointer;
  height: 22px;
  line-height: 22px;
  vertical-align: middle;
  box-sizing: initial;
  border: 1px solid;
  -webkit-border-radius: 50px;
  -moz-border-radius: 50px;
  -ms-border-radius: 50px;
  -o-border-radius: 50px;
  border-radius: 50px;
}
body .button:not(.feedback__button).small {
  font-size: 13px;
}
body .button:not(.feedback__button).large {
  width: 400px;
  font-size: 24px;
}
body .button:not(.feedback__button).center {
  margin-left: auto;
  margin-right: auto;
  display: block;
}
body .button:not(.feedback__button).btn-show-demo {
  margin-bottom: 15px;
}
body .button:not(.feedback__button).fiddle {
  height: 40px;
  display: inline-flex;
  gap: 0 10px;
  border: none;
  padding: 0 16px;
}
body .button:not(.feedback__button).fiddle .button-text {
  align-self: center;
}
body .button:not(.feedback__button).reset,
body .button:not(.feedback__button).apply {
  padding: 8px 20px;
  float: right;
  align-items: center;
  border: none;
  margin-right: 16px;
  height: 40px;
  box-sizing: border-box;
}
body .button:not(.feedback__button).apply {
  border: 1px solid;
}
body .button:not(.feedback__button).backend {
  border-radius: 4px;
  padding: 8px 20px;
  width: 100px;
  margin: 5px 1px 5px -17px;
}
body .dx-list-group-header {
  margin: 0;
  padding: 8px 15px;
  border-bottom: none;
  font-weight: normal;
}
body #reset,
body #apply {
  width: 72px;
}
body .dx-dropdownlist-popup-wrapper .dx-list:not(.dx-list-select-decorator-enabled) .dx-list-item-content {
  padding: 5px 15px 5px 0;
}
body .dx-popup-content {
  padding: 0;
}
body .adaptivity-switcher {
  position: absolute;
  left: 45%;
}
body .adaptivity-switcher .switcher-item-wrapper {
  cursor: pointer;
  box-sizing: border-box;
  height: 38px;
  border-radius: 8px;
}
body .adaptivity-switcher .switcher-item-wrapper.landscape {
  padding: 8px 6px;
}
body .adaptivity-switcher .switcher-item-wrapper.landscape .switcher-item {
  width: 24px;
  height: 14px;
}
body .adaptivity-switcher .switcher-item-wrapper.landscape .switcher-item .inner {
  display: block;
  position: relative;
  left: 3px;
  top: 2px;
  height: 10px;
  width: 18px;
}
body .adaptivity-switcher .switcher-item-wrapper.portrait {
  padding: 6px 11px;
}
body .adaptivity-switcher .switcher-item-wrapper.portrait .switcher-item {
  width: 14px;
  height: 24px;
}
body .adaptivity-switcher .switcher-item-wrapper.portrait .switcher-item .inner {
  display: block;
  position: relative;
  left: 2px;
  top: 3px;
  height: 18px;
  width: 10px;
}
body .adaptivity-switcher .switcher-item-wrapper .switcher-item {
  display: inline-block;
  cursor: pointer;
  border-radius: 2px;
}
body #themeChooserPopup.dx-overlay-content {
  -webkit-border-radius: 16px;
  -moz-border-radius: 16px;
  -ms-border-radius: 16px;
  -o-border-radius: 16px;
  border-radius: 16px;
  border: none;
}
body #copy-to-code-codepen,
body #copy-to-code-sandbox {
  border: 0px;
  padding: 6px 16px 6px 8px;
  white-space: nowrap;
  overflow: hidden;
}
body #copy-to-code-codepen svg,
body #copy-to-code-sandbox svg {
  flex-shrink: 0;
}
@media only screen and (max-width: 1900px) {
  body .content .doc-content.wide-demo {
    flex-flow: column;
  }
}
@media only screen and (max-width: 1600px) {
  body .content .doc-content .simulator-content-box {
    flex-direction: column !important;
  }
  body .content .doc-content .demo-panel-box {
    flex: 1 !important;
  }
  body .content .doc-content .demo-details {
    flex: 1 !important;
  }
}
@media only screen and (max-width: 1080px) {
  body .content .doc-content #widgetAccordion {
    display: none;
  }
  body .content .doc-content #widgetAccordion .widget-tree-main .widget-tree {
    display: none;
  }
  body .content .doc-content #widgetAccordion .widget-tree-main .widget-view {
    position: initial;
    height: 500px;
  }
}
@media only screen and (max-width: 1200px) {
  body .doc-content {
    padding: 32px 40px 40px 40px !important;
  }
}
@media screen and (max-width: 768px) {
  body .doc-content {
    padding: 32px 24px 32px 24px !important;
  }
  body .axe-box-with-btn {
    flex-direction: column !important;
  }
}
body.hidden-menu .widgets-menu-container {
  display: none;
}
body.hidden-menu .page-wrapper .doc-content {
  margin-left: 0;
}
body.hidden-menu .view-content {
  margin-left: 0;
}
body .body-container.content-width {
  padding-top: 70px;
}
body h1,
body h5 {
  font-family: 'Roboto', sans-serif;
  margin: 0;
}
body h2,
body h3,
body h4 {
  font-family: 'Roboto', sans-serif;
  margin: 0;
}
body h1 {
  font-weight: 700;
  font-size: 32px;
  padding: 0 0 16px 0;
}
body h2 {
  font-size: 24px;
  padding: 24px 0 12px 0;
}
body h3 {
  font-size: 20px;
  padding: 20px 0 10px 0;
}
body h4 {
  font-size: 20px;
  padding: 16px 0 8px 0;
}
body h5 {
  padding: 16px 0 8px 0;
}
body ul,
body li {
  margin: 0;
}
body .btn-text-overflow {
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
body .page-wrapper {
  position: relative;
  overflow: hidden;
  min-height: 100%;
  margin-bottom: -120px;
}
body .page-wrapper:after {
  content: '';
  display: block;
  height: 120px;
}
body .clear {
  clear: both;
}
body .dx-loadpanel-content {
  padding: 10px;
  border: 1px solid;
  text-align: center;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  -webkit-touch-callout: none;
  -webkit-user-drag: none;
  border-radius: 5px;
}
body .dx-overlay-wrapper.dx-loadpanel-wrapper {
  z-index: 1 !important;
}
body .dx-overlay-wrapper.dx-loadpanel-wrapper .dx-loadpanel-content.dx-loadpanel-pane-hidden {
  z-index: 1 !important;
}
body .dx-overlay-wrapper.dx-loadpanel-wrapper .dx-loadpanel-content.dx-loadpanel-pane-hidden .dx-loadindicator {
  width: 60px;
  height: 60px;
}
body .dx-overlay-wrapper.dx-loadpanel-wrapper .dx-loadpanel-content.dx-loadpanel-pane-hidden .dx-loadindicator .dx-loadindicator-icon .dx-loadindicator-segment {
  background: #7d8793;
}
body .dx-overlay-wrapper.dx-loadpanel-wrapper .dx-loadpanel-content.dx-loadpanel-pane-hidden .dx-loadpanel-message {
  color: #7d8793;
  font-size: 15px;
  line-height: 21px;
  margin-top: 10px;
}
body .whats-new-subpanel-container .space {
  display: none;
}
body .background-block p {
  font-size: 16px;
  line-height: 24px;
}
body .full-screen-demo .content .doc-content {
  display: none;
}
body .content {
  padding-top: 40px;
}
body .content .doc-content {
  width: auto;
  margin-left: 340px;
  margin-right: auto;
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  padding: 32px 40px;
}
body .content .doc-content.index {
  display: flex;
  flex-flow: column;
  gap: 40px;
}
body .content .doc-content.index p {
  margin: 0;
}
body .content .doc-content.index h1.page-title {
  padding: 0 0 16px 0;
}
body .content .doc-content.index h3.block-title {
  padding: 0;
}
body .content .doc-content.index h3.block-title + p {
  padding: 16px 0 0 0;
}
body .content .doc-content.index .page-block-header {
  padding: 0 0 40px 0;
}
body .content .doc-content.index .components-list-page-block .page-block-header {
  padding: 0;
}
body .content .doc-content.index .featured-components-container {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  gap: 20px;
  margin: 0;
}
body .content .doc-content.index .featured-components-container .component-container {
  padding: 8px;
  width: 120px;
  box-sizing: border-box;
  border-radius: 8px;
  display: flex;
  align-items: center;
  flex-direction: column;
  gap: 12px;
}
body .content .doc-content.index .featured-components-container .component-container .component-icon {
  width: 64px;
  height: 64px;
}
body .content .doc-content.index .featured-components-container .component-container .component-link {
  font-weight: normal;
  font-size: 16px;
  line-height: 24px;
  text-align: center;
}
body .content .doc-content.index .components-list-container {
  column-width: 200px;
  margin: 8px 0 32px 0;
}
body .content .doc-content.index .components-list-container .category-container {
  padding-top: 32px;
  break-inside: avoid;
  min-width: 200px;
}
body .content .doc-content.index .components-list-container .category-container .category-title {
  font-weight: 700;
  font-size: 14px;
  line-height: 20px;
  margin-bottom: 8px;
}
body .content .doc-content.index .components-list-container .category-container .demos-list {
  display: flex;
  flex-flow: column;
  gap: 8px;
}
body .content .doc-content.index .components-list-container .category-container .demos-list .link-container a {
  line-height: 20px;
  text-decoration: underline;
}
body .content .doc-content.index .components-list-container .category-container .demos-list .link-container:after {
  display: inline-block;
  color: white;
  font-size: 14px;
  line-height: 20px;
  height: 20px;
  font-weight: 500;
  padding: 0 6px;
  margin-left: 6px;
  border-radius: 50px;
  text-decoration: none;
}
body .content .doc-content.index .components-list-container .category-container .demos-list .link-container.Roadmap:after {
  content: "In Progress";
  background-color: #ff9000;
}
body .content .doc-content.index .components-list-container .category-container .demos-list .link-container.New:after {
  content: "New";
  background-color: #dd1144;
}
body .content .doc-content.index .components-list-container .category-container .demos-list .link-container.Updated:after {
  content: "Upd";
  background-color: #42b883;
}
body .content .doc-content .reference-button {
  font-size: 18px;
  padding: 4px 16px;
  margin-bottom: 16px;
}
body .content .doc-content .apiReferenceSection,
body .content .doc-content .documentationSection {
  padding-right: 30px;
  padding-top: 0;
  padding-bottom: 0;
  margin-top: 0;
  margin-bottom: 0;
}
body .content .doc-content .apiReferenceSection h2.api-header,
body .content .doc-content .documentationSection h2.api-header {
  font-size: 30px;
  font-family: 'Roboto', sans-serif;
  font-weight: bold;
  padding-top: 24px;
  padding-bottom: 12px;
  margin-top: 0;
  margin-bottom: 0;
}
body .content .doc-content .apiReferenceSection .short-description,
body .content .doc-content .documentationSection .short-description,
body .content .doc-content .apiReferenceSection .full-description-offset,
body .content .doc-content .documentationSection .full-description-offset,
body .content .doc-content .apiReferenceSection .parameter-description,
body .content .doc-content .documentationSection .parameter-description,
body .content .doc-content .apiReferenceSection .git-edit-paragraph,
body .content .doc-content .documentationSection .git-edit-paragraph {
  font-family: 'Roboto', sans-serif;
  font-size: 16px;
  line-height: 24px;
}
body .content .doc-content .apiReferenceSection .short-description:hover .git-edit-link,
body .content .doc-content .documentationSection .short-description:hover .git-edit-link,
body .content .doc-content .apiReferenceSection .full-description-offset:hover .git-edit-link,
body .content .doc-content .documentationSection .full-description-offset:hover .git-edit-link,
body .content .doc-content .apiReferenceSection .parameter-description:hover .git-edit-link,
body .content .doc-content .documentationSection .parameter-description:hover .git-edit-link,
body .content .doc-content .apiReferenceSection .git-edit-paragraph:hover .git-edit-link,
body .content .doc-content .documentationSection .git-edit-paragraph:hover .git-edit-link {
  visibility: visible;
}
body .content .doc-content p {
  margin: 0 0 16px 0;
}
body .content .doc-content li,
body .content .doc-content p {
  font-size: 16px;
  line-height: 24px;
  font-family: 'Roboto';
}
body .content .doc-content li p {
  margin: 0 0 4px 0;
}
body .content .doc-content .short-description {
  position: relative;
}
body .content .doc-content .api-example {
  padding-bottom: 15px;
}
body .content .doc-content .anchor {
  height: 110px;
  margin-top: -110px;
  visibility: hidden;
  display: block;
  position: absolute;
}
body .content .doc-content .note {
  padding: 16px;
  font-size: 16px;
  line-height: 24px;
  margin: 24px 0;
}
body .content .doc-content .note .note-text ul {
  padding-bottom: 0;
}
body .content .doc-content .note .note-text ul li:last-child p {
  margin-bottom: 0;
}
body .content .doc-content .note.note-important {
  line-height: 24px;
  padding: 16px;
}
body .content .doc-content .note.note-important .note-header {
  padding-bottom: 4px;
}
body .content .doc-content .note .note-header {
  font-weight: bold;
  padding-bottom: 4px;
}
body .content .doc-content ul {
  padding: 0 0 12px 18px;
}
body .content .doc-content ul ul {
  list-style-type: disc;
}
body .content .doc-content img {
  max-width: 100%;
}
body .content .doc-content video {
  max-width: 100%;
}
body .content .doc-content .libs {
  font-size: 16px;
  line-height: 24px;
}
body .content .doc-content .libs:last-child {
  padding-bottom: 20px;
}
body .content .doc-content .accordion-hidden-content {
  display: none;
}
body .content .doc-content .dx-accordion-item-selected,
body .content .doc-content .dx-accordion-item-opened {
  border-radius: 8px;
  margin-bottom: 7px;
}
body .content .doc-content .accordion-content .dx-accordion-item-closed {
  padding-bottom: 50px;
}
body .content .doc-content .accordion-content .dx-accordion-item {
  border: 1px solid transparent;
}
body .content .doc-content .accordion-content .dx-accordion-item-title,
body .content .doc-content .accordion-content .dx-accordion-item-body {
  padding: 8px 58px 8px 16px;
}
body .content .doc-content .accordion-content .dx-accordion-item-title {
  font-size: 20px;
  font-family: 'Roboto', sans-serif;
  padding-right: 22px;
  border-radius: 8px;
}
body .content .doc-content .accordion-content .dx-accordion-item-title:hover {
  height: 43px;
}
body .content .doc-content .accordion-content .dx-accordion-item-title:before {
  line-height: 28px;
}
body .content .doc-content .accordion-content .dx-accordion-item-title svg {
  height: 24px;
  width: 24px;
  vertical-align: bottom;
  margin-right: 8px;
}
body .content .doc-content .accordion-content .dx-accordion-item-body {
  padding-top: 0;
  border: none;
}
body .content .doc-content .accordion-content .dx-accordion-item-body .accordion-item-content > p:first-child {
  margin-bottom: 7px;
}
body .content .doc-content .accordion-content .dx-accordion-item-body .vote-text {
  line-height: 38px;
}
body .content .doc-content .accordion-content .dx-accordion-item-body .code-type,
body .content .doc-content .accordion-content .dx-accordion-item-body .numbers,
body .content .doc-content .accordion-content .dx-accordion-item-body pre {
  z-index: unset;
}
body .content .doc-content h5.see-also {
  font-size: 16px;
  line-height: 21px;
  font-family: 'Roboto', sans-serif;
  font-weight: 600;
  border-top: 1px solid;
  padding: 16px 0 8px 0;
  margin: 30px 0 0 0;
  font-weight: bold;
}
body .content .doc-content h5.see-also + ul,
body .content .doc-content h5.see-also + p {
  font-size: 16px;
  line-height: 24px;
  padding: 0 0 30px 0;
  margin: -8px 0 0 0;
}
body .content .doc-content h5.see-also + ul li {
  list-style-type: none;
  position: relative;
  padding: 8px 0 0 0;
}
body .content .doc-content h5.see-also + p {
  margin-top: 0;
  padding: 0 20px 20px 0;
}
body .content .doc-content .code-wrapper {
  position: relative;
  -moz-user-select: none;
  -ms-user-select: none;
  -webkit-user-select: none;
  user-select: none;
  border-spacing: 3px 0;
}
body .content .doc-content .code-wrapper.code-tabs {
  border-collapse: separate;
}
body .content .doc-content .code-wrapper.code-tabs .code-type {
  cursor: pointer;
  margin-right: 3px;
  display: table-cell;
  padding-left: 0.5rem;
  padding-right: 0.5rem;
  border-top-left-radius: 4px;
  border-top-right-radius: 4px;
  font-size: 14px;
}
body .content .doc-content .code-wrapper.code-tabs pre.prettyprint {
  display: none;
}
body .content .doc-content .code-wrapper.code-tabs pre.prettyprint.active {
  display: block;
}
body .content .doc-content .code-wrapper .code-type {
  border: 1px solid;
  border-bottom: none;
  display: table-cell;
  padding-left: 0.5rem;
  padding-right: 0.5rem;
  border-top-left-radius: 4px;
  border-top-right-radius: 4px;
  font-size: 14px;
}
body .content .doc-content .code-wrapper pre {
  margin: 0px;
  z-index: 2;
  position: relative;
  -webkit-border-radius: 4px;
  -moz-border-radius: 4px;
  -ms-border-radius: 4px;
  -o-border-radius: 4px;
  border-radius: 4px;
  border: 1px solid;
}
body .content .doc-content .code-wrapper pre.prettyprint {
  margin-bottom: 20px;
}
body .content .doc-content .code-wrapper pre.prettyprint ol.numbers li {
  font-size: 16px;
  color: #bebec5;
}
body .content .doc-content .code-wrapper ul.linenums {
  padding-bottom: 0;
}
body .content .doc-content .code-wrapper ul.linenums li {
  font-size: 16px;
  text-shadow: none;
}
body .content .doc-content div.download-code-button {
  padding-bottom: 20px;
}
body .content .doc-content .api-header {
  display: inline-block;
  font-size: 36px;
  font-family: 'Roboto', sans-serif;
  font-weight: bold;
}
body .content .doc-content .api-header a {
  font-size: 30px;
  font-family: 'Roboto', sans-serif;
  line-height: 35px;
}
body .content .doc-content .api-property-block .api-property {
  border-left: 3px solid;
  padding-left: 10px;
  font-size: 16px;
  line-height: 20px;
  margin-bottom: 16px;
}
body .content .doc-content .api-property-block .api-property:not(:last-child) {
  padding-bottom: 8px;
}
body .content .doc-content .api-property-block .api-property p {
  display: inline;
  white-space: nowrap;
  font-size: 16px;
}
body .content .doc-content .api-property-block .api-property.no-margin {
  margin-bottom: 0;
}
body .content .doc-content .api-property-block .api-property span.api-property-name {
  font-weight: normal;
}
body .content .doc-content .api-property-block .api-property .type-fields-offset {
  padding-left: 20px;
}
body .content .doc-content .api-property-block .api-property .type-offset {
  padding-left: 0px;
  padding-top: 8px;
}
body .content .doc-content .api-property-block .api-property .parameter-name:not(:first-child) {
  padding-top: 10px;
}
body .content .doc-content .api-property-block .api-property .parameter-name .deprecated {
  background: url(/Content/Images/Documentation/icon-attention-small.png) no-repeat center right;
  height: 12px;
  width: 16px;
  display: inline-block;
}
body .content .doc-content .api-property-block .api-property .parameter-description {
  padding-top: 8px;
  position: relative;
}
body .content .doc-content .api-property-block .api-property .parameter-description p {
  white-space: pre-wrap;
  font-size: 16px;
  margin: 0;
}
body .content .doc-content .api-property-block .api-property .parameter-description li {
  font-size: 16px;
}
body .content .doc-content .api-property-block .api-property .parameter-description ul {
  padding-bottom: 0;
}
body .content .doc-content .api-property-block .api-property .parameter-description ul li {
  font-size: 12px;
  text-shadow: none;
}
body .content .doc-content .full-description-offset {
  position: relative;
  margin-top: 15px;
}
body .content .doc-content .simple-table {
  font-size: 16px;
  margin-bottom: 20px;
}
body .content .doc-content .simple-table table {
  border-collapse: collapse;
}
body .content .doc-content .simple-table table td:first-child {
  text-align: center;
}
body .content .doc-content .simple-table:not(.normal-font-style) table td:first-child {
  font-style: italic;
}
body .content .doc-content .simple-table td,
body .content .doc-content .simple-table th {
  padding: 5px 20px;
  border: 2px solid;
}
body .content .doc-content .dx-table {
  border-collapse: collapse;
  font-size: 16px;
  margin-bottom: 20px;
  font-family: 'Roboto', sans-serif;
}
body .content .doc-content .dx-table tr th {
  text-align: left;
  font-weight: normal;
  border-bottom: 2px solid;
}
body .content .doc-content .dx-table tr td.member-name a {
  font-size: 16px;
}
body .content .doc-content .dx-table tr th,
body .content .doc-content .dx-table tr td {
  padding: 5px 20px;
}
body .content .doc-content .dx-table tr .parameter-name {
  width: 16%;
}
body .content .doc-content .dx-table tr .parameter-type {
  width: 20%;
}
body .content .doc-content .dx-table tr .parameter-description {
  position: relative;
}
body .content .doc-content .dx-table.full-width {
  width: 100%;
}
body .content .doc-content .dx-table.full-width tr > td:first-child {
  width: 20%;
}
body .content .doc-content .dx-table p {
  margin: 0;
}
body .content .doc-content .multicolumn-list tr > td {
  width: 33.3%;
  padding: 10px;
  vertical-align: text-top;
}
body .content .doc-content .multicolumn-list tr > td ul {
  list-style-position: outside;
}
body .content .doc-content .multicolumn-list tr > td ul li {
  padding: 4px;
}
body .content .doc-content .footnotes {
  width: 300px;
  margin-bottom: 30px;
  border-top: 1px solid;
}
body .content .doc-content .footnotes ol,
body .content .doc-content .footnotes ul {
  margin-top: 10px;
  padding: 0;
  list-style: none;
}
body .content .doc-content .footnotes ol li,
body .content .doc-content .footnotes ul li {
  font-size: 12px;
  counter-increment: custom;
}
body .content .doc-content .footnotes ol > li::before {
  font-size: 0.8em;
  vertical-align: text-top;
  content: counter(custom) " - ";
}
body .content .doc-content .footnotes ul > li::before {
  content: "* - ";
}
body .content .doc-content .three-col {
  -moz-column-count: 3;
  -moz-column-gap: 20px;
  -webkit-column-count: 3;
  -webkit-column-gap: 20px;
}
body .content .doc-content .documentation-gallery {
  position: relative;
  margin: 0 auto;
  margin-bottom: 50px;
}
body .content .doc-content .documentation-gallery .gallery-border {
  position: absolute;
  z-index: 2;
  border: solid 1px;
  bottom: 0;
  right: 0;
  left: 0;
  top: 0;
}
body .content .doc-content .documentation-gallery .gallery-border .arrow {
  width: 34px;
  height: 45px;
  position: absolute;
  top: 50%;
  margin-top: -23px;
  cursor: pointer;
  background-position: center;
  background-repeat: no-repeat;
  border: solid 1px;
  background-color: white;
}
body .content .doc-content .documentation-gallery .gallery-border .left-arrow {
  left: -17px;
  background-image: url('/Content/Images/Documentation/arrow-prev.svg');
}
body .content .doc-content .documentation-gallery .gallery-border .right-arrow {
  right: -17px;
  background-image: url('/Content/Images/Documentation/arrow-next.svg');
}
body .content .doc-content .documentation-gallery .dx-gallery-wrapper {
  position: absolute;
  bottom: -30px;
  top: 0;
  height: auto;
}
body .content .doc-content .documentation-gallery .dx-gallery-wrapper .gallery-content {
  padding-bottom: 30px;
}
body .content .doc-content .documentation-gallery .dx-gallery-wrapper .gallery-content h4 {
  font-size: 20px;
  font-family: 'Roboto', sans-serif;
  font-weight: bold;
  padding-top: 16px;
  padding-bottom: 8px;
}
body .content .doc-content .documentation-gallery .gallery-item .image {
  position: absolute;
  bottom: 100px;
  top: 0;
  width: 100%;
  background-repeat: no-repeat;
  background-position: center center;
  box-sizing: border-box;
  border-left: 15px solid;
  border-right: 15px solid;
}
body .content .doc-content .documentation-gallery .gallery-item .text {
  position: absolute;
  height: 90px;
  bottom: 30px;
  width: 100%;
  display: table;
}
body .content .doc-content .documentation-gallery .gallery-item .text div {
  vertical-align: middle;
  display: table-cell;
  height: 90px;
}
body .content .doc-content .api-example .show-text {
  color: #7f7f7f;
  padding-bottom: 3px;
  font-size: 16px;
}
body .content .doc-content .api-example .approach-tab-container:after {
  content: "";
  display: table;
  clear: both;
}
body .content .doc-content .api-example .approach-tab-container .button.approach-switcher {
  min-width: 90px;
  margin-right: -2px;
  display: block;
  float: left;
  white-space: normal;
  background-color: white;
  color: red;
}
body .content .doc-content .api-example .approach-tab-container .button.approach-switcher:after {
  border: 4px solid transparent;
  border-top: 4px solid;
  content: "";
  margin-top: 9px;
  float: right;
}
body .content .doc-content .api-example .approach-tab-container .button.approach-switcher.current:after {
  border-top: none;
  border-bottom: 4px solid;
}
body .content .doc-content .api-example .approach-tab {
  display: none;
}
body .content .doc-content .api-example .approach-tab.visible {
  display: block;
}
body .content .doc-content.search-page .header h1 {
  font-size: 36px;
  font-family: 'Roboto', sans-serif;
  font-weight: 700;
  margin-top: 0;
  margin-bottom: 0;
}
body .content .doc-content.search-page .header ul.search-counts {
  padding: 0 0 15px 0;
  list-style: none;
  border-bottom: 1px solid;
  white-space: nowrap;
}
body .content .doc-content.search-page .header ul.search-counts li {
  display: inline;
  padding: 0;
  margin-right: 30px;
}
body .content .doc-content.search-page .header ul.search-counts li .count {
  font-weight: bold;
}
body .content .doc-content.search-page .header ul.search-counts li.search-new-window a {
  background-image: url(/Content/Images/Documentation/icon-new-win.svg);
  background-repeat: no-repeat;
  background-position: 100% 75%;
  padding-right: 18px;
}
body .content .doc-content.search-page .header ul.search-counts li:first-child:not(.active) {
  padding-left: 0px;
}
body .content .doc-content.search-page .header ul.search-counts li.active {
  border-bottom: 2px solid;
  padding-bottom: 15px;
}
body .content .doc-content.search-page .header:after {
  content: '';
  display: block;
  clear: both;
}
body .content .doc-content.search-page h4 {
  font-size: 20px;
  font-family: 'Roboto', sans-serif;
  font-weight: bold;
  padding-top: 30px;
  padding-bottom: 10px;
  margin: 0;
}
body .content .doc-content.search-page h4 a {
  font-size: 24px;
}
body .content .doc-content.search-page .article-type {
  line-height: 24px;
}
body .content .doc-content.search-page .article-type p {
  margin: 10px 0;
}
body .content .doc-content.search-page .article-type:nth-last-of-type(1) {
  padding-bottom: 10px;
}
body .content .doc-content.search-page p {
  line-height: 24px;
}
body .content .doc-content.search-page .pagination {
  text-align: right;
  padding-bottom: 50px;
  padding-top: 10px;
}
body .content .doc-content.search-page .pagination .pagination-title {
  display: none;
}
body .content .doc-content.search-page .pagination .activeItem-item,
body .content .doc-content.search-page .pagination a {
  display: inline-block;
  height: 50px;
  width: 50px;
  border-radius: 25px;
  vertical-align: middle;
  text-align: center;
  line-height: 50px;
}
body .content .doc-content.search-page .pagination .activeItem-item.arrow-item,
body .content .doc-content.search-page .pagination a.arrow-item {
  background: no-repeat center;
}
body .content .doc-content.search-page .pagination .activeItem-item.arrow-item.left,
body .content .doc-content.search-page .pagination a.arrow-item.left {
  -webkit-mask-image: url('/Content/Images/Documentation/arrow-prev.svg');
  -webkit-mask-size: contain;
  -webkit-mask-repeat: no-repeat;
  -webkit-mask-position: center;
  background-color: #627789;
}
body .content .doc-content.search-page .pagination .activeItem-item.arrow-item.right,
body .content .doc-content.search-page .pagination a.arrow-item.right {
  -webkit-mask-image: url('/Content/Images/Documentation/arrow-next.svg');
  -webkit-mask-size: contain;
  -webkit-mask-repeat: no-repeat;
  -webkit-mask-position: center;
  background-color: #627789;
}
body .content .doc-content .api-header,
body .content .doc-content .article-section-header {
  position: relative;
  margin-left: -30px;
  padding-left: 30px;
}
body .content .doc-content .api-header .visible-anchor,
body .content .doc-content .article-section-header .visible-anchor {
  width: 20px;
  height: 20px;
  position: absolute;
  top: 50%;
  margin-left: -30px;
  padding-right: 10px;
  background-image: url(/Content/ImagesNew/Doc/link.svg);
  background-position: left center;
  background-repeat: no-repeat;
  visibility: hidden;
}
body .content .doc-content .api-header:hover .visible-anchor {
  visibility: visible;
  margin-top: -3px;
}
body .content .doc-content .article-section-header:hover .visible-anchor {
  visibility: visible;
}
body .content .doc-content .article-header,
body .content .doc-content .api-header {
  position: relative;
  font-family: 'Roboto', sans-serif;
  font-weight: bold;
}
body .content .doc-content .article-header .badge,
body .content .doc-content .api-header .badge {
  position: absolute;
  top: 0;
  margin-left: 5px;
  font-size: 11px;
  font-weight: bold;
  padding: 0 2px 0 2px;
  border-radius: 2px;
  line-height: 15px;
}
body .content .doc-content .axe-block {
  margin-bottom: 16px;
  min-width: 760px;
  width: 100%;
}
body .content .doc-content .axe-report {
  display: flex;
  flex-direction: row;
  padding: 16px 24px;
  gap: 16px;
  border: 1px solid;
  border-radius: 8px;
}
body .content .doc-content .axe-report svg {
  flex: 0 0 100px;
  align-self: center;
}
body .content .doc-content .axe-report .axe-header {
  font-family: Roboto;
  font-weight: 600;
  font-size: 20px;
  line-height: 24px;
}
body .content .doc-content .axe-report .axe-box-with-btn {
  display: flex;
  flex-direction: row;
  gap: 16px;
}
body .content .doc-content .axe-report .axe-box {
  display: flex;
  flex-direction: column;
  gap: 12px;
}
body .content .doc-content .axe-report .axe-text {
  font-family: Roboto;
  font-size: 14px;
  font-weight: 400;
  line-height: 20px;
  text-align: left;
}
body .content .doc-content .axe-report .axe-trademark {
  font-family: Roboto;
  font-size: 12px;
  font-weight: 400;
  line-height: 18px;
  text-align: left;
}
body .content .doc-content .axe-report .axe-button {
  display: block;
  padding: 10px 20px;
  border-radius: 40px;
  width: 190px;
  min-width: unset;
  white-space: nowrap;
  align-self: center;
  align-items: center;
  justify-content: center;
  box-shadow: 0px 2px 12px 0px #00000014, 0px 1px 4px 0px #0000000f;
  font-family: Roboto;
  font-size: 16px;
  font-weight: 500;
  line-height: 24px;
  cursor: pointer;
  border: none;
}
body .content .doc-content .axe-report .axe-button:focus,
body .content .doc-content .axe-report .axe-button:focus-visible {
  outline: none;
}
body .content .doc-content .axe-report sup {
  position: relative;
  font-size: 70%;
  line-height: 0;
  vertical-align: baseline;
  top: -0.8em;
}
body .content .doc-content .axe-note {
  height: 32px;
  margin-top: 16px;
  display: flex;
  flex: 0 0 1397px;
  justify-content: left;
  align-items: center;
  vertical-align: middle;
  padding: 4px 8px;
  gap: 8px;
  border-radius: 8px;
  font-family: Roboto;
  font-size: 14px;
  font-weight: 400;
  line-height: 18px;
  text-align: left;
}
body .content .doc-content .roadmap-survey-block {
  display: flex;
  flex-direction: row;
  gap: 32px;
  padding: 16px 24px;
  border: 1px solid;
  border-radius: 8px;
}
body .content .doc-content .roadmap-survey-text-block {
  display: flex;
  flex-direction: column;
  gap: 12px;
}
body .content .doc-content .roadmap-survey-header {
  display: flex;
  gap: 8px;
  font-family: Roboto;
  font-size: 20px;
  font-weight: 600;
  line-height: 24px;
  text-align: left;
}
body .content .doc-content .roadmap-survey-header svg {
  flex-shrink: 0;
}
body .content .doc-content .roadmap-survey-text {
  font-family: Roboto;
  font-size: 14px;
  font-weight: 400;
  line-height: 20px;
  text-align: left;
}
body .content .doc-content .roadmap-survey-button {
  height: 44px;
  align-self: center;
  padding: 10px 20px 10px 16px;
  min-width: unset;
  width: fit-content;
  white-space: nowrap;
}
body .content .doc-content .roadmap-image-block {
  max-height: 550px;
  border: 1px solid;
  border-radius: 8px;
  padding: 24px;
  display: flex;
  align-items: center;
  align-content: center;
}
body .content .doc-content .roadmap-image-block img {
  max-width: 75%;
  max-height: 550px;
  margin-left: auto;
  margin-right: auto;
}
body .content .doc-content .simulator-wrapper {
  min-width: 760px;
  width: 100%;
  margin-bottom: 32px;
}
body .content .doc-content .simulator-wrapper .simulator-content-box {
  width: 100%;
  display: flex;
  flex-direction: row;
  box-sizing: border-box;
  gap: 20px;
}
body .content .doc-content .simulator-wrapper .demo-panel-box {
  flex: 3 1 1000px;
}
body .content .doc-content .simulator-wrapper.surveyjs {
  padding-bottom: 0px;
  display: flex;
  flex-direction: column;
  gap: 32px;
  min-width: 360px;
}
body .content .doc-content .simulator-wrapper.surveyjs .description p:last-of-type {
  margin-bottom: 0px;
}
body .content .doc-content .simulator-wrapper.surveyjs .description,
body .content .doc-content .simulator-wrapper.surveyjs .second-description {
  margin: 0px;
  min-width: unset;
}
body .content .doc-content .description,
body .content .doc-content .second-description {
  box-sizing: border-box;
  position: relative;
  min-width: 760px;
  margin-bottom: 32px;
}
body .content .doc-content .description-expand,
body .content .doc-content .second-description-expand {
  z-index: 1;
  opacity: 1;
  height: auto;
}
body .content .doc-content .description code,
body .content .doc-content .second-description code {
  padding: 2px 4px;
  color: #dd1144;
  white-space: nowrap;
  border: 1px solid;
  display: inline;
  border-radius: 4px;
  font-size: 14px;
}
body .content .doc-content .description pre code,
body .content .doc-content .second-description pre code {
  border: none;
  display: inline-block;
  padding: 0;
  max-width: 900px;
  width: auto;
}
body .content .doc-content .description pre code .CodeMirror,
body .content .doc-content .second-description pre code .CodeMirror {
  border: 1px solid #e1e1e8;
  padding: 10px;
  border-radius: 4px;
  height: auto;
  z-index: 0;
}
body .content .doc-content .description pre code .CodeMirror pre,
body .content .doc-content .second-description pre code .CodeMirror pre {
  font-size: 12px;
}
body .content .doc-content .description pre code .CodeMirror-linenumber,
body .content .doc-content .second-description pre code .CodeMirror-linenumber {
  font-size: 12px;
}
body .content .doc-content .description .note,
body .content .doc-content .second-description .note {
  padding: 20px;
  font-size: 14px;
  margin-bottom: 10px;
}
body .content .doc-content .description .note .note-header,
body .content .doc-content .second-description .note .note-header {
  font-weight: bold;
}
body .content .doc-content .description p:last-of-type {
  margin-bottom: 8px;
}
body .content .doc-content .description-text a {
  text-decoration: underline;
}
body .content .doc-content .description-text p {
  text-size-adjust: 100%;
}
body .content .doc-content .simulators {
  min-height: 440px;
  border-radius: 0 0 6px 6px;
  border: 1px solid;
  border-top: none;
}
body .content .doc-content .simulators .demo-device {
  min-height: 440px;
  border-radius: 0 0 6px 6px;
}
body .content .doc-content .simulators .demo-device .demo-display {
  min-height: 440px;
  background: inherit;
  position: relative;
  border-radius: 0 0 6px 6px;
}
body .content .doc-content .simulators .demo-device .demo-display .demo-frame-container {
  height: 100%;
}
body .content .doc-content .simulators .demo-device .demo-display .demo-credits {
  text-align: right;
  font-size: 14px;
  color: #bfbfbf;
}
body .content .doc-content .simulators .demo-device .demo-display .load-panel {
  position: absolute;
  background: inherit;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  /* banner */

}
body .content .doc-content .simulators .demo-device .demo-display .load-panel .load-panel-banner-wrapper {
  display: flex;
  align-items: center;
  justify-content: center;
  height: 100%;
}
body .content .doc-content .simulators .demo-device .demo-display .load-panel .load-panel-banner-wrapper .load-panel-banner {
  max-width: 540px;
  box-sizing: border-box;
  padding: 20px;
  border: 1px solid #ffe4c2;
  border-radius: 8px;
  background-color: #ff900014;
}
body .content .doc-content .simulators .demo-device .demo-display .load-panel .load-panel-banner-wrapper .load-panel-banner p,
body .content .doc-content .simulators .demo-device .demo-display .load-panel .load-panel-banner-wrapper .load-panel-banner a {
  display: inline;
  font-size: 14px;
  line-height: 20px;
  font-weight: 400;
  color: #3f4d5a;
}
body .content .doc-content .simulators .demo-device .demo-display .load-panel .load-panel-banner-wrapper .load-panel-banner a {
  text-decoration: underline;
  color: #222930;
}
body .content .doc-content .simulators .demo-frame {
  width: 100%;
  min-height: 450px;
  margin: 0;
  padding: 0;
  border: 0;
  outline: 0;
  background-color: transparent;
  border-bottom-left-radius: 6px;
  border-bottom-right-radius: 6px;
}
body .content .doc-content .simulators .demo-frame-disabled {
  display: none;
}
body .content .doc-content .simulators #git-demo-frame {
  width: 100%;
  position: relative;
  z-index: 1;
  min-height: 440px;
}
body .content .doc-content .simulators.Mobile,
body .content .doc-content .simulators.TabletLandscape,
body .content .doc-content .simulators.TabletPortrait {
  box-shadow: none;
}
body .content .doc-content .simulators.Mobile .demo-device,
body .content .doc-content .simulators.TabletLandscape .demo-device,
body .content .doc-content .simulators.TabletPortrait .demo-device {
  border: 1px solid;
  border-radius: 15px;
}
body .content .doc-content .simulators.Mobile .demo-device .demo-display,
body .content .doc-content .simulators.TabletLandscape .demo-device .demo-display,
body .content .doc-content .simulators.TabletPortrait .demo-device .demo-display {
  border-radius: 2px;
  border: 1px solid;
}
body .content .doc-content .simulators.Mobile .demo-device .demo-display .demo-frame,
body .content .doc-content .simulators.TabletLandscape .demo-device .demo-display .demo-frame,
body .content .doc-content .simulators.TabletPortrait .demo-device .demo-display .demo-frame {
  height: 100%;
}
body .content .doc-content .simulators.TabletLandscape .demo-device {
  height: 511px;
  width: 780px;
  margin: 0 auto 0;
}
body .content .doc-content .simulators.TabletLandscape .demo-device .demo-display {
  margin-top: 14px;
  height: 480px;
  margin-left: 29px;
  width: 720px;
}
body .content .doc-content .simulators.TabletPortrait .demo-device {
  height: 780px;
  width: 511px;
  margin: 0 auto 0;
}
body .content .doc-content .simulators.TabletPortrait .demo-device .demo-display {
  margin-top: 29px;
  height: 720px;
  margin-left: 14px;
  width: 480px;
}
body .content .doc-content .simulators.Mobile .demo-device {
  height: 740px;
  width: 400px;
  margin: 10px auto 40px auto;
}
body .content .doc-content .simulators.Mobile .demo-device .demo-display {
  margin-top: 70px;
  height: 590px;
  margin-left: 20px;
  width: 360px;
}
body .content .doc-content .simulators.templates .demo-frame {
  min-height: 700px;
}
body .content .doc-content .simulators.simulators-no-border,
body .content .doc-content .simulators.simulators-no-border .demo-device,
body .content .doc-content .simulators.simulators-no-border .demo-device .demo-display {
  border: 0;
  padding: 0;
  box-shadow: none;
}
body .content .doc-content .title {
  padding-left: 40px;
}
body .content .marketing-demos .demos-container {
  padding: 32px;
  border-radius: 24px;
  display: flex;
  gap: 24px;
  flex-wrap: wrap;
}
body .content .marketing-demos .demo-link {
  flex: 1 350px;
  border-radius: 12px;
  box-shadow: 0px 2px 8px rgba(0, 0, 0, 0.12);
  display: grid;
  grid-template-rows: 1fr 1fr 1fr;
}
body .content .marketing-demos .demo-link:empty {
  visibility: hidden;
  height: none;
}
body .content .marketing-demos .demo-link-img {
  border-radius: 12px;
  grid-row-start: 1;
  grid-row-end: 5;
  grid-column: 1;
}
body .content .marketing-demos .demo-link-content {
  padding: 18px 24px;
  border-top: 1px solid;
  border-radius: 0 0 12px 12px;
  grid-row-start: 3;
  grid-row-end: 5;
  grid-column: 1;
}
body .content .marketing-demos .demo-link-content h5 {
  padding: 0 0 8px 0;
  font-style: normal;
  font-weight: 600;
  font-size: 20px;
  line-height: 125%;
}
body .content .marketing-demos .demo-link-content p {
  font-weight: 400;
  font-size: 16px;
  line-height: 135%;
}
body .content .top-content {
  position: relative;
  display: flex;
  gap: 32px;
  align-items: center;
}
body .content .top-content__expand {
  height: 36px;
  min-width: auto;
  border-width: 1px;
  padding: 6px 16px 6px 8px;
}
body .content .top-content__expand:focus-visible {
  outline-width: 0;
}
body .content .top-content__expand__svg {
  width: 24px;
  height: 24px;
}
body .content .top-content__expand__svg-visible,
body .content .top-content__expand__span-visible {
  display: block;
}
body .content .top-content__expand__svg-hide,
body .content .top-content__expand__span-hide {
  display: none;
}
body .content .top-content #report-design-btn {
  position: absolute;
  right: 0;
  height: 36px;
  top: 0;
}
body .content .top-content svg polygon,
body .content .top-content svg path,
body .content .top-content svg rect {
  fill: #8b949c;
}
body .content .top-content h1 {
  padding: 0;
}
body .content .top-content h1.New:after,
body .content .top-content h1.Updated:after,
body .content .top-content h1.Roadmap:after {
  left: -3px;
  font-size: 11px;
  padding: 2px 4px 3px 4px;
  font-family: 'Roboto', sans-serif;
  border-radius: 3px;
  position: relative;
  color: white;
  top: -13px;
  font-weight: 400;
}
body .content .top-content h1.New:after {
  content: "New";
  background-color: #f05b41;
}
body .content .top-content h1.Updated:after {
  content: "Updated";
  background-color: #1e70b9;
}
body .content .top-content h1.Roadmap:after {
  content: "In Progress";
  background-color: #a89cda;
}
body .content .demo-details {
  flex: 1 1 480px;
  align-items: stretch;
}
body .content .code {
  overflow: hidden;
  border: 1px solid;
  border-radius: 6px;
  max-height: calc(17%);
  height: calc(17%);
  min-height: 500px;
}
body .content .code .not-yet {
  height: 148px;
  font-size: 16px;
  text-align: center;
}
body .content .code .not-yet span {
  display: inline-block;
  margin-top: 64px;
}
body .content .code .tabs-container {
  display: flex;
  border-bottom: 1px solid;
  height: 60px;
}
body .content .code .tabs-container #code-tabs {
  width: 100%;
  display: inline-flex;
  justify-content: space-between;
}
body .content .code .tabs-container #code-tabs.has-arrow .tbs-arrows {
  display: flex;
  height: 100%;
}
body .content .code .tabs-container #code-tabs.has-arrow .tbs-children {
  overflow: hidden;
}
body .content .code .tabs-container #code-tabs.has-backend .switch {
  display: inline-flex;
}
body .content .code .tabs-container #code-tabs .switch {
  display: none;
}
body .content .code .tabs-container #code-tabs .switch::before {
  content: '';
  width: 1px;
  height: 100%;
  position: absolute;
  left: 0;
}
body .content .code .tabs-container #code-tabs .tbs-children-container {
  height: 60px;
}
body .content .code .tabs-container #code-tabs .tbs-arrows {
  display: none;
}
body .content .code .tabs-container #code-tabs .tbs-arrow {
  display: flex;
  min-width: 32px;
  height: 100%;
  padding: 0;
  border-radius: 0;
}
body .content .code .tabs-container #code-tabs .tbs-children {
  width: 100%;
  border: none;
  align-items: flex-start;
  justify-content: start;
}
body .content .code .tabs-container #code-tabs .tbs-children-container {
  position: relative;
  display: inline-flex;
  justify-content: flex-start;
}
body .content .code .tabs-container #code-tabs .tbs-item {
  white-space: nowrap;
}
body .content .code .tabs-container #code-tabs .tbs-item-container {
  position: relative;
}
body .content .code .tabs-container #code-tabs .tbs-item-container.active .tbs-item {
  width: inherit;
  position: relative;
}
body .content .code .tabs-container #code-tabs .tbs-item-container.active .tbs-item::after {
  content: "";
  position: absolute;
  right: 0;
  left: 0;
  width: 100%;
  height: 4px;
  bottom: -18px;
  border-top-right-radius: 8px;
  border-top-left-radius: 8px;
  border-bottom-right-radius: unset;
  border-bottom-left-radius: unset;
}
body .content .code .buttons-container {
  height: 52px;
  border-bottom: 1px solid;
}
body .content .code .buttons-container .buttons {
  height: inherit;
  display: flex;
  justify-content: space-between;
  gap: 8px;
  padding: 8px;
  box-sizing: border-box;
}
body .content .code .buttons-container .buttons-left {
  display: flex;
  gap: 8px;
}
body .content .code .buttons-container .buttons.fixed {
  position: fixed;
  z-index: 3;
  border-bottom: 1px solid;
}
body .content .code .buttons-container .btn.btn {
  height: 36px;
  min-width: auto;
  font-size: 16px;
  line-height: 24px;
}
body .content .code .source-block {
  margin: 10px;
  display: none;
  overflow: auto;
  height: 400px;
  min-height: 380px;
  scrollbar-width: thin;
}
body .content .code .source-block::-webkit-scrollbar {
  width: 8px;
}
body .content .code .source-block::-webkit-scrollbar-track {
  border-radius: 20px;
}
body .content .code .source-block::-webkit-scrollbar-thumb {
  border-radius: 20px;
}
body .content .code .source-block.active {
  display: block;
}
body .content .code .source-block.hidden {
  display: none;
}
body .content .code .source-block .CodeMirror {
  height: auto;
  font-size: 14px;
  z-index: 0;
}
body .content .code .source-block .CodeMirror .CodeMirror-scroll {
  overflow: hidden !important;
}
body .content .code .source-block .CodeMirror code,
body .content .code .source-block .CodeMirror pre {
  font-family: Monaco, Menlo, Consolas, "Courier New", monospace;
  display: block;
  font-size: 12px;
  line-height: 20px;
  word-break: break-all;
  word-wrap: break-word;
  white-space: pre;
  white-space: pre-wrap;
  -webkit-border-radius: 4px;
  -moz-border-radius: 4px;
  -ms-border-radius: 4px;
  -o-border-radius: 4px;
  border-radius: 4px;
}
body .content .code .source-block .CodeMirror code .prettyprint,
body .content .code .source-block .CodeMirror pre .prettyprint {
  margin-bottom: 20px;
}
body .content .code .source-block .CodeMirror code code,
body .content .code .source-block .CodeMirror pre code {
  padding: 0;
  white-space: pre;
  white-space: pre-wrap;
  border: 0;
}
body .content .code .source-block .CodeMirror code {
  padding: 2px 4px;
  white-space: nowrap;
  border: 1px solid;
  border-color: #e1e1e8;
  display: inline;
}
body .content .code .move-demo-container {
  display: flex;
  flex-direction: column;
  align-items: center;
  height: 200px;
}
body .content .code .move-demo-container .move-demo-text {
  padding: 15px;
  padding-bottom: 16px;
  font-size: 14px;
}
body .content .code .move-demo-container .move-demo-button {
  padding: 5px 15px;
  border: 1px solid;
  -webkit-border-radius: 5px;
  -moz-border-radius: 5px;
  -ms-border-radius: 5px;
  -o-border-radius: 5px;
  border-radius: 5px;
  margin: 0px;
  color: white;
  text-decoration: none;
}
body .content .code .move-demo-container .move-demo-button:hover {
  border: 1px solid;
}
body .content .code .move-demo-container .move-demo-button .move-demo-icon {
  display: inline;
  vertical-align: middle;
  margin-left: 5px;
  margin-bottom: 3px;
}
body .content .code .move-demo-container .move-demo-button .move-demo-icon path {
  stroke: white;
}
body .content .demo-nav-links {
  box-sizing: border-box;
  padding: 12px;
  height: 60px;
  display: flex;
  align-items: center;
  gap: 0 8px;
  position: relative;
  border-radius: 6px 6px 0 0;
  border: 1px solid;
  justify-content: right;
}
body .content .demo-nav-links a {
  text-decoration: none;
  display: flex;
  font-size: 16px;
  align-items: center;
  justify-content: center;
  height: 24px;
  width: 24px;
  border: none;
  padding: 6px;
}
body .content .demo-nav-links a:focus-visible {
  outline: 2px solid;
  outline-offset: 0px;
}
body .content .demo-nav-links a svg {
  height: 24px;
  width: 24px;
}
body .content .demo-nav-links a.adaptivity-switcher {
  width: auto;
}
body .content .demo-nav-links span.nav-border {
  width: 1px;
  height: 46px;
}
body .content .demo-nav-links button#fullScreenLink {
  display: flex;
  justify-content: center;
  align-items: center;
  padding: 6px;
  border: none;
  cursor: pointer;
}
body .content .demo-nav-links button#fullScreenLink #open-full-screen {
  display: block;
}
body .content .demo-nav-links button#fullScreenLink #close-full-screen {
  display: none;
}
body .content .demo-nav-links span.separator {
  width: 1px;
  height: 24px;
}
body .content .demo-nav-links a,
body .content .demo-nav-links button#fullScreenLink {
  border-radius: 50px;
}
body .content .demo-nav-links .justify-left {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  margin-right: auto;
  overflow-x: hidden;
}
body .content .demo-nav-links .justify-left svg {
  flex-shrink: 0;
}
body .content .demo-nav-links .uitg-button {
  padding: 6px 16px 6px 8px;
  min-width: unset;
  width: 70%;
  /*width: auto;*/
  height: 36px;
  overflow-x: hidden;
}
body .content .demo-nav-links .uitg-button:last-of-type {
  margin-right: auto;
}
body .content .demo-nav-links .themes-container .dx-texteditor.dx-editor-outlined {
  border: none;
}
body .content .demo-nav-links .demo-nav-arrows {
  display: flex;
}
body .content:not(.document__body) .doc-content h5.see-also + ul li:before {
  content: "";
  border-radius: 3px;
  border: 3px solid;
  display: inline-block;
  margin-right: 15px;
}
body .debug-invalid-model-popup {
  position: fixed;
  bottom: 80px;
  right: 0;
  padding: 10px;
  width: 300px;
  z-index: 9999;
}
body #docerror.error {
  position: static;
  height: auto;
  margin: 118px auto;
}
body a {
  outline: none;
  text-decoration: none;
}
body .doc-content.wide-demo {
  flex-direction: column;
}
body .doc-content.wide-demo .demo-details {
  max-width: inherit;
}
body .doc-content nav,
body .doc-content section {
  display: block;
}
body .doc-content .nav {
  margin-bottom: 20px;
  margin-left: 0;
  list-style: none;
}
body .doc-content .nav-tabs:after {
  clear: both;
}
body .doc-content .hide {
  display: none;
}
body .doc-content .tab-content {
  overflow: auto;
}
body .doc-content .tab-content > .tab-pane,
body .doc-content .pill-content > .pill-pane {
  display: none;
}
body .doc-content .tab-content > .active,
body .doc-content .pill-content > .active {
  display: block;
}
body .doc-content code .prettyprint,
body .doc-content pre .prettyprint {
  margin-bottom: 20px;
}
body .doc-content code code,
body .doc-content pre code {
  padding: 0;
  color: inherit;
  white-space: pre;
  white-space: pre-wrap;
  background-color: transparent;
  border: 0;
}
body .doc-content code {
  padding: 2px 4px;
  white-space: nowrap;
  border: 1px solid;
  display: inline;
}
body .doc-content .pre-scrollable {
  max-height: 340px;
  overflow-y: scroll;
}
body .doc-content .nav-tabs > .active > a,
body .doc-content .nav-tabs > .active > a:focus {
  cursor: default;
  border: 1px solid;
  border-bottom-color: transparent;
}
body .doc-content .codeTabs.nav.nav-tabs {
  padding: 20px 0 0 0;
  border-bottom: 2px solid;
}
body .doc-content .codeTabs.nav.nav-tabs li {
  float: none;
  display: inline-block;
}
body .doc-content .codeTabs.nav.nav-tabs li a {
  border: none;
  padding: 8px 12px;
  line-height: 36px;
  margin: 0;
}
body .doc-content .codeTabs.nav.nav-tabs li.active {
  border-top: 2px solid;
  border-left: 2px solid;
  border-right: 2px solid;
}
body .doc-content .codeTabs.nav.nav-tabs li.active a {
  padding-bottom: 12px;
}
body .button:not(.feedback__button) {
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  display: inline-block;
  font-size: 16px;
  font-family: 'Roboto', sans-serif;
  font-weight: normal;
  position: relative;
  text-decoration: none;
  text-align: center;
  white-space: nowrap;
  cursor: pointer;
  height: 22px;
  line-height: 22px;
  vertical-align: middle;
  box-sizing: initial;
  border: 1px solid;
  -webkit-border-radius: 50px;
  -moz-border-radius: 50px;
  -ms-border-radius: 50px;
  -o-border-radius: 50px;
  border-radius: 50px;
}
body .button:not(.feedback__button).small {
  font-size: 13px;
}
body .button:not(.feedback__button).large {
  width: 400px;
  font-size: 24px;
}
body .button:not(.feedback__button).center {
  margin-left: auto;
  margin-right: auto;
  display: block;
}
body .button:not(.feedback__button).btn-show-demo {
  margin-bottom: 15px;
}
body .button:not(.feedback__button).fiddle {
  height: 40px;
  display: inline-flex;
  gap: 0 10px;
  border: none;
  padding: 0 16px;
}
body .button:not(.feedback__button).fiddle .button-text {
  align-self: center;
}
body .button:not(.feedback__button).reset,
body .button:not(.feedback__button).apply {
  padding: 8px 20px;
  float: right;
  align-items: center;
  border: none;
  margin-right: 16px;
  height: 40px;
  box-sizing: border-box;
}
body .button:not(.feedback__button).apply {
  border: 1px solid;
}
body .button:not(.feedback__button).backend {
  border-radius: 4px;
  padding: 8px 20px;
  width: 100px;
  margin: 5px 1px 5px -17px;
}
body .dx-list-group-header {
  margin: 0;
  padding: 8px 15px;
  border-bottom: none;
  font-weight: normal;
}
body #reset,
body #apply {
  width: 72px;
}
body .dx-dropdownlist-popup-wrapper .dx-list:not(.dx-list-select-decorator-enabled) .dx-list-item-content {
  padding: 5px 15px 5px 0;
}
body .dx-popup-content {
  padding: 0;
}
body .adaptivity-switcher {
  position: absolute;
  left: 45%;
}
body .adaptivity-switcher .switcher-item-wrapper {
  cursor: pointer;
  box-sizing: border-box;
  height: 38px;
  border-radius: 8px;
}
body .adaptivity-switcher .switcher-item-wrapper.landscape {
  padding: 8px 6px;
}
body .adaptivity-switcher .switcher-item-wrapper.landscape .switcher-item {
  width: 24px;
  height: 14px;
}
body .adaptivity-switcher .switcher-item-wrapper.landscape .switcher-item .inner {
  display: block;
  position: relative;
  left: 3px;
  top: 2px;
  height: 10px;
  width: 18px;
}
body .adaptivity-switcher .switcher-item-wrapper.portrait {
  padding: 6px 11px;
}
body .adaptivity-switcher .switcher-item-wrapper.portrait .switcher-item {
  width: 14px;
  height: 24px;
}
body .adaptivity-switcher .switcher-item-wrapper.portrait .switcher-item .inner {
  display: block;
  position: relative;
  left: 2px;
  top: 3px;
  height: 18px;
  width: 10px;
}
body .adaptivity-switcher .switcher-item-wrapper .switcher-item {
  display: inline-block;
  cursor: pointer;
  border-radius: 2px;
}
body #themeChooserPopup.dx-overlay-content {
  -webkit-border-radius: 16px;
  -moz-border-radius: 16px;
  -ms-border-radius: 16px;
  -o-border-radius: 16px;
  border-radius: 16px;
  border: none;
}
body #copy-to-code-codepen,
body #copy-to-code-sandbox {
  border: 0px;
  padding: 6px 16px 6px 8px;
  white-space: nowrap;
  overflow: hidden;
}
body #copy-to-code-codepen svg,
body #copy-to-code-sandbox svg {
  flex-shrink: 0;
}
@media only screen and (max-width: 1900px) {
  body .content .doc-content.wide-demo {
    flex-flow: column;
  }
}
@media only screen and (max-width: 1600px) {
  body .content .doc-content .simulator-content-box {
    flex-direction: column !important;
  }
  body .content .doc-content .demo-panel-box {
    flex: 1 !important;
  }
  body .content .doc-content .demo-details {
    flex: 1 !important;
  }
}
@media only screen and (max-width: 1080px) {
  body .content .doc-content #widgetAccordion {
    display: none;
  }
  body .content .doc-content #widgetAccordion .widget-tree-main .widget-tree {
    display: none;
  }
  body .content .doc-content #widgetAccordion .widget-tree-main .widget-view {
    position: initial;
    height: 500px;
  }
}
@media only screen and (max-width: 1200px) {
  body .doc-content {
    padding: 32px 40px 40px 40px !important;
  }
}
@media screen and (max-width: 768px) {
  body .doc-content {
    padding: 32px 24px 32px 24px !important;
  }
  body .axe-box-with-btn {
    flex-direction: column !important;
  }
}
body .theme-popup-header,
body .theme-popup-content {
  font-family: 'Roboto', sans-serif;
}
body .theme-popup-header {
  position: sticky;
  top: 0;
  width: 100%;
  display: flex;
  flex-direction: column;
}
body .theme-popup-header #theme-selector {
  display: flex;
}
body .theme-popup-header #theme-selector .theme-selector-group-container {
  display: flex;
  flex: 1;
  text-align: center;
  cursor: pointer;
}
body .theme-popup-header #theme-selector .theme-selector-group {
  padding: 18px 12px;
  flex: 1;
  text-align: center;
}
body .theme-popup-header #theme-selector .theme-selector-group.active .theme-selector-group-name {
  position: relative;
  text-align: unset;
  font-weight: 500;
}
body .theme-popup-header #theme-selector .theme-selector-group.active span {
  position: relative;
}
body .theme-popup-header #theme-selector .theme-selector-group.active span::after {
  content: "";
  position: absolute;
  right: 0;
  left: 0;
  width: 100%;
  height: 4px;
  bottom: -19px;
  border-top-right-radius: 8px;
  border-top-left-radius: 8px;
  border-bottom-right-radius: unset;
  border-bottom-left-radius: unset;
}
body .theme-popup-title {
  font-family: 'Roboto', sans-serif;
  font-size: 24px;
  line-height: 125%;
  font-weight: 600;
}
body .theme-popup-switch {
  display: inline-flex;
  align-items: center;
  gap: 0 10px;
}
body .theme-popup-group {
  padding: 6px 24px;
  gap: 12px;
  display: flex;
  flex-direction: column;
}
body .theme-popup-group-title {
  margin: 0;
  padding: 0;
  font-size: 16px;
  font-weight: 600;
  height: 40px;
  line-height: 135%;
  border-bottom: 1px solid;
}
body .theme-popup-group[aria-hidden="true"] {
  display: none;
}
body .theme-popup-button.btn {
  height: 44px;
  border-radius: 8px;
  min-width: auto;
  max-width: none;
}
body .theme-popup-window .themebuilder-group {
  padding: 8px;
  border-top: 1px solid;
}
body .theme-popup-window .themebuilder-group .theme-popup-button {
  border: none;
}
body .theme-popup-window .themebuilder-group .theme-popup-button span {
  font-size: 16px;
  line-height: 24px;
  font-weight: 500;
}
body .theme-popup-window .theme-popup-group-title {
  display: flex;
  gap: 4px;
  align-items: center;
}
body .theme-popup-window .theme-popup-group-title .theme-trademark-warning {
  display: flex;
  align-items: center;
  cursor: pointer;
}
body .theme-popup-window .theme-list-items {
  display: flex;
  gap: 4px;
  flex-direction: column;
}
body .theme-popup-window .theme-item {
  cursor: pointer;
  box-sizing: border-box;
  /*width: 68px;
                    height: 68px;*/
  padding: 8px;
  display: flex;
  flex-direction: row;
  align-items: center;
  gap: 8px;
  border-radius: 8px;
}
body .theme-popup-window .theme-item:focus {
  outline: 2px solid;
}
body .theme-popup-window .theme-item span {
  white-space: nowrap;
  font-size: 14px;
  line-height: 24px;
}
body .theme-popup-window .theme-item use svg {
  vertical-align: middle;
}
body .theme-popup-window .theme-item .svg {
  width: 24px;
  height: 24px;
  background-repeat: no-repeat;
  background-position: center;
  vertical-align: middle;
  float: left;
}
body .theme-popup-window .theme-item.disabled {
  opacity: 0.5;
  pointer-events: none;
}
body #theme-selector-icon {
  height: 24px;
  width: 24px;
  background-size: contain;
  background-repeat: no-repeat;
}
body #theme-selector-icon[data-value="light"],
body #theme-selector-icon[data-value="light.compact"] {
  background-image: url(~/../../Images/Themes/light.svg);
}
body #theme-selector-icon[data-value="dark"],
body #theme-selector-icon[data-value="dark.compact"] {
  background-image: url(~/../../Images/Themes/dark.svg);
}
body #theme-selector-icon[data-value="contrast"],
body #theme-selector-icon[data-value="contrast.compact"] {
  background-image: url(~/../../Images/Themes/contrast.svg);
}
body #theme-selector-icon[data-value="softblue"],
body #theme-selector-icon[data-value="softblue.compact"] {
  background-image: url(~/../../Images/Themes/softblue.svg);
}
body #theme-selector-icon[data-value="carmine"],
body #theme-selector-icon[data-value="carmine.compact"] {
  background-image: url(~/../../Images/Themes/carmine.svg);
}
body #theme-selector-icon[data-value="darkmoon"],
body #theme-selector-icon[data-value="darkmoon.compact"] {
  background-image: url(~/../../Images/Themes/darkmoon.svg);
}
body #theme-selector-icon[data-value="darkviolet"],
body #theme-selector-icon[data-value="darkviolet.compact"] {
  background-image: url(~/../../Images/Themes/darkviolet.svg);
}
body #theme-selector-icon[data-value="greenmist"],
body #theme-selector-icon[data-value="greenmist.compact"] {
  background-image: url(~/../../Images/Themes/greenmist.svg);
}
body #theme-selector-icon[data-value="material.blue.light"],
body #theme-selector-icon[data-value="material.blue.light.compact"] {
  background-image: url(~/../../Images/Themes/material.blue.light.svg);
}
body #theme-selector-icon[data-value="material.blue.dark"],
body #theme-selector-icon[data-value="material.blue.dark.compact"] {
  background-image: url(~/../../Images/Themes/material.blue.dark.svg);
}
body #theme-selector-icon[data-value="material.lime.light"],
body #theme-selector-icon[data-value="material.lime.light.compact"] {
  background-image: url(~/../../Images/Themes/material.lime.light.svg);
}
body #theme-selector-icon[data-value="material.lime.dark"],
body #theme-selector-icon[data-value="material.lime.dark.compact"] {
  background-image: url(~/../../Images/Themes/material.lime.dark.svg);
}
body #theme-selector-icon[data-value="material.orange.light"],
body #theme-selector-icon[data-value="material.orange.light.compact"] {
  background-image: url(~/../../Images/Themes/material.orange.light.svg);
}
body #theme-selector-icon[data-value="material.orange.dark"],
body #theme-selector-icon[data-value="material.orange.dark.compact"] {
  background-image: url(~/../../Images/Themes/material.orange.dark.svg);
}
body #theme-selector-icon[data-value="material.purple.light"],
body #theme-selector-icon[data-value="material.purple.light.compact"] {
  background-image: url(~/../../Images/Themes/material.purple.light.svg);
}
body #theme-selector-icon[data-value="material.purple.dark"],
body #theme-selector-icon[data-value="material.purple.dark.compact"] {
  background-image: url(~/../../Images/Themes/material.purple.dark.svg);
}
body #theme-selector-icon[data-value="material.teal.light"],
body #theme-selector-icon[data-value="material.teal.light.compact"] {
  background-image: url(~/../../Images/Themes/material.teal.light.svg);
}
body #theme-selector-icon[data-value="material.teal.dark"],
body #theme-selector-icon[data-value="material.teal.dark.compact"] {
  background-image: url(~/../../Images/Themes/material.teal.dark.svg);
}
body #theme-selector-icon[data-value="fluent.blue.light"],
body #theme-selector-icon[data-value="fluent.blue.light.compact"] {
  background-image: url(~/../../Images/Themes/fluent.blue.light.svg);
}
body #theme-selector-icon[data-value="fluent.blue.dark"],
body #theme-selector-icon[data-value="fluent.blue.dark.compact"] {
  background-image: url(~/../../Images/Themes/fluent.blue.dark.svg);
}
body #theme-selector-icon[data-value="fluent.saas.light"],
body #theme-selector-icon[data-value="fluent.saas.light.compact"] {
  background-image: url(~/../../Images/Themes/fluent.saas.light.svg);
}
body #theme-selector-icon[data-value="fluent.saas.dark"],
body #theme-selector-icon[data-value="fluent.saas.dark.compact"] {
  background-image: url(~/../../Images/Themes/fluent.saas.dark.svg);
}
body #theme-selector-button.btn {
  height: 36px;
  min-width: auto;
  max-width: none;
  gap: 8px;
  padding: 6px 8px;
  outline: none;
  border: none;
  white-space: nowrap;
  overflow: hidden;
}
body #theme-selector-button.btn:focus-visible {
  outline: 2px solid;
  outline-offset: -2px;
}
body #theme-selector-button.btn .theme-selector-arrow {
  width: 24px;
  height: 24px;
}
body #theme-selector-button.btn #theme-selector-text {
  font-size: 16px;
}
body .theme-popup-header,
body .theme-popup-content {
  font-family: 'Roboto', sans-serif;
}
body .theme-popup-header {
  position: sticky;
  top: 0;
  width: 100%;
  display: flex;
  flex-direction: column;
}
body .theme-popup-header #theme-selector {
  display: flex;
}
body .theme-popup-header #theme-selector .theme-selector-group-container {
  display: flex;
  flex: 1;
  text-align: center;
  cursor: pointer;
}
body .theme-popup-header #theme-selector .theme-selector-group {
  padding: 18px 12px;
  flex: 1;
  text-align: center;
}
body .theme-popup-header #theme-selector .theme-selector-group.active .theme-selector-group-name {
  position: relative;
  text-align: unset;
  font-weight: 500;
}
body .theme-popup-header #theme-selector .theme-selector-group.active span {
  position: relative;
}
body .theme-popup-header #theme-selector .theme-selector-group.active span::after {
  content: "";
  position: absolute;
  right: 0;
  left: 0;
  width: 100%;
  height: 4px;
  bottom: -19px;
  border-top-right-radius: 8px;
  border-top-left-radius: 8px;
  border-bottom-right-radius: unset;
  border-bottom-left-radius: unset;
}
body .theme-popup-title {
  font-family: 'Roboto', sans-serif;
  font-size: 24px;
  line-height: 125%;
  font-weight: 600;
}
body .theme-popup-switch {
  display: inline-flex;
  align-items: center;
  gap: 0 10px;
}
body .theme-popup-group {
  padding: 6px 24px;
  gap: 12px;
  display: flex;
  flex-direction: column;
}
body .theme-popup-group-title {
  margin: 0;
  padding: 0;
  font-size: 16px;
  font-weight: 600;
  height: 40px;
  line-height: 135%;
  border-bottom: 1px solid;
}
body .theme-popup-group[aria-hidden="true"] {
  display: none;
}
body .theme-popup-button.btn {
  height: 44px;
  border-radius: 8px;
  min-width: auto;
  max-width: none;
}
body .theme-popup-window .themebuilder-group {
  padding: 8px;
  border-top: 1px solid;
}
body .theme-popup-window .themebuilder-group .theme-popup-button {
  border: none;
}
body .theme-popup-window .themebuilder-group .theme-popup-button span {
  font-size: 16px;
  line-height: 24px;
  font-weight: 500;
}
body .theme-popup-window .theme-popup-group-title {
  display: flex;
  gap: 4px;
  align-items: center;
}
body .theme-popup-window .theme-popup-group-title .theme-trademark-warning {
  display: flex;
  align-items: center;
  cursor: pointer;
}
body .theme-popup-window .theme-list-items {
  display: flex;
  gap: 4px;
  flex-direction: column;
}
body .theme-popup-window .theme-item {
  cursor: pointer;
  box-sizing: border-box;
  /*width: 68px;
                    height: 68px;*/
  padding: 8px;
  display: flex;
  flex-direction: row;
  align-items: center;
  gap: 8px;
  border-radius: 8px;
}
body .theme-popup-window .theme-item:focus {
  outline: 2px solid;
}
body .theme-popup-window .theme-item span {
  white-space: nowrap;
  font-size: 14px;
  line-height: 24px;
}
body .theme-popup-window .theme-item use svg {
  vertical-align: middle;
}
body .theme-popup-window .theme-item .svg {
  width: 24px;
  height: 24px;
  background-repeat: no-repeat;
  background-position: center;
  vertical-align: middle;
  float: left;
}
body .theme-popup-window .theme-item.disabled {
  opacity: 0.5;
  pointer-events: none;
}
body #theme-selector-icon {
  height: 24px;
  width: 24px;
  background-size: contain;
  background-repeat: no-repeat;
}
body #theme-selector-icon[data-value="light"],
body #theme-selector-icon[data-value="light.compact"] {
  background-image: url(~/../../Images/Themes/light.svg);
}
body #theme-selector-icon[data-value="dark"],
body #theme-selector-icon[data-value="dark.compact"] {
  background-image: url(~/../../Images/Themes/dark.svg);
}
body #theme-selector-icon[data-value="contrast"],
body #theme-selector-icon[data-value="contrast.compact"] {
  background-image: url(~/../../Images/Themes/contrast.svg);
}
body #theme-selector-icon[data-value="softblue"],
body #theme-selector-icon[data-value="softblue.compact"] {
  background-image: url(~/../../Images/Themes/softblue.svg);
}
body #theme-selector-icon[data-value="carmine"],
body #theme-selector-icon[data-value="carmine.compact"] {
  background-image: url(~/../../Images/Themes/carmine.svg);
}
body #theme-selector-icon[data-value="darkmoon"],
body #theme-selector-icon[data-value="darkmoon.compact"] {
  background-image: url(~/../../Images/Themes/darkmoon.svg);
}
body #theme-selector-icon[data-value="darkviolet"],
body #theme-selector-icon[data-value="darkviolet.compact"] {
  background-image: url(~/../../Images/Themes/darkviolet.svg);
}
body #theme-selector-icon[data-value="greenmist"],
body #theme-selector-icon[data-value="greenmist.compact"] {
  background-image: url(~/../../Images/Themes/greenmist.svg);
}
body #theme-selector-icon[data-value="material.blue.light"],
body #theme-selector-icon[data-value="material.blue.light.compact"] {
  background-image: url(~/../../Images/Themes/material.blue.light.svg);
}
body #theme-selector-icon[data-value="material.blue.dark"],
body #theme-selector-icon[data-value="material.blue.dark.compact"] {
  background-image: url(~/../../Images/Themes/material.blue.dark.svg);
}
body #theme-selector-icon[data-value="material.lime.light"],
body #theme-selector-icon[data-value="material.lime.light.compact"] {
  background-image: url(~/../../Images/Themes/material.lime.light.svg);
}
body #theme-selector-icon[data-value="material.lime.dark"],
body #theme-selector-icon[data-value="material.lime.dark.compact"] {
  background-image: url(~/../../Images/Themes/material.lime.dark.svg);
}
body #theme-selector-icon[data-value="material.orange.light"],
body #theme-selector-icon[data-value="material.orange.light.compact"] {
  background-image: url(~/../../Images/Themes/material.orange.light.svg);
}
body #theme-selector-icon[data-value="material.orange.dark"],
body #theme-selector-icon[data-value="material.orange.dark.compact"] {
  background-image: url(~/../../Images/Themes/material.orange.dark.svg);
}
body #theme-selector-icon[data-value="material.purple.light"],
body #theme-selector-icon[data-value="material.purple.light.compact"] {
  background-image: url(~/../../Images/Themes/material.purple.light.svg);
}
body #theme-selector-icon[data-value="material.purple.dark"],
body #theme-selector-icon[data-value="material.purple.dark.compact"] {
  background-image: url(~/../../Images/Themes/material.purple.dark.svg);
}
body #theme-selector-icon[data-value="material.teal.light"],
body #theme-selector-icon[data-value="material.teal.light.compact"] {
  background-image: url(~/../../Images/Themes/material.teal.light.svg);
}
body #theme-selector-icon[data-value="material.teal.dark"],
body #theme-selector-icon[data-value="material.teal.dark.compact"] {
  background-image: url(~/../../Images/Themes/material.teal.dark.svg);
}
body #theme-selector-icon[data-value="fluent.blue.light"],
body #theme-selector-icon[data-value="fluent.blue.light.compact"] {
  background-image: url(~/../../Images/Themes/fluent.blue.light.svg);
}
body #theme-selector-icon[data-value="fluent.blue.dark"],
body #theme-selector-icon[data-value="fluent.blue.dark.compact"] {
  background-image: url(~/../../Images/Themes/fluent.blue.dark.svg);
}
body #theme-selector-icon[data-value="fluent.saas.light"],
body #theme-selector-icon[data-value="fluent.saas.light.compact"] {
  background-image: url(~/../../Images/Themes/fluent.saas.light.svg);
}
body #theme-selector-icon[data-value="fluent.saas.dark"],
body #theme-selector-icon[data-value="fluent.saas.dark.compact"] {
  background-image: url(~/../../Images/Themes/fluent.saas.dark.svg);
}
body #theme-selector-button.btn {
  height: 36px;
  min-width: auto;
  max-width: none;
  gap: 8px;
  padding: 6px 8px;
  outline: none;
  border: none;
  white-space: nowrap;
  overflow: hidden;
}
body #theme-selector-button.btn:focus-visible {
  outline: 2px solid;
  outline-offset: -2px;
}
body #theme-selector-button.btn .theme-selector-arrow {
  width: 24px;
  height: 24px;
}
body #theme-selector-button.btn #theme-selector-text {
  font-size: 16px;
}
body .footer {
  position: absolute;
  width: 100%;
  padding: 24px;
  box-sizing: border-box;
  font-size: 12px;
  color: white;
  z-index: 5;
}
body .footer svg#devextreme-logo path {
  fill: white;
}
body .footer .content-width {
  padding-top: 0;
  padding-bottom: 0;
}
body .footer-container {
  display: flex;
  justify-content: space-between;
  gap: 32px 16px;
}
body .footer-about {
  display: flex;
  gap: 40px;
}
body .footer-logo {
  height: min-content;
  display: flex;
  gap: 12px;
  align-items: center;
}
body .footer-text {
  margin: 0 0 16px;
  font-size: 12px;
  line-height: 14px;
}
body .footer a {
  text-decoration: underline;
}
body .footer-socials {
  display: flex;
  align-items: center;
}
body .footer-socials-links {
  display: flex;
  gap: 8px;
}
body .footer-socials-link svg {
  width: 32px;
  height: 32px;
}
body .footer-socials-link:hover {
  opacity: 0.8;
}
@media only screen and (max-width: 1400px) {
  body .footer {
    padding: 32px 0;
    height: auto;
    font-size: 12px;
  }
  body .footer-container {
    flex-direction: column;
  }
  body .footer-about {
    flex-direction: column;
    align-items: center;
  }
  body .footer-text,
  body .footer-links {
    text-align: center;
  }
  body .footer-text {
    margin-bottom: 16px;
  }
  body .footer-socials {
    justify-content: center;
  }
  body .footer-socials-title {
    display: none;
  }
  body .footer-socials-links {
    justify-content: center;
  }
}
body .footer {
  position: absolute;
  width: 100%;
  padding: 24px;
  box-sizing: border-box;
  font-size: 12px;
  color: white;
  z-index: 5;
}
body .footer svg#devextreme-logo path {
  fill: white;
}
body .footer .content-width {
  padding-top: 0;
  padding-bottom: 0;
}
body .footer-container {
  display: flex;
  justify-content: space-between;
  gap: 32px 16px;
}
body .footer-about {
  display: flex;
  gap: 40px;
}
body .footer-logo {
  height: min-content;
  display: flex;
  gap: 12px;
  align-items: center;
}
body .footer-text {
  margin: 0 0 16px;
  font-size: 12px;
  line-height: 14px;
}
body .footer a {
  text-decoration: underline;
}
body .footer-socials {
  display: flex;
  align-items: center;
}
body .footer-socials-links {
  display: flex;
  gap: 8px;
}
body .footer-socials-link svg {
  width: 32px;
  height: 32px;
}
body .footer-socials-link:hover {
  opacity: 0.8;
}
@media only screen and (max-width: 1400px) {
  body .footer {
    padding: 32px 0;
    height: auto;
    font-size: 12px;
  }
  body .footer-container {
    flex-direction: column;
  }
  body .footer-about {
    flex-direction: column;
    align-items: center;
  }
  body .footer-text,
  body .footer-links {
    text-align: center;
  }
  body .footer-text {
    margin-bottom: 16px;
  }
  body .footer-socials {
    justify-content: center;
  }
  body .footer-socials-title {
    display: none;
  }
  body .footer-socials-links {
    justify-content: center;
  }
}
body .theme-switch {
  display: flex;
  flex: 0 0 56px;
  width: 56px;
  height: 28px;
  border: 1px solid;
  box-sizing: border-box;
  border-radius: 50px;
  padding: 1px;
  overflow: hidden;
  cursor: pointer;
}
body .theme-switch-wrapper {
  display: inline-flex;
  align-items: center;
  width: 52px;
  height: 24px;
}
body .theme-toogle {
  flex: 0 0 20px;
  padding: 2px;
  display: flex;
  justify-content: center;
  align-items: center;
  margin-right: 4px;
}
body .theme-toogle svg {
  width: 20px;
  height: 20px;
  border-radius: 10px;
}
body .theme-toogle.light {
  transition: 0.4s;
}
body .theme-toogle.dark {
  width: 0;
}
body .theme-input {
  width: 20px;
  height: 20px;
  border-radius: 10px;
}
body .theme-switch {
  display: flex;
  flex: 0 0 56px;
  width: 56px;
  height: 28px;
  border: 1px solid;
  box-sizing: border-box;
  border-radius: 50px;
  padding: 1px;
  overflow: hidden;
  cursor: pointer;
}
body .theme-switch-wrapper {
  display: inline-flex;
  align-items: center;
  width: 52px;
  height: 24px;
}
body .theme-toogle {
  flex: 0 0 20px;
  padding: 2px;
  display: flex;
  justify-content: center;
  align-items: center;
  margin-right: 4px;
}
body .theme-toogle svg {
  width: 20px;
  height: 20px;
  border-radius: 10px;
}
body .theme-toogle.light {
  transition: 0.4s;
}
body .theme-toogle.dark {
  width: 0;
}
body .theme-input {
  width: 20px;
  height: 20px;
  border-radius: 10px;
}
body .front-toggle-container {
  display: inline-flex;
  padding: 12px 12px;
}
body .front-toggle {
  display: inline-flex;
  align-items: center;
  height: 32px;
  border-radius: 999px;
  justify-content: space-between;
  position: relative;
}
body .front-toggle .front-toggle-track {
  position: absolute;
  height: 32px;
  width: 48px;
  border-radius: 50px;
  transform: translateX(0px);
  transition: transform 200ms;
}
body .front-toggle input[type="checkbox"]:checked ~ .front-toggle-track {
  transform: translateX(48px);
  transition: transform 200ms;
}
body .front-toggle [name="front-toggle"] {
  display: none;
}
body .front-toggle input[type="checkbox"] ~ label {
  cursor: pointer;
  font-family: 'Roboto', sans-serif;
  user-select: none;
  padding: 0 16px;
  height: 100%;
  display: flex;
  align-items: center;
  z-index: 2;
}
body .front-toggle-container {
  display: inline-flex;
  padding: 12px 12px;
}
body .front-toggle {
  display: inline-flex;
  align-items: center;
  height: 32px;
  border-radius: 999px;
  justify-content: space-between;
  position: relative;
}
body .front-toggle .front-toggle-track {
  position: absolute;
  height: 32px;
  width: 48px;
  border-radius: 50px;
  transform: translateX(0px);
  transition: transform 200ms;
}
body .front-toggle input[type="checkbox"]:checked ~ .front-toggle-track {
  transform: translateX(48px);
  transition: transform 200ms;
}
body .front-toggle [name="front-toggle"] {
  display: none;
}
body .front-toggle input[type="checkbox"] ~ label {
  cursor: pointer;
  font-family: 'Roboto', sans-serif;
  user-select: none;
  padding: 0 16px;
  height: 100%;
  display: flex;
  align-items: center;
  z-index: 2;
}
body .survey-hidden {
  display: none;
}
body .survey--container {
  height: 42px;
  width: 100%;
  width: -moz-available;
  width: -webkit-fill-available;
  width: fill-available;
  position: fixed;
  z-index: 2000;
}
body .survey--component {
  height: inherit;
  padding-top: 0;
  padding-bottom: 0;
  display: flex;
  justify-content: space-between;
  align-items: center;
}
body .survey--part {
  display: flex;
  align-items: center;
  gap: 32px;
}
body .survey--part p {
  margin: 0;
  line-height: 125%;
}
body .survey--part a {
  text-decoration: underline;
}
body .survey--button {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 32px;
  height: 32px;
  padding: 0;
  background: transparent;
  border: none;
  border-radius: 50%;
  color: white;
}
body .survey--button:hover {
  cursor: pointer;
}
body .survey--indent ~ header .header {
  top: 42px;
}
body .survey--indent ~ .header-drawer {
  top: 112px;
}
body .survey--indent ~ #menu {
  top: 112px;
}
body .survey--indent ~ main .block-approch-selected-content {
  padding-top: 42px;
}
body .survey--indent ~ main .doc-content {
  position: relative;
  top: 42px;
}
body .survey--indent ~ main .sticky-wrapper .tabs {
  top: 112px;
}
body .survey--indent ~ main .left-menu {
  top: 152px;
}
@media only screen and (max-width: 2000px) {
  body .survey--container {
    padding-right: 24px;
    padding-left: 24px;
  }
}
@media only screen and (max-width: 1500px) {
  body .survey--container {
    padding-right: 18px;
    padding-left: 18px;
  }
}
@media only screen and (max-width: 1101px) {
  body .survey--part {
    gap: 16px;
  }
}
@media only screen and (max-width: 1069px) {
  body .survey--part {
    gap: 8px;
  }
}
@media only screen and (max-width: 1069px) {
  body .survey--svg {
    display: none;
  }
}
@media only screen and (max-width: 955px) {
  body .survey--part p {
    font-size: 14px;
  }
}
@media only screen and (max-width: 773px) {
  body .survey--container {
    height: 60px;
  }
  body .survey--part {
    flex-direction: column;
    align-items: flex-start;
  }
  body .survey--indent ~ header .header {
    top: 60px;
  }
  body .survey--indent ~ .header-drawer {
    top: 130px;
  }
  body .survey--indent ~ #menu {
    top: 130px;
  }
  body .survey--indent ~ main {
    top: 60px;
  }
  body .survey--indent ~ main .block-approch-selected-content {
    padding-top: 60px;
  }
  body .survey--indent ~ main .sticky-wrapper .tabs {
    top: 130px;
  }
  body .survey--indent ~ main .left-menu {
    top: 190px;
  }
}
@media only screen and (max-width: 540px) {
  body .survey--part {
    gap: 0;
  }
  body .survey--part p {
    font-size: 12px;
  }
}
body .survey-hidden {
  display: none;
}
body .survey--container {
  height: 42px;
  width: 100%;
  width: -moz-available;
  width: -webkit-fill-available;
  width: fill-available;
  position: fixed;
  z-index: 2000;
}
body .survey--component {
  height: inherit;
  padding-top: 0;
  padding-bottom: 0;
  display: flex;
  justify-content: space-between;
  align-items: center;
}
body .survey--part {
  display: flex;
  align-items: center;
  gap: 32px;
}
body .survey--part p {
  margin: 0;
  line-height: 125%;
}
body .survey--part a {
  text-decoration: underline;
}
body .survey--button {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 32px;
  height: 32px;
  padding: 0;
  background: transparent;
  border: none;
  border-radius: 50%;
  color: white;
}
body .survey--button:hover {
  cursor: pointer;
}
body .survey--indent ~ header .header {
  top: 42px;
}
body .survey--indent ~ .header-drawer {
  top: 112px;
}
body .survey--indent ~ #menu {
  top: 112px;
}
body .survey--indent ~ main .block-approch-selected-content {
  padding-top: 42px;
}
body .survey--indent ~ main .doc-content {
  position: relative;
  top: 42px;
}
body .survey--indent ~ main .sticky-wrapper .tabs {
  top: 112px;
}
body .survey--indent ~ main .left-menu {
  top: 152px;
}
@media only screen and (max-width: 2000px) {
  body .survey--container {
    padding-right: 24px;
    padding-left: 24px;
  }
}
@media only screen and (max-width: 1500px) {
  body .survey--container {
    padding-right: 18px;
    padding-left: 18px;
  }
}
@media only screen and (max-width: 1101px) {
  body .survey--part {
    gap: 16px;
  }
}
@media only screen and (max-width: 1069px) {
  body .survey--part {
    gap: 8px;
  }
}
@media only screen and (max-width: 1069px) {
  body .survey--svg {
    display: none;
  }
}
@media only screen and (max-width: 955px) {
  body .survey--part p {
    font-size: 14px;
  }
}
@media only screen and (max-width: 773px) {
  body .survey--container {
    height: 60px;
  }
  body .survey--part {
    flex-direction: column;
    align-items: flex-start;
  }
  body .survey--indent ~ header .header {
    top: 60px;
  }
  body .survey--indent ~ .header-drawer {
    top: 130px;
  }
  body .survey--indent ~ #menu {
    top: 130px;
  }
  body .survey--indent ~ main {
    top: 60px;
  }
  body .survey--indent ~ main .block-approch-selected-content {
    padding-top: 60px;
  }
  body .survey--indent ~ main .sticky-wrapper .tabs {
    top: 130px;
  }
  body .survey--indent ~ main .left-menu {
    top: 190px;
  }
}
@media only screen and (max-width: 540px) {
  body .survey--part {
    gap: 0;
  }
  body .survey--part p {
    font-size: 12px;
  }
}
body #ot-sdk-btn-floating.ot-floating-button {
  display: none;
}
body #onetrust-consent-sdk #onetrust-banner-sdk #onetrust-button-group-parent button {
  border-radius: 4px;
  font-family: 'Open Sans', sans-serif;
  width: 100% !important;
}
body #onetrust-consent-sdk #onetrust-banner-sdk #onetrust-button-group-parent button#onetrust-pc-btn-handler:hover {
  color: white;
  opacity: 1;
}
body #onetrust-consent-sdk #onetrust-pc-sdk button:not(#clear-filters-handler):not(.ot-close-icon):not(#filter-btn-handler):not(.ot-remove-objection-handler):not(.ot-obj-leg-btn-handler):not([aria-expanded]):not(.ot-link-btn) {
  border-radius: 4px;
  font-family: 'Open Sans', sans-serif;
}
body #ot-sdk-btn.ot-sdk-show-settings,
body #ot-sdk-btn.optanon-show-settings {
  border: none;
  padding: 0;
  line-height: inherit;
  font-size: inherit;
  color: inherit;
  background-color: transparent !important;
  text-decoration: underline;
  color: white;
}
body #ot-sdk-btn.ot-sdk-show-settings:visited,
body #ot-sdk-btn.optanon-show-settings:visited {
  color: white;
}
body #ot-sdk-btn.ot-sdk-show-settings:hover,
body #ot-sdk-btn.optanon-show-settings:hover,
body #ot-sdk-btn.ot-sdk-show-settings:visited:hover,
body #ot-sdk-btn.optanon-show-settings:visited:hover {
  color: #d9d9d9;
}
body #ot-sdk-btn.ot-sdk-show-settings:active,
body #ot-sdk-btn.optanon-show-settings:active {
  color: #b3b3b3;
}
body #ot-sdk-btn.ot-sdk-show-settings:focus,
body #ot-sdk-btn.optanon-show-settings:focus {
  outline-color: white;
}
body #ot-sdk-btn-floating.ot-floating-button {
  display: none;
}
body #onetrust-consent-sdk #onetrust-banner-sdk #onetrust-button-group-parent button {
  border-radius: 4px;
  font-family: 'Open Sans', sans-serif;
  width: 100% !important;
}
body #onetrust-consent-sdk #onetrust-banner-sdk #onetrust-button-group-parent button#onetrust-pc-btn-handler:hover {
  color: white;
  opacity: 1;
}
body #onetrust-consent-sdk #onetrust-pc-sdk button:not(#clear-filters-handler):not(.ot-close-icon):not(#filter-btn-handler):not(.ot-remove-objection-handler):not(.ot-obj-leg-btn-handler):not([aria-expanded]):not(.ot-link-btn) {
  border-radius: 4px;
  font-family: 'Open Sans', sans-serif;
}
body #ot-sdk-btn.ot-sdk-show-settings,
body #ot-sdk-btn.optanon-show-settings {
  border: none;
  padding: 0;
  line-height: inherit;
  font-size: inherit;
  color: inherit;
  background-color: transparent !important;
  text-decoration: underline;
  color: white;
}
body #ot-sdk-btn.ot-sdk-show-settings:visited,
body #ot-sdk-btn.optanon-show-settings:visited {
  color: white;
}
body #ot-sdk-btn.ot-sdk-show-settings:hover,
body #ot-sdk-btn.optanon-show-settings:hover,
body #ot-sdk-btn.ot-sdk-show-settings:visited:hover,
body #ot-sdk-btn.optanon-show-settings:visited:hover {
  color: #d9d9d9;
}
body #ot-sdk-btn.ot-sdk-show-settings:active,
body #ot-sdk-btn.optanon-show-settings:active {
  color: #b3b3b3;
}
body #ot-sdk-btn.ot-sdk-show-settings:focus,
body #ot-sdk-btn.optanon-show-settings:focus {
  outline-color: white;
}
body a:focus {
  outline: auto;
}
body .btn.btn {
  box-sizing: border-box;
  display: flex;
  align-items: center;
  padding: 10px 20px;
  border-radius: 40px;
  text-decoration: none;
  justify-content: center;
  color: white;
  font-family: 'Roboto', sans-serif;
  font-size: 18px;
  line-height: 24px;
  font-weight: 500;
  min-width: 220px;
  max-width: fit-content;
  border: 2px solid;
  cursor: pointer;
}
body .btn.btn-shadow {
  box-shadow: 0px 4px 12px rgba(0, 0, 0, 0.16);
}
body .btn.btn-icon {
  gap: 8px;
}
body .btn.btn-hidden {
  display: none;
}
body .btn.btn-blue-outline {
  cursor: pointer;
}
body .btn.btn-blue-outline:focus-visible {
  outline: 2px solid;
}
body .btn.btn-blue-outline:visited {
  color: white;
}
body .btn.btn-blue-outline:hover {
  color: white !important;
}
body .btn.btn-orange {
  border-radius: 999px;
  outline-offset: 0px;
  border: none;
}
body .btn.btn-orange:focus {
  outline: none;
}
body .btn.btn-orange:focus-visible {
  outline: 2px solid;
}
body .btn.btn svg {
  width: 24px;
  height: 24px;
}
body .tbs {
  width: 100%;
  display: inline-flex;
  align-items: center;
  flex-wrap: nowrap;
  flex-direction: row;
  justify-content: center;
  border-bottom: 1px solid;
}
body .tbs-item-container {
  display: inline-flex;
  align-items: center;
  padding: 19px 12px;
}
body .tbs-item {
  text-align: center;
  font-style: normal;
  font-weight: 400;
  font-size: 16px;
  line-height: 135%;
  cursor: pointer;
  border: none;
  text-decoration: none;
}
body .duo-card {
  margin-top: 16px;
  display: flex;
  justify-content: center;
  padding: 4px;
  width: fit-content;
  border-radius: 40px;
}
body .duo-card .wrapper-card {
  position: relative;
  cursor: pointer;
}
body .duo-card .wrapper-card svg {
  position: absolute;
  left: 12px;
  top: 10px;
  width: 18px;
  height: 18px;
}
body .duo-card .wrapper-card.active input,
body .duo-card input.active {
  box-shadow: 0px 2px 6px rgba(0, 0, 0, 0.16);
}
body .duo-card input {
  background-color: transparent;
  border: none;
  border-radius: 4px;
  margin: 0;
  padding: 10px 12px;
  border-radius: 40px;
  font-weight: 400;
  font-size: 16px;
  line-height: 18px;
}
body .duo-card input:hover {
  cursor: pointer;
}
body .duo-card svg + input {
  padding: 10px 12px 10px 38px;
}
body .content-width {
  max-width: 1900px;
  margin: 0 auto;
  padding: 64px 0;
  position: relative;
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
}
body .switch {
  display: inline-flex;
  padding: 0 16px;
  gap: 8px;
  align-items: center;
  position: relative;
}
body .switch-toogle {
  position: relative;
  display: inline-block;
  width: 56px;
  height: 28px;
}
body .switch-toogle input {
  opacity: 0;
  width: 0;
  height: 0;
}
body .switch-toogle input:checked + .switch-slider::before {
  transform: translateX(28px);
}
body .switch-slider {
  position: absolute;
  cursor: pointer;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  transition: 0.4s;
  border-radius: 34px;
  border: 1px solid;
}
body .switch-slider::before {
  position: absolute;
  content: "";
  height: 20px;
  width: 20px;
  left: 4px;
  top: 3px;
  -webkit-transition: 0.4s;
  transition: 0.4s;
  border-radius: 50%;
}
body .switch-label {
  white-space: nowrap;
}
@media only screen and (max-width: 1400px) {
  body .content-width {
    padding-top: 32px;
    padding-bottom: 32px;
  }
}
@media only screen and (max-width: 768px) {
  body .content-width {
    padding-left: 0;
    padding-right: 0;
  }
  body .btn.btn {
    min-width: 180px;
  }
  body .tbs {
    overflow-x: scroll;
    justify-content: flex-start;
    -ms-overflow-style: none;
    scrollbar-width: none;
  }
  body .tbs-item {
    width: auto;
    white-space: nowrap;
  }
  body .tbs::-webkit-scrollbar {
    display: none;
  }
}
body .btn.btn {
  box-sizing: border-box;
  display: flex;
  align-items: center;
  padding: 10px 20px;
  border-radius: 40px;
  text-decoration: none;
  justify-content: center;
  color: white;
  font-family: 'Roboto', sans-serif;
  font-size: 18px;
  line-height: 24px;
  font-weight: 500;
  min-width: 220px;
  max-width: fit-content;
  border: 2px solid;
  cursor: pointer;
}
body .btn.btn-shadow {
  box-shadow: 0px 4px 12px rgba(0, 0, 0, 0.16);
}
body .btn.btn-icon {
  gap: 8px;
}
body .btn.btn-hidden {
  display: none;
}
body .btn.btn-blue-outline {
  cursor: pointer;
}
body .btn.btn-blue-outline:focus-visible {
  outline: 2px solid;
}
body .btn.btn-blue-outline:visited {
  color: white;
}
body .btn.btn-blue-outline:hover {
  color: white !important;
}
body .btn.btn-orange {
  border-radius: 999px;
  outline-offset: 0px;
  border: none;
}
body .btn.btn-orange:focus {
  outline: none;
}
body .btn.btn-orange:focus-visible {
  outline: 2px solid;
}
body .btn.btn svg {
  width: 24px;
  height: 24px;
}
body .tbs {
  width: 100%;
  display: inline-flex;
  align-items: center;
  flex-wrap: nowrap;
  flex-direction: row;
  justify-content: center;
  border-bottom: 1px solid;
}
body .tbs-item-container {
  display: inline-flex;
  align-items: center;
  padding: 19px 12px;
}
body .tbs-item {
  text-align: center;
  font-style: normal;
  font-weight: 400;
  font-size: 16px;
  line-height: 135%;
  cursor: pointer;
  border: none;
  text-decoration: none;
}
body .duo-card {
  margin-top: 16px;
  display: flex;
  justify-content: center;
  padding: 4px;
  width: fit-content;
  border-radius: 40px;
}
body .duo-card .wrapper-card {
  position: relative;
  cursor: pointer;
}
body .duo-card .wrapper-card svg {
  position: absolute;
  left: 12px;
  top: 10px;
  width: 18px;
  height: 18px;
}
body .duo-card .wrapper-card.active input,
body .duo-card input.active {
  box-shadow: 0px 2px 6px rgba(0, 0, 0, 0.16);
}
body .duo-card input {
  background-color: transparent;
  border: none;
  border-radius: 4px;
  margin: 0;
  padding: 10px 12px;
  border-radius: 40px;
  font-weight: 400;
  font-size: 16px;
  line-height: 18px;
}
body .duo-card input:hover {
  cursor: pointer;
}
body .duo-card svg + input {
  padding: 10px 12px 10px 38px;
}
body .content-width {
  max-width: 1900px;
  margin: 0 auto;
  padding: 64px 0;
  position: relative;
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
}
body .switch {
  display: inline-flex;
  padding: 0 16px;
  gap: 8px;
  align-items: center;
  position: relative;
}
body .switch-toogle {
  position: relative;
  display: inline-block;
  width: 56px;
  height: 28px;
}
body .switch-toogle input {
  opacity: 0;
  width: 0;
  height: 0;
}
body .switch-toogle input:checked + .switch-slider::before {
  transform: translateX(28px);
}
body .switch-slider {
  position: absolute;
  cursor: pointer;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  transition: 0.4s;
  border-radius: 34px;
  border: 1px solid;
}
body .switch-slider::before {
  position: absolute;
  content: "";
  height: 20px;
  width: 20px;
  left: 4px;
  top: 3px;
  -webkit-transition: 0.4s;
  transition: 0.4s;
  border-radius: 50%;
}
body .switch-label {
  white-space: nowrap;
}
@media only screen and (max-width: 1400px) {
  body .content-width {
    padding-top: 32px;
    padding-bottom: 32px;
  }
}
@media only screen and (max-width: 768px) {
  body .content-width {
    padding-left: 0;
    padding-right: 0;
  }
  body .btn.btn {
    min-width: 180px;
  }
  body .tbs {
    overflow-x: scroll;
    justify-content: flex-start;
    -ms-overflow-style: none;
    scrollbar-width: none;
  }
  body .tbs-item {
    width: auto;
    white-space: nowrap;
  }
  body .tbs::-webkit-scrollbar {
    display: none;
  }
}
body .btn.btn {
  box-sizing: border-box;
  display: flex;
  align-items: center;
  padding: 10px 20px;
  border-radius: 40px;
  text-decoration: none;
  justify-content: center;
  color: white;
  font-family: 'Roboto', sans-serif;
  font-size: 18px;
  line-height: 24px;
  font-weight: 500;
  min-width: 220px;
  max-width: fit-content;
  border: 2px solid;
  cursor: pointer;
}
body .btn.btn-shadow {
  box-shadow: 0px 4px 12px rgba(0, 0, 0, 0.16);
}
body .btn.btn-icon {
  gap: 8px;
}
body .btn.btn-hidden {
  display: none;
}
body .btn.btn-blue-outline {
  cursor: pointer;
}
body .btn.btn-blue-outline:focus-visible {
  outline: 2px solid;
}
body .btn.btn-blue-outline:visited {
  color: white;
}
body .btn.btn-blue-outline:hover {
  color: white !important;
}
body .btn.btn-orange {
  border-radius: 999px;
  outline-offset: 0px;
  border: none;
}
body .btn.btn-orange:focus {
  outline: none;
}
body .btn.btn-orange:focus-visible {
  outline: 2px solid;
}
body .btn.btn svg {
  width: 24px;
  height: 24px;
}
body .tbs {
  width: 100%;
  display: inline-flex;
  align-items: center;
  flex-wrap: nowrap;
  flex-direction: row;
  justify-content: center;
  border-bottom: 1px solid;
}
body .tbs-item-container {
  display: inline-flex;
  align-items: center;
  padding: 19px 12px;
}
body .tbs-item {
  text-align: center;
  font-style: normal;
  font-weight: 400;
  font-size: 16px;
  line-height: 135%;
  cursor: pointer;
  border: none;
  text-decoration: none;
}
body .duo-card {
  margin-top: 16px;
  display: flex;
  justify-content: center;
  padding: 4px;
  width: fit-content;
  border-radius: 40px;
}
body .duo-card .wrapper-card {
  position: relative;
  cursor: pointer;
}
body .duo-card .wrapper-card svg {
  position: absolute;
  left: 12px;
  top: 10px;
  width: 18px;
  height: 18px;
}
body .duo-card .wrapper-card.active input,
body .duo-card input.active {
  box-shadow: 0px 2px 6px rgba(0, 0, 0, 0.16);
}
body .duo-card input {
  background-color: transparent;
  border: none;
  border-radius: 4px;
  margin: 0;
  padding: 10px 12px;
  border-radius: 40px;
  font-weight: 400;
  font-size: 16px;
  line-height: 18px;
}
body .duo-card input:hover {
  cursor: pointer;
}
body .duo-card svg + input {
  padding: 10px 12px 10px 38px;
}
body .content-width {
  max-width: 1900px;
  margin: 0 auto;
  padding: 64px 0;
  position: relative;
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
}
body .switch {
  display: inline-flex;
  padding: 0 16px;
  gap: 8px;
  align-items: center;
  position: relative;
}
body .switch-toogle {
  position: relative;
  display: inline-block;
  width: 56px;
  height: 28px;
}
body .switch-toogle input {
  opacity: 0;
  width: 0;
  height: 0;
}
body .switch-toogle input:checked + .switch-slider::before {
  transform: translateX(28px);
}
body .switch-slider {
  position: absolute;
  cursor: pointer;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  transition: 0.4s;
  border-radius: 34px;
  border: 1px solid;
}
body .switch-slider::before {
  position: absolute;
  content: "";
  height: 20px;
  width: 20px;
  left: 4px;
  top: 3px;
  -webkit-transition: 0.4s;
  transition: 0.4s;
  border-radius: 50%;
}
body .switch-label {
  white-space: nowrap;
}
@media only screen and (max-width: 1400px) {
  body .content-width {
    padding-top: 32px;
    padding-bottom: 32px;
  }
}
@media only screen and (max-width: 768px) {
  body .content-width {
    padding-left: 0;
    padding-right: 0;
  }
  body .btn.btn {
    min-width: 180px;
  }
  body .tbs {
    overflow-x: scroll;
    justify-content: flex-start;
    -ms-overflow-style: none;
    scrollbar-width: none;
  }
  body .tbs-item {
    width: auto;
    white-space: nowrap;
  }
  body .tbs::-webkit-scrollbar {
    display: none;
  }
}
body .btn.btn {
  box-sizing: border-box;
  display: flex;
  align-items: center;
  padding: 10px 20px;
  border-radius: 40px;
  text-decoration: none;
  justify-content: center;
  color: white;
  font-family: 'Roboto', sans-serif;
  font-size: 18px;
  line-height: 24px;
  font-weight: 500;
  min-width: 220px;
  max-width: fit-content;
  border: 2px solid;
  cursor: pointer;
}
body .btn.btn-shadow {
  box-shadow: 0px 4px 12px rgba(0, 0, 0, 0.16);
}
body .btn.btn-icon {
  gap: 8px;
}
body .btn.btn-hidden {
  display: none;
}
body .btn.btn-blue-outline {
  cursor: pointer;
}
body .btn.btn-blue-outline:focus-visible {
  outline: 2px solid;
}
body .btn.btn-blue-outline:visited {
  color: white;
}
body .btn.btn-blue-outline:hover {
  color: white !important;
}
body .btn.btn-orange {
  border-radius: 999px;
  outline-offset: 0px;
  border: none;
}
body .btn.btn-orange:focus {
  outline: none;
}
body .btn.btn-orange:focus-visible {
  outline: 2px solid;
}
body .btn.btn svg {
  width: 24px;
  height: 24px;
}
body .tbs {
  width: 100%;
  display: inline-flex;
  align-items: center;
  flex-wrap: nowrap;
  flex-direction: row;
  justify-content: center;
  border-bottom: 1px solid;
}
body .tbs-item-container {
  display: inline-flex;
  align-items: center;
  padding: 19px 12px;
}
body .tbs-item {
  text-align: center;
  font-style: normal;
  font-weight: 400;
  font-size: 16px;
  line-height: 135%;
  cursor: pointer;
  border: none;
  text-decoration: none;
}
body .duo-card {
  margin-top: 16px;
  display: flex;
  justify-content: center;
  padding: 4px;
  width: fit-content;
  border-radius: 40px;
}
body .duo-card .wrapper-card {
  position: relative;
  cursor: pointer;
}
body .duo-card .wrapper-card svg {
  position: absolute;
  left: 12px;
  top: 10px;
  width: 18px;
  height: 18px;
}
body .duo-card .wrapper-card.active input,
body .duo-card input.active {
  box-shadow: 0px 2px 6px rgba(0, 0, 0, 0.16);
}
body .duo-card input {
  background-color: transparent;
  border: none;
  border-radius: 4px;
  margin: 0;
  padding: 10px 12px;
  border-radius: 40px;
  font-weight: 400;
  font-size: 16px;
  line-height: 18px;
}
body .duo-card input:hover {
  cursor: pointer;
}
body .duo-card svg + input {
  padding: 10px 12px 10px 38px;
}
body .content-width {
  max-width: 1900px;
  margin: 0 auto;
  padding: 64px 0;
  position: relative;
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
}
body .switch {
  display: inline-flex;
  padding: 0 16px;
  gap: 8px;
  align-items: center;
  position: relative;
}
body .switch-toogle {
  position: relative;
  display: inline-block;
  width: 56px;
  height: 28px;
}
body .switch-toogle input {
  opacity: 0;
  width: 0;
  height: 0;
}
body .switch-toogle input:checked + .switch-slider::before {
  transform: translateX(28px);
}
body .switch-slider {
  position: absolute;
  cursor: pointer;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  transition: 0.4s;
  border-radius: 34px;
  border: 1px solid;
}
body .switch-slider::before {
  position: absolute;
  content: "";
  height: 20px;
  width: 20px;
  left: 4px;
  top: 3px;
  -webkit-transition: 0.4s;
  transition: 0.4s;
  border-radius: 50%;
}
body .switch-label {
  white-space: nowrap;
}
@media only screen and (max-width: 1400px) {
  body .content-width {
    padding-top: 32px;
    padding-bottom: 32px;
  }
}
@media only screen and (max-width: 768px) {
  body .content-width {
    padding-left: 0;
    padding-right: 0;
  }
  body .btn.btn {
    min-width: 180px;
  }
  body .tbs {
    overflow-x: scroll;
    justify-content: flex-start;
    -ms-overflow-style: none;
    scrollbar-width: none;
  }
  body .tbs-item {
    width: auto;
    white-space: nowrap;
  }
  body .tbs::-webkit-scrollbar {
    display: none;
  }
}
body .header-approach-selected {
  min-width: auto;
  padding: 0 8px 2px 8px;
  margin-bottom: 12px;
  font-size: 26px;
  line-height: 100%;
  font-weight: 700;
  font-stretch: 75%;
  font-family: 'Open Sans', sans-serif;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  border: 0;
  border-radius: 40px;
  cursor: pointer;
}
body .header-approach-selected::after {
  content: ' ';
  margin-top: 6px;
  transition: transform 0.4s;
}
body .header-approach-selected:focus {
  outline-color: initial;
  outline-style: solid;
  outline-width: 2px;
}
body .header-approach-list {
  z-index: 100001;
  box-sizing: border-box;
  display: none;
  box-shadow: 0 2px 8px 0 rgba(0, 0, 0, 0.12), 0 1px 2px 0 rgba(0, 0, 0, 0.06);
  border-radius: 8px;
  flex-direction: column;
  position: fixed;
  padding: 4px;
  gap: 2px;
}
body .header-approach-list.active {
  display: flex;
}
body .header-approach-list-item {
  border-radius: 4px;
  display: flex;
  align-items: center;
  box-sizing: border-box;
  height: 40px;
  padding: 8px 8px 8px 12px;
  text-align: left;
  text-decoration: none !important;
}
body .header-approach-list-item-content {
  flex: 1;
}
body .header-approach-list-item .indicator-new {
  margin-left: 8px;
}
body .header-approach-list {
  z-index: 100001;
  box-sizing: border-box;
  display: none;
  box-shadow: 0 2px 8px 0 rgba(0, 0, 0, 0.12), 0 1px 2px 0 rgba(0, 0, 0, 0.06);
  border-radius: 8px;
  flex-direction: column;
  position: fixed;
  padding: 4px;
  gap: 2px;
}
body .header-approach-list.active {
  display: flex;
}
body .header-approach-list-item {
  border-radius: 4px;
  display: flex;
  align-items: center;
  box-sizing: border-box;
  height: 40px;
  padding: 8px 8px 8px 12px;
  text-align: left;
  text-decoration: none !important;
}
body .header-approach-list-item-content {
  flex: 1;
}
body .header-approach-list-item .indicator-new {
  margin-left: 8px;
}
body .header-approach-list {
  width: 170px;
}
body .header-approach-selected {
  min-width: auto;
  padding: 0 8px 2px 8px;
  margin-bottom: 12px;
  font-size: 26px;
  line-height: 100%;
  font-weight: 700;
  font-stretch: 75%;
  font-family: 'Open Sans', sans-serif;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  border: 0;
  border-radius: 40px;
  cursor: pointer;
}
body .header-approach-selected::after {
  content: ' ';
  margin-top: 6px;
  transition: transform 0.4s;
}
body .header-approach-selected:focus {
  outline-color: initial;
  outline-style: solid;
  outline-width: 2px;
}
body .header-approach-list {
  z-index: 100001;
  box-sizing: border-box;
  display: none;
  box-shadow: 0 2px 8px 0 rgba(0, 0, 0, 0.12), 0 1px 2px 0 rgba(0, 0, 0, 0.06);
  border-radius: 8px;
  flex-direction: column;
  position: fixed;
  padding: 4px;
  gap: 2px;
}
body .header-approach-list.active {
  display: flex;
}
body .header-approach-list-item {
  border-radius: 4px;
  display: flex;
  align-items: center;
  box-sizing: border-box;
  height: 40px;
  padding: 8px 8px 8px 12px;
  text-align: left;
  text-decoration: none !important;
}
body .header-approach-list-item-content {
  flex: 1;
}
body .header-approach-list-item .indicator-new {
  margin-left: 8px;
}
body .header-approach-list {
  z-index: 100001;
  box-sizing: border-box;
  display: none;
  box-shadow: 0 2px 8px 0 rgba(0, 0, 0, 0.12), 0 1px 2px 0 rgba(0, 0, 0, 0.06);
  border-radius: 8px;
  flex-direction: column;
  position: fixed;
  padding: 4px;
  gap: 2px;
}
body .header-approach-list.active {
  display: flex;
}
body .header-approach-list-item {
  border-radius: 4px;
  display: flex;
  align-items: center;
  box-sizing: border-box;
  height: 40px;
  padding: 8px 8px 8px 12px;
  text-align: left;
  text-decoration: none !important;
}
body .header-approach-list-item-content {
  flex: 1;
}
body .header-approach-list-item .indicator-new {
  margin-left: 8px;
}
body .header-approach-list {
  width: 170px;
}
body .header-drawer {
  display: none;
}
body .header-drawer-toggle.btn {
  display: none;
  min-width: 40px;
  height: 40px;
  padding: 8px;
  margin-right: 6px;
}
body .header-drawer-toggle.btn .dx-icon {
  font-size: 18px;
}
body .drawer-menu-divider {
  display: none;
}
@media only screen and (max-width: 1500px) {
  body .header-drawer {
    position: fixed;
    top: 70px;
    width: 358px;
    height: 100vh;
    z-index: 100000;
    box-shadow: 0px 4px 8px rgba(0, 0, 0, 0.12);
    flex-direction: column;
  }
  body .header-drawer.active {
    display: flex;
  }
  body .header-drawer-toggle.btn {
    display: flex;
  }
  body .header-drawer .header-menu-items {
    flex-direction: column;
  }
  body .header-drawer-link-left {
    display: none;
  }
  body .header-drawer .header-link {
    padding: 8px 18px;
    border-top: 0;
    border-bottom: 0;
    border-left: 4px solid transparent;
  }
}
@media only screen and (max-width: 1160px) {
  body .header-drawer-link-left {
    display: block;
  }
  body .header-drawer .drawer-menu-divider {
    display: block;
    height: 1px;
    margin: 4px 12px;
  }
}
@media only screen and (max-width: 768px) {
  body .header-drawer {
    width: 100vw;
  }
  body .header-drawer .header-link {
    width: 100vw;
  }
}
body .header-drawer {
  display: none;
}
body .header-drawer-toggle.btn {
  display: none;
  min-width: 40px;
  height: 40px;
  padding: 8px;
  margin-right: 6px;
}
body .header-drawer-toggle.btn .dx-icon {
  font-size: 18px;
}
body .drawer-menu-divider {
  display: none;
}
@media only screen and (max-width: 1500px) {
  body .header-drawer {
    position: fixed;
    top: 70px;
    width: 358px;
    height: 100vh;
    z-index: 100000;
    box-shadow: 0px 4px 8px rgba(0, 0, 0, 0.12);
    flex-direction: column;
  }
  body .header-drawer.active {
    display: flex;
  }
  body .header-drawer-toggle.btn {
    display: flex;
  }
  body .header-drawer .header-menu-items {
    flex-direction: column;
  }
  body .header-drawer-link-left {
    display: none;
  }
  body .header-drawer .header-link {
    padding: 8px 18px;
    border-top: 0;
    border-bottom: 0;
    border-left: 4px solid transparent;
  }
}
@media only screen and (max-width: 1160px) {
  body .header-drawer-link-left {
    display: block;
  }
  body .header-drawer .drawer-menu-divider {
    display: block;
    height: 1px;
    margin: 4px 12px;
  }
}
@media only screen and (max-width: 768px) {
  body .header-drawer {
    width: 100vw;
  }
  body .header-drawer .header-link {
    width: 100vw;
  }
}
body .header.releases-has-news .badge-new {
  display: flex;
}
body .header.releases-has-news .blog-link .badge-new {
  display: none;
}
body .header .badge-new,
body .header-drawer .badge-new,
body .header .indicator-new,
body .header-drawer .indicator-new {
  display: none;
}
body .header.whats-new-has-news .whats-new-menu-item .badge-new,
body .header-drawer.whats-new-has-news .whats-new-menu-item .badge-new,
body .header.whats-new-has-news .whats-new-menu-item .indicator-new,
body .header-drawer.whats-new-has-news .whats-new-menu-item .indicator-new {
  display: flex;
}
body .header.roadmap-has-news .roadmap-menu-item .badge-new,
body .header-drawer.roadmap-has-news .roadmap-menu-item .badge-new,
body .header.roadmap-has-news .roadmap-menu-item .indicator-new,
body .header-drawer.roadmap-has-news .roadmap-menu-item .indicator-new {
  display: flex;
}
body header .header {
  position: fixed;
  z-index: 1500;
  width: 100%;
  height: 70px;
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.08);
}
body .header-logo {
  position: relative;
  text-decoration: none !important;
  display: flex;
  gap: 12px;
  align-items: center;
}
body .header-container {
  max-width: 1900px;
  height: inherit;
  padding-top: 0;
  padding-bottom: 0;
  display: flex;
  justify-content: space-between;
}
body .header-group {
  display: flex;
  align-items: center;
  gap: 40px;
}
body .header-group-logo {
  display: flex;
  align-items: center;
  gap: 4px;
}
body .header-menu-items {
  padding: 0;
  display: flex;
  gap: 0 12px;
}
body .header-menu-item {
  list-style: none;
}
body .header-menu-item .header-menu-list {
  z-index: 100001;
  box-sizing: border-box;
  display: none;
  box-shadow: 0 2px 8px 0 rgba(0, 0, 0, 0.12), 0 1px 2px 0 rgba(0, 0, 0, 0.06);
  border-radius: 8px;
  flex-direction: column;
  position: fixed;
  padding: 4px;
  gap: 2px;
}
body .header-menu-item .header-menu-list.active {
  display: flex;
}
body .header-menu-item .header-menu-list-item {
  border-radius: 4px;
  display: flex;
  align-items: center;
  box-sizing: border-box;
  height: 40px;
  padding: 8px 8px 8px 12px;
  text-align: left;
  text-decoration: none !important;
}
body .header-menu-item .header-menu-list-item-content {
  flex: 1;
}
body .header-menu-item .header-menu-list-item .indicator-new {
  margin-left: 8px;
}
body .header-menu-item .header-menu-list {
  z-index: 100001;
  box-sizing: border-box;
  display: none;
  box-shadow: 0 2px 8px 0 rgba(0, 0, 0, 0.12), 0 1px 2px 0 rgba(0, 0, 0, 0.06);
  border-radius: 8px;
  flex-direction: column;
  position: fixed;
  padding: 4px;
  gap: 2px;
}
body .header-menu-item .header-menu-list.active {
  display: flex;
}
body .header-menu-item .header-menu-list-item {
  border-radius: 4px;
  display: flex;
  align-items: center;
  box-sizing: border-box;
  height: 40px;
  padding: 8px 8px 8px 12px;
  text-align: left;
  text-decoration: none !important;
}
body .header-menu-item .header-menu-list-item-content {
  flex: 1;
}
body .header-menu-item .header-menu-list-item .indicator-new {
  margin-left: 8px;
}
body .header-menu-item .header-menu-list {
  width: 144px;
}
body .header-link {
  cursor: pointer;
  display: flex;
  align-items: center;
  box-sizing: border-box;
  height: 70px;
  padding: 0 12px;
  text-decoration: none !important;
  font-size: 18px;
  font-weight: 500;
  line-height: 100%;
}
body .header-link .badge-new {
  margin-left: 8px;
}
body .header-link.header-menu-button {
  border: none;
  position: relative;
}
body .header-link.header-menu-button .badge-new {
  margin-left: 4px;
}
body .header-buttons {
  display: inline-flex;
  gap: 10px;
}
body .header-button.btn {
  min-width: 150px;
  height: 44px;
  margin-bottom: 6px;
}
body .header-button.btn svg {
  height: 18px;
  width: 18px;
}
@media only screen and (min-width: 2000px) {
  body .header-container {
    padding-left: 24px;
    padding-right: 0;
  }
}
@media only screen and (max-width: 2000px) {
  body .header-container {
    padding-left: 24px;
    padding-right: 24px;
  }
}
@media only screen and (max-width: 1500px) {
  body .header-container {
    padding-right: 18px;
    padding-left: 18px;
  }
  body .header-container-right .header-menu-items {
    display: none;
  }
}
@media only screen and (max-width: 1160px) {
  body .header-container-left .header-menu-items {
    display: none;
  }
}
@media only screen and (max-width: 768px) {
  body .header-button.btn {
    min-width: 50px;
    height: 50px;
    padding: 14px;
  }
  body .header-button.btn span {
    display: none;
  }
  body .header-button.btn[title='Download'] {
    display: none;
  }
  body .header-logo-template {
    display: none;
  }
}
body.dx-swatch-dark header svg#devextreme-logo path {
  fill: white;
}
body .header-approach-selected {
  min-width: auto;
  padding: 0 8px 2px 8px;
  margin-bottom: 12px;
  font-size: 26px;
  line-height: 100%;
  font-weight: 700;
  font-stretch: 75%;
  font-family: 'Open Sans', sans-serif;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  border: 0;
  border-radius: 40px;
  cursor: pointer;
}
body .header-approach-selected::after {
  content: ' ';
  margin-top: 6px;
  transition: transform 0.4s;
}
body .header-approach-selected:focus {
  outline-color: initial;
  outline-style: solid;
  outline-width: 2px;
}
body .header-approach-list {
  z-index: 100001;
  box-sizing: border-box;
  display: none;
  box-shadow: 0 2px 8px 0 rgba(0, 0, 0, 0.12), 0 1px 2px 0 rgba(0, 0, 0, 0.06);
  border-radius: 8px;
  flex-direction: column;
  position: fixed;
  padding: 4px;
  gap: 2px;
}
body .header-approach-list.active {
  display: flex;
}
body .header-approach-list-item {
  border-radius: 4px;
  display: flex;
  align-items: center;
  box-sizing: border-box;
  height: 40px;
  padding: 8px 8px 8px 12px;
  text-align: left;
  text-decoration: none !important;
}
body .header-approach-list-item-content {
  flex: 1;
}
body .header-approach-list-item .indicator-new {
  margin-left: 8px;
}
body .header-approach-list {
  z-index: 100001;
  box-sizing: border-box;
  display: none;
  box-shadow: 0 2px 8px 0 rgba(0, 0, 0, 0.12), 0 1px 2px 0 rgba(0, 0, 0, 0.06);
  border-radius: 8px;
  flex-direction: column;
  position: fixed;
  padding: 4px;
  gap: 2px;
}
body .header-approach-list.active {
  display: flex;
}
body .header-approach-list-item {
  border-radius: 4px;
  display: flex;
  align-items: center;
  box-sizing: border-box;
  height: 40px;
  padding: 8px 8px 8px 12px;
  text-align: left;
  text-decoration: none !important;
}
body .header-approach-list-item-content {
  flex: 1;
}
body .header-approach-list-item .indicator-new {
  margin-left: 8px;
}
body .header-approach-list {
  width: 170px;
}
body .header-approach-selected {
  min-width: auto;
  padding: 0 8px 2px 8px;
  margin-bottom: 12px;
  font-size: 26px;
  line-height: 100%;
  font-weight: 700;
  font-stretch: 75%;
  font-family: 'Open Sans', sans-serif;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  border: 0;
  border-radius: 40px;
  cursor: pointer;
}
body .header-approach-selected::after {
  content: ' ';
  margin-top: 6px;
  transition: transform 0.4s;
}
body .header-approach-selected:focus {
  outline-color: initial;
  outline-style: solid;
  outline-width: 2px;
}
body .header-approach-list {
  z-index: 100001;
  box-sizing: border-box;
  display: none;
  box-shadow: 0 2px 8px 0 rgba(0, 0, 0, 0.12), 0 1px 2px 0 rgba(0, 0, 0, 0.06);
  border-radius: 8px;
  flex-direction: column;
  position: fixed;
  padding: 4px;
  gap: 2px;
}
body .header-approach-list.active {
  display: flex;
}
body .header-approach-list-item {
  border-radius: 4px;
  display: flex;
  align-items: center;
  box-sizing: border-box;
  height: 40px;
  padding: 8px 8px 8px 12px;
  text-align: left;
  text-decoration: none !important;
}
body .header-approach-list-item-content {
  flex: 1;
}
body .header-approach-list-item .indicator-new {
  margin-left: 8px;
}
body .header-approach-list {
  z-index: 100001;
  box-sizing: border-box;
  display: none;
  box-shadow: 0 2px 8px 0 rgba(0, 0, 0, 0.12), 0 1px 2px 0 rgba(0, 0, 0, 0.06);
  border-radius: 8px;
  flex-direction: column;
  position: fixed;
  padding: 4px;
  gap: 2px;
}
body .header-approach-list.active {
  display: flex;
}
body .header-approach-list-item {
  border-radius: 4px;
  display: flex;
  align-items: center;
  box-sizing: border-box;
  height: 40px;
  padding: 8px 8px 8px 12px;
  text-align: left;
  text-decoration: none !important;
}
body .header-approach-list-item-content {
  flex: 1;
}
body .header-approach-list-item .indicator-new {
  margin-left: 8px;
}
body .header-approach-list {
  width: 170px;
}
body .header-drawer {
  display: none;
}
body .header-drawer-toggle.btn {
  display: none;
  min-width: 40px;
  height: 40px;
  padding: 8px;
  margin-right: 6px;
}
body .header-drawer-toggle.btn .dx-icon {
  font-size: 18px;
}
body .drawer-menu-divider {
  display: none;
}
@media only screen and (max-width: 1500px) {
  body .header-drawer {
    position: fixed;
    top: 70px;
    width: 358px;
    height: 100vh;
    z-index: 100000;
    box-shadow: 0px 4px 8px rgba(0, 0, 0, 0.12);
    flex-direction: column;
  }
  body .header-drawer.active {
    display: flex;
  }
  body .header-drawer-toggle.btn {
    display: flex;
  }
  body .header-drawer .header-menu-items {
    flex-direction: column;
  }
  body .header-drawer-link-left {
    display: none;
  }
  body .header-drawer .header-link {
    padding: 8px 18px;
    border-top: 0;
    border-bottom: 0;
    border-left: 4px solid transparent;
  }
}
@media only screen and (max-width: 1160px) {
  body .header-drawer-link-left {
    display: block;
  }
  body .header-drawer .drawer-menu-divider {
    display: block;
    height: 1px;
    margin: 4px 12px;
  }
}
@media only screen and (max-width: 768px) {
  body .header-drawer {
    width: 100vw;
  }
  body .header-drawer .header-link {
    width: 100vw;
  }
}
body .header-drawer {
  display: none;
}
body .header-drawer-toggle.btn {
  display: none;
  min-width: 40px;
  height: 40px;
  padding: 8px;
  margin-right: 6px;
}
body .header-drawer-toggle.btn .dx-icon {
  font-size: 18px;
}
body .drawer-menu-divider {
  display: none;
}
@media only screen and (max-width: 1500px) {
  body .header-drawer {
    position: fixed;
    top: 70px;
    width: 358px;
    height: 100vh;
    z-index: 100000;
    box-shadow: 0px 4px 8px rgba(0, 0, 0, 0.12);
    flex-direction: column;
  }
  body .header-drawer.active {
    display: flex;
  }
  body .header-drawer-toggle.btn {
    display: flex;
  }
  body .header-drawer .header-menu-items {
    flex-direction: column;
  }
  body .header-drawer-link-left {
    display: none;
  }
  body .header-drawer .header-link {
    padding: 8px 18px;
    border-top: 0;
    border-bottom: 0;
    border-left: 4px solid transparent;
  }
}
@media only screen and (max-width: 1160px) {
  body .header-drawer-link-left {
    display: block;
  }
  body .header-drawer .drawer-menu-divider {
    display: block;
    height: 1px;
    margin: 4px 12px;
  }
}
@media only screen and (max-width: 768px) {
  body .header-drawer {
    width: 100vw;
  }
  body .header-drawer .header-link {
    width: 100vw;
  }
}
body .header.releases-has-news .badge-new {
  display: flex;
}
body .header.releases-has-news .blog-link .badge-new {
  display: none;
}
body .header .badge-new,
body .header-drawer .badge-new,
body .header .indicator-new,
body .header-drawer .indicator-new {
  display: none;
}
body .header.whats-new-has-news .whats-new-menu-item .badge-new,
body .header-drawer.whats-new-has-news .whats-new-menu-item .badge-new,
body .header.whats-new-has-news .whats-new-menu-item .indicator-new,
body .header-drawer.whats-new-has-news .whats-new-menu-item .indicator-new {
  display: flex;
}
body .header.roadmap-has-news .roadmap-menu-item .badge-new,
body .header-drawer.roadmap-has-news .roadmap-menu-item .badge-new,
body .header.roadmap-has-news .roadmap-menu-item .indicator-new,
body .header-drawer.roadmap-has-news .roadmap-menu-item .indicator-new {
  display: flex;
}
body header .header {
  position: fixed;
  z-index: 1500;
  width: 100%;
  height: 70px;
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.08);
}
body .header-logo {
  position: relative;
  text-decoration: none !important;
  display: flex;
  gap: 12px;
  align-items: center;
}
body .header-container {
  max-width: 1900px;
  height: inherit;
  padding-top: 0;
  padding-bottom: 0;
  display: flex;
  justify-content: space-between;
}
body .header-group {
  display: flex;
  align-items: center;
  gap: 40px;
}
body .header-group-logo {
  display: flex;
  align-items: center;
  gap: 4px;
}
body .header-menu-items {
  padding: 0;
  display: flex;
  gap: 0 12px;
}
body .header-menu-item {
  list-style: none;
}
body .header-menu-item .header-menu-list {
  z-index: 100001;
  box-sizing: border-box;
  display: none;
  box-shadow: 0 2px 8px 0 rgba(0, 0, 0, 0.12), 0 1px 2px 0 rgba(0, 0, 0, 0.06);
  border-radius: 8px;
  flex-direction: column;
  position: fixed;
  padding: 4px;
  gap: 2px;
}
body .header-menu-item .header-menu-list.active {
  display: flex;
}
body .header-menu-item .header-menu-list-item {
  border-radius: 4px;
  display: flex;
  align-items: center;
  box-sizing: border-box;
  height: 40px;
  padding: 8px 8px 8px 12px;
  text-align: left;
  text-decoration: none !important;
}
body .header-menu-item .header-menu-list-item-content {
  flex: 1;
}
body .header-menu-item .header-menu-list-item .indicator-new {
  margin-left: 8px;
}
body .header-menu-item .header-menu-list {
  z-index: 100001;
  box-sizing: border-box;
  display: none;
  box-shadow: 0 2px 8px 0 rgba(0, 0, 0, 0.12), 0 1px 2px 0 rgba(0, 0, 0, 0.06);
  border-radius: 8px;
  flex-direction: column;
  position: fixed;
  padding: 4px;
  gap: 2px;
}
body .header-menu-item .header-menu-list.active {
  display: flex;
}
body .header-menu-item .header-menu-list-item {
  border-radius: 4px;
  display: flex;
  align-items: center;
  box-sizing: border-box;
  height: 40px;
  padding: 8px 8px 8px 12px;
  text-align: left;
  text-decoration: none !important;
}
body .header-menu-item .header-menu-list-item-content {
  flex: 1;
}
body .header-menu-item .header-menu-list-item .indicator-new {
  margin-left: 8px;
}
body .header-menu-item .header-menu-list {
  width: 144px;
}
body .header-link {
  cursor: pointer;
  display: flex;
  align-items: center;
  box-sizing: border-box;
  height: 70px;
  padding: 0 12px;
  text-decoration: none !important;
  font-size: 18px;
  font-weight: 500;
  line-height: 100%;
}
body .header-link .badge-new {
  margin-left: 8px;
}
body .header-link.header-menu-button {
  border: none;
  position: relative;
}
body .header-link.header-menu-button .badge-new {
  margin-left: 4px;
}
body .header-buttons {
  display: inline-flex;
  gap: 10px;
}
body .header-button.btn {
  min-width: 150px;
  height: 44px;
  margin-bottom: 6px;
}
body .header-button.btn svg {
  height: 18px;
  width: 18px;
}
@media only screen and (min-width: 2000px) {
  body .header-container {
    padding-left: 24px;
    padding-right: 0;
  }
}
@media only screen and (max-width: 2000px) {
  body .header-container {
    padding-left: 24px;
    padding-right: 24px;
  }
}
@media only screen and (max-width: 1500px) {
  body .header-container {
    padding-right: 18px;
    padding-left: 18px;
  }
  body .header-container-right .header-menu-items {
    display: none;
  }
}
@media only screen and (max-width: 1160px) {
  body .header-container-left .header-menu-items {
    display: none;
  }
}
@media only screen and (max-width: 768px) {
  body .header-button.btn {
    min-width: 50px;
    height: 50px;
    padding: 14px;
  }
  body .header-button.btn span {
    display: none;
  }
  body .header-button.btn[title='Download'] {
    display: none;
  }
  body .header-logo-template {
    display: none;
  }
}
body.dx-swatch-dark header svg#devextreme-logo path {
  fill: white;
}
body #menu {
  top: 70px;
  height: 40px;
  width: 100%;
  position: fixed;
  z-index: 3;
  left: 0;
}
body #menu .menu-wrapper {
  height: inherit;
  padding-top: 0;
  padding-bottom: 0;
  display: flex;
  gap: 15px;
}
body #menu .menu-state-button {
  flex: 0 0 40px;
  margin-left: 340px;
  cursor: pointer;
  display: flex;
  justify-content: center;
}
body #menu .breadcrumbs-svg {
  min-width: 20px;
  max-width: 20px;
  height: inherit;
  padding-right: 6px;
}
body #menu .tools-panel {
  height: inherit;
  padding-right: 16px;
  width: 100%;
  display: flex;
  justify-content: space-between;
  gap: 15px;
}
body #menu .tools-panel .menu-dropdown-toogle {
  display: none;
}
body #menu .tools-panel .breadcrumbs {
  min-width: 230px;
  height: 40px;
  min-width: 260px;
  width: 50%;
  white-space: nowrap;
  text-overflow: ellipsis;
}
body #menu .tools-panel .breadcrumbs a:not([href]) {
  opacity: 0.6;
}
body #menu .tools-panel .breadcrumbs a[href] {
  text-decoration: underline;
}
body #menu .tools-panel .breadcrumbs .breadcrumbs-wrapper,
body #menu .tools-panel .breadcrumbs nav {
  height: inherit;
  padding: 0;
  display: inline-flex;
  align-items: center;
  list-style: none;
  position: absolute;
}
body #menu .tools-panel .breadcrumbs .breadcrumbs-wrapper li,
body #menu .tools-panel .breadcrumbs nav li {
  display: inline-block;
  padding-left: 2px;
}
body #menu .tools-panel .breadcrumbs .breadcrumbs-wrapper li.crumb,
body #menu .tools-panel .breadcrumbs nav li.crumb {
  visibility: hidden;
}
body #menu .tools-panel .breadcrumbs .breadcrumbs-wrapper li.crumb.no-hide,
body #menu .tools-panel .breadcrumbs nav li.crumb.no-hide {
  visibility: visible;
}
body #menu .tools-panel .breadcrumbs .breadcrumbs-wrapper li a,
body #menu .tools-panel .breadcrumbs nav li a,
body #menu .tools-panel .breadcrumbs .breadcrumbs-wrapper li span,
body #menu .tools-panel .breadcrumbs nav li span {
  padding: 0 1px;
  display: inline-block;
  font-weight: 400;
}
body #menu .tools-panel .breadcrumbs .breadcrumbs-wrapper li span,
body #menu .tools-panel .breadcrumbs nav li span {
  opacity: 0.5;
}
body #menu .tools-panel .breadcrumbs .breadcrumbs-wrapper li:not(:first-child)::before,
body #menu .tools-panel .breadcrumbs nav li:not(:first-child)::before {
  content: "\2192";
  padding: 0 4px;
}
body #menu .tools-panel .breadcrumbs .breadcrumbs-wrapper li.hidden,
body #menu .tools-panel .breadcrumbs nav li.hidden {
  display: none;
}
body #menu .tools-panel .breadcrumbs .breadcrumbs-wrapper li.hint,
body #menu .tools-panel .breadcrumbs nav li.hint {
  cursor: pointer;
  text-align: center;
}
body #menu .tools-panel .breadcrumbs .breadcrumbs-wrapper li.hint span,
body #menu .tools-panel .breadcrumbs nav li.hint span {
  width: 30px;
  font-size: 18px;
  font-weight: bold;
  position: relative;
  top: -3px;
  padding: 11px 0;
  margin-left: 4px;
}
body #menu .tools-panel .breadcrumbs .breadcrumbs-wrapper li.hint.active span,
body #menu .tools-panel .breadcrumbs nav li.hint.active span {
  opacity: 1;
}
body #menu .tools-panel .breadcrumbs-dropdown {
  display: none;
}
body #menu .tools-panel .breadcrumbs-dropdown.active {
  display: flex;
  align-items: center;
  top: 40px;
  left: 0;
  height: 40px;
  width: 100%;
  position: absolute;
  list-style: none;
}
body #menu .tools-panel .breadcrumbs-dropdown.active ul {
  display: block;
  padding-left: 400px;
}
body #menu .tools-panel .breadcrumbs-dropdown.active ul li {
  display: inline-block;
  padding: 2px 0;
}
body #menu .tools-panel .breadcrumbs-dropdown.active ul li a {
  text-decoration: underline;
  font-weight: normal;
}
body #menu .tools-panel .breadcrumbs-dropdown.active ul li:not(:last-child):after {
  content: "\2192";
  margin: 0 4px;
}
body #menu .tools-panel .tools-items {
  height: 40px;
  display: flex;
  gap: 0 16px;
  align-items: center;
}
body #menu .tools-panel .tools-items.toggle-button {
  display: none;
}
body #menu .tools-panel .tools-items .filter-item.toggle-button.search {
  display: none;
}
body.hidden-menu #menu .tools-panel .breadcrumbs-dropdown.active ul {
  padding-left: 100px;
}
body #menu {
  top: 70px;
  height: 40px;
  width: 100%;
  position: fixed;
  z-index: 3;
  left: 0;
}
body #menu .menu-wrapper {
  height: inherit;
  padding-top: 0;
  padding-bottom: 0;
  display: flex;
  gap: 15px;
}
body #menu .menu-state-button {
  flex: 0 0 40px;
  margin-left: 340px;
  cursor: pointer;
  display: flex;
  justify-content: center;
}
body #menu .breadcrumbs-svg {
  min-width: 20px;
  max-width: 20px;
  height: inherit;
  padding-right: 6px;
}
body #menu .tools-panel {
  height: inherit;
  padding-right: 16px;
  width: 100%;
  display: flex;
  justify-content: space-between;
  gap: 15px;
}
body #menu .tools-panel .menu-dropdown-toogle {
  display: none;
}
body #menu .tools-panel .breadcrumbs {
  min-width: 230px;
  height: 40px;
  min-width: 260px;
  width: 50%;
  white-space: nowrap;
  text-overflow: ellipsis;
}
body #menu .tools-panel .breadcrumbs a:not([href]) {
  opacity: 0.6;
}
body #menu .tools-panel .breadcrumbs a[href] {
  text-decoration: underline;
}
body #menu .tools-panel .breadcrumbs .breadcrumbs-wrapper,
body #menu .tools-panel .breadcrumbs nav {
  height: inherit;
  padding: 0;
  display: inline-flex;
  align-items: center;
  list-style: none;
  position: absolute;
}
body #menu .tools-panel .breadcrumbs .breadcrumbs-wrapper li,
body #menu .tools-panel .breadcrumbs nav li {
  display: inline-block;
  padding-left: 2px;
}
body #menu .tools-panel .breadcrumbs .breadcrumbs-wrapper li.crumb,
body #menu .tools-panel .breadcrumbs nav li.crumb {
  visibility: hidden;
}
body #menu .tools-panel .breadcrumbs .breadcrumbs-wrapper li.crumb.no-hide,
body #menu .tools-panel .breadcrumbs nav li.crumb.no-hide {
  visibility: visible;
}
body #menu .tools-panel .breadcrumbs .breadcrumbs-wrapper li a,
body #menu .tools-panel .breadcrumbs nav li a,
body #menu .tools-panel .breadcrumbs .breadcrumbs-wrapper li span,
body #menu .tools-panel .breadcrumbs nav li span {
  padding: 0 1px;
  display: inline-block;
  font-weight: 400;
}
body #menu .tools-panel .breadcrumbs .breadcrumbs-wrapper li span,
body #menu .tools-panel .breadcrumbs nav li span {
  opacity: 0.5;
}
body #menu .tools-panel .breadcrumbs .breadcrumbs-wrapper li:not(:first-child)::before,
body #menu .tools-panel .breadcrumbs nav li:not(:first-child)::before {
  content: "\2192";
  padding: 0 4px;
}
body #menu .tools-panel .breadcrumbs .breadcrumbs-wrapper li.hidden,
body #menu .tools-panel .breadcrumbs nav li.hidden {
  display: none;
}
body #menu .tools-panel .breadcrumbs .breadcrumbs-wrapper li.hint,
body #menu .tools-panel .breadcrumbs nav li.hint {
  cursor: pointer;
  text-align: center;
}
body #menu .tools-panel .breadcrumbs .breadcrumbs-wrapper li.hint span,
body #menu .tools-panel .breadcrumbs nav li.hint span {
  width: 30px;
  font-size: 18px;
  font-weight: bold;
  position: relative;
  top: -3px;
  padding: 11px 0;
  margin-left: 4px;
}
body #menu .tools-panel .breadcrumbs .breadcrumbs-wrapper li.hint.active span,
body #menu .tools-panel .breadcrumbs nav li.hint.active span {
  opacity: 1;
}
body #menu .tools-panel .breadcrumbs-dropdown {
  display: none;
}
body #menu .tools-panel .breadcrumbs-dropdown.active {
  display: flex;
  align-items: center;
  top: 40px;
  left: 0;
  height: 40px;
  width: 100%;
  position: absolute;
  list-style: none;
}
body #menu .tools-panel .breadcrumbs-dropdown.active ul {
  display: block;
  padding-left: 400px;
}
body #menu .tools-panel .breadcrumbs-dropdown.active ul li {
  display: inline-block;
  padding: 2px 0;
}
body #menu .tools-panel .breadcrumbs-dropdown.active ul li a {
  text-decoration: underline;
  font-weight: normal;
}
body #menu .tools-panel .breadcrumbs-dropdown.active ul li:not(:last-child):after {
  content: "\2192";
  margin: 0 4px;
}
body #menu .tools-panel .tools-items {
  height: 40px;
  display: flex;
  gap: 0 16px;
  align-items: center;
}
body #menu .tools-panel .tools-items.toggle-button {
  display: none;
}
body #menu .tools-panel .tools-items .filter-item.toggle-button.search {
  display: none;
}
body.hidden-menu #menu .tools-panel .breadcrumbs-dropdown.active ul {
  padding-left: 100px;
}
body .left-menu {
  -webkit-backface-visibility: hidden;
  -moz-backface-visibility: hidden;
  backface-visibility: hidden;
  position: fixed;
  z-index: 4;
  top: 110px;
  bottom: 0;
  width: 340px;
}
body .left-menu div.search {
  display: flex;
  align-items: baseline;
  padding-left: 23px;
}
body .left-menu div.search .left-menu-filter {
  flex: 1;
}
body .left-menu::after {
  content: '';
  position: absolute;
  top: -40px;
  right: 0;
  width: 1px;
  height: 100vh;
  z-index: -1;
}
body .left-menu > div:not(.left-menu-filter-wrapper) {
  box-sizing: border-box;
}
body .left-menu a {
  font-weight: 400;
  text-decoration: none;
}
body .left-menu a:focus-visible {
  outline-offset: -2px;
}
body .left-menu .left-menu-filter-wrapper {
  position: absolute;
  height: 40px;
  top: -40px;
  width: 100%;
  z-index: 1;
}
body .left-menu .left-menu-filter-wrapper .dx-icon-search {
  font-size: 16px;
}
body .left-menu .left-menu-filter-wrapper .left-menu-filter {
  width: 340px;
  height: 40px;
  padding-left: 8px;
}
body .left-menu .left-menu-filter-wrapper .left-menu-filter .dx-placeholder {
  font-size: 16px;
}
body .left-menu .left-menu-filter-wrapper .left-menu-filter .dx-placeholder:before {
  padding: 0;
}
body .left-menu .left-menu-filter-wrapper .left-menu-filter.dx-texteditor.dx-editor-outlined {
  border: none;
}
body .left-menu .left-menu-filter-wrapper .left-menu-filter.dx-texteditor .dx-texteditor-input {
  margin-right: 25px;
  padding: 12px 30px 12px 0;
  border-radius: 0;
}
body .left-menu .left-menu-filter-wrapper .left-menu-filter.dx-texteditor .dx-texteditor-buttons-container {
  position: absolute;
}
body .left-menu .left-menu-filter-wrapper .left-menu-filter.dx-texteditor .dx-texteditor-buttons-container .dx-icon-clear {
  top: 20px;
  left: 260px;
}
body .left-menu .widgets-menu {
  height: 100%;
}
body .left-menu .widgets-menu .site-search-suggestion {
  display: none;
  margin: 20px 20px 40px 25px;
  font-size: 15px;
}
body .left-menu .widgets-menu .hidden {
  display: none;
}
body .left-menu .widgets-menu.filter-empty .site-search-suggestion {
  display: block;
}
body .left-menu .widgets-menu.filter-empty > ul {
  display: none;
}
body .left-menu .widgets-menu ul {
  list-style: none;
  padding-left: 0;
}
body .left-menu .widgets-menu ul.first-level-list,
body .left-menu .widgets-menu ul.equivalents {
  padding-left: 0;
}
body .left-menu .widgets-menu ul.first-level-list > li.category > .first-level,
body .left-menu .widgets-menu ul.equivalents > li.category > .first-level {
  padding: 12px 12px 12px 24px;
}
body .left-menu .widgets-menu ul.first-level-list > li.category > ul,
body .left-menu .widgets-menu ul.equivalents > li.category > ul {
  padding: 8px 0;
}
body .left-menu .widgets-menu ul.first-level-list > li.category.Updated > .first-level .link-text:after,
body .left-menu .widgets-menu ul.equivalents > li.category.Updated > .first-level .link-text:after,
body .left-menu .widgets-menu ul.first-level-list > li.category.New > .first-level .link-text:after,
body .left-menu .widgets-menu ul.equivalents > li.category.New > .first-level .link-text:after,
body .left-menu .widgets-menu ul.first-level-list > li.category.Roadmap > .first-level .link-text:after,
body .left-menu .widgets-menu ul.equivalents > li.category.Roadmap > .first-level .link-text:after {
  display: none;
}
body .left-menu .widgets-menu ul.first-level-list > li.category > ul,
body .left-menu .widgets-menu ul.equivalents > li.category > ul {
  padding-left: 0;
}
body .left-menu .widgets-menu ul li:not(.category) .group-name {
  padding: 8px 12px 8px 20px;
}
body .left-menu .widgets-menu ul li:not(.category) .ajax-link {
  padding: 8px 12px 8px 46px;
}
body .left-menu .widgets-menu ul li:not(.category) li .group-name {
  padding-left: 40px;
}
body .left-menu .widgets-menu ul li:not(.category) li .ajax-link {
  padding-left: 66px;
}
body .left-menu .widgets-menu ul li:not(.category) li li .group-name {
  padding-left: 56px;
}
body .left-menu .widgets-menu ul li:not(.category) li li .ajax-link {
  padding-left: 82px;
}
body .left-menu .widgets-menu ul li:not(.category) li li li .group-name {
  padding-left: 72px;
}
body .left-menu .widgets-menu ul li:not(.category) li li li .ajax-link {
  padding-left: 98px;
}
body .left-menu .widgets-menu ul li .first-level {
  font-weight: 700;
  font-size: 16px;
  line-height: 24px;
}
body .left-menu .widgets-menu ul li .first-level::after {
  content: '';
  position: absolute;
  height: 0;
  bottom: 0;
  right: 12px;
  left: 24px;
  border-bottom-width: 1px;
  border-bottom-style: solid;
}
body .left-menu .widgets-menu ul li .first-level,
body .left-menu .widgets-menu ul li .ajax-link,
body .left-menu .widgets-menu ul li .group-name {
  cursor: pointer;
  line-height: 16px;
  height: 16px;
  position: relative;
  display: inline-flex;
  align-items: center;
  gap: 6px;
  width: -moz-available;
  width: -webkit-fill-available;
}
body .left-menu .widgets-menu ul li .first-level::before,
body .left-menu .widgets-menu ul li .ajax-link::before,
body .left-menu .widgets-menu ul li .group-name::before {
  transition: transform 0.2s;
  position: absolute;
  left: 0;
}
body .left-menu .widgets-menu ul li .first-level .expander,
body .left-menu .widgets-menu ul li .ajax-link .expander,
body .left-menu .widgets-menu ul li .group-name .expander {
  flex: 0;
  height: 24px;
}
body .left-menu .widgets-menu ul li .first-level:focus-visible,
body .left-menu .widgets-menu ul li .group-name:focus-visible {
  outline-offset: -3px;
}
body .left-menu .widgets-menu ul li .ajax-link,
body .left-menu .widgets-menu ul li .group-name {
  font-size: 15px;
}
body .left-menu .widgets-menu ul li > ul {
  display: none;
}
body .left-menu .widgets-menu ul li.opened > ul {
  display: block;
}
body .left-menu .widgets-menu ul .category.hidden {
  display: none;
}
body .left-menu .widgets-menu ul .category .link-text:after {
  position: absolute;
  right: 12px;
  display: inline-block;
  color: white;
  font-size: 14px;
  line-height: 20px;
  height: 20px;
  font-weight: 500;
  padding: 0 6px;
  margin-left: 6px;
  border-radius: 50px;
  text-decoration: none;
}
body .left-menu .widgets-menu ul .category.Updated .link-text:after,
body .left-menu .widgets-menu ul .category .Updated .link-text:after {
  content: "Upd";
  background-color: #42b883;
}
body .left-menu .widgets-menu ul .category.New .link-text:after,
body .left-menu .widgets-menu ul .category .New .link-text:after {
  content: "New";
  background-color: #dd1144;
}
body .left-menu .widgets-menu ul .category.Roadmap .link-text:after,
body .left-menu .widgets-menu ul .category .Roadmap .link-text:after {
  content: "In Progress";
  background-color: #ff9000;
}
body .left-menu .widgets-menu ul .category > ul {
  display: none;
}
body .left-menu .widgets-menu ul .category > ul .api-section {
  list-style: none;
}
body .left-menu .widgets-menu ul .api-section.None .link-text::after,
body .left-menu .widgets-menu ul .ajax-link.None .link-text::after {
  display: none;
}
body .left-menu .widgets-menu div.equivalents {
  margin: 20px 24px 0;
}
body .left-menu .widgets-menu ul.equivalent {
  margin: 20px 0;
}
body .left-menu .widgets-menu .equivalents-header {
  margin: 0 24px;
  padding-top: 12px;
}
body .left-menu .widgets-menu .equivalents-header.second {
  border-top: solid 1px;
}
body .left-menu {
  -webkit-backface-visibility: hidden;
  -moz-backface-visibility: hidden;
  backface-visibility: hidden;
  position: fixed;
  z-index: 4;
  top: 110px;
  bottom: 0;
  width: 340px;
}
body .left-menu div.search {
  display: flex;
  align-items: baseline;
  padding-left: 23px;
}
body .left-menu div.search .left-menu-filter {
  flex: 1;
}
body .left-menu::after {
  content: '';
  position: absolute;
  top: -40px;
  right: 0;
  width: 1px;
  height: 100vh;
  z-index: -1;
}
body .left-menu > div:not(.left-menu-filter-wrapper) {
  box-sizing: border-box;
}
body .left-menu a {
  font-weight: 400;
  text-decoration: none;
}
body .left-menu a:focus-visible {
  outline-offset: -2px;
}
body .left-menu .left-menu-filter-wrapper {
  position: absolute;
  height: 40px;
  top: -40px;
  width: 100%;
  z-index: 1;
}
body .left-menu .left-menu-filter-wrapper .dx-icon-search {
  font-size: 16px;
}
body .left-menu .left-menu-filter-wrapper .left-menu-filter {
  width: 340px;
  height: 40px;
  padding-left: 8px;
}
body .left-menu .left-menu-filter-wrapper .left-menu-filter .dx-placeholder {
  font-size: 16px;
}
body .left-menu .left-menu-filter-wrapper .left-menu-filter .dx-placeholder:before {
  padding: 0;
}
body .left-menu .left-menu-filter-wrapper .left-menu-filter.dx-texteditor.dx-editor-outlined {
  border: none;
}
body .left-menu .left-menu-filter-wrapper .left-menu-filter.dx-texteditor .dx-texteditor-input {
  margin-right: 25px;
  padding: 12px 30px 12px 0;
  border-radius: 0;
}
body .left-menu .left-menu-filter-wrapper .left-menu-filter.dx-texteditor .dx-texteditor-buttons-container {
  position: absolute;
}
body .left-menu .left-menu-filter-wrapper .left-menu-filter.dx-texteditor .dx-texteditor-buttons-container .dx-icon-clear {
  top: 20px;
  left: 260px;
}
body .left-menu .widgets-menu {
  height: 100%;
}
body .left-menu .widgets-menu .site-search-suggestion {
  display: none;
  margin: 20px 20px 40px 25px;
  font-size: 15px;
}
body .left-menu .widgets-menu .hidden {
  display: none;
}
body .left-menu .widgets-menu.filter-empty .site-search-suggestion {
  display: block;
}
body .left-menu .widgets-menu.filter-empty > ul {
  display: none;
}
body .left-menu .widgets-menu ul {
  list-style: none;
  padding-left: 0;
}
body .left-menu .widgets-menu ul.first-level-list,
body .left-menu .widgets-menu ul.equivalents {
  padding-left: 0;
}
body .left-menu .widgets-menu ul.first-level-list > li.category > .first-level,
body .left-menu .widgets-menu ul.equivalents > li.category > .first-level {
  padding: 12px 12px 12px 24px;
}
body .left-menu .widgets-menu ul.first-level-list > li.category > ul,
body .left-menu .widgets-menu ul.equivalents > li.category > ul {
  padding: 8px 0;
}
body .left-menu .widgets-menu ul.first-level-list > li.category.Updated > .first-level .link-text:after,
body .left-menu .widgets-menu ul.equivalents > li.category.Updated > .first-level .link-text:after,
body .left-menu .widgets-menu ul.first-level-list > li.category.New > .first-level .link-text:after,
body .left-menu .widgets-menu ul.equivalents > li.category.New > .first-level .link-text:after,
body .left-menu .widgets-menu ul.first-level-list > li.category.Roadmap > .first-level .link-text:after,
body .left-menu .widgets-menu ul.equivalents > li.category.Roadmap > .first-level .link-text:after {
  display: none;
}
body .left-menu .widgets-menu ul.first-level-list > li.category > ul,
body .left-menu .widgets-menu ul.equivalents > li.category > ul {
  padding-left: 0;
}
body .left-menu .widgets-menu ul li:not(.category) .group-name {
  padding: 8px 12px 8px 20px;
}
body .left-menu .widgets-menu ul li:not(.category) .ajax-link {
  padding: 8px 12px 8px 46px;
}
body .left-menu .widgets-menu ul li:not(.category) li .group-name {
  padding-left: 40px;
}
body .left-menu .widgets-menu ul li:not(.category) li .ajax-link {
  padding-left: 66px;
}
body .left-menu .widgets-menu ul li:not(.category) li li .group-name {
  padding-left: 56px;
}
body .left-menu .widgets-menu ul li:not(.category) li li .ajax-link {
  padding-left: 82px;
}
body .left-menu .widgets-menu ul li:not(.category) li li li .group-name {
  padding-left: 72px;
}
body .left-menu .widgets-menu ul li:not(.category) li li li .ajax-link {
  padding-left: 98px;
}
body .left-menu .widgets-menu ul li .first-level {
  font-weight: 700;
  font-size: 16px;
  line-height: 24px;
}
body .left-menu .widgets-menu ul li .first-level::after {
  content: '';
  position: absolute;
  height: 0;
  bottom: 0;
  right: 12px;
  left: 24px;
  border-bottom-width: 1px;
  border-bottom-style: solid;
}
body .left-menu .widgets-menu ul li .first-level,
body .left-menu .widgets-menu ul li .ajax-link,
body .left-menu .widgets-menu ul li .group-name {
  cursor: pointer;
  line-height: 16px;
  height: 16px;
  position: relative;
  display: inline-flex;
  align-items: center;
  gap: 6px;
  width: -moz-available;
  width: -webkit-fill-available;
}
body .left-menu .widgets-menu ul li .first-level::before,
body .left-menu .widgets-menu ul li .ajax-link::before,
body .left-menu .widgets-menu ul li .group-name::before {
  transition: transform 0.2s;
  position: absolute;
  left: 0;
}
body .left-menu .widgets-menu ul li .first-level .expander,
body .left-menu .widgets-menu ul li .ajax-link .expander,
body .left-menu .widgets-menu ul li .group-name .expander {
  flex: 0;
  height: 24px;
}
body .left-menu .widgets-menu ul li .first-level:focus-visible,
body .left-menu .widgets-menu ul li .group-name:focus-visible {
  outline-offset: -3px;
}
body .left-menu .widgets-menu ul li .ajax-link,
body .left-menu .widgets-menu ul li .group-name {
  font-size: 15px;
}
body .left-menu .widgets-menu ul li > ul {
  display: none;
}
body .left-menu .widgets-menu ul li.opened > ul {
  display: block;
}
body .left-menu .widgets-menu ul .category.hidden {
  display: none;
}
body .left-menu .widgets-menu ul .category .link-text:after {
  position: absolute;
  right: 12px;
  display: inline-block;
  color: white;
  font-size: 14px;
  line-height: 20px;
  height: 20px;
  font-weight: 500;
  padding: 0 6px;
  margin-left: 6px;
  border-radius: 50px;
  text-decoration: none;
}
body .left-menu .widgets-menu ul .category.Updated .link-text:after,
body .left-menu .widgets-menu ul .category .Updated .link-text:after {
  content: "Upd";
  background-color: #42b883;
}
body .left-menu .widgets-menu ul .category.New .link-text:after,
body .left-menu .widgets-menu ul .category .New .link-text:after {
  content: "New";
  background-color: #dd1144;
}
body .left-menu .widgets-menu ul .category.Roadmap .link-text:after,
body .left-menu .widgets-menu ul .category .Roadmap .link-text:after {
  content: "In Progress";
  background-color: #ff9000;
}
body .left-menu .widgets-menu ul .category > ul {
  display: none;
}
body .left-menu .widgets-menu ul .category > ul .api-section {
  list-style: none;
}
body .left-menu .widgets-menu ul .api-section.None .link-text::after,
body .left-menu .widgets-menu ul .ajax-link.None .link-text::after {
  display: none;
}
body .left-menu .widgets-menu div.equivalents {
  margin: 20px 24px 0;
}
body .left-menu .widgets-menu ul.equivalent {
  margin: 20px 0;
}
body .left-menu .widgets-menu .equivalents-header {
  margin: 0 24px;
  padding-top: 12px;
}
body .left-menu .widgets-menu .equivalents-header.second {
  border-top: solid 1px;
}
body.hidden-menu .widgets-menu-container {
  display: none;
}
body.hidden-menu .page-wrapper .doc-content {
  margin-left: 0;
}
body.hidden-menu .view-content {
  margin-left: 0;
}
body .body-container.content-width {
  padding-top: 70px;
}
body h1,
body h5 {
  font-family: 'Roboto', sans-serif;
  margin: 0;
}
body h2,
body h3,
body h4 {
  font-family: 'Roboto', sans-serif;
  margin: 0;
}
body h1 {
  font-weight: 700;
  font-size: 32px;
  padding: 0 0 16px 0;
}
body h2 {
  font-size: 24px;
  padding: 24px 0 12px 0;
}
body h3 {
  font-size: 20px;
  padding: 20px 0 10px 0;
}
body h4 {
  font-size: 20px;
  padding: 16px 0 8px 0;
}
body h5 {
  padding: 16px 0 8px 0;
}
body ul,
body li {
  margin: 0;
}
body .btn-text-overflow {
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
body .page-wrapper {
  position: relative;
  overflow: hidden;
  min-height: 100%;
  margin-bottom: -120px;
}
body .page-wrapper:after {
  content: '';
  display: block;
  height: 120px;
}
body .clear {
  clear: both;
}
body .dx-loadpanel-content {
  padding: 10px;
  border: 1px solid;
  text-align: center;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  -webkit-touch-callout: none;
  -webkit-user-drag: none;
  border-radius: 5px;
}
body .dx-overlay-wrapper.dx-loadpanel-wrapper {
  z-index: 1 !important;
}
body .dx-overlay-wrapper.dx-loadpanel-wrapper .dx-loadpanel-content.dx-loadpanel-pane-hidden {
  z-index: 1 !important;
}
body .dx-overlay-wrapper.dx-loadpanel-wrapper .dx-loadpanel-content.dx-loadpanel-pane-hidden .dx-loadindicator {
  width: 60px;
  height: 60px;
}
body .dx-overlay-wrapper.dx-loadpanel-wrapper .dx-loadpanel-content.dx-loadpanel-pane-hidden .dx-loadindicator .dx-loadindicator-icon .dx-loadindicator-segment {
  background: #7d8793;
}
body .dx-overlay-wrapper.dx-loadpanel-wrapper .dx-loadpanel-content.dx-loadpanel-pane-hidden .dx-loadpanel-message {
  color: #7d8793;
  font-size: 15px;
  line-height: 21px;
  margin-top: 10px;
}
body .whats-new-subpanel-container .space {
  display: none;
}
body .background-block p {
  font-size: 16px;
  line-height: 24px;
}
body .full-screen-demo .content .doc-content {
  display: none;
}
body .content {
  padding-top: 40px;
}
body .content .doc-content {
  width: auto;
  margin-left: 340px;
  margin-right: auto;
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  padding: 32px 40px;
}
body .content .doc-content.index {
  display: flex;
  flex-flow: column;
  gap: 40px;
}
body .content .doc-content.index p {
  margin: 0;
}
body .content .doc-content.index h1.page-title {
  padding: 0 0 16px 0;
}
body .content .doc-content.index h3.block-title {
  padding: 0;
}
body .content .doc-content.index h3.block-title + p {
  padding: 16px 0 0 0;
}
body .content .doc-content.index .page-block-header {
  padding: 0 0 40px 0;
}
body .content .doc-content.index .components-list-page-block .page-block-header {
  padding: 0;
}
body .content .doc-content.index .featured-components-container {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  gap: 20px;
  margin: 0;
}
body .content .doc-content.index .featured-components-container .component-container {
  padding: 8px;
  width: 120px;
  box-sizing: border-box;
  border-radius: 8px;
  display: flex;
  align-items: center;
  flex-direction: column;
  gap: 12px;
}
body .content .doc-content.index .featured-components-container .component-container .component-icon {
  width: 64px;
  height: 64px;
}
body .content .doc-content.index .featured-components-container .component-container .component-link {
  font-weight: normal;
  font-size: 16px;
  line-height: 24px;
  text-align: center;
}
body .content .doc-content.index .components-list-container {
  column-width: 200px;
  margin: 8px 0 32px 0;
}
body .content .doc-content.index .components-list-container .category-container {
  padding-top: 32px;
  break-inside: avoid;
  min-width: 200px;
}
body .content .doc-content.index .components-list-container .category-container .category-title {
  font-weight: 700;
  font-size: 14px;
  line-height: 20px;
  margin-bottom: 8px;
}
body .content .doc-content.index .components-list-container .category-container .demos-list {
  display: flex;
  flex-flow: column;
  gap: 8px;
}
body .content .doc-content.index .components-list-container .category-container .demos-list .link-container a {
  line-height: 20px;
  text-decoration: underline;
}
body .content .doc-content.index .components-list-container .category-container .demos-list .link-container:after {
  display: inline-block;
  color: white;
  font-size: 14px;
  line-height: 20px;
  height: 20px;
  font-weight: 500;
  padding: 0 6px;
  margin-left: 6px;
  border-radius: 50px;
  text-decoration: none;
}
body .content .doc-content.index .components-list-container .category-container .demos-list .link-container.Roadmap:after {
  content: "In Progress";
  background-color: #ff9000;
}
body .content .doc-content.index .components-list-container .category-container .demos-list .link-container.New:after {
  content: "New";
  background-color: #dd1144;
}
body .content .doc-content.index .components-list-container .category-container .demos-list .link-container.Updated:after {
  content: "Upd";
  background-color: #42b883;
}
body .content .doc-content .reference-button {
  font-size: 18px;
  padding: 4px 16px;
  margin-bottom: 16px;
}
body .content .doc-content .apiReferenceSection,
body .content .doc-content .documentationSection {
  padding-right: 30px;
  padding-top: 0;
  padding-bottom: 0;
  margin-top: 0;
  margin-bottom: 0;
}
body .content .doc-content .apiReferenceSection h2.api-header,
body .content .doc-content .documentationSection h2.api-header {
  font-size: 30px;
  font-family: 'Roboto', sans-serif;
  font-weight: bold;
  padding-top: 24px;
  padding-bottom: 12px;
  margin-top: 0;
  margin-bottom: 0;
}
body .content .doc-content .apiReferenceSection .short-description,
body .content .doc-content .documentationSection .short-description,
body .content .doc-content .apiReferenceSection .full-description-offset,
body .content .doc-content .documentationSection .full-description-offset,
body .content .doc-content .apiReferenceSection .parameter-description,
body .content .doc-content .documentationSection .parameter-description,
body .content .doc-content .apiReferenceSection .git-edit-paragraph,
body .content .doc-content .documentationSection .git-edit-paragraph {
  font-family: 'Roboto', sans-serif;
  font-size: 16px;
  line-height: 24px;
}
body .content .doc-content .apiReferenceSection .short-description:hover .git-edit-link,
body .content .doc-content .documentationSection .short-description:hover .git-edit-link,
body .content .doc-content .apiReferenceSection .full-description-offset:hover .git-edit-link,
body .content .doc-content .documentationSection .full-description-offset:hover .git-edit-link,
body .content .doc-content .apiReferenceSection .parameter-description:hover .git-edit-link,
body .content .doc-content .documentationSection .parameter-description:hover .git-edit-link,
body .content .doc-content .apiReferenceSection .git-edit-paragraph:hover .git-edit-link,
body .content .doc-content .documentationSection .git-edit-paragraph:hover .git-edit-link {
  visibility: visible;
}
body .content .doc-content p {
  margin: 0 0 16px 0;
}
body .content .doc-content li,
body .content .doc-content p {
  font-size: 16px;
  line-height: 24px;
  font-family: 'Roboto';
}
body .content .doc-content li p {
  margin: 0 0 4px 0;
}
body .content .doc-content .short-description {
  position: relative;
}
body .content .doc-content .api-example {
  padding-bottom: 15px;
}
body .content .doc-content .anchor {
  height: 110px;
  margin-top: -110px;
  visibility: hidden;
  display: block;
  position: absolute;
}
body .content .doc-content .note {
  padding: 16px;
  font-size: 16px;
  line-height: 24px;
  margin: 24px 0;
}
body .content .doc-content .note .note-text ul {
  padding-bottom: 0;
}
body .content .doc-content .note .note-text ul li:last-child p {
  margin-bottom: 0;
}
body .content .doc-content .note.note-important {
  line-height: 24px;
  padding: 16px;
}
body .content .doc-content .note.note-important .note-header {
  padding-bottom: 4px;
}
body .content .doc-content .note .note-header {
  font-weight: bold;
  padding-bottom: 4px;
}
body .content .doc-content ul {
  padding: 0 0 12px 18px;
}
body .content .doc-content ul ul {
  list-style-type: disc;
}
body .content .doc-content img {
  max-width: 100%;
}
body .content .doc-content video {
  max-width: 100%;
}
body .content .doc-content .libs {
  font-size: 16px;
  line-height: 24px;
}
body .content .doc-content .libs:last-child {
  padding-bottom: 20px;
}
body .content .doc-content .accordion-hidden-content {
  display: none;
}
body .content .doc-content .dx-accordion-item-selected,
body .content .doc-content .dx-accordion-item-opened {
  border-radius: 8px;
  margin-bottom: 7px;
}
body .content .doc-content .accordion-content .dx-accordion-item-closed {
  padding-bottom: 50px;
}
body .content .doc-content .accordion-content .dx-accordion-item {
  border: 1px solid transparent;
}
body .content .doc-content .accordion-content .dx-accordion-item-title,
body .content .doc-content .accordion-content .dx-accordion-item-body {
  padding: 8px 58px 8px 16px;
}
body .content .doc-content .accordion-content .dx-accordion-item-title {
  font-size: 20px;
  font-family: 'Roboto', sans-serif;
  padding-right: 22px;
  border-radius: 8px;
}
body .content .doc-content .accordion-content .dx-accordion-item-title:hover {
  height: 43px;
}
body .content .doc-content .accordion-content .dx-accordion-item-title:before {
  line-height: 28px;
}
body .content .doc-content .accordion-content .dx-accordion-item-title svg {
  height: 24px;
  width: 24px;
  vertical-align: bottom;
  margin-right: 8px;
}
body .content .doc-content .accordion-content .dx-accordion-item-body {
  padding-top: 0;
  border: none;
}
body .content .doc-content .accordion-content .dx-accordion-item-body .accordion-item-content > p:first-child {
  margin-bottom: 7px;
}
body .content .doc-content .accordion-content .dx-accordion-item-body .vote-text {
  line-height: 38px;
}
body .content .doc-content .accordion-content .dx-accordion-item-body .code-type,
body .content .doc-content .accordion-content .dx-accordion-item-body .numbers,
body .content .doc-content .accordion-content .dx-accordion-item-body pre {
  z-index: unset;
}
body .content .doc-content h5.see-also {
  font-size: 16px;
  line-height: 21px;
  font-family: 'Roboto', sans-serif;
  font-weight: 600;
  border-top: 1px solid;
  padding: 16px 0 8px 0;
  margin: 30px 0 0 0;
  font-weight: bold;
}
body .content .doc-content h5.see-also + ul,
body .content .doc-content h5.see-also + p {
  font-size: 16px;
  line-height: 24px;
  padding: 0 0 30px 0;
  margin: -8px 0 0 0;
}
body .content .doc-content h5.see-also + ul li {
  list-style-type: none;
  position: relative;
  padding: 8px 0 0 0;
}
body .content .doc-content h5.see-also + p {
  margin-top: 0;
  padding: 0 20px 20px 0;
}
body .content .doc-content .code-wrapper {
  position: relative;
  -moz-user-select: none;
  -ms-user-select: none;
  -webkit-user-select: none;
  user-select: none;
  border-spacing: 3px 0;
}
body .content .doc-content .code-wrapper.code-tabs {
  border-collapse: separate;
}
body .content .doc-content .code-wrapper.code-tabs .code-type {
  cursor: pointer;
  margin-right: 3px;
  display: table-cell;
  padding-left: 0.5rem;
  padding-right: 0.5rem;
  border-top-left-radius: 4px;
  border-top-right-radius: 4px;
  font-size: 14px;
}
body .content .doc-content .code-wrapper.code-tabs pre.prettyprint {
  display: none;
}
body .content .doc-content .code-wrapper.code-tabs pre.prettyprint.active {
  display: block;
}
body .content .doc-content .code-wrapper .code-type {
  border: 1px solid;
  border-bottom: none;
  display: table-cell;
  padding-left: 0.5rem;
  padding-right: 0.5rem;
  border-top-left-radius: 4px;
  border-top-right-radius: 4px;
  font-size: 14px;
}
body .content .doc-content .code-wrapper pre {
  margin: 0px;
  z-index: 2;
  position: relative;
  -webkit-border-radius: 4px;
  -moz-border-radius: 4px;
  -ms-border-radius: 4px;
  -o-border-radius: 4px;
  border-radius: 4px;
  border: 1px solid;
}
body .content .doc-content .code-wrapper pre.prettyprint {
  margin-bottom: 20px;
}
body .content .doc-content .code-wrapper pre.prettyprint ol.numbers li {
  font-size: 16px;
  color: #bebec5;
}
body .content .doc-content .code-wrapper ul.linenums {
  padding-bottom: 0;
}
body .content .doc-content .code-wrapper ul.linenums li {
  font-size: 16px;
  text-shadow: none;
}
body .content .doc-content div.download-code-button {
  padding-bottom: 20px;
}
body .content .doc-content .api-header {
  display: inline-block;
  font-size: 36px;
  font-family: 'Roboto', sans-serif;
  font-weight: bold;
}
body .content .doc-content .api-header a {
  font-size: 30px;
  font-family: 'Roboto', sans-serif;
  line-height: 35px;
}
body .content .doc-content .api-property-block .api-property {
  border-left: 3px solid;
  padding-left: 10px;
  font-size: 16px;
  line-height: 20px;
  margin-bottom: 16px;
}
body .content .doc-content .api-property-block .api-property:not(:last-child) {
  padding-bottom: 8px;
}
body .content .doc-content .api-property-block .api-property p {
  display: inline;
  white-space: nowrap;
  font-size: 16px;
}
body .content .doc-content .api-property-block .api-property.no-margin {
  margin-bottom: 0;
}
body .content .doc-content .api-property-block .api-property span.api-property-name {
  font-weight: normal;
}
body .content .doc-content .api-property-block .api-property .type-fields-offset {
  padding-left: 20px;
}
body .content .doc-content .api-property-block .api-property .type-offset {
  padding-left: 0px;
  padding-top: 8px;
}
body .content .doc-content .api-property-block .api-property .parameter-name:not(:first-child) {
  padding-top: 10px;
}
body .content .doc-content .api-property-block .api-property .parameter-name .deprecated {
  background: url(/Content/Images/Documentation/icon-attention-small.png) no-repeat center right;
  height: 12px;
  width: 16px;
  display: inline-block;
}
body .content .doc-content .api-property-block .api-property .parameter-description {
  padding-top: 8px;
  position: relative;
}
body .content .doc-content .api-property-block .api-property .parameter-description p {
  white-space: pre-wrap;
  font-size: 16px;
  margin: 0;
}
body .content .doc-content .api-property-block .api-property .parameter-description li {
  font-size: 16px;
}
body .content .doc-content .api-property-block .api-property .parameter-description ul {
  padding-bottom: 0;
}
body .content .doc-content .api-property-block .api-property .parameter-description ul li {
  font-size: 12px;
  text-shadow: none;
}
body .content .doc-content .full-description-offset {
  position: relative;
  margin-top: 15px;
}
body .content .doc-content .simple-table {
  font-size: 16px;
  margin-bottom: 20px;
}
body .content .doc-content .simple-table table {
  border-collapse: collapse;
}
body .content .doc-content .simple-table table td:first-child {
  text-align: center;
}
body .content .doc-content .simple-table:not(.normal-font-style) table td:first-child {
  font-style: italic;
}
body .content .doc-content .simple-table td,
body .content .doc-content .simple-table th {
  padding: 5px 20px;
  border: 2px solid;
}
body .content .doc-content .dx-table {
  border-collapse: collapse;
  font-size: 16px;
  margin-bottom: 20px;
  font-family: 'Roboto', sans-serif;
}
body .content .doc-content .dx-table tr th {
  text-align: left;
  font-weight: normal;
  border-bottom: 2px solid;
}
body .content .doc-content .dx-table tr td.member-name a {
  font-size: 16px;
}
body .content .doc-content .dx-table tr th,
body .content .doc-content .dx-table tr td {
  padding: 5px 20px;
}
body .content .doc-content .dx-table tr .parameter-name {
  width: 16%;
}
body .content .doc-content .dx-table tr .parameter-type {
  width: 20%;
}
body .content .doc-content .dx-table tr .parameter-description {
  position: relative;
}
body .content .doc-content .dx-table.full-width {
  width: 100%;
}
body .content .doc-content .dx-table.full-width tr > td:first-child {
  width: 20%;
}
body .content .doc-content .dx-table p {
  margin: 0;
}
body .content .doc-content .multicolumn-list tr > td {
  width: 33.3%;
  padding: 10px;
  vertical-align: text-top;
}
body .content .doc-content .multicolumn-list tr > td ul {
  list-style-position: outside;
}
body .content .doc-content .multicolumn-list tr > td ul li {
  padding: 4px;
}
body .content .doc-content .footnotes {
  width: 300px;
  margin-bottom: 30px;
  border-top: 1px solid;
}
body .content .doc-content .footnotes ol,
body .content .doc-content .footnotes ul {
  margin-top: 10px;
  padding: 0;
  list-style: none;
}
body .content .doc-content .footnotes ol li,
body .content .doc-content .footnotes ul li {
  font-size: 12px;
  counter-increment: custom;
}
body .content .doc-content .footnotes ol > li::before {
  font-size: 0.8em;
  vertical-align: text-top;
  content: counter(custom) " - ";
}
body .content .doc-content .footnotes ul > li::before {
  content: "* - ";
}
body .content .doc-content .three-col {
  -moz-column-count: 3;
  -moz-column-gap: 20px;
  -webkit-column-count: 3;
  -webkit-column-gap: 20px;
}
body .content .doc-content .documentation-gallery {
  position: relative;
  margin: 0 auto;
  margin-bottom: 50px;
}
body .content .doc-content .documentation-gallery .gallery-border {
  position: absolute;
  z-index: 2;
  border: solid 1px;
  bottom: 0;
  right: 0;
  left: 0;
  top: 0;
}
body .content .doc-content .documentation-gallery .gallery-border .arrow {
  width: 34px;
  height: 45px;
  position: absolute;
  top: 50%;
  margin-top: -23px;
  cursor: pointer;
  background-position: center;
  background-repeat: no-repeat;
  border: solid 1px;
  background-color: white;
}
body .content .doc-content .documentation-gallery .gallery-border .left-arrow {
  left: -17px;
  background-image: url('/Content/Images/Documentation/arrow-prev.svg');
}
body .content .doc-content .documentation-gallery .gallery-border .right-arrow {
  right: -17px;
  background-image: url('/Content/Images/Documentation/arrow-next.svg');
}
body .content .doc-content .documentation-gallery .dx-gallery-wrapper {
  position: absolute;
  bottom: -30px;
  top: 0;
  height: auto;
}
body .content .doc-content .documentation-gallery .dx-gallery-wrapper .gallery-content {
  padding-bottom: 30px;
}
body .content .doc-content .documentation-gallery .dx-gallery-wrapper .gallery-content h4 {
  font-size: 20px;
  font-family: 'Roboto', sans-serif;
  font-weight: bold;
  padding-top: 16px;
  padding-bottom: 8px;
}
body .content .doc-content .documentation-gallery .gallery-item .image {
  position: absolute;
  bottom: 100px;
  top: 0;
  width: 100%;
  background-repeat: no-repeat;
  background-position: center center;
  box-sizing: border-box;
  border-left: 15px solid;
  border-right: 15px solid;
}
body .content .doc-content .documentation-gallery .gallery-item .text {
  position: absolute;
  height: 90px;
  bottom: 30px;
  width: 100%;
  display: table;
}
body .content .doc-content .documentation-gallery .gallery-item .text div {
  vertical-align: middle;
  display: table-cell;
  height: 90px;
}
body .content .doc-content .api-example .show-text {
  color: #7f7f7f;
  padding-bottom: 3px;
  font-size: 16px;
}
body .content .doc-content .api-example .approach-tab-container:after {
  content: "";
  display: table;
  clear: both;
}
body .content .doc-content .api-example .approach-tab-container .button.approach-switcher {
  min-width: 90px;
  margin-right: -2px;
  display: block;
  float: left;
  white-space: normal;
  background-color: white;
  color: red;
}
body .content .doc-content .api-example .approach-tab-container .button.approach-switcher:after {
  border: 4px solid transparent;
  border-top: 4px solid;
  content: "";
  margin-top: 9px;
  float: right;
}
body .content .doc-content .api-example .approach-tab-container .button.approach-switcher.current:after {
  border-top: none;
  border-bottom: 4px solid;
}
body .content .doc-content .api-example .approach-tab {
  display: none;
}
body .content .doc-content .api-example .approach-tab.visible {
  display: block;
}
body .content .doc-content.search-page .header h1 {
  font-size: 36px;
  font-family: 'Roboto', sans-serif;
  font-weight: 700;
  margin-top: 0;
  margin-bottom: 0;
}
body .content .doc-content.search-page .header ul.search-counts {
  padding: 0 0 15px 0;
  list-style: none;
  border-bottom: 1px solid;
  white-space: nowrap;
}
body .content .doc-content.search-page .header ul.search-counts li {
  display: inline;
  padding: 0;
  margin-right: 30px;
}
body .content .doc-content.search-page .header ul.search-counts li .count {
  font-weight: bold;
}
body .content .doc-content.search-page .header ul.search-counts li.search-new-window a {
  background-image: url(/Content/Images/Documentation/icon-new-win.svg);
  background-repeat: no-repeat;
  background-position: 100% 75%;
  padding-right: 18px;
}
body .content .doc-content.search-page .header ul.search-counts li:first-child:not(.active) {
  padding-left: 0px;
}
body .content .doc-content.search-page .header ul.search-counts li.active {
  border-bottom: 2px solid;
  padding-bottom: 15px;
}
body .content .doc-content.search-page .header:after {
  content: '';
  display: block;
  clear: both;
}
body .content .doc-content.search-page h4 {
  font-size: 20px;
  font-family: 'Roboto', sans-serif;
  font-weight: bold;
  padding-top: 30px;
  padding-bottom: 10px;
  margin: 0;
}
body .content .doc-content.search-page h4 a {
  font-size: 24px;
}
body .content .doc-content.search-page .article-type {
  line-height: 24px;
}
body .content .doc-content.search-page .article-type p {
  margin: 10px 0;
}
body .content .doc-content.search-page .article-type:nth-last-of-type(1) {
  padding-bottom: 10px;
}
body .content .doc-content.search-page p {
  line-height: 24px;
}
body .content .doc-content.search-page .pagination {
  text-align: right;
  padding-bottom: 50px;
  padding-top: 10px;
}
body .content .doc-content.search-page .pagination .pagination-title {
  display: none;
}
body .content .doc-content.search-page .pagination .activeItem-item,
body .content .doc-content.search-page .pagination a {
  display: inline-block;
  height: 50px;
  width: 50px;
  border-radius: 25px;
  vertical-align: middle;
  text-align: center;
  line-height: 50px;
}
body .content .doc-content.search-page .pagination .activeItem-item.arrow-item,
body .content .doc-content.search-page .pagination a.arrow-item {
  background: no-repeat center;
}
body .content .doc-content.search-page .pagination .activeItem-item.arrow-item.left,
body .content .doc-content.search-page .pagination a.arrow-item.left {
  -webkit-mask-image: url('/Content/Images/Documentation/arrow-prev.svg');
  -webkit-mask-size: contain;
  -webkit-mask-repeat: no-repeat;
  -webkit-mask-position: center;
  background-color: #627789;
}
body .content .doc-content.search-page .pagination .activeItem-item.arrow-item.right,
body .content .doc-content.search-page .pagination a.arrow-item.right {
  -webkit-mask-image: url('/Content/Images/Documentation/arrow-next.svg');
  -webkit-mask-size: contain;
  -webkit-mask-repeat: no-repeat;
  -webkit-mask-position: center;
  background-color: #627789;
}
body .content .doc-content .api-header,
body .content .doc-content .article-section-header {
  position: relative;
  margin-left: -30px;
  padding-left: 30px;
}
body .content .doc-content .api-header .visible-anchor,
body .content .doc-content .article-section-header .visible-anchor {
  width: 20px;
  height: 20px;
  position: absolute;
  top: 50%;
  margin-left: -30px;
  padding-right: 10px;
  background-image: url(/Content/ImagesNew/Doc/link.svg);
  background-position: left center;
  background-repeat: no-repeat;
  visibility: hidden;
}
body .content .doc-content .api-header:hover .visible-anchor {
  visibility: visible;
  margin-top: -3px;
}
body .content .doc-content .article-section-header:hover .visible-anchor {
  visibility: visible;
}
body .content .doc-content .article-header,
body .content .doc-content .api-header {
  position: relative;
  font-family: 'Roboto', sans-serif;
  font-weight: bold;
}
body .content .doc-content .article-header .badge,
body .content .doc-content .api-header .badge {
  position: absolute;
  top: 0;
  margin-left: 5px;
  font-size: 11px;
  font-weight: bold;
  padding: 0 2px 0 2px;
  border-radius: 2px;
  line-height: 15px;
}
body .content .doc-content .axe-block {
  margin-bottom: 16px;
  min-width: 760px;
  width: 100%;
}
body .content .doc-content .axe-report {
  display: flex;
  flex-direction: row;
  padding: 16px 24px;
  gap: 16px;
  border: 1px solid;
  border-radius: 8px;
}
body .content .doc-content .axe-report svg {
  flex: 0 0 100px;
  align-self: center;
}
body .content .doc-content .axe-report .axe-header {
  font-family: Roboto;
  font-weight: 600;
  font-size: 20px;
  line-height: 24px;
}
body .content .doc-content .axe-report .axe-box-with-btn {
  display: flex;
  flex-direction: row;
  gap: 16px;
}
body .content .doc-content .axe-report .axe-box {
  display: flex;
  flex-direction: column;
  gap: 12px;
}
body .content .doc-content .axe-report .axe-text {
  font-family: Roboto;
  font-size: 14px;
  font-weight: 400;
  line-height: 20px;
  text-align: left;
}
body .content .doc-content .axe-report .axe-trademark {
  font-family: Roboto;
  font-size: 12px;
  font-weight: 400;
  line-height: 18px;
  text-align: left;
}
body .content .doc-content .axe-report .axe-button {
  display: block;
  padding: 10px 20px;
  border-radius: 40px;
  width: 190px;
  min-width: unset;
  white-space: nowrap;
  align-self: center;
  align-items: center;
  justify-content: center;
  box-shadow: 0px 2px 12px 0px #00000014, 0px 1px 4px 0px #0000000f;
  font-family: Roboto;
  font-size: 16px;
  font-weight: 500;
  line-height: 24px;
  cursor: pointer;
  border: none;
}
body .content .doc-content .axe-report .axe-button:focus,
body .content .doc-content .axe-report .axe-button:focus-visible {
  outline: none;
}
body .content .doc-content .axe-report sup {
  position: relative;
  font-size: 70%;
  line-height: 0;
  vertical-align: baseline;
  top: -0.8em;
}
body .content .doc-content .axe-note {
  height: 32px;
  margin-top: 16px;
  display: flex;
  flex: 0 0 1397px;
  justify-content: left;
  align-items: center;
  vertical-align: middle;
  padding: 4px 8px;
  gap: 8px;
  border-radius: 8px;
  font-family: Roboto;
  font-size: 14px;
  font-weight: 400;
  line-height: 18px;
  text-align: left;
}
body .content .doc-content .roadmap-survey-block {
  display: flex;
  flex-direction: row;
  gap: 32px;
  padding: 16px 24px;
  border: 1px solid;
  border-radius: 8px;
}
body .content .doc-content .roadmap-survey-text-block {
  display: flex;
  flex-direction: column;
  gap: 12px;
}
body .content .doc-content .roadmap-survey-header {
  display: flex;
  gap: 8px;
  font-family: Roboto;
  font-size: 20px;
  font-weight: 600;
  line-height: 24px;
  text-align: left;
}
body .content .doc-content .roadmap-survey-header svg {
  flex-shrink: 0;
}
body .content .doc-content .roadmap-survey-text {
  font-family: Roboto;
  font-size: 14px;
  font-weight: 400;
  line-height: 20px;
  text-align: left;
}
body .content .doc-content .roadmap-survey-button {
  height: 44px;
  align-self: center;
  padding: 10px 20px 10px 16px;
  min-width: unset;
  width: fit-content;
  white-space: nowrap;
}
body .content .doc-content .roadmap-image-block {
  max-height: 550px;
  border: 1px solid;
  border-radius: 8px;
  padding: 24px;
  display: flex;
  align-items: center;
  align-content: center;
}
body .content .doc-content .roadmap-image-block img {
  max-width: 75%;
  max-height: 550px;
  margin-left: auto;
  margin-right: auto;
}
body .content .doc-content .simulator-wrapper {
  min-width: 760px;
  width: 100%;
  margin-bottom: 32px;
}
body .content .doc-content .simulator-wrapper .simulator-content-box {
  width: 100%;
  display: flex;
  flex-direction: row;
  box-sizing: border-box;
  gap: 20px;
}
body .content .doc-content .simulator-wrapper .demo-panel-box {
  flex: 3 1 1000px;
}
body .content .doc-content .simulator-wrapper.surveyjs {
  padding-bottom: 0px;
  display: flex;
  flex-direction: column;
  gap: 32px;
  min-width: 360px;
}
body .content .doc-content .simulator-wrapper.surveyjs .description p:last-of-type {
  margin-bottom: 0px;
}
body .content .doc-content .simulator-wrapper.surveyjs .description,
body .content .doc-content .simulator-wrapper.surveyjs .second-description {
  margin: 0px;
  min-width: unset;
}
body .content .doc-content .description,
body .content .doc-content .second-description {
  box-sizing: border-box;
  position: relative;
  min-width: 760px;
  margin-bottom: 32px;
}
body .content .doc-content .description-expand,
body .content .doc-content .second-description-expand {
  z-index: 1;
  opacity: 1;
  height: auto;
}
body .content .doc-content .description code,
body .content .doc-content .second-description code {
  padding: 2px 4px;
  color: #dd1144;
  white-space: nowrap;
  border: 1px solid;
  display: inline;
  border-radius: 4px;
  font-size: 14px;
}
body .content .doc-content .description pre code,
body .content .doc-content .second-description pre code {
  border: none;
  display: inline-block;
  padding: 0;
  max-width: 900px;
  width: auto;
}
body .content .doc-content .description pre code .CodeMirror,
body .content .doc-content .second-description pre code .CodeMirror {
  border: 1px solid #e1e1e8;
  padding: 10px;
  border-radius: 4px;
  height: auto;
  z-index: 0;
}
body .content .doc-content .description pre code .CodeMirror pre,
body .content .doc-content .second-description pre code .CodeMirror pre {
  font-size: 12px;
}
body .content .doc-content .description pre code .CodeMirror-linenumber,
body .content .doc-content .second-description pre code .CodeMirror-linenumber {
  font-size: 12px;
}
body .content .doc-content .description .note,
body .content .doc-content .second-description .note {
  padding: 20px;
  font-size: 14px;
  margin-bottom: 10px;
}
body .content .doc-content .description .note .note-header,
body .content .doc-content .second-description .note .note-header {
  font-weight: bold;
}
body .content .doc-content .description p:last-of-type {
  margin-bottom: 8px;
}
body .content .doc-content .description-text a {
  text-decoration: underline;
}
body .content .doc-content .description-text p {
  text-size-adjust: 100%;
}
body .content .doc-content .simulators {
  min-height: 440px;
  border-radius: 0 0 6px 6px;
  border: 1px solid;
  border-top: none;
}
body .content .doc-content .simulators .demo-device {
  min-height: 440px;
  border-radius: 0 0 6px 6px;
}
body .content .doc-content .simulators .demo-device .demo-display {
  min-height: 440px;
  background: inherit;
  position: relative;
  border-radius: 0 0 6px 6px;
}
body .content .doc-content .simulators .demo-device .demo-display .demo-frame-container {
  height: 100%;
}
body .content .doc-content .simulators .demo-device .demo-display .demo-credits {
  text-align: right;
  font-size: 14px;
  color: #bfbfbf;
}
body .content .doc-content .simulators .demo-device .demo-display .load-panel {
  position: absolute;
  background: inherit;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  /* banner */

}
body .content .doc-content .simulators .demo-device .demo-display .load-panel .load-panel-banner-wrapper {
  display: flex;
  align-items: center;
  justify-content: center;
  height: 100%;
}
body .content .doc-content .simulators .demo-device .demo-display .load-panel .load-panel-banner-wrapper .load-panel-banner {
  max-width: 540px;
  box-sizing: border-box;
  padding: 20px;
  border: 1px solid #ffe4c2;
  border-radius: 8px;
  background-color: #ff900014;
}
body .content .doc-content .simulators .demo-device .demo-display .load-panel .load-panel-banner-wrapper .load-panel-banner p,
body .content .doc-content .simulators .demo-device .demo-display .load-panel .load-panel-banner-wrapper .load-panel-banner a {
  display: inline;
  font-size: 14px;
  line-height: 20px;
  font-weight: 400;
  color: #3f4d5a;
}
body .content .doc-content .simulators .demo-device .demo-display .load-panel .load-panel-banner-wrapper .load-panel-banner a {
  text-decoration: underline;
  color: #222930;
}
body .content .doc-content .simulators .demo-frame {
  width: 100%;
  min-height: 450px;
  margin: 0;
  padding: 0;
  border: 0;
  outline: 0;
  background-color: transparent;
  border-bottom-left-radius: 6px;
  border-bottom-right-radius: 6px;
}
body .content .doc-content .simulators .demo-frame-disabled {
  display: none;
}
body .content .doc-content .simulators #git-demo-frame {
  width: 100%;
  position: relative;
  z-index: 1;
  min-height: 440px;
}
body .content .doc-content .simulators.Mobile,
body .content .doc-content .simulators.TabletLandscape,
body .content .doc-content .simulators.TabletPortrait {
  box-shadow: none;
}
body .content .doc-content .simulators.Mobile .demo-device,
body .content .doc-content .simulators.TabletLandscape .demo-device,
body .content .doc-content .simulators.TabletPortrait .demo-device {
  border: 1px solid;
  border-radius: 15px;
}
body .content .doc-content .simulators.Mobile .demo-device .demo-display,
body .content .doc-content .simulators.TabletLandscape .demo-device .demo-display,
body .content .doc-content .simulators.TabletPortrait .demo-device .demo-display {
  border-radius: 2px;
  border: 1px solid;
}
body .content .doc-content .simulators.Mobile .demo-device .demo-display .demo-frame,
body .content .doc-content .simulators.TabletLandscape .demo-device .demo-display .demo-frame,
body .content .doc-content .simulators.TabletPortrait .demo-device .demo-display .demo-frame {
  height: 100%;
}
body .content .doc-content .simulators.TabletLandscape .demo-device {
  height: 511px;
  width: 780px;
  margin: 0 auto 0;
}
body .content .doc-content .simulators.TabletLandscape .demo-device .demo-display {
  margin-top: 14px;
  height: 480px;
  margin-left: 29px;
  width: 720px;
}
body .content .doc-content .simulators.TabletPortrait .demo-device {
  height: 780px;
  width: 511px;
  margin: 0 auto 0;
}
body .content .doc-content .simulators.TabletPortrait .demo-device .demo-display {
  margin-top: 29px;
  height: 720px;
  margin-left: 14px;
  width: 480px;
}
body .content .doc-content .simulators.Mobile .demo-device {
  height: 740px;
  width: 400px;
  margin: 10px auto 40px auto;
}
body .content .doc-content .simulators.Mobile .demo-device .demo-display {
  margin-top: 70px;
  height: 590px;
  margin-left: 20px;
  width: 360px;
}
body .content .doc-content .simulators.templates .demo-frame {
  min-height: 700px;
}
body .content .doc-content .simulators.simulators-no-border,
body .content .doc-content .simulators.simulators-no-border .demo-device,
body .content .doc-content .simulators.simulators-no-border .demo-device .demo-display {
  border: 0;
  padding: 0;
  box-shadow: none;
}
body .content .doc-content .title {
  padding-left: 40px;
}
body .content .marketing-demos .demos-container {
  padding: 32px;
  border-radius: 24px;
  display: flex;
  gap: 24px;
  flex-wrap: wrap;
}
body .content .marketing-demos .demo-link {
  flex: 1 350px;
  border-radius: 12px;
  box-shadow: 0px 2px 8px rgba(0, 0, 0, 0.12);
  display: grid;
  grid-template-rows: 1fr 1fr 1fr;
}
body .content .marketing-demos .demo-link:empty {
  visibility: hidden;
  height: none;
}
body .content .marketing-demos .demo-link-img {
  border-radius: 12px;
  grid-row-start: 1;
  grid-row-end: 5;
  grid-column: 1;
}
body .content .marketing-demos .demo-link-content {
  padding: 18px 24px;
  border-top: 1px solid;
  border-radius: 0 0 12px 12px;
  grid-row-start: 3;
  grid-row-end: 5;
  grid-column: 1;
}
body .content .marketing-demos .demo-link-content h5 {
  padding: 0 0 8px 0;
  font-style: normal;
  font-weight: 600;
  font-size: 20px;
  line-height: 125%;
}
body .content .marketing-demos .demo-link-content p {
  font-weight: 400;
  font-size: 16px;
  line-height: 135%;
}
body .content .top-content {
  position: relative;
  display: flex;
  gap: 32px;
  align-items: center;
}
body .content .top-content__expand {
  height: 36px;
  min-width: auto;
  border-width: 1px;
  padding: 6px 16px 6px 8px;
}
body .content .top-content__expand:focus-visible {
  outline-width: 0;
}
body .content .top-content__expand__svg {
  width: 24px;
  height: 24px;
}
body .content .top-content__expand__svg-visible,
body .content .top-content__expand__span-visible {
  display: block;
}
body .content .top-content__expand__svg-hide,
body .content .top-content__expand__span-hide {
  display: none;
}
body .content .top-content #report-design-btn {
  position: absolute;
  right: 0;
  height: 36px;
  top: 0;
}
body .content .top-content svg polygon,
body .content .top-content svg path,
body .content .top-content svg rect {
  fill: #8b949c;
}
body .content .top-content h1 {
  padding: 0;
}
body .content .top-content h1.New:after,
body .content .top-content h1.Updated:after,
body .content .top-content h1.Roadmap:after {
  left: -3px;
  font-size: 11px;
  padding: 2px 4px 3px 4px;
  font-family: 'Roboto', sans-serif;
  border-radius: 3px;
  position: relative;
  color: white;
  top: -13px;
  font-weight: 400;
}
body .content .top-content h1.New:after {
  content: "New";
  background-color: #f05b41;
}
body .content .top-content h1.Updated:after {
  content: "Updated";
  background-color: #1e70b9;
}
body .content .top-content h1.Roadmap:after {
  content: "In Progress";
  background-color: #a89cda;
}
body .content .demo-details {
  flex: 1 1 480px;
  align-items: stretch;
}
body .content .code {
  overflow: hidden;
  border: 1px solid;
  border-radius: 6px;
  max-height: calc(17%);
  height: calc(17%);
  min-height: 500px;
}
body .content .code .not-yet {
  height: 148px;
  font-size: 16px;
  text-align: center;
}
body .content .code .not-yet span {
  display: inline-block;
  margin-top: 64px;
}
body .content .code .tabs-container {
  display: flex;
  border-bottom: 1px solid;
  height: 60px;
}
body .content .code .tabs-container #code-tabs {
  width: 100%;
  display: inline-flex;
  justify-content: space-between;
}
body .content .code .tabs-container #code-tabs.has-arrow .tbs-arrows {
  display: flex;
  height: 100%;
}
body .content .code .tabs-container #code-tabs.has-arrow .tbs-children {
  overflow: hidden;
}
body .content .code .tabs-container #code-tabs.has-backend .switch {
  display: inline-flex;
}
body .content .code .tabs-container #code-tabs .switch {
  display: none;
}
body .content .code .tabs-container #code-tabs .switch::before {
  content: '';
  width: 1px;
  height: 100%;
  position: absolute;
  left: 0;
}
body .content .code .tabs-container #code-tabs .tbs-children-container {
  height: 60px;
}
body .content .code .tabs-container #code-tabs .tbs-arrows {
  display: none;
}
body .content .code .tabs-container #code-tabs .tbs-arrow {
  display: flex;
  min-width: 32px;
  height: 100%;
  padding: 0;
  border-radius: 0;
}
body .content .code .tabs-container #code-tabs .tbs-children {
  width: 100%;
  border: none;
  align-items: flex-start;
  justify-content: start;
}
body .content .code .tabs-container #code-tabs .tbs-children-container {
  position: relative;
  display: inline-flex;
  justify-content: flex-start;
}
body .content .code .tabs-container #code-tabs .tbs-item {
  white-space: nowrap;
}
body .content .code .tabs-container #code-tabs .tbs-item-container {
  position: relative;
}
body .content .code .tabs-container #code-tabs .tbs-item-container.active .tbs-item {
  width: inherit;
  position: relative;
}
body .content .code .tabs-container #code-tabs .tbs-item-container.active .tbs-item::after {
  content: "";
  position: absolute;
  right: 0;
  left: 0;
  width: 100%;
  height: 4px;
  bottom: -18px;
  border-top-right-radius: 8px;
  border-top-left-radius: 8px;
  border-bottom-right-radius: unset;
  border-bottom-left-radius: unset;
}
body .content .code .buttons-container {
  height: 52px;
  border-bottom: 1px solid;
}
body .content .code .buttons-container .buttons {
  height: inherit;
  display: flex;
  justify-content: space-between;
  gap: 8px;
  padding: 8px;
  box-sizing: border-box;
}
body .content .code .buttons-container .buttons-left {
  display: flex;
  gap: 8px;
}
body .content .code .buttons-container .buttons.fixed {
  position: fixed;
  z-index: 3;
  border-bottom: 1px solid;
}
body .content .code .buttons-container .btn.btn {
  height: 36px;
  min-width: auto;
  font-size: 16px;
  line-height: 24px;
}
body .content .code .source-block {
  margin: 10px;
  display: none;
  overflow: auto;
  height: 400px;
  min-height: 380px;
  scrollbar-width: thin;
}
body .content .code .source-block::-webkit-scrollbar {
  width: 8px;
}
body .content .code .source-block::-webkit-scrollbar-track {
  border-radius: 20px;
}
body .content .code .source-block::-webkit-scrollbar-thumb {
  border-radius: 20px;
}
body .content .code .source-block.active {
  display: block;
}
body .content .code .source-block.hidden {
  display: none;
}
body .content .code .source-block .CodeMirror {
  height: auto;
  font-size: 14px;
  z-index: 0;
}
body .content .code .source-block .CodeMirror .CodeMirror-scroll {
  overflow: hidden !important;
}
body .content .code .source-block .CodeMirror code,
body .content .code .source-block .CodeMirror pre {
  font-family: Monaco, Menlo, Consolas, "Courier New", monospace;
  display: block;
  font-size: 12px;
  line-height: 20px;
  word-break: break-all;
  word-wrap: break-word;
  white-space: pre;
  white-space: pre-wrap;
  -webkit-border-radius: 4px;
  -moz-border-radius: 4px;
  -ms-border-radius: 4px;
  -o-border-radius: 4px;
  border-radius: 4px;
}
body .content .code .source-block .CodeMirror code .prettyprint,
body .content .code .source-block .CodeMirror pre .prettyprint {
  margin-bottom: 20px;
}
body .content .code .source-block .CodeMirror code code,
body .content .code .source-block .CodeMirror pre code {
  padding: 0;
  white-space: pre;
  white-space: pre-wrap;
  border: 0;
}
body .content .code .source-block .CodeMirror code {
  padding: 2px 4px;
  white-space: nowrap;
  border: 1px solid;
  border-color: #e1e1e8;
  display: inline;
}
body .content .code .move-demo-container {
  display: flex;
  flex-direction: column;
  align-items: center;
  height: 200px;
}
body .content .code .move-demo-container .move-demo-text {
  padding: 15px;
  padding-bottom: 16px;
  font-size: 14px;
}
body .content .code .move-demo-container .move-demo-button {
  padding: 5px 15px;
  border: 1px solid;
  -webkit-border-radius: 5px;
  -moz-border-radius: 5px;
  -ms-border-radius: 5px;
  -o-border-radius: 5px;
  border-radius: 5px;
  margin: 0px;
  color: white;
  text-decoration: none;
}
body .content .code .move-demo-container .move-demo-button:hover {
  border: 1px solid;
}
body .content .code .move-demo-container .move-demo-button .move-demo-icon {
  display: inline;
  vertical-align: middle;
  margin-left: 5px;
  margin-bottom: 3px;
}
body .content .code .move-demo-container .move-demo-button .move-demo-icon path {
  stroke: white;
}
body .content .demo-nav-links {
  box-sizing: border-box;
  padding: 12px;
  height: 60px;
  display: flex;
  align-items: center;
  gap: 0 8px;
  position: relative;
  border-radius: 6px 6px 0 0;
  border: 1px solid;
  justify-content: right;
}
body .content .demo-nav-links a {
  text-decoration: none;
  display: flex;
  font-size: 16px;
  align-items: center;
  justify-content: center;
  height: 24px;
  width: 24px;
  border: none;
  padding: 6px;
}
body .content .demo-nav-links a:focus-visible {
  outline: 2px solid;
  outline-offset: 0px;
}
body .content .demo-nav-links a svg {
  height: 24px;
  width: 24px;
}
body .content .demo-nav-links a.adaptivity-switcher {
  width: auto;
}
body .content .demo-nav-links span.nav-border {
  width: 1px;
  height: 46px;
}
body .content .demo-nav-links button#fullScreenLink {
  display: flex;
  justify-content: center;
  align-items: center;
  padding: 6px;
  border: none;
  cursor: pointer;
}
body .content .demo-nav-links button#fullScreenLink #open-full-screen {
  display: block;
}
body .content .demo-nav-links button#fullScreenLink #close-full-screen {
  display: none;
}
body .content .demo-nav-links span.separator {
  width: 1px;
  height: 24px;
}
body .content .demo-nav-links a,
body .content .demo-nav-links button#fullScreenLink {
  border-radius: 50px;
}
body .content .demo-nav-links .justify-left {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  margin-right: auto;
  overflow-x: hidden;
}
body .content .demo-nav-links .justify-left svg {
  flex-shrink: 0;
}
body .content .demo-nav-links .uitg-button {
  padding: 6px 16px 6px 8px;
  min-width: unset;
  width: 70%;
  /*width: auto;*/
  height: 36px;
  overflow-x: hidden;
}
body .content .demo-nav-links .uitg-button:last-of-type {
  margin-right: auto;
}
body .content .demo-nav-links .themes-container .dx-texteditor.dx-editor-outlined {
  border: none;
}
body .content .demo-nav-links .demo-nav-arrows {
  display: flex;
}
body .content:not(.document__body) .doc-content h5.see-also + ul li:before {
  content: "";
  border-radius: 3px;
  border: 3px solid;
  display: inline-block;
  margin-right: 15px;
}
body .debug-invalid-model-popup {
  position: fixed;
  bottom: 80px;
  right: 0;
  padding: 10px;
  width: 300px;
  z-index: 9999;
}
body #docerror.error {
  position: static;
  height: auto;
  margin: 118px auto;
}
body a {
  outline: none;
  text-decoration: none;
}
body .doc-content.wide-demo {
  flex-direction: column;
}
body .doc-content.wide-demo .demo-details {
  max-width: inherit;
}
body .doc-content nav,
body .doc-content section {
  display: block;
}
body .doc-content .nav {
  margin-bottom: 20px;
  margin-left: 0;
  list-style: none;
}
body .doc-content .nav-tabs:after {
  clear: both;
}
body .doc-content .hide {
  display: none;
}
body .doc-content .tab-content {
  overflow: auto;
}
body .doc-content .tab-content > .tab-pane,
body .doc-content .pill-content > .pill-pane {
  display: none;
}
body .doc-content .tab-content > .active,
body .doc-content .pill-content > .active {
  display: block;
}
body .doc-content code .prettyprint,
body .doc-content pre .prettyprint {
  margin-bottom: 20px;
}
body .doc-content code code,
body .doc-content pre code {
  padding: 0;
  color: inherit;
  white-space: pre;
  white-space: pre-wrap;
  background-color: transparent;
  border: 0;
}
body .doc-content code {
  padding: 2px 4px;
  white-space: nowrap;
  border: 1px solid;
  display: inline;
}
body .doc-content .pre-scrollable {
  max-height: 340px;
  overflow-y: scroll;
}
body .doc-content .nav-tabs > .active > a,
body .doc-content .nav-tabs > .active > a:focus {
  cursor: default;
  border: 1px solid;
  border-bottom-color: transparent;
}
body .doc-content .codeTabs.nav.nav-tabs {
  padding: 20px 0 0 0;
  border-bottom: 2px solid;
}
body .doc-content .codeTabs.nav.nav-tabs li {
  float: none;
  display: inline-block;
}
body .doc-content .codeTabs.nav.nav-tabs li a {
  border: none;
  padding: 8px 12px;
  line-height: 36px;
  margin: 0;
}
body .doc-content .codeTabs.nav.nav-tabs li.active {
  border-top: 2px solid;
  border-left: 2px solid;
  border-right: 2px solid;
}
body .doc-content .codeTabs.nav.nav-tabs li.active a {
  padding-bottom: 12px;
}
body .button:not(.feedback__button) {
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  display: inline-block;
  font-size: 16px;
  font-family: 'Roboto', sans-serif;
  font-weight: normal;
  position: relative;
  text-decoration: none;
  text-align: center;
  white-space: nowrap;
  cursor: pointer;
  height: 22px;
  line-height: 22px;
  vertical-align: middle;
  box-sizing: initial;
  border: 1px solid;
  -webkit-border-radius: 50px;
  -moz-border-radius: 50px;
  -ms-border-radius: 50px;
  -o-border-radius: 50px;
  border-radius: 50px;
}
body .button:not(.feedback__button).small {
  font-size: 13px;
}
body .button:not(.feedback__button).large {
  width: 400px;
  font-size: 24px;
}
body .button:not(.feedback__button).center {
  margin-left: auto;
  margin-right: auto;
  display: block;
}
body .button:not(.feedback__button).btn-show-demo {
  margin-bottom: 15px;
}
body .button:not(.feedback__button).fiddle {
  height: 40px;
  display: inline-flex;
  gap: 0 10px;
  border: none;
  padding: 0 16px;
}
body .button:not(.feedback__button).fiddle .button-text {
  align-self: center;
}
body .button:not(.feedback__button).reset,
body .button:not(.feedback__button).apply {
  padding: 8px 20px;
  float: right;
  align-items: center;
  border: none;
  margin-right: 16px;
  height: 40px;
  box-sizing: border-box;
}
body .button:not(.feedback__button).apply {
  border: 1px solid;
}
body .button:not(.feedback__button).backend {
  border-radius: 4px;
  padding: 8px 20px;
  width: 100px;
  margin: 5px 1px 5px -17px;
}
body .dx-list-group-header {
  margin: 0;
  padding: 8px 15px;
  border-bottom: none;
  font-weight: normal;
}
body #reset,
body #apply {
  width: 72px;
}
body .dx-dropdownlist-popup-wrapper .dx-list:not(.dx-list-select-decorator-enabled) .dx-list-item-content {
  padding: 5px 15px 5px 0;
}
body .dx-popup-content {
  padding: 0;
}
body .adaptivity-switcher {
  position: absolute;
  left: 45%;
}
body .adaptivity-switcher .switcher-item-wrapper {
  cursor: pointer;
  box-sizing: border-box;
  height: 38px;
  border-radius: 8px;
}
body .adaptivity-switcher .switcher-item-wrapper.landscape {
  padding: 8px 6px;
}
body .adaptivity-switcher .switcher-item-wrapper.landscape .switcher-item {
  width: 24px;
  height: 14px;
}
body .adaptivity-switcher .switcher-item-wrapper.landscape .switcher-item .inner {
  display: block;
  position: relative;
  left: 3px;
  top: 2px;
  height: 10px;
  width: 18px;
}
body .adaptivity-switcher .switcher-item-wrapper.portrait {
  padding: 6px 11px;
}
body .adaptivity-switcher .switcher-item-wrapper.portrait .switcher-item {
  width: 14px;
  height: 24px;
}
body .adaptivity-switcher .switcher-item-wrapper.portrait .switcher-item .inner {
  display: block;
  position: relative;
  left: 2px;
  top: 3px;
  height: 18px;
  width: 10px;
}
body .adaptivity-switcher .switcher-item-wrapper .switcher-item {
  display: inline-block;
  cursor: pointer;
  border-radius: 2px;
}
body #themeChooserPopup.dx-overlay-content {
  -webkit-border-radius: 16px;
  -moz-border-radius: 16px;
  -ms-border-radius: 16px;
  -o-border-radius: 16px;
  border-radius: 16px;
  border: none;
}
body #copy-to-code-codepen,
body #copy-to-code-sandbox {
  border: 0px;
  padding: 6px 16px 6px 8px;
  white-space: nowrap;
  overflow: hidden;
}
body #copy-to-code-codepen svg,
body #copy-to-code-sandbox svg {
  flex-shrink: 0;
}
@media only screen and (max-width: 1900px) {
  body .content .doc-content.wide-demo {
    flex-flow: column;
  }
}
@media only screen and (max-width: 1600px) {
  body .content .doc-content .simulator-content-box {
    flex-direction: column !important;
  }
  body .content .doc-content .demo-panel-box {
    flex: 1 !important;
  }
  body .content .doc-content .demo-details {
    flex: 1 !important;
  }
}
@media only screen and (max-width: 1080px) {
  body .content .doc-content #widgetAccordion {
    display: none;
  }
  body .content .doc-content #widgetAccordion .widget-tree-main .widget-tree {
    display: none;
  }
  body .content .doc-content #widgetAccordion .widget-tree-main .widget-view {
    position: initial;
    height: 500px;
  }
}
@media only screen and (max-width: 1200px) {
  body .doc-content {
    padding: 32px 40px 40px 40px !important;
  }
}
@media screen and (max-width: 768px) {
  body .doc-content {
    padding: 32px 24px 32px 24px !important;
  }
  body .axe-box-with-btn {
    flex-direction: column !important;
  }
}
body.hidden-menu .widgets-menu-container {
  display: none;
}
body.hidden-menu .page-wrapper .doc-content {
  margin-left: 0;
}
body.hidden-menu .view-content {
  margin-left: 0;
}
body .body-container.content-width {
  padding-top: 70px;
}
body h1,
body h5 {
  font-family: 'Roboto', sans-serif;
  margin: 0;
}
body h2,
body h3,
body h4 {
  font-family: 'Roboto', sans-serif;
  margin: 0;
}
body h1 {
  font-weight: 700;
  font-size: 32px;
  padding: 0 0 16px 0;
}
body h2 {
  font-size: 24px;
  padding: 24px 0 12px 0;
}
body h3 {
  font-size: 20px;
  padding: 20px 0 10px 0;
}
body h4 {
  font-size: 20px;
  padding: 16px 0 8px 0;
}
body h5 {
  padding: 16px 0 8px 0;
}
body ul,
body li {
  margin: 0;
}
body .btn-text-overflow {
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
body .page-wrapper {
  position: relative;
  overflow: hidden;
  min-height: 100%;
  margin-bottom: -120px;
}
body .page-wrapper:after {
  content: '';
  display: block;
  height: 120px;
}
body .clear {
  clear: both;
}
body .dx-loadpanel-content {
  padding: 10px;
  border: 1px solid;
  text-align: center;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  -webkit-touch-callout: none;
  -webkit-user-drag: none;
  border-radius: 5px;
}
body .dx-overlay-wrapper.dx-loadpanel-wrapper {
  z-index: 1 !important;
}
body .dx-overlay-wrapper.dx-loadpanel-wrapper .dx-loadpanel-content.dx-loadpanel-pane-hidden {
  z-index: 1 !important;
}
body .dx-overlay-wrapper.dx-loadpanel-wrapper .dx-loadpanel-content.dx-loadpanel-pane-hidden .dx-loadindicator {
  width: 60px;
  height: 60px;
}
body .dx-overlay-wrapper.dx-loadpanel-wrapper .dx-loadpanel-content.dx-loadpanel-pane-hidden .dx-loadindicator .dx-loadindicator-icon .dx-loadindicator-segment {
  background: #7d8793;
}
body .dx-overlay-wrapper.dx-loadpanel-wrapper .dx-loadpanel-content.dx-loadpanel-pane-hidden .dx-loadpanel-message {
  color: #7d8793;
  font-size: 15px;
  line-height: 21px;
  margin-top: 10px;
}
body .whats-new-subpanel-container .space {
  display: none;
}
body .background-block p {
  font-size: 16px;
  line-height: 24px;
}
body .full-screen-demo .content .doc-content {
  display: none;
}
body .content {
  padding-top: 40px;
}
body .content .doc-content {
  width: auto;
  margin-left: 340px;
  margin-right: auto;
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  padding: 32px 40px;
}
body .content .doc-content.index {
  display: flex;
  flex-flow: column;
  gap: 40px;
}
body .content .doc-content.index p {
  margin: 0;
}
body .content .doc-content.index h1.page-title {
  padding: 0 0 16px 0;
}
body .content .doc-content.index h3.block-title {
  padding: 0;
}
body .content .doc-content.index h3.block-title + p {
  padding: 16px 0 0 0;
}
body .content .doc-content.index .page-block-header {
  padding: 0 0 40px 0;
}
body .content .doc-content.index .components-list-page-block .page-block-header {
  padding: 0;
}
body .content .doc-content.index .featured-components-container {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  gap: 20px;
  margin: 0;
}
body .content .doc-content.index .featured-components-container .component-container {
  padding: 8px;
  width: 120px;
  box-sizing: border-box;
  border-radius: 8px;
  display: flex;
  align-items: center;
  flex-direction: column;
  gap: 12px;
}
body .content .doc-content.index .featured-components-container .component-container .component-icon {
  width: 64px;
  height: 64px;
}
body .content .doc-content.index .featured-components-container .component-container .component-link {
  font-weight: normal;
  font-size: 16px;
  line-height: 24px;
  text-align: center;
}
body .content .doc-content.index .components-list-container {
  column-width: 200px;
  margin: 8px 0 32px 0;
}
body .content .doc-content.index .components-list-container .category-container {
  padding-top: 32px;
  break-inside: avoid;
  min-width: 200px;
}
body .content .doc-content.index .components-list-container .category-container .category-title {
  font-weight: 700;
  font-size: 14px;
  line-height: 20px;
  margin-bottom: 8px;
}
body .content .doc-content.index .components-list-container .category-container .demos-list {
  display: flex;
  flex-flow: column;
  gap: 8px;
}
body .content .doc-content.index .components-list-container .category-container .demos-list .link-container a {
  line-height: 20px;
  text-decoration: underline;
}
body .content .doc-content.index .components-list-container .category-container .demos-list .link-container:after {
  display: inline-block;
  color: white;
  font-size: 14px;
  line-height: 20px;
  height: 20px;
  font-weight: 500;
  padding: 0 6px;
  margin-left: 6px;
  border-radius: 50px;
  text-decoration: none;
}
body .content .doc-content.index .components-list-container .category-container .demos-list .link-container.Roadmap:after {
  content: "In Progress";
  background-color: #ff9000;
}
body .content .doc-content.index .components-list-container .category-container .demos-list .link-container.New:after {
  content: "New";
  background-color: #dd1144;
}
body .content .doc-content.index .components-list-container .category-container .demos-list .link-container.Updated:after {
  content: "Upd";
  background-color: #42b883;
}
body .content .doc-content .reference-button {
  font-size: 18px;
  padding: 4px 16px;
  margin-bottom: 16px;
}
body .content .doc-content .apiReferenceSection,
body .content .doc-content .documentationSection {
  padding-right: 30px;
  padding-top: 0;
  padding-bottom: 0;
  margin-top: 0;
  margin-bottom: 0;
}
body .content .doc-content .apiReferenceSection h2.api-header,
body .content .doc-content .documentationSection h2.api-header {
  font-size: 30px;
  font-family: 'Roboto', sans-serif;
  font-weight: bold;
  padding-top: 24px;
  padding-bottom: 12px;
  margin-top: 0;
  margin-bottom: 0;
}
body .content .doc-content .apiReferenceSection .short-description,
body .content .doc-content .documentationSection .short-description,
body .content .doc-content .apiReferenceSection .full-description-offset,
body .content .doc-content .documentationSection .full-description-offset,
body .content .doc-content .apiReferenceSection .parameter-description,
body .content .doc-content .documentationSection .parameter-description,
body .content .doc-content .apiReferenceSection .git-edit-paragraph,
body .content .doc-content .documentationSection .git-edit-paragraph {
  font-family: 'Roboto', sans-serif;
  font-size: 16px;
  line-height: 24px;
}
body .content .doc-content .apiReferenceSection .short-description:hover .git-edit-link,
body .content .doc-content .documentationSection .short-description:hover .git-edit-link,
body .content .doc-content .apiReferenceSection .full-description-offset:hover .git-edit-link,
body .content .doc-content .documentationSection .full-description-offset:hover .git-edit-link,
body .content .doc-content .apiReferenceSection .parameter-description:hover .git-edit-link,
body .content .doc-content .documentationSection .parameter-description:hover .git-edit-link,
body .content .doc-content .apiReferenceSection .git-edit-paragraph:hover .git-edit-link,
body .content .doc-content .documentationSection .git-edit-paragraph:hover .git-edit-link {
  visibility: visible;
}
body .content .doc-content p {
  margin: 0 0 16px 0;
}
body .content .doc-content li,
body .content .doc-content p {
  font-size: 16px;
  line-height: 24px;
  font-family: 'Roboto';
}
body .content .doc-content li p {
  margin: 0 0 4px 0;
}
body .content .doc-content .short-description {
  position: relative;
}
body .content .doc-content .api-example {
  padding-bottom: 15px;
}
body .content .doc-content .anchor {
  height: 110px;
  margin-top: -110px;
  visibility: hidden;
  display: block;
  position: absolute;
}
body .content .doc-content .note {
  padding: 16px;
  font-size: 16px;
  line-height: 24px;
  margin: 24px 0;
}
body .content .doc-content .note .note-text ul {
  padding-bottom: 0;
}
body .content .doc-content .note .note-text ul li:last-child p {
  margin-bottom: 0;
}
body .content .doc-content .note.note-important {
  line-height: 24px;
  padding: 16px;
}
body .content .doc-content .note.note-important .note-header {
  padding-bottom: 4px;
}
body .content .doc-content .note .note-header {
  font-weight: bold;
  padding-bottom: 4px;
}
body .content .doc-content ul {
  padding: 0 0 12px 18px;
}
body .content .doc-content ul ul {
  list-style-type: disc;
}
body .content .doc-content img {
  max-width: 100%;
}
body .content .doc-content video {
  max-width: 100%;
}
body .content .doc-content .libs {
  font-size: 16px;
  line-height: 24px;
}
body .content .doc-content .libs:last-child {
  padding-bottom: 20px;
}
body .content .doc-content .accordion-hidden-content {
  display: none;
}
body .content .doc-content .dx-accordion-item-selected,
body .content .doc-content .dx-accordion-item-opened {
  border-radius: 8px;
  margin-bottom: 7px;
}
body .content .doc-content .accordion-content .dx-accordion-item-closed {
  padding-bottom: 50px;
}
body .content .doc-content .accordion-content .dx-accordion-item {
  border: 1px solid transparent;
}
body .content .doc-content .accordion-content .dx-accordion-item-title,
body .content .doc-content .accordion-content .dx-accordion-item-body {
  padding: 8px 58px 8px 16px;
}
body .content .doc-content .accordion-content .dx-accordion-item-title {
  font-size: 20px;
  font-family: 'Roboto', sans-serif;
  padding-right: 22px;
  border-radius: 8px;
}
body .content .doc-content .accordion-content .dx-accordion-item-title:hover {
  height: 43px;
}
body .content .doc-content .accordion-content .dx-accordion-item-title:before {
  line-height: 28px;
}
body .content .doc-content .accordion-content .dx-accordion-item-title svg {
  height: 24px;
  width: 24px;
  vertical-align: bottom;
  margin-right: 8px;
}
body .content .doc-content .accordion-content .dx-accordion-item-body {
  padding-top: 0;
  border: none;
}
body .content .doc-content .accordion-content .dx-accordion-item-body .accordion-item-content > p:first-child {
  margin-bottom: 7px;
}
body .content .doc-content .accordion-content .dx-accordion-item-body .vote-text {
  line-height: 38px;
}
body .content .doc-content .accordion-content .dx-accordion-item-body .code-type,
body .content .doc-content .accordion-content .dx-accordion-item-body .numbers,
body .content .doc-content .accordion-content .dx-accordion-item-body pre {
  z-index: unset;
}
body .content .doc-content h5.see-also {
  font-size: 16px;
  line-height: 21px;
  font-family: 'Roboto', sans-serif;
  font-weight: 600;
  border-top: 1px solid;
  padding: 16px 0 8px 0;
  margin: 30px 0 0 0;
  font-weight: bold;
}
body .content .doc-content h5.see-also + ul,
body .content .doc-content h5.see-also + p {
  font-size: 16px;
  line-height: 24px;
  padding: 0 0 30px 0;
  margin: -8px 0 0 0;
}
body .content .doc-content h5.see-also + ul li {
  list-style-type: none;
  position: relative;
  padding: 8px 0 0 0;
}
body .content .doc-content h5.see-also + p {
  margin-top: 0;
  padding: 0 20px 20px 0;
}
body .content .doc-content .code-wrapper {
  position: relative;
  -moz-user-select: none;
  -ms-user-select: none;
  -webkit-user-select: none;
  user-select: none;
  border-spacing: 3px 0;
}
body .content .doc-content .code-wrapper.code-tabs {
  border-collapse: separate;
}
body .content .doc-content .code-wrapper.code-tabs .code-type {
  cursor: pointer;
  margin-right: 3px;
  display: table-cell;
  padding-left: 0.5rem;
  padding-right: 0.5rem;
  border-top-left-radius: 4px;
  border-top-right-radius: 4px;
  font-size: 14px;
}
body .content .doc-content .code-wrapper.code-tabs pre.prettyprint {
  display: none;
}
body .content .doc-content .code-wrapper.code-tabs pre.prettyprint.active {
  display: block;
}
body .content .doc-content .code-wrapper .code-type {
  border: 1px solid;
  border-bottom: none;
  display: table-cell;
  padding-left: 0.5rem;
  padding-right: 0.5rem;
  border-top-left-radius: 4px;
  border-top-right-radius: 4px;
  font-size: 14px;
}
body .content .doc-content .code-wrapper pre {
  margin: 0px;
  z-index: 2;
  position: relative;
  -webkit-border-radius: 4px;
  -moz-border-radius: 4px;
  -ms-border-radius: 4px;
  -o-border-radius: 4px;
  border-radius: 4px;
  border: 1px solid;
}
body .content .doc-content .code-wrapper pre.prettyprint {
  margin-bottom: 20px;
}
body .content .doc-content .code-wrapper pre.prettyprint ol.numbers li {
  font-size: 16px;
  color: #bebec5;
}
body .content .doc-content .code-wrapper ul.linenums {
  padding-bottom: 0;
}
body .content .doc-content .code-wrapper ul.linenums li {
  font-size: 16px;
  text-shadow: none;
}
body .content .doc-content div.download-code-button {
  padding-bottom: 20px;
}
body .content .doc-content .api-header {
  display: inline-block;
  font-size: 36px;
  font-family: 'Roboto', sans-serif;
  font-weight: bold;
}
body .content .doc-content .api-header a {
  font-size: 30px;
  font-family: 'Roboto', sans-serif;
  line-height: 35px;
}
body .content .doc-content .api-property-block .api-property {
  border-left: 3px solid;
  padding-left: 10px;
  font-size: 16px;
  line-height: 20px;
  margin-bottom: 16px;
}
body .content .doc-content .api-property-block .api-property:not(:last-child) {
  padding-bottom: 8px;
}
body .content .doc-content .api-property-block .api-property p {
  display: inline;
  white-space: nowrap;
  font-size: 16px;
}
body .content .doc-content .api-property-block .api-property.no-margin {
  margin-bottom: 0;
}
body .content .doc-content .api-property-block .api-property span.api-property-name {
  font-weight: normal;
}
body .content .doc-content .api-property-block .api-property .type-fields-offset {
  padding-left: 20px;
}
body .content .doc-content .api-property-block .api-property .type-offset {
  padding-left: 0px;
  padding-top: 8px;
}
body .content .doc-content .api-property-block .api-property .parameter-name:not(:first-child) {
  padding-top: 10px;
}
body .content .doc-content .api-property-block .api-property .parameter-name .deprecated {
  background: url(/Content/Images/Documentation/icon-attention-small.png) no-repeat center right;
  height: 12px;
  width: 16px;
  display: inline-block;
}
body .content .doc-content .api-property-block .api-property .parameter-description {
  padding-top: 8px;
  position: relative;
}
body .content .doc-content .api-property-block .api-property .parameter-description p {
  white-space: pre-wrap;
  font-size: 16px;
  margin: 0;
}
body .content .doc-content .api-property-block .api-property .parameter-description li {
  font-size: 16px;
}
body .content .doc-content .api-property-block .api-property .parameter-description ul {
  padding-bottom: 0;
}
body .content .doc-content .api-property-block .api-property .parameter-description ul li {
  font-size: 12px;
  text-shadow: none;
}
body .content .doc-content .full-description-offset {
  position: relative;
  margin-top: 15px;
}
body .content .doc-content .simple-table {
  font-size: 16px;
  margin-bottom: 20px;
}
body .content .doc-content .simple-table table {
  border-collapse: collapse;
}
body .content .doc-content .simple-table table td:first-child {
  text-align: center;
}
body .content .doc-content .simple-table:not(.normal-font-style) table td:first-child {
  font-style: italic;
}
body .content .doc-content .simple-table td,
body .content .doc-content .simple-table th {
  padding: 5px 20px;
  border: 2px solid;
}
body .content .doc-content .dx-table {
  border-collapse: collapse;
  font-size: 16px;
  margin-bottom: 20px;
  font-family: 'Roboto', sans-serif;
}
body .content .doc-content .dx-table tr th {
  text-align: left;
  font-weight: normal;
  border-bottom: 2px solid;
}
body .content .doc-content .dx-table tr td.member-name a {
  font-size: 16px;
}
body .content .doc-content .dx-table tr th,
body .content .doc-content .dx-table tr td {
  padding: 5px 20px;
}
body .content .doc-content .dx-table tr .parameter-name {
  width: 16%;
}
body .content .doc-content .dx-table tr .parameter-type {
  width: 20%;
}
body .content .doc-content .dx-table tr .parameter-description {
  position: relative;
}
body .content .doc-content .dx-table.full-width {
  width: 100%;
}
body .content .doc-content .dx-table.full-width tr > td:first-child {
  width: 20%;
}
body .content .doc-content .dx-table p {
  margin: 0;
}
body .content .doc-content .multicolumn-list tr > td {
  width: 33.3%;
  padding: 10px;
  vertical-align: text-top;
}
body .content .doc-content .multicolumn-list tr > td ul {
  list-style-position: outside;
}
body .content .doc-content .multicolumn-list tr > td ul li {
  padding: 4px;
}
body .content .doc-content .footnotes {
  width: 300px;
  margin-bottom: 30px;
  border-top: 1px solid;
}
body .content .doc-content .footnotes ol,
body .content .doc-content .footnotes ul {
  margin-top: 10px;
  padding: 0;
  list-style: none;
}
body .content .doc-content .footnotes ol li,
body .content .doc-content .footnotes ul li {
  font-size: 12px;
  counter-increment: custom;
}
body .content .doc-content .footnotes ol > li::before {
  font-size: 0.8em;
  vertical-align: text-top;
  content: counter(custom) " - ";
}
body .content .doc-content .footnotes ul > li::before {
  content: "* - ";
}
body .content .doc-content .three-col {
  -moz-column-count: 3;
  -moz-column-gap: 20px;
  -webkit-column-count: 3;
  -webkit-column-gap: 20px;
}
body .content .doc-content .documentation-gallery {
  position: relative;
  margin: 0 auto;
  margin-bottom: 50px;
}
body .content .doc-content .documentation-gallery .gallery-border {
  position: absolute;
  z-index: 2;
  border: solid 1px;
  bottom: 0;
  right: 0;
  left: 0;
  top: 0;
}
body .content .doc-content .documentation-gallery .gallery-border .arrow {
  width: 34px;
  height: 45px;
  position: absolute;
  top: 50%;
  margin-top: -23px;
  cursor: pointer;
  background-position: center;
  background-repeat: no-repeat;
  border: solid 1px;
  background-color: white;
}
body .content .doc-content .documentation-gallery .gallery-border .left-arrow {
  left: -17px;
  background-image: url('/Content/Images/Documentation/arrow-prev.svg');
}
body .content .doc-content .documentation-gallery .gallery-border .right-arrow {
  right: -17px;
  background-image: url('/Content/Images/Documentation/arrow-next.svg');
}
body .content .doc-content .documentation-gallery .dx-gallery-wrapper {
  position: absolute;
  bottom: -30px;
  top: 0;
  height: auto;
}
body .content .doc-content .documentation-gallery .dx-gallery-wrapper .gallery-content {
  padding-bottom: 30px;
}
body .content .doc-content .documentation-gallery .dx-gallery-wrapper .gallery-content h4 {
  font-size: 20px;
  font-family: 'Roboto', sans-serif;
  font-weight: bold;
  padding-top: 16px;
  padding-bottom: 8px;
}
body .content .doc-content .documentation-gallery .gallery-item .image {
  position: absolute;
  bottom: 100px;
  top: 0;
  width: 100%;
  background-repeat: no-repeat;
  background-position: center center;
  box-sizing: border-box;
  border-left: 15px solid;
  border-right: 15px solid;
}
body .content .doc-content .documentation-gallery .gallery-item .text {
  position: absolute;
  height: 90px;
  bottom: 30px;
  width: 100%;
  display: table;
}
body .content .doc-content .documentation-gallery .gallery-item .text div {
  vertical-align: middle;
  display: table-cell;
  height: 90px;
}
body .content .doc-content .api-example .show-text {
  color: #7f7f7f;
  padding-bottom: 3px;
  font-size: 16px;
}
body .content .doc-content .api-example .approach-tab-container:after {
  content: "";
  display: table;
  clear: both;
}
body .content .doc-content .api-example .approach-tab-container .button.approach-switcher {
  min-width: 90px;
  margin-right: -2px;
  display: block;
  float: left;
  white-space: normal;
  background-color: white;
  color: red;
}
body .content .doc-content .api-example .approach-tab-container .button.approach-switcher:after {
  border: 4px solid transparent;
  border-top: 4px solid;
  content: "";
  margin-top: 9px;
  float: right;
}
body .content .doc-content .api-example .approach-tab-container .button.approach-switcher.current:after {
  border-top: none;
  border-bottom: 4px solid;
}
body .content .doc-content .api-example .approach-tab {
  display: none;
}
body .content .doc-content .api-example .approach-tab.visible {
  display: block;
}
body .content .doc-content.search-page .header h1 {
  font-size: 36px;
  font-family: 'Roboto', sans-serif;
  font-weight: 700;
  margin-top: 0;
  margin-bottom: 0;
}
body .content .doc-content.search-page .header ul.search-counts {
  padding: 0 0 15px 0;
  list-style: none;
  border-bottom: 1px solid;
  white-space: nowrap;
}
body .content .doc-content.search-page .header ul.search-counts li {
  display: inline;
  padding: 0;
  margin-right: 30px;
}
body .content .doc-content.search-page .header ul.search-counts li .count {
  font-weight: bold;
}
body .content .doc-content.search-page .header ul.search-counts li.search-new-window a {
  background-image: url(/Content/Images/Documentation/icon-new-win.svg);
  background-repeat: no-repeat;
  background-position: 100% 75%;
  padding-right: 18px;
}
body .content .doc-content.search-page .header ul.search-counts li:first-child:not(.active) {
  padding-left: 0px;
}
body .content .doc-content.search-page .header ul.search-counts li.active {
  border-bottom: 2px solid;
  padding-bottom: 15px;
}
body .content .doc-content.search-page .header:after {
  content: '';
  display: block;
  clear: both;
}
body .content .doc-content.search-page h4 {
  font-size: 20px;
  font-family: 'Roboto', sans-serif;
  font-weight: bold;
  padding-top: 30px;
  padding-bottom: 10px;
  margin: 0;
}
body .content .doc-content.search-page h4 a {
  font-size: 24px;
}
body .content .doc-content.search-page .article-type {
  line-height: 24px;
}
body .content .doc-content.search-page .article-type p {
  margin: 10px 0;
}
body .content .doc-content.search-page .article-type:nth-last-of-type(1) {
  padding-bottom: 10px;
}
body .content .doc-content.search-page p {
  line-height: 24px;
}
body .content .doc-content.search-page .pagination {
  text-align: right;
  padding-bottom: 50px;
  padding-top: 10px;
}
body .content .doc-content.search-page .pagination .pagination-title {
  display: none;
}
body .content .doc-content.search-page .pagination .activeItem-item,
body .content .doc-content.search-page .pagination a {
  display: inline-block;
  height: 50px;
  width: 50px;
  border-radius: 25px;
  vertical-align: middle;
  text-align: center;
  line-height: 50px;
}
body .content .doc-content.search-page .pagination .activeItem-item.arrow-item,
body .content .doc-content.search-page .pagination a.arrow-item {
  background: no-repeat center;
}
body .content .doc-content.search-page .pagination .activeItem-item.arrow-item.left,
body .content .doc-content.search-page .pagination a.arrow-item.left {
  -webkit-mask-image: url('/Content/Images/Documentation/arrow-prev.svg');
  -webkit-mask-size: contain;
  -webkit-mask-repeat: no-repeat;
  -webkit-mask-position: center;
  background-color: #627789;
}
body .content .doc-content.search-page .pagination .activeItem-item.arrow-item.right,
body .content .doc-content.search-page .pagination a.arrow-item.right {
  -webkit-mask-image: url('/Content/Images/Documentation/arrow-next.svg');
  -webkit-mask-size: contain;
  -webkit-mask-repeat: no-repeat;
  -webkit-mask-position: center;
  background-color: #627789;
}
body .content .doc-content .api-header,
body .content .doc-content .article-section-header {
  position: relative;
  margin-left: -30px;
  padding-left: 30px;
}
body .content .doc-content .api-header .visible-anchor,
body .content .doc-content .article-section-header .visible-anchor {
  width: 20px;
  height: 20px;
  position: absolute;
  top: 50%;
  margin-left: -30px;
  padding-right: 10px;
  background-image: url(/Content/ImagesNew/Doc/link.svg);
  background-position: left center;
  background-repeat: no-repeat;
  visibility: hidden;
}
body .content .doc-content .api-header:hover .visible-anchor {
  visibility: visible;
  margin-top: -3px;
}
body .content .doc-content .article-section-header:hover .visible-anchor {
  visibility: visible;
}
body .content .doc-content .article-header,
body .content .doc-content .api-header {
  position: relative;
  font-family: 'Roboto', sans-serif;
  font-weight: bold;
}
body .content .doc-content .article-header .badge,
body .content .doc-content .api-header .badge {
  position: absolute;
  top: 0;
  margin-left: 5px;
  font-size: 11px;
  font-weight: bold;
  padding: 0 2px 0 2px;
  border-radius: 2px;
  line-height: 15px;
}
body .content .doc-content .axe-block {
  margin-bottom: 16px;
  min-width: 760px;
  width: 100%;
}
body .content .doc-content .axe-report {
  display: flex;
  flex-direction: row;
  padding: 16px 24px;
  gap: 16px;
  border: 1px solid;
  border-radius: 8px;
}
body .content .doc-content .axe-report svg {
  flex: 0 0 100px;
  align-self: center;
}
body .content .doc-content .axe-report .axe-header {
  font-family: Roboto;
  font-weight: 600;
  font-size: 20px;
  line-height: 24px;
}
body .content .doc-content .axe-report .axe-box-with-btn {
  display: flex;
  flex-direction: row;
  gap: 16px;
}
body .content .doc-content .axe-report .axe-box {
  display: flex;
  flex-direction: column;
  gap: 12px;
}
body .content .doc-content .axe-report .axe-text {
  font-family: Roboto;
  font-size: 14px;
  font-weight: 400;
  line-height: 20px;
  text-align: left;
}
body .content .doc-content .axe-report .axe-trademark {
  font-family: Roboto;
  font-size: 12px;
  font-weight: 400;
  line-height: 18px;
  text-align: left;
}
body .content .doc-content .axe-report .axe-button {
  display: block;
  padding: 10px 20px;
  border-radius: 40px;
  width: 190px;
  min-width: unset;
  white-space: nowrap;
  align-self: center;
  align-items: center;
  justify-content: center;
  box-shadow: 0px 2px 12px 0px #00000014, 0px 1px 4px 0px #0000000f;
  font-family: Roboto;
  font-size: 16px;
  font-weight: 500;
  line-height: 24px;
  cursor: pointer;
  border: none;
}
body .content .doc-content .axe-report .axe-button:focus,
body .content .doc-content .axe-report .axe-button:focus-visible {
  outline: none;
}
body .content .doc-content .axe-report sup {
  position: relative;
  font-size: 70%;
  line-height: 0;
  vertical-align: baseline;
  top: -0.8em;
}
body .content .doc-content .axe-note {
  height: 32px;
  margin-top: 16px;
  display: flex;
  flex: 0 0 1397px;
  justify-content: left;
  align-items: center;
  vertical-align: middle;
  padding: 4px 8px;
  gap: 8px;
  border-radius: 8px;
  font-family: Roboto;
  font-size: 14px;
  font-weight: 400;
  line-height: 18px;
  text-align: left;
}
body .content .doc-content .roadmap-survey-block {
  display: flex;
  flex-direction: row;
  gap: 32px;
  padding: 16px 24px;
  border: 1px solid;
  border-radius: 8px;
}
body .content .doc-content .roadmap-survey-text-block {
  display: flex;
  flex-direction: column;
  gap: 12px;
}
body .content .doc-content .roadmap-survey-header {
  display: flex;
  gap: 8px;
  font-family: Roboto;
  font-size: 20px;
  font-weight: 600;
  line-height: 24px;
  text-align: left;
}
body .content .doc-content .roadmap-survey-header svg {
  flex-shrink: 0;
}
body .content .doc-content .roadmap-survey-text {
  font-family: Roboto;
  font-size: 14px;
  font-weight: 400;
  line-height: 20px;
  text-align: left;
}
body .content .doc-content .roadmap-survey-button {
  height: 44px;
  align-self: center;
  padding: 10px 20px 10px 16px;
  min-width: unset;
  width: fit-content;
  white-space: nowrap;
}
body .content .doc-content .roadmap-image-block {
  max-height: 550px;
  border: 1px solid;
  border-radius: 8px;
  padding: 24px;
  display: flex;
  align-items: center;
  align-content: center;
}
body .content .doc-content .roadmap-image-block img {
  max-width: 75%;
  max-height: 550px;
  margin-left: auto;
  margin-right: auto;
}
body .content .doc-content .simulator-wrapper {
  min-width: 760px;
  width: 100%;
  margin-bottom: 32px;
}
body .content .doc-content .simulator-wrapper .simulator-content-box {
  width: 100%;
  display: flex;
  flex-direction: row;
  box-sizing: border-box;
  gap: 20px;
}
body .content .doc-content .simulator-wrapper .demo-panel-box {
  flex: 3 1 1000px;
}
body .content .doc-content .simulator-wrapper.surveyjs {
  padding-bottom: 0px;
  display: flex;
  flex-direction: column;
  gap: 32px;
  min-width: 360px;
}
body .content .doc-content .simulator-wrapper.surveyjs .description p:last-of-type {
  margin-bottom: 0px;
}
body .content .doc-content .simulator-wrapper.surveyjs .description,
body .content .doc-content .simulator-wrapper.surveyjs .second-description {
  margin: 0px;
  min-width: unset;
}
body .content .doc-content .description,
body .content .doc-content .second-description {
  box-sizing: border-box;
  position: relative;
  min-width: 760px;
  margin-bottom: 32px;
}
body .content .doc-content .description-expand,
body .content .doc-content .second-description-expand {
  z-index: 1;
  opacity: 1;
  height: auto;
}
body .content .doc-content .description code,
body .content .doc-content .second-description code {
  padding: 2px 4px;
  color: #dd1144;
  white-space: nowrap;
  border: 1px solid;
  display: inline;
  border-radius: 4px;
  font-size: 14px;
}
body .content .doc-content .description pre code,
body .content .doc-content .second-description pre code {
  border: none;
  display: inline-block;
  padding: 0;
  max-width: 900px;
  width: auto;
}
body .content .doc-content .description pre code .CodeMirror,
body .content .doc-content .second-description pre code .CodeMirror {
  border: 1px solid #e1e1e8;
  padding: 10px;
  border-radius: 4px;
  height: auto;
  z-index: 0;
}
body .content .doc-content .description pre code .CodeMirror pre,
body .content .doc-content .second-description pre code .CodeMirror pre {
  font-size: 12px;
}
body .content .doc-content .description pre code .CodeMirror-linenumber,
body .content .doc-content .second-description pre code .CodeMirror-linenumber {
  font-size: 12px;
}
body .content .doc-content .description .note,
body .content .doc-content .second-description .note {
  padding: 20px;
  font-size: 14px;
  margin-bottom: 10px;
}
body .content .doc-content .description .note .note-header,
body .content .doc-content .second-description .note .note-header {
  font-weight: bold;
}
body .content .doc-content .description p:last-of-type {
  margin-bottom: 8px;
}
body .content .doc-content .description-text a {
  text-decoration: underline;
}
body .content .doc-content .description-text p {
  text-size-adjust: 100%;
}
body .content .doc-content .simulators {
  min-height: 440px;
  border-radius: 0 0 6px 6px;
  border: 1px solid;
  border-top: none;
}
body .content .doc-content .simulators .demo-device {
  min-height: 440px;
  border-radius: 0 0 6px 6px;
}
body .content .doc-content .simulators .demo-device .demo-display {
  min-height: 440px;
  background: inherit;
  position: relative;
  border-radius: 0 0 6px 6px;
}
body .content .doc-content .simulators .demo-device .demo-display .demo-frame-container {
  height: 100%;
}
body .content .doc-content .simulators .demo-device .demo-display .demo-credits {
  text-align: right;
  font-size: 14px;
  color: #bfbfbf;
}
body .content .doc-content .simulators .demo-device .demo-display .load-panel {
  position: absolute;
  background: inherit;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  /* banner */

}
body .content .doc-content .simulators .demo-device .demo-display .load-panel .load-panel-banner-wrapper {
  display: flex;
  align-items: center;
  justify-content: center;
  height: 100%;
}
body .content .doc-content .simulators .demo-device .demo-display .load-panel .load-panel-banner-wrapper .load-panel-banner {
  max-width: 540px;
  box-sizing: border-box;
  padding: 20px;
  border: 1px solid #ffe4c2;
  border-radius: 8px;
  background-color: #ff900014;
}
body .content .doc-content .simulators .demo-device .demo-display .load-panel .load-panel-banner-wrapper .load-panel-banner p,
body .content .doc-content .simulators .demo-device .demo-display .load-panel .load-panel-banner-wrapper .load-panel-banner a {
  display: inline;
  font-size: 14px;
  line-height: 20px;
  font-weight: 400;
  color: #3f4d5a;
}
body .content .doc-content .simulators .demo-device .demo-display .load-panel .load-panel-banner-wrapper .load-panel-banner a {
  text-decoration: underline;
  color: #222930;
}
body .content .doc-content .simulators .demo-frame {
  width: 100%;
  min-height: 450px;
  margin: 0;
  padding: 0;
  border: 0;
  outline: 0;
  background-color: transparent;
  border-bottom-left-radius: 6px;
  border-bottom-right-radius: 6px;
}
body .content .doc-content .simulators .demo-frame-disabled {
  display: none;
}
body .content .doc-content .simulators #git-demo-frame {
  width: 100%;
  position: relative;
  z-index: 1;
  min-height: 440px;
}
body .content .doc-content .simulators.Mobile,
body .content .doc-content .simulators.TabletLandscape,
body .content .doc-content .simulators.TabletPortrait {
  box-shadow: none;
}
body .content .doc-content .simulators.Mobile .demo-device,
body .content .doc-content .simulators.TabletLandscape .demo-device,
body .content .doc-content .simulators.TabletPortrait .demo-device {
  border: 1px solid;
  border-radius: 15px;
}
body .content .doc-content .simulators.Mobile .demo-device .demo-display,
body .content .doc-content .simulators.TabletLandscape .demo-device .demo-display,
body .content .doc-content .simulators.TabletPortrait .demo-device .demo-display {
  border-radius: 2px;
  border: 1px solid;
}
body .content .doc-content .simulators.Mobile .demo-device .demo-display .demo-frame,
body .content .doc-content .simulators.TabletLandscape .demo-device .demo-display .demo-frame,
body .content .doc-content .simulators.TabletPortrait .demo-device .demo-display .demo-frame {
  height: 100%;
}
body .content .doc-content .simulators.TabletLandscape .demo-device {
  height: 511px;
  width: 780px;
  margin: 0 auto 0;
}
body .content .doc-content .simulators.TabletLandscape .demo-device .demo-display {
  margin-top: 14px;
  height: 480px;
  margin-left: 29px;
  width: 720px;
}
body .content .doc-content .simulators.TabletPortrait .demo-device {
  height: 780px;
  width: 511px;
  margin: 0 auto 0;
}
body .content .doc-content .simulators.TabletPortrait .demo-device .demo-display {
  margin-top: 29px;
  height: 720px;
  margin-left: 14px;
  width: 480px;
}
body .content .doc-content .simulators.Mobile .demo-device {
  height: 740px;
  width: 400px;
  margin: 10px auto 40px auto;
}
body .content .doc-content .simulators.Mobile .demo-device .demo-display {
  margin-top: 70px;
  height: 590px;
  margin-left: 20px;
  width: 360px;
}
body .content .doc-content .simulators.templates .demo-frame {
  min-height: 700px;
}
body .content .doc-content .simulators.simulators-no-border,
body .content .doc-content .simulators.simulators-no-border .demo-device,
body .content .doc-content .simulators.simulators-no-border .demo-device .demo-display {
  border: 0;
  padding: 0;
  box-shadow: none;
}
body .content .doc-content .title {
  padding-left: 40px;
}
body .content .marketing-demos .demos-container {
  padding: 32px;
  border-radius: 24px;
  display: flex;
  gap: 24px;
  flex-wrap: wrap;
}
body .content .marketing-demos .demo-link {
  flex: 1 350px;
  border-radius: 12px;
  box-shadow: 0px 2px 8px rgba(0, 0, 0, 0.12);
  display: grid;
  grid-template-rows: 1fr 1fr 1fr;
}
body .content .marketing-demos .demo-link:empty {
  visibility: hidden;
  height: none;
}
body .content .marketing-demos .demo-link-img {
  border-radius: 12px;
  grid-row-start: 1;
  grid-row-end: 5;
  grid-column: 1;
}
body .content .marketing-demos .demo-link-content {
  padding: 18px 24px;
  border-top: 1px solid;
  border-radius: 0 0 12px 12px;
  grid-row-start: 3;
  grid-row-end: 5;
  grid-column: 1;
}
body .content .marketing-demos .demo-link-content h5 {
  padding: 0 0 8px 0;
  font-style: normal;
  font-weight: 600;
  font-size: 20px;
  line-height: 125%;
}
body .content .marketing-demos .demo-link-content p {
  font-weight: 400;
  font-size: 16px;
  line-height: 135%;
}
body .content .top-content {
  position: relative;
  display: flex;
  gap: 32px;
  align-items: center;
}
body .content .top-content__expand {
  height: 36px;
  min-width: auto;
  border-width: 1px;
  padding: 6px 16px 6px 8px;
}
body .content .top-content__expand:focus-visible {
  outline-width: 0;
}
body .content .top-content__expand__svg {
  width: 24px;
  height: 24px;
}
body .content .top-content__expand__svg-visible,
body .content .top-content__expand__span-visible {
  display: block;
}
body .content .top-content__expand__svg-hide,
body .content .top-content__expand__span-hide {
  display: none;
}
body .content .top-content #report-design-btn {
  position: absolute;
  right: 0;
  height: 36px;
  top: 0;
}
body .content .top-content svg polygon,
body .content .top-content svg path,
body .content .top-content svg rect {
  fill: #8b949c;
}
body .content .top-content h1 {
  padding: 0;
}
body .content .top-content h1.New:after,
body .content .top-content h1.Updated:after,
body .content .top-content h1.Roadmap:after {
  left: -3px;
  font-size: 11px;
  padding: 2px 4px 3px 4px;
  font-family: 'Roboto', sans-serif;
  border-radius: 3px;
  position: relative;
  color: white;
  top: -13px;
  font-weight: 400;
}
body .content .top-content h1.New:after {
  content: "New";
  background-color: #f05b41;
}
body .content .top-content h1.Updated:after {
  content: "Updated";
  background-color: #1e70b9;
}
body .content .top-content h1.Roadmap:after {
  content: "In Progress";
  background-color: #a89cda;
}
body .content .demo-details {
  flex: 1 1 480px;
  align-items: stretch;
}
body .content .code {
  overflow: hidden;
  border: 1px solid;
  border-radius: 6px;
  max-height: calc(17%);
  height: calc(17%);
  min-height: 500px;
}
body .content .code .not-yet {
  height: 148px;
  font-size: 16px;
  text-align: center;
}
body .content .code .not-yet span {
  display: inline-block;
  margin-top: 64px;
}
body .content .code .tabs-container {
  display: flex;
  border-bottom: 1px solid;
  height: 60px;
}
body .content .code .tabs-container #code-tabs {
  width: 100%;
  display: inline-flex;
  justify-content: space-between;
}
body .content .code .tabs-container #code-tabs.has-arrow .tbs-arrows {
  display: flex;
  height: 100%;
}
body .content .code .tabs-container #code-tabs.has-arrow .tbs-children {
  overflow: hidden;
}
body .content .code .tabs-container #code-tabs.has-backend .switch {
  display: inline-flex;
}
body .content .code .tabs-container #code-tabs .switch {
  display: none;
}
body .content .code .tabs-container #code-tabs .switch::before {
  content: '';
  width: 1px;
  height: 100%;
  position: absolute;
  left: 0;
}
body .content .code .tabs-container #code-tabs .tbs-children-container {
  height: 60px;
}
body .content .code .tabs-container #code-tabs .tbs-arrows {
  display: none;
}
body .content .code .tabs-container #code-tabs .tbs-arrow {
  display: flex;
  min-width: 32px;
  height: 100%;
  padding: 0;
  border-radius: 0;
}
body .content .code .tabs-container #code-tabs .tbs-children {
  width: 100%;
  border: none;
  align-items: flex-start;
  justify-content: start;
}
body .content .code .tabs-container #code-tabs .tbs-children-container {
  position: relative;
  display: inline-flex;
  justify-content: flex-start;
}
body .content .code .tabs-container #code-tabs .tbs-item {
  white-space: nowrap;
}
body .content .code .tabs-container #code-tabs .tbs-item-container {
  position: relative;
}
body .content .code .tabs-container #code-tabs .tbs-item-container.active .tbs-item {
  width: inherit;
  position: relative;
}
body .content .code .tabs-container #code-tabs .tbs-item-container.active .tbs-item::after {
  content: "";
  position: absolute;
  right: 0;
  left: 0;
  width: 100%;
  height: 4px;
  bottom: -18px;
  border-top-right-radius: 8px;
  border-top-left-radius: 8px;
  border-bottom-right-radius: unset;
  border-bottom-left-radius: unset;
}
body .content .code .buttons-container {
  height: 52px;
  border-bottom: 1px solid;
}
body .content .code .buttons-container .buttons {
  height: inherit;
  display: flex;
  justify-content: space-between;
  gap: 8px;
  padding: 8px;
  box-sizing: border-box;
}
body .content .code .buttons-container .buttons-left {
  display: flex;
  gap: 8px;
}
body .content .code .buttons-container .buttons.fixed {
  position: fixed;
  z-index: 3;
  border-bottom: 1px solid;
}
body .content .code .buttons-container .btn.btn {
  height: 36px;
  min-width: auto;
  font-size: 16px;
  line-height: 24px;
}
body .content .code .source-block {
  margin: 10px;
  display: none;
  overflow: auto;
  height: 400px;
  min-height: 380px;
  scrollbar-width: thin;
}
body .content .code .source-block::-webkit-scrollbar {
  width: 8px;
}
body .content .code .source-block::-webkit-scrollbar-track {
  border-radius: 20px;
}
body .content .code .source-block::-webkit-scrollbar-thumb {
  border-radius: 20px;
}
body .content .code .source-block.active {
  display: block;
}
body .content .code .source-block.hidden {
  display: none;
}
body .content .code .source-block .CodeMirror {
  height: auto;
  font-size: 14px;
  z-index: 0;
}
body .content .code .source-block .CodeMirror .CodeMirror-scroll {
  overflow: hidden !important;
}
body .content .code .source-block .CodeMirror code,
body .content .code .source-block .CodeMirror pre {
  font-family: Monaco, Menlo, Consolas, "Courier New", monospace;
  display: block;
  font-size: 12px;
  line-height: 20px;
  word-break: break-all;
  word-wrap: break-word;
  white-space: pre;
  white-space: pre-wrap;
  -webkit-border-radius: 4px;
  -moz-border-radius: 4px;
  -ms-border-radius: 4px;
  -o-border-radius: 4px;
  border-radius: 4px;
}
body .content .code .source-block .CodeMirror code .prettyprint,
body .content .code .source-block .CodeMirror pre .prettyprint {
  margin-bottom: 20px;
}
body .content .code .source-block .CodeMirror code code,
body .content .code .source-block .CodeMirror pre code {
  padding: 0;
  white-space: pre;
  white-space: pre-wrap;
  border: 0;
}
body .content .code .source-block .CodeMirror code {
  padding: 2px 4px;
  white-space: nowrap;
  border: 1px solid;
  border-color: #e1e1e8;
  display: inline;
}
body .content .code .move-demo-container {
  display: flex;
  flex-direction: column;
  align-items: center;
  height: 200px;
}
body .content .code .move-demo-container .move-demo-text {
  padding: 15px;
  padding-bottom: 16px;
  font-size: 14px;
}
body .content .code .move-demo-container .move-demo-button {
  padding: 5px 15px;
  border: 1px solid;
  -webkit-border-radius: 5px;
  -moz-border-radius: 5px;
  -ms-border-radius: 5px;
  -o-border-radius: 5px;
  border-radius: 5px;
  margin: 0px;
  color: white;
  text-decoration: none;
}
body .content .code .move-demo-container .move-demo-button:hover {
  border: 1px solid;
}
body .content .code .move-demo-container .move-demo-button .move-demo-icon {
  display: inline;
  vertical-align: middle;
  margin-left: 5px;
  margin-bottom: 3px;
}
body .content .code .move-demo-container .move-demo-button .move-demo-icon path {
  stroke: white;
}
body .content .demo-nav-links {
  box-sizing: border-box;
  padding: 12px;
  height: 60px;
  display: flex;
  align-items: center;
  gap: 0 8px;
  position: relative;
  border-radius: 6px 6px 0 0;
  border: 1px solid;
  justify-content: right;
}
body .content .demo-nav-links a {
  text-decoration: none;
  display: flex;
  font-size: 16px;
  align-items: center;
  justify-content: center;
  height: 24px;
  width: 24px;
  border: none;
  padding: 6px;
}
body .content .demo-nav-links a:focus-visible {
  outline: 2px solid;
  outline-offset: 0px;
}
body .content .demo-nav-links a svg {
  height: 24px;
  width: 24px;
}
body .content .demo-nav-links a.adaptivity-switcher {
  width: auto;
}
body .content .demo-nav-links span.nav-border {
  width: 1px;
  height: 46px;
}
body .content .demo-nav-links button#fullScreenLink {
  display: flex;
  justify-content: center;
  align-items: center;
  padding: 6px;
  border: none;
  cursor: pointer;
}
body .content .demo-nav-links button#fullScreenLink #open-full-screen {
  display: block;
}
body .content .demo-nav-links button#fullScreenLink #close-full-screen {
  display: none;
}
body .content .demo-nav-links span.separator {
  width: 1px;
  height: 24px;
}
body .content .demo-nav-links a,
body .content .demo-nav-links button#fullScreenLink {
  border-radius: 50px;
}
body .content .demo-nav-links .justify-left {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  margin-right: auto;
  overflow-x: hidden;
}
body .content .demo-nav-links .justify-left svg {
  flex-shrink: 0;
}
body .content .demo-nav-links .uitg-button {
  padding: 6px 16px 6px 8px;
  min-width: unset;
  width: 70%;
  /*width: auto;*/
  height: 36px;
  overflow-x: hidden;
}
body .content .demo-nav-links .uitg-button:last-of-type {
  margin-right: auto;
}
body .content .demo-nav-links .themes-container .dx-texteditor.dx-editor-outlined {
  border: none;
}
body .content .demo-nav-links .demo-nav-arrows {
  display: flex;
}
body .content:not(.document__body) .doc-content h5.see-also + ul li:before {
  content: "";
  border-radius: 3px;
  border: 3px solid;
  display: inline-block;
  margin-right: 15px;
}
body .debug-invalid-model-popup {
  position: fixed;
  bottom: 80px;
  right: 0;
  padding: 10px;
  width: 300px;
  z-index: 9999;
}
body #docerror.error {
  position: static;
  height: auto;
  margin: 118px auto;
}
body a {
  outline: none;
  text-decoration: none;
}
body .doc-content.wide-demo {
  flex-direction: column;
}
body .doc-content.wide-demo .demo-details {
  max-width: inherit;
}
body .doc-content nav,
body .doc-content section {
  display: block;
}
body .doc-content .nav {
  margin-bottom: 20px;
  margin-left: 0;
  list-style: none;
}
body .doc-content .nav-tabs:after {
  clear: both;
}
body .doc-content .hide {
  display: none;
}
body .doc-content .tab-content {
  overflow: auto;
}
body .doc-content .tab-content > .tab-pane,
body .doc-content .pill-content > .pill-pane {
  display: none;
}
body .doc-content .tab-content > .active,
body .doc-content .pill-content > .active {
  display: block;
}
body .doc-content code .prettyprint,
body .doc-content pre .prettyprint {
  margin-bottom: 20px;
}
body .doc-content code code,
body .doc-content pre code {
  padding: 0;
  color: inherit;
  white-space: pre;
  white-space: pre-wrap;
  background-color: transparent;
  border: 0;
}
body .doc-content code {
  padding: 2px 4px;
  white-space: nowrap;
  border: 1px solid;
  display: inline;
}
body .doc-content .pre-scrollable {
  max-height: 340px;
  overflow-y: scroll;
}
body .doc-content .nav-tabs > .active > a,
body .doc-content .nav-tabs > .active > a:focus {
  cursor: default;
  border: 1px solid;
  border-bottom-color: transparent;
}
body .doc-content .codeTabs.nav.nav-tabs {
  padding: 20px 0 0 0;
  border-bottom: 2px solid;
}
body .doc-content .codeTabs.nav.nav-tabs li {
  float: none;
  display: inline-block;
}
body .doc-content .codeTabs.nav.nav-tabs li a {
  border: none;
  padding: 8px 12px;
  line-height: 36px;
  margin: 0;
}
body .doc-content .codeTabs.nav.nav-tabs li.active {
  border-top: 2px solid;
  border-left: 2px solid;
  border-right: 2px solid;
}
body .doc-content .codeTabs.nav.nav-tabs li.active a {
  padding-bottom: 12px;
}
body .button:not(.feedback__button) {
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  display: inline-block;
  font-size: 16px;
  font-family: 'Roboto', sans-serif;
  font-weight: normal;
  position: relative;
  text-decoration: none;
  text-align: center;
  white-space: nowrap;
  cursor: pointer;
  height: 22px;
  line-height: 22px;
  vertical-align: middle;
  box-sizing: initial;
  border: 1px solid;
  -webkit-border-radius: 50px;
  -moz-border-radius: 50px;
  -ms-border-radius: 50px;
  -o-border-radius: 50px;
  border-radius: 50px;
}
body .button:not(.feedback__button).small {
  font-size: 13px;
}
body .button:not(.feedback__button).large {
  width: 400px;
  font-size: 24px;
}
body .button:not(.feedback__button).center {
  margin-left: auto;
  margin-right: auto;
  display: block;
}
body .button:not(.feedback__button).btn-show-demo {
  margin-bottom: 15px;
}
body .button:not(.feedback__button).fiddle {
  height: 40px;
  display: inline-flex;
  gap: 0 10px;
  border: none;
  padding: 0 16px;
}
body .button:not(.feedback__button).fiddle .button-text {
  align-self: center;
}
body .button:not(.feedback__button).reset,
body .button:not(.feedback__button).apply {
  padding: 8px 20px;
  float: right;
  align-items: center;
  border: none;
  margin-right: 16px;
  height: 40px;
  box-sizing: border-box;
}
body .button:not(.feedback__button).apply {
  border: 1px solid;
}
body .button:not(.feedback__button).backend {
  border-radius: 4px;
  padding: 8px 20px;
  width: 100px;
  margin: 5px 1px 5px -17px;
}
body .dx-list-group-header {
  margin: 0;
  padding: 8px 15px;
  border-bottom: none;
  font-weight: normal;
}
body #reset,
body #apply {
  width: 72px;
}
body .dx-dropdownlist-popup-wrapper .dx-list:not(.dx-list-select-decorator-enabled) .dx-list-item-content {
  padding: 5px 15px 5px 0;
}
body .dx-popup-content {
  padding: 0;
}
body .adaptivity-switcher {
  position: absolute;
  left: 45%;
}
body .adaptivity-switcher .switcher-item-wrapper {
  cursor: pointer;
  box-sizing: border-box;
  height: 38px;
  border-radius: 8px;
}
body .adaptivity-switcher .switcher-item-wrapper.landscape {
  padding: 8px 6px;
}
body .adaptivity-switcher .switcher-item-wrapper.landscape .switcher-item {
  width: 24px;
  height: 14px;
}
body .adaptivity-switcher .switcher-item-wrapper.landscape .switcher-item .inner {
  display: block;
  position: relative;
  left: 3px;
  top: 2px;
  height: 10px;
  width: 18px;
}
body .adaptivity-switcher .switcher-item-wrapper.portrait {
  padding: 6px 11px;
}
body .adaptivity-switcher .switcher-item-wrapper.portrait .switcher-item {
  width: 14px;
  height: 24px;
}
body .adaptivity-switcher .switcher-item-wrapper.portrait .switcher-item .inner {
  display: block;
  position: relative;
  left: 2px;
  top: 3px;
  height: 18px;
  width: 10px;
}
body .adaptivity-switcher .switcher-item-wrapper .switcher-item {
  display: inline-block;
  cursor: pointer;
  border-radius: 2px;
}
body #themeChooserPopup.dx-overlay-content {
  -webkit-border-radius: 16px;
  -moz-border-radius: 16px;
  -ms-border-radius: 16px;
  -o-border-radius: 16px;
  border-radius: 16px;
  border: none;
}
body #copy-to-code-codepen,
body #copy-to-code-sandbox {
  border: 0px;
  padding: 6px 16px 6px 8px;
  white-space: nowrap;
  overflow: hidden;
}
body #copy-to-code-codepen svg,
body #copy-to-code-sandbox svg {
  flex-shrink: 0;
}
@media only screen and (max-width: 1900px) {
  body .content .doc-content.wide-demo {
    flex-flow: column;
  }
}
@media only screen and (max-width: 1600px) {
  body .content .doc-content .simulator-content-box {
    flex-direction: column !important;
  }
  body .content .doc-content .demo-panel-box {
    flex: 1 !important;
  }
  body .content .doc-content .demo-details {
    flex: 1 !important;
  }
}
@media only screen and (max-width: 1080px) {
  body .content .doc-content #widgetAccordion {
    display: none;
  }
  body .content .doc-content #widgetAccordion .widget-tree-main .widget-tree {
    display: none;
  }
  body .content .doc-content #widgetAccordion .widget-tree-main .widget-view {
    position: initial;
    height: 500px;
  }
}
@media only screen and (max-width: 1200px) {
  body .doc-content {
    padding: 32px 40px 40px 40px !important;
  }
}
@media screen and (max-width: 768px) {
  body .doc-content {
    padding: 32px 24px 32px 24px !important;
  }
  body .axe-box-with-btn {
    flex-direction: column !important;
  }
}
body .theme-popup-header,
body .theme-popup-content {
  font-family: 'Roboto', sans-serif;
}
body .theme-popup-header {
  position: sticky;
  top: 0;
  width: 100%;
  display: flex;
  flex-direction: column;
}
body .theme-popup-header #theme-selector {
  display: flex;
}
body .theme-popup-header #theme-selector .theme-selector-group-container {
  display: flex;
  flex: 1;
  text-align: center;
  cursor: pointer;
}
body .theme-popup-header #theme-selector .theme-selector-group {
  padding: 18px 12px;
  flex: 1;
  text-align: center;
}
body .theme-popup-header #theme-selector .theme-selector-group.active .theme-selector-group-name {
  position: relative;
  text-align: unset;
  font-weight: 500;
}
body .theme-popup-header #theme-selector .theme-selector-group.active span {
  position: relative;
}
body .theme-popup-header #theme-selector .theme-selector-group.active span::after {
  content: "";
  position: absolute;
  right: 0;
  left: 0;
  width: 100%;
  height: 4px;
  bottom: -19px;
  border-top-right-radius: 8px;
  border-top-left-radius: 8px;
  border-bottom-right-radius: unset;
  border-bottom-left-radius: unset;
}
body .theme-popup-title {
  font-family: 'Roboto', sans-serif;
  font-size: 24px;
  line-height: 125%;
  font-weight: 600;
}
body .theme-popup-switch {
  display: inline-flex;
  align-items: center;
  gap: 0 10px;
}
body .theme-popup-group {
  padding: 6px 24px;
  gap: 12px;
  display: flex;
  flex-direction: column;
}
body .theme-popup-group-title {
  margin: 0;
  padding: 0;
  font-size: 16px;
  font-weight: 600;
  height: 40px;
  line-height: 135%;
  border-bottom: 1px solid;
}
body .theme-popup-group[aria-hidden="true"] {
  display: none;
}
body .theme-popup-button.btn {
  height: 44px;
  border-radius: 8px;
  min-width: auto;
  max-width: none;
}
body .theme-popup-window .themebuilder-group {
  padding: 8px;
  border-top: 1px solid;
}
body .theme-popup-window .themebuilder-group .theme-popup-button {
  border: none;
}
body .theme-popup-window .themebuilder-group .theme-popup-button span {
  font-size: 16px;
  line-height: 24px;
  font-weight: 500;
}
body .theme-popup-window .theme-popup-group-title {
  display: flex;
  gap: 4px;
  align-items: center;
}
body .theme-popup-window .theme-popup-group-title .theme-trademark-warning {
  display: flex;
  align-items: center;
  cursor: pointer;
}
body .theme-popup-window .theme-list-items {
  display: flex;
  gap: 4px;
  flex-direction: column;
}
body .theme-popup-window .theme-item {
  cursor: pointer;
  box-sizing: border-box;
  /*width: 68px;
                    height: 68px;*/
  padding: 8px;
  display: flex;
  flex-direction: row;
  align-items: center;
  gap: 8px;
  border-radius: 8px;
}
body .theme-popup-window .theme-item:focus {
  outline: 2px solid;
}
body .theme-popup-window .theme-item span {
  white-space: nowrap;
  font-size: 14px;
  line-height: 24px;
}
body .theme-popup-window .theme-item use svg {
  vertical-align: middle;
}
body .theme-popup-window .theme-item .svg {
  width: 24px;
  height: 24px;
  background-repeat: no-repeat;
  background-position: center;
  vertical-align: middle;
  float: left;
}
body .theme-popup-window .theme-item.disabled {
  opacity: 0.5;
  pointer-events: none;
}
body #theme-selector-icon {
  height: 24px;
  width: 24px;
  background-size: contain;
  background-repeat: no-repeat;
}
body #theme-selector-icon[data-value="light"],
body #theme-selector-icon[data-value="light.compact"] {
  background-image: url(~/../../Images/Themes/light.svg);
}
body #theme-selector-icon[data-value="dark"],
body #theme-selector-icon[data-value="dark.compact"] {
  background-image: url(~/../../Images/Themes/dark.svg);
}
body #theme-selector-icon[data-value="contrast"],
body #theme-selector-icon[data-value="contrast.compact"] {
  background-image: url(~/../../Images/Themes/contrast.svg);
}
body #theme-selector-icon[data-value="softblue"],
body #theme-selector-icon[data-value="softblue.compact"] {
  background-image: url(~/../../Images/Themes/softblue.svg);
}
body #theme-selector-icon[data-value="carmine"],
body #theme-selector-icon[data-value="carmine.compact"] {
  background-image: url(~/../../Images/Themes/carmine.svg);
}
body #theme-selector-icon[data-value="darkmoon"],
body #theme-selector-icon[data-value="darkmoon.compact"] {
  background-image: url(~/../../Images/Themes/darkmoon.svg);
}
body #theme-selector-icon[data-value="darkviolet"],
body #theme-selector-icon[data-value="darkviolet.compact"] {
  background-image: url(~/../../Images/Themes/darkviolet.svg);
}
body #theme-selector-icon[data-value="greenmist"],
body #theme-selector-icon[data-value="greenmist.compact"] {
  background-image: url(~/../../Images/Themes/greenmist.svg);
}
body #theme-selector-icon[data-value="material.blue.light"],
body #theme-selector-icon[data-value="material.blue.light.compact"] {
  background-image: url(~/../../Images/Themes/material.blue.light.svg);
}
body #theme-selector-icon[data-value="material.blue.dark"],
body #theme-selector-icon[data-value="material.blue.dark.compact"] {
  background-image: url(~/../../Images/Themes/material.blue.dark.svg);
}
body #theme-selector-icon[data-value="material.lime.light"],
body #theme-selector-icon[data-value="material.lime.light.compact"] {
  background-image: url(~/../../Images/Themes/material.lime.light.svg);
}
body #theme-selector-icon[data-value="material.lime.dark"],
body #theme-selector-icon[data-value="material.lime.dark.compact"] {
  background-image: url(~/../../Images/Themes/material.lime.dark.svg);
}
body #theme-selector-icon[data-value="material.orange.light"],
body #theme-selector-icon[data-value="material.orange.light.compact"] {
  background-image: url(~/../../Images/Themes/material.orange.light.svg);
}
body #theme-selector-icon[data-value="material.orange.dark"],
body #theme-selector-icon[data-value="material.orange.dark.compact"] {
  background-image: url(~/../../Images/Themes/material.orange.dark.svg);
}
body #theme-selector-icon[data-value="material.purple.light"],
body #theme-selector-icon[data-value="material.purple.light.compact"] {
  background-image: url(~/../../Images/Themes/material.purple.light.svg);
}
body #theme-selector-icon[data-value="material.purple.dark"],
body #theme-selector-icon[data-value="material.purple.dark.compact"] {
  background-image: url(~/../../Images/Themes/material.purple.dark.svg);
}
body #theme-selector-icon[data-value="material.teal.light"],
body #theme-selector-icon[data-value="material.teal.light.compact"] {
  background-image: url(~/../../Images/Themes/material.teal.light.svg);
}
body #theme-selector-icon[data-value="material.teal.dark"],
body #theme-selector-icon[data-value="material.teal.dark.compact"] {
  background-image: url(~/../../Images/Themes/material.teal.dark.svg);
}
body #theme-selector-icon[data-value="fluent.blue.light"],
body #theme-selector-icon[data-value="fluent.blue.light.compact"] {
  background-image: url(~/../../Images/Themes/fluent.blue.light.svg);
}
body #theme-selector-icon[data-value="fluent.blue.dark"],
body #theme-selector-icon[data-value="fluent.blue.dark.compact"] {
  background-image: url(~/../../Images/Themes/fluent.blue.dark.svg);
}
body #theme-selector-icon[data-value="fluent.saas.light"],
body #theme-selector-icon[data-value="fluent.saas.light.compact"] {
  background-image: url(~/../../Images/Themes/fluent.saas.light.svg);
}
body #theme-selector-icon[data-value="fluent.saas.dark"],
body #theme-selector-icon[data-value="fluent.saas.dark.compact"] {
  background-image: url(~/../../Images/Themes/fluent.saas.dark.svg);
}
body #theme-selector-button.btn {
  height: 36px;
  min-width: auto;
  max-width: none;
  gap: 8px;
  padding: 6px 8px;
  outline: none;
  border: none;
  white-space: nowrap;
  overflow: hidden;
}
body #theme-selector-button.btn:focus-visible {
  outline: 2px solid;
  outline-offset: -2px;
}
body #theme-selector-button.btn .theme-selector-arrow {
  width: 24px;
  height: 24px;
}
body #theme-selector-button.btn #theme-selector-text {
  font-size: 16px;
}
body .theme-popup-header,
body .theme-popup-content {
  font-family: 'Roboto', sans-serif;
}
body .theme-popup-header {
  position: sticky;
  top: 0;
  width: 100%;
  display: flex;
  flex-direction: column;
}
body .theme-popup-header #theme-selector {
  display: flex;
}
body .theme-popup-header #theme-selector .theme-selector-group-container {
  display: flex;
  flex: 1;
  text-align: center;
  cursor: pointer;
}
body .theme-popup-header #theme-selector .theme-selector-group {
  padding: 18px 12px;
  flex: 1;
  text-align: center;
}
body .theme-popup-header #theme-selector .theme-selector-group.active .theme-selector-group-name {
  position: relative;
  text-align: unset;
  font-weight: 500;
}
body .theme-popup-header #theme-selector .theme-selector-group.active span {
  position: relative;
}
body .theme-popup-header #theme-selector .theme-selector-group.active span::after {
  content: "";
  position: absolute;
  right: 0;
  left: 0;
  width: 100%;
  height: 4px;
  bottom: -19px;
  border-top-right-radius: 8px;
  border-top-left-radius: 8px;
  border-bottom-right-radius: unset;
  border-bottom-left-radius: unset;
}
body .theme-popup-title {
  font-family: 'Roboto', sans-serif;
  font-size: 24px;
  line-height: 125%;
  font-weight: 600;
}
body .theme-popup-switch {
  display: inline-flex;
  align-items: center;
  gap: 0 10px;
}
body .theme-popup-group {
  padding: 6px 24px;
  gap: 12px;
  display: flex;
  flex-direction: column;
}
body .theme-popup-group-title {
  margin: 0;
  padding: 0;
  font-size: 16px;
  font-weight: 600;
  height: 40px;
  line-height: 135%;
  border-bottom: 1px solid;
}
body .theme-popup-group[aria-hidden="true"] {
  display: none;
}
body .theme-popup-button.btn {
  height: 44px;
  border-radius: 8px;
  min-width: auto;
  max-width: none;
}
body .theme-popup-window .themebuilder-group {
  padding: 8px;
  border-top: 1px solid;
}
body .theme-popup-window .themebuilder-group .theme-popup-button {
  border: none;
}
body .theme-popup-window .themebuilder-group .theme-popup-button span {
  font-size: 16px;
  line-height: 24px;
  font-weight: 500;
}
body .theme-popup-window .theme-popup-group-title {
  display: flex;
  gap: 4px;
  align-items: center;
}
body .theme-popup-window .theme-popup-group-title .theme-trademark-warning {
  display: flex;
  align-items: center;
  cursor: pointer;
}
body .theme-popup-window .theme-list-items {
  display: flex;
  gap: 4px;
  flex-direction: column;
}
body .theme-popup-window .theme-item {
  cursor: pointer;
  box-sizing: border-box;
  /*width: 68px;
                    height: 68px;*/
  padding: 8px;
  display: flex;
  flex-direction: row;
  align-items: center;
  gap: 8px;
  border-radius: 8px;
}
body .theme-popup-window .theme-item:focus {
  outline: 2px solid;
}
body .theme-popup-window .theme-item span {
  white-space: nowrap;
  font-size: 14px;
  line-height: 24px;
}
body .theme-popup-window .theme-item use svg {
  vertical-align: middle;
}
body .theme-popup-window .theme-item .svg {
  width: 24px;
  height: 24px;
  background-repeat: no-repeat;
  background-position: center;
  vertical-align: middle;
  float: left;
}
body .theme-popup-window .theme-item.disabled {
  opacity: 0.5;
  pointer-events: none;
}
body #theme-selector-icon {
  height: 24px;
  width: 24px;
  background-size: contain;
  background-repeat: no-repeat;
}
body #theme-selector-icon[data-value="light"],
body #theme-selector-icon[data-value="light.compact"] {
  background-image: url(~/../../Images/Themes/light.svg);
}
body #theme-selector-icon[data-value="dark"],
body #theme-selector-icon[data-value="dark.compact"] {
  background-image: url(~/../../Images/Themes/dark.svg);
}
body #theme-selector-icon[data-value="contrast"],
body #theme-selector-icon[data-value="contrast.compact"] {
  background-image: url(~/../../Images/Themes/contrast.svg);
}
body #theme-selector-icon[data-value="softblue"],
body #theme-selector-icon[data-value="softblue.compact"] {
  background-image: url(~/../../Images/Themes/softblue.svg);
}
body #theme-selector-icon[data-value="carmine"],
body #theme-selector-icon[data-value="carmine.compact"] {
  background-image: url(~/../../Images/Themes/carmine.svg);
}
body #theme-selector-icon[data-value="darkmoon"],
body #theme-selector-icon[data-value="darkmoon.compact"] {
  background-image: url(~/../../Images/Themes/darkmoon.svg);
}
body #theme-selector-icon[data-value="darkviolet"],
body #theme-selector-icon[data-value="darkviolet.compact"] {
  background-image: url(~/../../Images/Themes/darkviolet.svg);
}
body #theme-selector-icon[data-value="greenmist"],
body #theme-selector-icon[data-value="greenmist.compact"] {
  background-image: url(~/../../Images/Themes/greenmist.svg);
}
body #theme-selector-icon[data-value="material.blue.light"],
body #theme-selector-icon[data-value="material.blue.light.compact"] {
  background-image: url(~/../../Images/Themes/material.blue.light.svg);
}
body #theme-selector-icon[data-value="material.blue.dark"],
body #theme-selector-icon[data-value="material.blue.dark.compact"] {
  background-image: url(~/../../Images/Themes/material.blue.dark.svg);
}
body #theme-selector-icon[data-value="material.lime.light"],
body #theme-selector-icon[data-value="material.lime.light.compact"] {
  background-image: url(~/../../Images/Themes/material.lime.light.svg);
}
body #theme-selector-icon[data-value="material.lime.dark"],
body #theme-selector-icon[data-value="material.lime.dark.compact"] {
  background-image: url(~/../../Images/Themes/material.lime.dark.svg);
}
body #theme-selector-icon[data-value="material.orange.light"],
body #theme-selector-icon[data-value="material.orange.light.compact"] {
  background-image: url(~/../../Images/Themes/material.orange.light.svg);
}
body #theme-selector-icon[data-value="material.orange.dark"],
body #theme-selector-icon[data-value="material.orange.dark.compact"] {
  background-image: url(~/../../Images/Themes/material.orange.dark.svg);
}
body #theme-selector-icon[data-value="material.purple.light"],
body #theme-selector-icon[data-value="material.purple.light.compact"] {
  background-image: url(~/../../Images/Themes/material.purple.light.svg);
}
body #theme-selector-icon[data-value="material.purple.dark"],
body #theme-selector-icon[data-value="material.purple.dark.compact"] {
  background-image: url(~/../../Images/Themes/material.purple.dark.svg);
}
body #theme-selector-icon[data-value="material.teal.light"],
body #theme-selector-icon[data-value="material.teal.light.compact"] {
  background-image: url(~/../../Images/Themes/material.teal.light.svg);
}
body #theme-selector-icon[data-value="material.teal.dark"],
body #theme-selector-icon[data-value="material.teal.dark.compact"] {
  background-image: url(~/../../Images/Themes/material.teal.dark.svg);
}
body #theme-selector-icon[data-value="fluent.blue.light"],
body #theme-selector-icon[data-value="fluent.blue.light.compact"] {
  background-image: url(~/../../Images/Themes/fluent.blue.light.svg);
}
body #theme-selector-icon[data-value="fluent.blue.dark"],
body #theme-selector-icon[data-value="fluent.blue.dark.compact"] {
  background-image: url(~/../../Images/Themes/fluent.blue.dark.svg);
}
body #theme-selector-icon[data-value="fluent.saas.light"],
body #theme-selector-icon[data-value="fluent.saas.light.compact"] {
  background-image: url(~/../../Images/Themes/fluent.saas.light.svg);
}
body #theme-selector-icon[data-value="fluent.saas.dark"],
body #theme-selector-icon[data-value="fluent.saas.dark.compact"] {
  background-image: url(~/../../Images/Themes/fluent.saas.dark.svg);
}
body #theme-selector-button.btn {
  height: 36px;
  min-width: auto;
  max-width: none;
  gap: 8px;
  padding: 6px 8px;
  outline: none;
  border: none;
  white-space: nowrap;
  overflow: hidden;
}
body #theme-selector-button.btn:focus-visible {
  outline: 2px solid;
  outline-offset: -2px;
}
body #theme-selector-button.btn .theme-selector-arrow {
  width: 24px;
  height: 24px;
}
body #theme-selector-button.btn #theme-selector-text {
  font-size: 16px;
}
body .footer {
  position: absolute;
  width: 100%;
  padding: 24px;
  box-sizing: border-box;
  font-size: 12px;
  color: white;
  z-index: 5;
}
body .footer svg#devextreme-logo path {
  fill: white;
}
body .footer .content-width {
  padding-top: 0;
  padding-bottom: 0;
}
body .footer-container {
  display: flex;
  justify-content: space-between;
  gap: 32px 16px;
}
body .footer-about {
  display: flex;
  gap: 40px;
}
body .footer-logo {
  height: min-content;
  display: flex;
  gap: 12px;
  align-items: center;
}
body .footer-text {
  margin: 0 0 16px;
  font-size: 12px;
  line-height: 14px;
}
body .footer a {
  text-decoration: underline;
}
body .footer-socials {
  display: flex;
  align-items: center;
}
body .footer-socials-links {
  display: flex;
  gap: 8px;
}
body .footer-socials-link svg {
  width: 32px;
  height: 32px;
}
body .footer-socials-link:hover {
  opacity: 0.8;
}
@media only screen and (max-width: 1400px) {
  body .footer {
    padding: 32px 0;
    height: auto;
    font-size: 12px;
  }
  body .footer-container {
    flex-direction: column;
  }
  body .footer-about {
    flex-direction: column;
    align-items: center;
  }
  body .footer-text,
  body .footer-links {
    text-align: center;
  }
  body .footer-text {
    margin-bottom: 16px;
  }
  body .footer-socials {
    justify-content: center;
  }
  body .footer-socials-title {
    display: none;
  }
  body .footer-socials-links {
    justify-content: center;
  }
}
body .footer {
  position: absolute;
  width: 100%;
  padding: 24px;
  box-sizing: border-box;
  font-size: 12px;
  color: white;
  z-index: 5;
}
body .footer svg#devextreme-logo path {
  fill: white;
}
body .footer .content-width {
  padding-top: 0;
  padding-bottom: 0;
}
body .footer-container {
  display: flex;
  justify-content: space-between;
  gap: 32px 16px;
}
body .footer-about {
  display: flex;
  gap: 40px;
}
body .footer-logo {
  height: min-content;
  display: flex;
  gap: 12px;
  align-items: center;
}
body .footer-text {
  margin: 0 0 16px;
  font-size: 12px;
  line-height: 14px;
}
body .footer a {
  text-decoration: underline;
}
body .footer-socials {
  display: flex;
  align-items: center;
}
body .footer-socials-links {
  display: flex;
  gap: 8px;
}
body .footer-socials-link svg {
  width: 32px;
  height: 32px;
}
body .footer-socials-link:hover {
  opacity: 0.8;
}
@media only screen and (max-width: 1400px) {
  body .footer {
    padding: 32px 0;
    height: auto;
    font-size: 12px;
  }
  body .footer-container {
    flex-direction: column;
  }
  body .footer-about {
    flex-direction: column;
    align-items: center;
  }
  body .footer-text,
  body .footer-links {
    text-align: center;
  }
  body .footer-text {
    margin-bottom: 16px;
  }
  body .footer-socials {
    justify-content: center;
  }
  body .footer-socials-title {
    display: none;
  }
  body .footer-socials-links {
    justify-content: center;
  }
}
body .theme-switch {
  display: flex;
  flex: 0 0 56px;
  width: 56px;
  height: 28px;
  border: 1px solid;
  box-sizing: border-box;
  border-radius: 50px;
  padding: 1px;
  overflow: hidden;
  cursor: pointer;
}
body .theme-switch-wrapper {
  display: inline-flex;
  align-items: center;
  width: 52px;
  height: 24px;
}
body .theme-toogle {
  flex: 0 0 20px;
  padding: 2px;
  display: flex;
  justify-content: center;
  align-items: center;
  margin-right: 4px;
}
body .theme-toogle svg {
  width: 20px;
  height: 20px;
  border-radius: 10px;
}
body .theme-toogle.light {
  transition: 0.4s;
}
body .theme-toogle.dark {
  width: 0;
}
body .theme-input {
  width: 20px;
  height: 20px;
  border-radius: 10px;
}
body .theme-switch {
  display: flex;
  flex: 0 0 56px;
  width: 56px;
  height: 28px;
  border: 1px solid;
  box-sizing: border-box;
  border-radius: 50px;
  padding: 1px;
  overflow: hidden;
  cursor: pointer;
}
body .theme-switch-wrapper {
  display: inline-flex;
  align-items: center;
  width: 52px;
  height: 24px;
}
body .theme-toogle {
  flex: 0 0 20px;
  padding: 2px;
  display: flex;
  justify-content: center;
  align-items: center;
  margin-right: 4px;
}
body .theme-toogle svg {
  width: 20px;
  height: 20px;
  border-radius: 10px;
}
body .theme-toogle.light {
  transition: 0.4s;
}
body .theme-toogle.dark {
  width: 0;
}
body .theme-input {
  width: 20px;
  height: 20px;
  border-radius: 10px;
}
body .front-toggle-container {
  display: inline-flex;
  padding: 12px 12px;
}
body .front-toggle {
  display: inline-flex;
  align-items: center;
  height: 32px;
  border-radius: 999px;
  justify-content: space-between;
  position: relative;
}
body .front-toggle .front-toggle-track {
  position: absolute;
  height: 32px;
  width: 48px;
  border-radius: 50px;
  transform: translateX(0px);
  transition: transform 200ms;
}
body .front-toggle input[type="checkbox"]:checked ~ .front-toggle-track {
  transform: translateX(48px);
  transition: transform 200ms;
}
body .front-toggle [name="front-toggle"] {
  display: none;
}
body .front-toggle input[type="checkbox"] ~ label {
  cursor: pointer;
  font-family: 'Roboto', sans-serif;
  user-select: none;
  padding: 0 16px;
  height: 100%;
  display: flex;
  align-items: center;
  z-index: 2;
}
body .front-toggle-container {
  display: inline-flex;
  padding: 12px 12px;
}
body .front-toggle {
  display: inline-flex;
  align-items: center;
  height: 32px;
  border-radius: 999px;
  justify-content: space-between;
  position: relative;
}
body .front-toggle .front-toggle-track {
  position: absolute;
  height: 32px;
  width: 48px;
  border-radius: 50px;
  transform: translateX(0px);
  transition: transform 200ms;
}
body .front-toggle input[type="checkbox"]:checked ~ .front-toggle-track {
  transform: translateX(48px);
  transition: transform 200ms;
}
body .front-toggle [name="front-toggle"] {
  display: none;
}
body .front-toggle input[type="checkbox"] ~ label {
  cursor: pointer;
  font-family: 'Roboto', sans-serif;
  user-select: none;
  padding: 0 16px;
  height: 100%;
  display: flex;
  align-items: center;
  z-index: 2;
}
body .survey-hidden {
  display: none;
}
body .survey--container {
  height: 42px;
  width: 100%;
  width: -moz-available;
  width: -webkit-fill-available;
  width: fill-available;
  position: fixed;
  z-index: 2000;
}
body .survey--component {
  height: inherit;
  padding-top: 0;
  padding-bottom: 0;
  display: flex;
  justify-content: space-between;
  align-items: center;
}
body .survey--part {
  display: flex;
  align-items: center;
  gap: 32px;
}
body .survey--part p {
  margin: 0;
  line-height: 125%;
}
body .survey--part a {
  text-decoration: underline;
}
body .survey--button {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 32px;
  height: 32px;
  padding: 0;
  background: transparent;
  border: none;
  border-radius: 50%;
  color: white;
}
body .survey--button:hover {
  cursor: pointer;
}
body .survey--indent ~ header .header {
  top: 42px;
}
body .survey--indent ~ .header-drawer {
  top: 112px;
}
body .survey--indent ~ #menu {
  top: 112px;
}
body .survey--indent ~ main .block-approch-selected-content {
  padding-top: 42px;
}
body .survey--indent ~ main .doc-content {
  position: relative;
  top: 42px;
}
body .survey--indent ~ main .sticky-wrapper .tabs {
  top: 112px;
}
body .survey--indent ~ main .left-menu {
  top: 152px;
}
@media only screen and (max-width: 2000px) {
  body .survey--container {
    padding-right: 24px;
    padding-left: 24px;
  }
}
@media only screen and (max-width: 1500px) {
  body .survey--container {
    padding-right: 18px;
    padding-left: 18px;
  }
}
@media only screen and (max-width: 1101px) {
  body .survey--part {
    gap: 16px;
  }
}
@media only screen and (max-width: 1069px) {
  body .survey--part {
    gap: 8px;
  }
}
@media only screen and (max-width: 1069px) {
  body .survey--svg {
    display: none;
  }
}
@media only screen and (max-width: 955px) {
  body .survey--part p {
    font-size: 14px;
  }
}
@media only screen and (max-width: 773px) {
  body .survey--container {
    height: 60px;
  }
  body .survey--part {
    flex-direction: column;
    align-items: flex-start;
  }
  body .survey--indent ~ header .header {
    top: 60px;
  }
  body .survey--indent ~ .header-drawer {
    top: 130px;
  }
  body .survey--indent ~ #menu {
    top: 130px;
  }
  body .survey--indent ~ main {
    top: 60px;
  }
  body .survey--indent ~ main .block-approch-selected-content {
    padding-top: 60px;
  }
  body .survey--indent ~ main .sticky-wrapper .tabs {
    top: 130px;
  }
  body .survey--indent ~ main .left-menu {
    top: 190px;
  }
}
@media only screen and (max-width: 540px) {
  body .survey--part {
    gap: 0;
  }
  body .survey--part p {
    font-size: 12px;
  }
}
body .survey-hidden {
  display: none;
}
body .survey--container {
  height: 42px;
  width: 100%;
  width: -moz-available;
  width: -webkit-fill-available;
  width: fill-available;
  position: fixed;
  z-index: 2000;
}
body .survey--component {
  height: inherit;
  padding-top: 0;
  padding-bottom: 0;
  display: flex;
  justify-content: space-between;
  align-items: center;
}
body .survey--part {
  display: flex;
  align-items: center;
  gap: 32px;
}
body .survey--part p {
  margin: 0;
  line-height: 125%;
}
body .survey--part a {
  text-decoration: underline;
}
body .survey--button {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 32px;
  height: 32px;
  padding: 0;
  background: transparent;
  border: none;
  border-radius: 50%;
  color: white;
}
body .survey--button:hover {
  cursor: pointer;
}
body .survey--indent ~ header .header {
  top: 42px;
}
body .survey--indent ~ .header-drawer {
  top: 112px;
}
body .survey--indent ~ #menu {
  top: 112px;
}
body .survey--indent ~ main .block-approch-selected-content {
  padding-top: 42px;
}
body .survey--indent ~ main .doc-content {
  position: relative;
  top: 42px;
}
body .survey--indent ~ main .sticky-wrapper .tabs {
  top: 112px;
}
body .survey--indent ~ main .left-menu {
  top: 152px;
}
@media only screen and (max-width: 2000px) {
  body .survey--container {
    padding-right: 24px;
    padding-left: 24px;
  }
}
@media only screen and (max-width: 1500px) {
  body .survey--container {
    padding-right: 18px;
    padding-left: 18px;
  }
}
@media only screen and (max-width: 1101px) {
  body .survey--part {
    gap: 16px;
  }
}
@media only screen and (max-width: 1069px) {
  body .survey--part {
    gap: 8px;
  }
}
@media only screen and (max-width: 1069px) {
  body .survey--svg {
    display: none;
  }
}
@media only screen and (max-width: 955px) {
  body .survey--part p {
    font-size: 14px;
  }
}
@media only screen and (max-width: 773px) {
  body .survey--container {
    height: 60px;
  }
  body .survey--part {
    flex-direction: column;
    align-items: flex-start;
  }
  body .survey--indent ~ header .header {
    top: 60px;
  }
  body .survey--indent ~ .header-drawer {
    top: 130px;
  }
  body .survey--indent ~ #menu {
    top: 130px;
  }
  body .survey--indent ~ main {
    top: 60px;
  }
  body .survey--indent ~ main .block-approch-selected-content {
    padding-top: 60px;
  }
  body .survey--indent ~ main .sticky-wrapper .tabs {
    top: 130px;
  }
  body .survey--indent ~ main .left-menu {
    top: 190px;
  }
}
@media only screen and (max-width: 540px) {
  body .survey--part {
    gap: 0;
  }
  body .survey--part p {
    font-size: 12px;
  }
}
body #ot-sdk-btn-floating.ot-floating-button {
  display: none;
}
body #onetrust-consent-sdk #onetrust-banner-sdk #onetrust-button-group-parent button {
  border-radius: 4px;
  font-family: 'Open Sans', sans-serif;
  width: 100% !important;
}
body #onetrust-consent-sdk #onetrust-banner-sdk #onetrust-button-group-parent button#onetrust-pc-btn-handler:hover {
  color: white;
  opacity: 1;
}
body #onetrust-consent-sdk #onetrust-pc-sdk button:not(#clear-filters-handler):not(.ot-close-icon):not(#filter-btn-handler):not(.ot-remove-objection-handler):not(.ot-obj-leg-btn-handler):not([aria-expanded]):not(.ot-link-btn) {
  border-radius: 4px;
  font-family: 'Open Sans', sans-serif;
}
body #ot-sdk-btn.ot-sdk-show-settings,
body #ot-sdk-btn.optanon-show-settings {
  border: none;
  padding: 0;
  line-height: inherit;
  font-size: inherit;
  color: inherit;
  background-color: transparent !important;
  text-decoration: underline;
  color: white;
}
body #ot-sdk-btn.ot-sdk-show-settings:visited,
body #ot-sdk-btn.optanon-show-settings:visited {
  color: white;
}
body #ot-sdk-btn.ot-sdk-show-settings:hover,
body #ot-sdk-btn.optanon-show-settings:hover,
body #ot-sdk-btn.ot-sdk-show-settings:visited:hover,
body #ot-sdk-btn.optanon-show-settings:visited:hover {
  color: #d9d9d9;
}
body #ot-sdk-btn.ot-sdk-show-settings:active,
body #ot-sdk-btn.optanon-show-settings:active {
  color: #b3b3b3;
}
body #ot-sdk-btn.ot-sdk-show-settings:focus,
body #ot-sdk-btn.optanon-show-settings:focus {
  outline-color: white;
}
body #ot-sdk-btn-floating.ot-floating-button {
  display: none;
}
body #onetrust-consent-sdk #onetrust-banner-sdk #onetrust-button-group-parent button {
  border-radius: 4px;
  font-family: 'Open Sans', sans-serif;
  width: 100% !important;
}
body #onetrust-consent-sdk #onetrust-banner-sdk #onetrust-button-group-parent button#onetrust-pc-btn-handler:hover {
  color: white;
  opacity: 1;
}
body #onetrust-consent-sdk #onetrust-pc-sdk button:not(#clear-filters-handler):not(.ot-close-icon):not(#filter-btn-handler):not(.ot-remove-objection-handler):not(.ot-obj-leg-btn-handler):not([aria-expanded]):not(.ot-link-btn) {
  border-radius: 4px;
  font-family: 'Open Sans', sans-serif;
}
body #ot-sdk-btn.ot-sdk-show-settings,
body #ot-sdk-btn.optanon-show-settings {
  border: none;
  padding: 0;
  line-height: inherit;
  font-size: inherit;
  color: inherit;
  background-color: transparent !important;
  text-decoration: underline;
  color: white;
}
body #ot-sdk-btn.ot-sdk-show-settings:visited,
body #ot-sdk-btn.optanon-show-settings:visited {
  color: white;
}
body #ot-sdk-btn.ot-sdk-show-settings:hover,
body #ot-sdk-btn.optanon-show-settings:hover,
body #ot-sdk-btn.ot-sdk-show-settings:visited:hover,
body #ot-sdk-btn.optanon-show-settings:visited:hover {
  color: #d9d9d9;
}
body #ot-sdk-btn.ot-sdk-show-settings:active,
body #ot-sdk-btn.optanon-show-settings:active {
  color: #b3b3b3;
}
body #ot-sdk-btn.ot-sdk-show-settings:focus,
body #ot-sdk-btn.optanon-show-settings:focus {
  outline-color: white;
}
body header.header .header-container {
  justify-content: space-between;
}
body header.header a.logo span {
  color: #3f4d5a;
}
@keyframes menuNotificationGrowUp {
  0% {
    left: 0;
    top: 0;
    right: 0;
    bottom: 0;
    border-width: 1px;
    opacity: 1;
  }
  100% {
    left: -7px;
    top: -7px;
    right: -7px;
    bottom: -7px;
    border-width: 14px;
    opacity: 0;
  }
}
.badge-new {
  padding: 2px 6px;
  min-width: 20px;
  max-height: 20px;
  box-sizing: border-box;
  display: flex;
  align-items: center;
  justify-content: center;
  background-color: #ff9000;
  border-radius: 50px;
  font-size: 14px;
  line-height: 18px;
  color: white;
  position: relative;
}
.badge-new:after {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  border: 2px solid #ff9000;
  border-radius: 50px;
  animation: menuNotificationGrowUp 2s;
  animation-iteration-count: 3;
}
.indicator-new {
  width: 24px;
  height: 24px;
  background: url('/Content/images/indicator-new.svg') no-repeat;
}
body {
  text-size-adjust: 100%;
}
body.full-screen-demo {
  max-width: none;
}
body.full-screen-demo > .page-wrapper:after {
  content: "";
  display: block;
  height: 0;
}
body.full-screen-demo > .page-wrapper .simulator-wrapper .top-content {
  display: none;
}
body.full-screen-demo > .page-wrapper .description,
body.full-screen-demo > .page-wrapper .axe-block,
body.full-screen-demo > .page-wrapper .second-description {
  display: none;
}
body.full-screen-demo > .page-wrapper .content .demo-details {
  display: none;
}
body.full-screen-demo .content .doc-content {
  margin: -40px 0 0 0;
  padding: 0;
  display: block;
}
body.full-screen-demo .content .doc-content .simulators #git-demo-frame,
body.full-screen-demo .content .doc-content .simulators .demo-frame {
  min-height: 90vh;
}
body.full-screen-demo .content .doc-content .simulators .dx-loadpanel-content {
  position: absolute;
  margin: auto;
  top: 0;
  left: 0;
  bottom: 0;
  right: 0;
}
body.full-screen-demo .content .demo-nav-links button#fullScreenLink .link-button#open-full-screen {
  display: none;
}
body.full-screen-demo .content .demo-nav-links button#fullScreenLink .link-button#close-full-screen {
  display: block;
}
body.full-screen-demo footer.footer {
  display: none;
}
body.hidden-menu .menu-state-button .opened {
  display: none;
}
body.hidden-menu .menu-state-button .closed {
  display: flex;
  align-items: center;
}
body:not(.hidden-menu) .menu-state-button .opened {
  display: flex;
  align-items: center;
}
body:not(.hidden-menu) .menu-state-button .closed {
  display: none;
}
body:not(:has(#survey-banner)) .body-container.content-width {
  padding-bottom: 0;
}
@media (min-width: 1400px) {
  .components-list-container {
    column-count: 5;
    gap: unset;
  }
}
@media (max-width: 1400px) {
  .components-list-container {
    gap: 32px;
  }
  body:not(.hidden-menu) .components-list-container {
    column-count: 4;
  }
  .hidden-menu .components-list-container {
    column-count: 5;
  }
}
@media (max-width: 1200px) {
  body:not(.hidden-menu) .components-list-container {
    column-count: 3;
  }
  .hidden-menu .components-list-container {
    column-count: 4;
  }
}
@media (max-width: 992px) {
  body:not(.hidden-menu) .components-list-container {
    column-count: 2;
  }
  .hidden-menu .components-list-container {
    column-count: 3;
  }
}
@media (max-width: 576px) {
  .hidden-menu .components-list-container {
    column-count: 2;
  }
}
/* banner */

body.dx-swatch-dark .content .doc-content .simulators .demo-device .demo-display .load-panel .load-panel-banner-wrapper .load-panel-banner {
  border-color: #cc7300;
}
body.dx-swatch-dark .content .doc-content .simulators .demo-device .demo-display .load-panel .load-panel-banner-wrapper .load-panel-banner p {
  color: #fafafa;
}
body.dx-swatch-dark .content .doc-content .simulators .demo-device .demo-display .load-panel .load-panel-banner-wrapper .load-panel-banner a {
  color: white;
}
/* banner */

.dx-swatch-dark .theme-toogle.light {
  margin-right: -24px;
}
.hidden-menu #menu .menu-state-button {
  margin-left: 0;
}
.hidden-menu #menu .breadcrumbs-dropdown.active ul {
  padding-left: 95px;
}
.hidden-menu .left-menu {
  display: none;
}
.full-screen-demo header,
.full-screen-demo #menu,
.full-screen-demo .left-menu {
  display: none;
}
.full-screen-demo .body-container.content-width {
  padding: 0;
  max-width: none;
}
html,
body {
  padding: 0;
  margin: 0;
  height: 100%;
  min-width: 400px;
  font-family: 'Roboto', sans-serif;
}
body.hidden-menu .menu-wrapper {
  padding-left: 24px;
}
@media only screen and (max-width: 1500px) {
  body.hidden-menu .menu-wrapper {
    padding-left: 18px;
  }
}
html.aspnet-demos .btn.btn-accent {
  color: white;
  border-color: #512bd4;
  outline-color: #512bd4;
  background-color: #512bd4;
}
html.aspnet-demos .btn.btn-accent svg {
  fill: white;
}
html.aspnet-demos .btn.btn-accent svg path,
html.aspnet-demos .btn.btn-accent svg circle {
  fill: white;
}
html.aspnet-demos .btn.btn-accent:hover {
  color: white;
  border-color: #4525b4;
  outline-color: #4525b4;
  background-color: #4525b4;
}
html.aspnet-demos .btn.btn-accent:hover svg {
  fill: white;
}
html.aspnet-demos .btn.btn-accent:hover svg path,
html.aspnet-demos .btn.btn-accent:hover svg circle {
  fill: white;
}
html.aspnet-demos .btn.btn-accent:active,
html.aspnet-demos .btn.btn-accent:focus {
  color: white;
  border-color: #391e94;
  outline-color: #391e94;
  background-color: #391e94;
}
html.aspnet-demos .btn.btn-accent:active svg,
html.aspnet-demos .btn.btn-accent:focus svg {
  fill: white;
}
html.aspnet-demos .btn.btn-accent:active svg path,
html.aspnet-demos .btn.btn-accent:focus svg path,
html.aspnet-demos .btn.btn-accent:active svg circle,
html.aspnet-demos .btn.btn-accent:focus svg circle {
  fill: white;
}
html.aspnet-demos .btn.btn-outlined {
  color: #512bd4;
  border-color: #512bd4;
  outline-color: #512bd4;
  background-color: transparent;
}
html.aspnet-demos .btn.btn-outlined svg {
  fill: #512bd4;
}
html.aspnet-demos .btn.btn-outlined svg path,
html.aspnet-demos .btn.btn-outlined svg circle {
  fill: #512bd4;
}
html.aspnet-demos .btn.btn-outlined:hover {
  color: white;
  border-color: #4525b4;
  outline-color: #4525b4;
  background-color: #4525b4;
}
html.aspnet-demos .btn.btn-outlined:hover svg {
  fill: white;
}
html.aspnet-demos .btn.btn-outlined:hover svg path,
html.aspnet-demos .btn.btn-outlined:hover svg circle {
  fill: white;
}
html.aspnet-demos .btn.btn-outlined:active,
html.aspnet-demos .btn.btn-outlined:focus {
  color: white;
  border-color: #391e94;
  outline-color: #391e94;
  background-color: #391e94;
}
html.aspnet-demos .btn.btn-outlined:active svg,
html.aspnet-demos .btn.btn-outlined:focus svg {
  fill: white;
}
html.aspnet-demos .btn.btn-outlined:active svg path,
html.aspnet-demos .btn.btn-outlined:focus svg path,
html.aspnet-demos .btn.btn-outlined:active svg circle,
html.aspnet-demos .btn.btn-outlined:focus svg circle {
  fill: white;
}
html.aspnet-demos .btn.btn-outlined-text {
  color: #596c7d;
  border-color: #e7ebee;
  outline-color: #e7ebee;
  background-color: white;
}
html.aspnet-demos .btn.btn-outlined-text svg {
  fill: #596c7d;
}
html.aspnet-demos .btn.btn-outlined-text svg path,
html.aspnet-demos .btn.btn-outlined-text svg circle {
  fill: #596c7d;
}
html.aspnet-demos .btn.btn-outlined-text:hover {
  color: #596c7d;
  border-color: #e7ebee;
  outline-color: #e7ebee;
  background-color: #f3f5f6;
}
html.aspnet-demos .btn.btn-outlined-text:hover svg {
  fill: #596c7d;
}
html.aspnet-demos .btn.btn-outlined-text:hover svg path,
html.aspnet-demos .btn.btn-outlined-text:hover svg circle {
  fill: #596c7d;
}
html.aspnet-demos .btn.btn-outlined-text:active,
html.aspnet-demos .btn.btn-outlined-text:focus {
  color: #596c7d;
  border-color: #e7ebee;
  outline-color: #e7ebee;
  background-color: #edf0f2;
}
html.aspnet-demos .btn.btn-outlined-text:active svg,
html.aspnet-demos .btn.btn-outlined-text:focus svg {
  fill: #596c7d;
}
html.aspnet-demos .btn.btn-outlined-text:active svg path,
html.aspnet-demos .btn.btn-outlined-text:focus svg path,
html.aspnet-demos .btn.btn-outlined-text:active svg circle,
html.aspnet-demos .btn.btn-outlined-text:focus svg circle {
  fill: #596c7d;
}
html.aspnet-demos .btn.btn-blue-outline {
  background-color: white;
}
html.aspnet-demos .btn.btn-blue-outline:focus,
html.aspnet-demos .btn.btn-blue-outline:focus-visible {
  outline-color: #2190f7;
}
html.aspnet-demos .btn.btn-blue-outline:hover {
  background-color: rgba(28, 45, 54, 0.03);
}
html.aspnet-demos .btn.btn-blue-outline:active {
  background-color: rgba(28, 45, 54, 0.07);
}
html.aspnet-demos .btn.btn-orange {
  background-color: #ff9000;
}
html.aspnet-demos .btn.btn-orange:visited {
  color: white;
}
html.aspnet-demos .btn.btn-orange:hover {
  background-color: #f08700;
  color: white;
}
html.aspnet-demos .btn.btn-orange:visited:hover {
  color: white;
}
html.aspnet-demos .btn.btn-orange:active {
  background-color: #e07f00;
}
html.aspnet-demos .btn.btn-orange:focus-visible {
  outline-color: #cc7300;
}
html.aspnet-demos .btn.btn-orange svg,
html.aspnet-demos .btn.btn-orange path {
  fill: white;
}
html.aspnet-demos .btn.btn-text {
  color: #596c7d;
  border-color: white;
  outline-color: white;
  background-color: white;
}
html.aspnet-demos .btn.btn-text svg {
  fill: #596c7d;
}
html.aspnet-demos .btn.btn-text svg path,
html.aspnet-demos .btn.btn-text svg circle {
  fill: #596c7d;
}
html.aspnet-demos .btn.btn-text:hover {
  color: #596c7d;
  border-color: #f3f5f6;
  outline-color: #f3f5f6;
  background-color: #f3f5f6;
}
html.aspnet-demos .btn.btn-text:hover svg {
  fill: #596c7d;
}
html.aspnet-demos .btn.btn-text:hover svg path,
html.aspnet-demos .btn.btn-text:hover svg circle {
  fill: #596c7d;
}
html.aspnet-demos .btn.btn-text:active,
html.aspnet-demos .btn.btn-text:focus {
  color: #596c7d;
  border-color: #edf0f2;
  outline-color: #edf0f2;
  background-color: #edf0f2;
}
html.aspnet-demos .btn.btn-text:active svg,
html.aspnet-demos .btn.btn-text:focus svg {
  fill: #596c7d;
}
html.aspnet-demos .btn.btn-text:active svg path,
html.aspnet-demos .btn.btn-text:focus svg path,
html.aspnet-demos .btn.btn-text:active svg circle,
html.aspnet-demos .btn.btn-text:focus svg circle {
  fill: #596c7d;
}
html.aspnet-demos .btn.btn-text-accent {
  color: #512bd4;
  border-color: white;
  outline-color: white;
  background-color: white;
}
html.aspnet-demos .btn.btn-text-accent svg {
  fill: #512bd4;
}
html.aspnet-demos .btn.btn-text-accent svg path,
html.aspnet-demos .btn.btn-text-accent svg circle {
  fill: #512bd4;
}
html.aspnet-demos .btn.btn-text-accent:hover {
  color: #512bd4;
  border-color: #f3f5f6;
  outline-color: #f3f5f6;
  background-color: #f3f5f6;
}
html.aspnet-demos .btn.btn-text-accent:hover svg {
  fill: #512bd4;
}
html.aspnet-demos .btn.btn-text-accent:hover svg path,
html.aspnet-demos .btn.btn-text-accent:hover svg circle {
  fill: #512bd4;
}
html.aspnet-demos .btn.btn-text-accent:active,
html.aspnet-demos .btn.btn-text-accent:focus {
  color: #512bd4;
  border-color: #edf0f2;
  outline-color: #edf0f2;
  background-color: #edf0f2;
}
html.aspnet-demos .btn.btn-text-accent:active svg,
html.aspnet-demos .btn.btn-text-accent:focus svg {
  fill: #512bd4;
}
html.aspnet-demos .btn.btn-text-accent:active svg path,
html.aspnet-demos .btn.btn-text-accent:focus svg path,
html.aspnet-demos .btn.btn-text-accent:active svg circle,
html.aspnet-demos .btn.btn-text-accent:focus svg circle {
  fill: #512bd4;
}
html.aspnet-demos .btn.btn-text-outlined {
  color: white;
  border-color: white;
  outline-color: white;
  background-color: transparent;
}
html.aspnet-demos .btn.btn-text-outlined svg {
  fill: white;
}
html.aspnet-demos .btn.btn-text-outlined svg path,
html.aspnet-demos .btn.btn-text-outlined svg circle {
  fill: white;
}
html.aspnet-demos .btn.btn-text-outlined:hover {
  color: #512bd4;
  border-color: white;
  outline-color: white;
  background-color: white;
}
html.aspnet-demos .btn.btn-text-outlined:hover svg {
  fill: #512bd4;
}
html.aspnet-demos .btn.btn-text-outlined:hover svg path,
html.aspnet-demos .btn.btn-text-outlined:hover svg circle {
  fill: #512bd4;
}
html.aspnet-demos .btn.btn-text-outlined:active,
html.aspnet-demos .btn.btn-text-outlined:focus {
  color: #512bd4;
  border-color: #f3f5f6;
  outline-color: #f3f5f6;
  background-color: #f3f5f6;
}
html.aspnet-demos .btn.btn-text-outlined:active svg,
html.aspnet-demos .btn.btn-text-outlined:focus svg {
  fill: #512bd4;
}
html.aspnet-demos .btn.btn-text-outlined:active svg path,
html.aspnet-demos .btn.btn-text-outlined:focus svg path,
html.aspnet-demos .btn.btn-text-outlined:active svg circle,
html.aspnet-demos .btn.btn-text-outlined:focus svg circle {
  fill: #512bd4;
}
html.aspnet-demos .btn-read-more {
  color: #512bd4;
  background-color: white;
  border: none;
  outline: 1px solid #512bd4;
  display: flex;
  gap: 8px;
  font-family: Roboto;
  font-size: 16px;
  font-weight: 400;
  line-height: 20px;
  padding: 6px 16px 6px 8px;
  align-items: center;
  border-radius: 99px;
  cursor: pointer;
}
html.aspnet-demos .btn-read-more svg > path {
  fill: #512bd4;
}
html.aspnet-demos .btn-read-more .btn-read-more-text {
  background-image: linear-gradient(to right, #512bd4 4px, rgba(255, 255, 255, 0) 4px);
  background-position: bottom;
  background-size: 6px 1px;
  background-repeat: repeat-x;
  background-position-x: 1px;
}
html.aspnet-demos .btn-read-more:focus-visible {
  outline: 2px solid #512bd4;
}
html.aspnet-demos .btn-read-more:hover {
  background-color: rgba(81, 43, 212, 0.08);
}
html.aspnet-demos .btn-read-more:active {
  background-color: rgba(81, 43, 212, 0.12);
}
html.aspnet-demos .tbs {
  border-color: #e7ebee;
}
html.aspnet-demos .tbs-arrows,
html.aspnet-demos .tbs-arrow.btn {
  background-color: white;
  border: none;
}
html.aspnet-demos .tbs-item {
  color: #596c7d;
  background-color: white;
}
html.aspnet-demos .tbs-item:visited {
  color: #596c7d;
}
html.aspnet-demos .tbs-item-container:hover {
  background-color: #f3f5f6;
}
html.aspnet-demos .tbs-item-container:hover .tbs-item {
  background-color: #f3f5f6;
}
html.aspnet-demos .tbs-item-container.active .tbs-item {
  color: #512bd4;
}
html.aspnet-demos .tbs-item-container.active .tbs-item::after {
  background-color: #512bd4;
}
html.aspnet-demos .duo-card {
  background-color: #f3f5f6;
}
html.aspnet-demos .duo-card .wrapper-card:not(.active) svg path {
  fill: #596c7d;
}
html.aspnet-demos .duo-card .wrapper-card:not(.active) svg path.background {
  opacity: 0.5;
}
html.aspnet-demos .duo-card .wrapper-card:not(.active) svg path.letter {
  fill: #f3f5f6;
}
html.aspnet-demos .duo-card .wrapper-card.active input,
html.aspnet-demos .duo-card input.active {
  background-color: white;
}
html.aspnet-demos .duo-card input {
  color: #596c7d;
}
html.aspnet-demos .switch-toogle input:checked + .switch-slider {
  background-color: #512bd4;
}
html.aspnet-demos .switch-toogle input:checked + .switch-slider.disabled {
  background-color: #e7ebee;
}
html.aspnet-demos .switch-toogle input:checked + .switch-slider::before {
  background-color: white;
  box-shadow: 0px 1px 2px 0px rgba(0, 0, 0, 0.16);
}
html.aspnet-demos .switch-slider {
  background-color: white;
  border-color: #e7ebee;
}
html.aspnet-demos .switch-slider.disabled {
  background-color: #e7ebee;
}
html.aspnet-demos .switch-slider.disabled:before {
  background-color: white;
  box-shadow: 0px 1px 2px 0px rgba(0, 0, 0, 0.16);
}
html.aspnet-demos .switch-slider:before {
  background-color: #512bd4;
}
html.aspnet-demos .switch-label {
  color: #596c7d;
}
html.aspnet-demos .btn.btn-accent {
  color: white;
  border-color: #512bd4;
  outline-color: #512bd4;
  background-color: #512bd4;
}
html.aspnet-demos .btn.btn-accent svg {
  fill: white;
}
html.aspnet-demos .btn.btn-accent svg path,
html.aspnet-demos .btn.btn-accent svg circle {
  fill: white;
}
html.aspnet-demos .btn.btn-accent:hover {
  color: white;
  border-color: #4525b4;
  outline-color: #4525b4;
  background-color: #4525b4;
}
html.aspnet-demos .btn.btn-accent:hover svg {
  fill: white;
}
html.aspnet-demos .btn.btn-accent:hover svg path,
html.aspnet-demos .btn.btn-accent:hover svg circle {
  fill: white;
}
html.aspnet-demos .btn.btn-accent:active,
html.aspnet-demos .btn.btn-accent:focus {
  color: white;
  border-color: #391e94;
  outline-color: #391e94;
  background-color: #391e94;
}
html.aspnet-demos .btn.btn-accent:active svg,
html.aspnet-demos .btn.btn-accent:focus svg {
  fill: white;
}
html.aspnet-demos .btn.btn-accent:active svg path,
html.aspnet-demos .btn.btn-accent:focus svg path,
html.aspnet-demos .btn.btn-accent:active svg circle,
html.aspnet-demos .btn.btn-accent:focus svg circle {
  fill: white;
}
html.aspnet-demos .btn.btn-outlined {
  color: #512bd4;
  border-color: #512bd4;
  outline-color: #512bd4;
  background-color: transparent;
}
html.aspnet-demos .btn.btn-outlined svg {
  fill: #512bd4;
}
html.aspnet-demos .btn.btn-outlined svg path,
html.aspnet-demos .btn.btn-outlined svg circle {
  fill: #512bd4;
}
html.aspnet-demos .btn.btn-outlined:hover {
  color: white;
  border-color: #4525b4;
  outline-color: #4525b4;
  background-color: #4525b4;
}
html.aspnet-demos .btn.btn-outlined:hover svg {
  fill: white;
}
html.aspnet-demos .btn.btn-outlined:hover svg path,
html.aspnet-demos .btn.btn-outlined:hover svg circle {
  fill: white;
}
html.aspnet-demos .btn.btn-outlined:active,
html.aspnet-demos .btn.btn-outlined:focus {
  color: white;
  border-color: #391e94;
  outline-color: #391e94;
  background-color: #391e94;
}
html.aspnet-demos .btn.btn-outlined:active svg,
html.aspnet-demos .btn.btn-outlined:focus svg {
  fill: white;
}
html.aspnet-demos .btn.btn-outlined:active svg path,
html.aspnet-demos .btn.btn-outlined:focus svg path,
html.aspnet-demos .btn.btn-outlined:active svg circle,
html.aspnet-demos .btn.btn-outlined:focus svg circle {
  fill: white;
}
html.aspnet-demos .btn.btn-outlined-text {
  color: #596c7d;
  border-color: #e7ebee;
  outline-color: #e7ebee;
  background-color: white;
}
html.aspnet-demos .btn.btn-outlined-text svg {
  fill: #596c7d;
}
html.aspnet-demos .btn.btn-outlined-text svg path,
html.aspnet-demos .btn.btn-outlined-text svg circle {
  fill: #596c7d;
}
html.aspnet-demos .btn.btn-outlined-text:hover {
  color: #596c7d;
  border-color: #e7ebee;
  outline-color: #e7ebee;
  background-color: #f3f5f6;
}
html.aspnet-demos .btn.btn-outlined-text:hover svg {
  fill: #596c7d;
}
html.aspnet-demos .btn.btn-outlined-text:hover svg path,
html.aspnet-demos .btn.btn-outlined-text:hover svg circle {
  fill: #596c7d;
}
html.aspnet-demos .btn.btn-outlined-text:active,
html.aspnet-demos .btn.btn-outlined-text:focus {
  color: #596c7d;
  border-color: #e7ebee;
  outline-color: #e7ebee;
  background-color: #edf0f2;
}
html.aspnet-demos .btn.btn-outlined-text:active svg,
html.aspnet-demos .btn.btn-outlined-text:focus svg {
  fill: #596c7d;
}
html.aspnet-demos .btn.btn-outlined-text:active svg path,
html.aspnet-demos .btn.btn-outlined-text:focus svg path,
html.aspnet-demos .btn.btn-outlined-text:active svg circle,
html.aspnet-demos .btn.btn-outlined-text:focus svg circle {
  fill: #596c7d;
}
html.aspnet-demos .btn.btn-blue-outline {
  background-color: white;
}
html.aspnet-demos .btn.btn-blue-outline:focus,
html.aspnet-demos .btn.btn-blue-outline:focus-visible {
  outline-color: #2190f7;
}
html.aspnet-demos .btn.btn-blue-outline:hover {
  background-color: rgba(28, 45, 54, 0.03);
}
html.aspnet-demos .btn.btn-blue-outline:active {
  background-color: rgba(28, 45, 54, 0.07);
}
html.aspnet-demos .btn.btn-orange {
  background-color: #ff9000;
}
html.aspnet-demos .btn.btn-orange:visited {
  color: white;
}
html.aspnet-demos .btn.btn-orange:hover {
  background-color: #f08700;
  color: white;
}
html.aspnet-demos .btn.btn-orange:visited:hover {
  color: white;
}
html.aspnet-demos .btn.btn-orange:active {
  background-color: #e07f00;
}
html.aspnet-demos .btn.btn-orange:focus-visible {
  outline-color: #cc7300;
}
html.aspnet-demos .btn.btn-orange svg,
html.aspnet-demos .btn.btn-orange path {
  fill: white;
}
html.aspnet-demos .btn.btn-text {
  color: #596c7d;
  border-color: white;
  outline-color: white;
  background-color: white;
}
html.aspnet-demos .btn.btn-text svg {
  fill: #596c7d;
}
html.aspnet-demos .btn.btn-text svg path,
html.aspnet-demos .btn.btn-text svg circle {
  fill: #596c7d;
}
html.aspnet-demos .btn.btn-text:hover {
  color: #596c7d;
  border-color: #f3f5f6;
  outline-color: #f3f5f6;
  background-color: #f3f5f6;
}
html.aspnet-demos .btn.btn-text:hover svg {
  fill: #596c7d;
}
html.aspnet-demos .btn.btn-text:hover svg path,
html.aspnet-demos .btn.btn-text:hover svg circle {
  fill: #596c7d;
}
html.aspnet-demos .btn.btn-text:active,
html.aspnet-demos .btn.btn-text:focus {
  color: #596c7d;
  border-color: #edf0f2;
  outline-color: #edf0f2;
  background-color: #edf0f2;
}
html.aspnet-demos .btn.btn-text:active svg,
html.aspnet-demos .btn.btn-text:focus svg {
  fill: #596c7d;
}
html.aspnet-demos .btn.btn-text:active svg path,
html.aspnet-demos .btn.btn-text:focus svg path,
html.aspnet-demos .btn.btn-text:active svg circle,
html.aspnet-demos .btn.btn-text:focus svg circle {
  fill: #596c7d;
}
html.aspnet-demos .btn.btn-text-accent {
  color: #512bd4;
  border-color: white;
  outline-color: white;
  background-color: white;
}
html.aspnet-demos .btn.btn-text-accent svg {
  fill: #512bd4;
}
html.aspnet-demos .btn.btn-text-accent svg path,
html.aspnet-demos .btn.btn-text-accent svg circle {
  fill: #512bd4;
}
html.aspnet-demos .btn.btn-text-accent:hover {
  color: #512bd4;
  border-color: #f3f5f6;
  outline-color: #f3f5f6;
  background-color: #f3f5f6;
}
html.aspnet-demos .btn.btn-text-accent:hover svg {
  fill: #512bd4;
}
html.aspnet-demos .btn.btn-text-accent:hover svg path,
html.aspnet-demos .btn.btn-text-accent:hover svg circle {
  fill: #512bd4;
}
html.aspnet-demos .btn.btn-text-accent:active,
html.aspnet-demos .btn.btn-text-accent:focus {
  color: #512bd4;
  border-color: #edf0f2;
  outline-color: #edf0f2;
  background-color: #edf0f2;
}
html.aspnet-demos .btn.btn-text-accent:active svg,
html.aspnet-demos .btn.btn-text-accent:focus svg {
  fill: #512bd4;
}
html.aspnet-demos .btn.btn-text-accent:active svg path,
html.aspnet-demos .btn.btn-text-accent:focus svg path,
html.aspnet-demos .btn.btn-text-accent:active svg circle,
html.aspnet-demos .btn.btn-text-accent:focus svg circle {
  fill: #512bd4;
}
html.aspnet-demos .btn.btn-text-outlined {
  color: white;
  border-color: white;
  outline-color: white;
  background-color: transparent;
}
html.aspnet-demos .btn.btn-text-outlined svg {
  fill: white;
}
html.aspnet-demos .btn.btn-text-outlined svg path,
html.aspnet-demos .btn.btn-text-outlined svg circle {
  fill: white;
}
html.aspnet-demos .btn.btn-text-outlined:hover {
  color: #512bd4;
  border-color: white;
  outline-color: white;
  background-color: white;
}
html.aspnet-demos .btn.btn-text-outlined:hover svg {
  fill: #512bd4;
}
html.aspnet-demos .btn.btn-text-outlined:hover svg path,
html.aspnet-demos .btn.btn-text-outlined:hover svg circle {
  fill: #512bd4;
}
html.aspnet-demos .btn.btn-text-outlined:active,
html.aspnet-demos .btn.btn-text-outlined:focus {
  color: #512bd4;
  border-color: #f3f5f6;
  outline-color: #f3f5f6;
  background-color: #f3f5f6;
}
html.aspnet-demos .btn.btn-text-outlined:active svg,
html.aspnet-demos .btn.btn-text-outlined:focus svg {
  fill: #512bd4;
}
html.aspnet-demos .btn.btn-text-outlined:active svg path,
html.aspnet-demos .btn.btn-text-outlined:focus svg path,
html.aspnet-demos .btn.btn-text-outlined:active svg circle,
html.aspnet-demos .btn.btn-text-outlined:focus svg circle {
  fill: #512bd4;
}
html.aspnet-demos .btn-read-more {
  color: #512bd4;
  background-color: white;
  border: none;
  outline: 1px solid #512bd4;
  display: flex;
  gap: 8px;
  font-family: Roboto;
  font-size: 16px;
  font-weight: 400;
  line-height: 20px;
  padding: 6px 16px 6px 8px;
  align-items: center;
  border-radius: 99px;
  cursor: pointer;
}
html.aspnet-demos .btn-read-more svg > path {
  fill: #512bd4;
}
html.aspnet-demos .btn-read-more .btn-read-more-text {
  background-image: linear-gradient(to right, #512bd4 4px, rgba(255, 255, 255, 0) 4px);
  background-position: bottom;
  background-size: 6px 1px;
  background-repeat: repeat-x;
  background-position-x: 1px;
}
html.aspnet-demos .btn-read-more:focus-visible {
  outline: 2px solid #512bd4;
}
html.aspnet-demos .btn-read-more:hover {
  background-color: rgba(81, 43, 212, 0.08);
}
html.aspnet-demos .btn-read-more:active {
  background-color: rgba(81, 43, 212, 0.12);
}
html.aspnet-demos .tbs {
  border-color: #e7ebee;
}
html.aspnet-demos .tbs-arrows,
html.aspnet-demos .tbs-arrow.btn {
  background-color: white;
  border: none;
}
html.aspnet-demos .tbs-item {
  color: #596c7d;
  background-color: white;
}
html.aspnet-demos .tbs-item:visited {
  color: #596c7d;
}
html.aspnet-demos .tbs-item-container:hover {
  background-color: #f3f5f6;
}
html.aspnet-demos .tbs-item-container:hover .tbs-item {
  background-color: #f3f5f6;
}
html.aspnet-demos .tbs-item-container.active .tbs-item {
  color: #512bd4;
}
html.aspnet-demos .tbs-item-container.active .tbs-item::after {
  background-color: #512bd4;
}
html.aspnet-demos .duo-card {
  background-color: #f3f5f6;
}
html.aspnet-demos .duo-card .wrapper-card:not(.active) svg path {
  fill: #596c7d;
}
html.aspnet-demos .duo-card .wrapper-card:not(.active) svg path.background {
  opacity: 0.5;
}
html.aspnet-demos .duo-card .wrapper-card:not(.active) svg path.letter {
  fill: #f3f5f6;
}
html.aspnet-demos .duo-card .wrapper-card.active input,
html.aspnet-demos .duo-card input.active {
  background-color: white;
}
html.aspnet-demos .duo-card input {
  color: #596c7d;
}
html.aspnet-demos .switch-toogle input:checked + .switch-slider {
  background-color: #512bd4;
}
html.aspnet-demos .switch-toogle input:checked + .switch-slider.disabled {
  background-color: #e7ebee;
}
html.aspnet-demos .switch-toogle input:checked + .switch-slider::before {
  background-color: white;
  box-shadow: 0px 1px 2px 0px rgba(0, 0, 0, 0.16);
}
html.aspnet-demos .switch-slider {
  background-color: white;
  border-color: #e7ebee;
}
html.aspnet-demos .switch-slider.disabled {
  background-color: #e7ebee;
}
html.aspnet-demos .switch-slider.disabled:before {
  background-color: white;
  box-shadow: 0px 1px 2px 0px rgba(0, 0, 0, 0.16);
}
html.aspnet-demos .switch-slider:before {
  background-color: #512bd4;
}
html.aspnet-demos .switch-label {
  color: #596c7d;
}
html.aspnet-demos .btn.btn-accent {
  color: white;
  border-color: #512bd4;
  outline-color: #512bd4;
  background-color: #512bd4;
}
html.aspnet-demos .btn.btn-accent svg {
  fill: white;
}
html.aspnet-demos .btn.btn-accent svg path,
html.aspnet-demos .btn.btn-accent svg circle {
  fill: white;
}
html.aspnet-demos .btn.btn-accent:hover {
  color: white;
  border-color: #4525b4;
  outline-color: #4525b4;
  background-color: #4525b4;
}
html.aspnet-demos .btn.btn-accent:hover svg {
  fill: white;
}
html.aspnet-demos .btn.btn-accent:hover svg path,
html.aspnet-demos .btn.btn-accent:hover svg circle {
  fill: white;
}
html.aspnet-demos .btn.btn-accent:active,
html.aspnet-demos .btn.btn-accent:focus {
  color: white;
  border-color: #391e94;
  outline-color: #391e94;
  background-color: #391e94;
}
html.aspnet-demos .btn.btn-accent:active svg,
html.aspnet-demos .btn.btn-accent:focus svg {
  fill: white;
}
html.aspnet-demos .btn.btn-accent:active svg path,
html.aspnet-demos .btn.btn-accent:focus svg path,
html.aspnet-demos .btn.btn-accent:active svg circle,
html.aspnet-demos .btn.btn-accent:focus svg circle {
  fill: white;
}
html.aspnet-demos .btn.btn-outlined {
  color: #512bd4;
  border-color: #512bd4;
  outline-color: #512bd4;
  background-color: transparent;
}
html.aspnet-demos .btn.btn-outlined svg {
  fill: #512bd4;
}
html.aspnet-demos .btn.btn-outlined svg path,
html.aspnet-demos .btn.btn-outlined svg circle {
  fill: #512bd4;
}
html.aspnet-demos .btn.btn-outlined:hover {
  color: white;
  border-color: #4525b4;
  outline-color: #4525b4;
  background-color: #4525b4;
}
html.aspnet-demos .btn.btn-outlined:hover svg {
  fill: white;
}
html.aspnet-demos .btn.btn-outlined:hover svg path,
html.aspnet-demos .btn.btn-outlined:hover svg circle {
  fill: white;
}
html.aspnet-demos .btn.btn-outlined:active,
html.aspnet-demos .btn.btn-outlined:focus {
  color: white;
  border-color: #391e94;
  outline-color: #391e94;
  background-color: #391e94;
}
html.aspnet-demos .btn.btn-outlined:active svg,
html.aspnet-demos .btn.btn-outlined:focus svg {
  fill: white;
}
html.aspnet-demos .btn.btn-outlined:active svg path,
html.aspnet-demos .btn.btn-outlined:focus svg path,
html.aspnet-demos .btn.btn-outlined:active svg circle,
html.aspnet-demos .btn.btn-outlined:focus svg circle {
  fill: white;
}
html.aspnet-demos .btn.btn-outlined-text {
  color: #596c7d;
  border-color: #e7ebee;
  outline-color: #e7ebee;
  background-color: white;
}
html.aspnet-demos .btn.btn-outlined-text svg {
  fill: #596c7d;
}
html.aspnet-demos .btn.btn-outlined-text svg path,
html.aspnet-demos .btn.btn-outlined-text svg circle {
  fill: #596c7d;
}
html.aspnet-demos .btn.btn-outlined-text:hover {
  color: #596c7d;
  border-color: #e7ebee;
  outline-color: #e7ebee;
  background-color: #f3f5f6;
}
html.aspnet-demos .btn.btn-outlined-text:hover svg {
  fill: #596c7d;
}
html.aspnet-demos .btn.btn-outlined-text:hover svg path,
html.aspnet-demos .btn.btn-outlined-text:hover svg circle {
  fill: #596c7d;
}
html.aspnet-demos .btn.btn-outlined-text:active,
html.aspnet-demos .btn.btn-outlined-text:focus {
  color: #596c7d;
  border-color: #e7ebee;
  outline-color: #e7ebee;
  background-color: #edf0f2;
}
html.aspnet-demos .btn.btn-outlined-text:active svg,
html.aspnet-demos .btn.btn-outlined-text:focus svg {
  fill: #596c7d;
}
html.aspnet-demos .btn.btn-outlined-text:active svg path,
html.aspnet-demos .btn.btn-outlined-text:focus svg path,
html.aspnet-demos .btn.btn-outlined-text:active svg circle,
html.aspnet-demos .btn.btn-outlined-text:focus svg circle {
  fill: #596c7d;
}
html.aspnet-demos .btn.btn-blue-outline {
  background-color: white;
}
html.aspnet-demos .btn.btn-blue-outline:focus,
html.aspnet-demos .btn.btn-blue-outline:focus-visible {
  outline-color: #2190f7;
}
html.aspnet-demos .btn.btn-blue-outline:hover {
  background-color: rgba(28, 45, 54, 0.03);
}
html.aspnet-demos .btn.btn-blue-outline:active {
  background-color: rgba(28, 45, 54, 0.07);
}
html.aspnet-demos .btn.btn-orange {
  background-color: #ff9000;
}
html.aspnet-demos .btn.btn-orange:visited {
  color: white;
}
html.aspnet-demos .btn.btn-orange:hover {
  background-color: #f08700;
  color: white;
}
html.aspnet-demos .btn.btn-orange:visited:hover {
  color: white;
}
html.aspnet-demos .btn.btn-orange:active {
  background-color: #e07f00;
}
html.aspnet-demos .btn.btn-orange:focus-visible {
  outline-color: #cc7300;
}
html.aspnet-demos .btn.btn-orange svg,
html.aspnet-demos .btn.btn-orange path {
  fill: white;
}
html.aspnet-demos .btn.btn-text {
  color: #596c7d;
  border-color: white;
  outline-color: white;
  background-color: white;
}
html.aspnet-demos .btn.btn-text svg {
  fill: #596c7d;
}
html.aspnet-demos .btn.btn-text svg path,
html.aspnet-demos .btn.btn-text svg circle {
  fill: #596c7d;
}
html.aspnet-demos .btn.btn-text:hover {
  color: #596c7d;
  border-color: #f3f5f6;
  outline-color: #f3f5f6;
  background-color: #f3f5f6;
}
html.aspnet-demos .btn.btn-text:hover svg {
  fill: #596c7d;
}
html.aspnet-demos .btn.btn-text:hover svg path,
html.aspnet-demos .btn.btn-text:hover svg circle {
  fill: #596c7d;
}
html.aspnet-demos .btn.btn-text:active,
html.aspnet-demos .btn.btn-text:focus {
  color: #596c7d;
  border-color: #edf0f2;
  outline-color: #edf0f2;
  background-color: #edf0f2;
}
html.aspnet-demos .btn.btn-text:active svg,
html.aspnet-demos .btn.btn-text:focus svg {
  fill: #596c7d;
}
html.aspnet-demos .btn.btn-text:active svg path,
html.aspnet-demos .btn.btn-text:focus svg path,
html.aspnet-demos .btn.btn-text:active svg circle,
html.aspnet-demos .btn.btn-text:focus svg circle {
  fill: #596c7d;
}
html.aspnet-demos .btn.btn-text-accent {
  color: #512bd4;
  border-color: white;
  outline-color: white;
  background-color: white;
}
html.aspnet-demos .btn.btn-text-accent svg {
  fill: #512bd4;
}
html.aspnet-demos .btn.btn-text-accent svg path,
html.aspnet-demos .btn.btn-text-accent svg circle {
  fill: #512bd4;
}
html.aspnet-demos .btn.btn-text-accent:hover {
  color: #512bd4;
  border-color: #f3f5f6;
  outline-color: #f3f5f6;
  background-color: #f3f5f6;
}
html.aspnet-demos .btn.btn-text-accent:hover svg {
  fill: #512bd4;
}
html.aspnet-demos .btn.btn-text-accent:hover svg path,
html.aspnet-demos .btn.btn-text-accent:hover svg circle {
  fill: #512bd4;
}
html.aspnet-demos .btn.btn-text-accent:active,
html.aspnet-demos .btn.btn-text-accent:focus {
  color: #512bd4;
  border-color: #edf0f2;
  outline-color: #edf0f2;
  background-color: #edf0f2;
}
html.aspnet-demos .btn.btn-text-accent:active svg,
html.aspnet-demos .btn.btn-text-accent:focus svg {
  fill: #512bd4;
}
html.aspnet-demos .btn.btn-text-accent:active svg path,
html.aspnet-demos .btn.btn-text-accent:focus svg path,
html.aspnet-demos .btn.btn-text-accent:active svg circle,
html.aspnet-demos .btn.btn-text-accent:focus svg circle {
  fill: #512bd4;
}
html.aspnet-demos .btn.btn-text-outlined {
  color: white;
  border-color: white;
  outline-color: white;
  background-color: transparent;
}
html.aspnet-demos .btn.btn-text-outlined svg {
  fill: white;
}
html.aspnet-demos .btn.btn-text-outlined svg path,
html.aspnet-demos .btn.btn-text-outlined svg circle {
  fill: white;
}
html.aspnet-demos .btn.btn-text-outlined:hover {
  color: #512bd4;
  border-color: white;
  outline-color: white;
  background-color: white;
}
html.aspnet-demos .btn.btn-text-outlined:hover svg {
  fill: #512bd4;
}
html.aspnet-demos .btn.btn-text-outlined:hover svg path,
html.aspnet-demos .btn.btn-text-outlined:hover svg circle {
  fill: #512bd4;
}
html.aspnet-demos .btn.btn-text-outlined:active,
html.aspnet-demos .btn.btn-text-outlined:focus {
  color: #512bd4;
  border-color: #f3f5f6;
  outline-color: #f3f5f6;
  background-color: #f3f5f6;
}
html.aspnet-demos .btn.btn-text-outlined:active svg,
html.aspnet-demos .btn.btn-text-outlined:focus svg {
  fill: #512bd4;
}
html.aspnet-demos .btn.btn-text-outlined:active svg path,
html.aspnet-demos .btn.btn-text-outlined:focus svg path,
html.aspnet-demos .btn.btn-text-outlined:active svg circle,
html.aspnet-demos .btn.btn-text-outlined:focus svg circle {
  fill: #512bd4;
}
html.aspnet-demos .btn-read-more {
  color: #512bd4;
  background-color: white;
  border: none;
  outline: 1px solid #512bd4;
  display: flex;
  gap: 8px;
  font-family: Roboto;
  font-size: 16px;
  font-weight: 400;
  line-height: 20px;
  padding: 6px 16px 6px 8px;
  align-items: center;
  border-radius: 99px;
  cursor: pointer;
}
html.aspnet-demos .btn-read-more svg > path {
  fill: #512bd4;
}
html.aspnet-demos .btn-read-more .btn-read-more-text {
  background-image: linear-gradient(to right, #512bd4 4px, rgba(255, 255, 255, 0) 4px);
  background-position: bottom;
  background-size: 6px 1px;
  background-repeat: repeat-x;
  background-position-x: 1px;
}
html.aspnet-demos .btn-read-more:focus-visible {
  outline: 2px solid #512bd4;
}
html.aspnet-demos .btn-read-more:hover {
  background-color: rgba(81, 43, 212, 0.08);
}
html.aspnet-demos .btn-read-more:active {
  background-color: rgba(81, 43, 212, 0.12);
}
html.aspnet-demos .tbs {
  border-color: #e7ebee;
}
html.aspnet-demos .tbs-arrows,
html.aspnet-demos .tbs-arrow.btn {
  background-color: white;
  border: none;
}
html.aspnet-demos .tbs-item {
  color: #596c7d;
  background-color: white;
}
html.aspnet-demos .tbs-item:visited {
  color: #596c7d;
}
html.aspnet-demos .tbs-item-container:hover {
  background-color: #f3f5f6;
}
html.aspnet-demos .tbs-item-container:hover .tbs-item {
  background-color: #f3f5f6;
}
html.aspnet-demos .tbs-item-container.active .tbs-item {
  color: #512bd4;
}
html.aspnet-demos .tbs-item-container.active .tbs-item::after {
  background-color: #512bd4;
}
html.aspnet-demos .duo-card {
  background-color: #f3f5f6;
}
html.aspnet-demos .duo-card .wrapper-card:not(.active) svg path {
  fill: #596c7d;
}
html.aspnet-demos .duo-card .wrapper-card:not(.active) svg path.background {
  opacity: 0.5;
}
html.aspnet-demos .duo-card .wrapper-card:not(.active) svg path.letter {
  fill: #f3f5f6;
}
html.aspnet-demos .duo-card .wrapper-card.active input,
html.aspnet-demos .duo-card input.active {
  background-color: white;
}
html.aspnet-demos .duo-card input {
  color: #596c7d;
}
html.aspnet-demos .switch-toogle input:checked + .switch-slider {
  background-color: #512bd4;
}
html.aspnet-demos .switch-toogle input:checked + .switch-slider.disabled {
  background-color: #e7ebee;
}
html.aspnet-demos .switch-toogle input:checked + .switch-slider::before {
  background-color: white;
  box-shadow: 0px 1px 2px 0px rgba(0, 0, 0, 0.16);
}
html.aspnet-demos .switch-slider {
  background-color: white;
  border-color: #e7ebee;
}
html.aspnet-demos .switch-slider.disabled {
  background-color: #e7ebee;
}
html.aspnet-demos .switch-slider.disabled:before {
  background-color: white;
  box-shadow: 0px 1px 2px 0px rgba(0, 0, 0, 0.16);
}
html.aspnet-demos .switch-slider:before {
  background-color: #512bd4;
}
html.aspnet-demos .switch-label {
  color: #596c7d;
}
html.aspnet-demos .btn.btn-accent {
  color: white;
  border-color: #512bd4;
  outline-color: #512bd4;
  background-color: #512bd4;
}
html.aspnet-demos .btn.btn-accent svg {
  fill: white;
}
html.aspnet-demos .btn.btn-accent svg path,
html.aspnet-demos .btn.btn-accent svg circle {
  fill: white;
}
html.aspnet-demos .btn.btn-accent:hover {
  color: white;
  border-color: #4525b4;
  outline-color: #4525b4;
  background-color: #4525b4;
}
html.aspnet-demos .btn.btn-accent:hover svg {
  fill: white;
}
html.aspnet-demos .btn.btn-accent:hover svg path,
html.aspnet-demos .btn.btn-accent:hover svg circle {
  fill: white;
}
html.aspnet-demos .btn.btn-accent:active,
html.aspnet-demos .btn.btn-accent:focus {
  color: white;
  border-color: #391e94;
  outline-color: #391e94;
  background-color: #391e94;
}
html.aspnet-demos .btn.btn-accent:active svg,
html.aspnet-demos .btn.btn-accent:focus svg {
  fill: white;
}
html.aspnet-demos .btn.btn-accent:active svg path,
html.aspnet-demos .btn.btn-accent:focus svg path,
html.aspnet-demos .btn.btn-accent:active svg circle,
html.aspnet-demos .btn.btn-accent:focus svg circle {
  fill: white;
}
html.aspnet-demos .btn.btn-outlined {
  color: #512bd4;
  border-color: #512bd4;
  outline-color: #512bd4;
  background-color: transparent;
}
html.aspnet-demos .btn.btn-outlined svg {
  fill: #512bd4;
}
html.aspnet-demos .btn.btn-outlined svg path,
html.aspnet-demos .btn.btn-outlined svg circle {
  fill: #512bd4;
}
html.aspnet-demos .btn.btn-outlined:hover {
  color: white;
  border-color: #4525b4;
  outline-color: #4525b4;
  background-color: #4525b4;
}
html.aspnet-demos .btn.btn-outlined:hover svg {
  fill: white;
}
html.aspnet-demos .btn.btn-outlined:hover svg path,
html.aspnet-demos .btn.btn-outlined:hover svg circle {
  fill: white;
}
html.aspnet-demos .btn.btn-outlined:active,
html.aspnet-demos .btn.btn-outlined:focus {
  color: white;
  border-color: #391e94;
  outline-color: #391e94;
  background-color: #391e94;
}
html.aspnet-demos .btn.btn-outlined:active svg,
html.aspnet-demos .btn.btn-outlined:focus svg {
  fill: white;
}
html.aspnet-demos .btn.btn-outlined:active svg path,
html.aspnet-demos .btn.btn-outlined:focus svg path,
html.aspnet-demos .btn.btn-outlined:active svg circle,
html.aspnet-demos .btn.btn-outlined:focus svg circle {
  fill: white;
}
html.aspnet-demos .btn.btn-outlined-text {
  color: #596c7d;
  border-color: #e7ebee;
  outline-color: #e7ebee;
  background-color: white;
}
html.aspnet-demos .btn.btn-outlined-text svg {
  fill: #596c7d;
}
html.aspnet-demos .btn.btn-outlined-text svg path,
html.aspnet-demos .btn.btn-outlined-text svg circle {
  fill: #596c7d;
}
html.aspnet-demos .btn.btn-outlined-text:hover {
  color: #596c7d;
  border-color: #e7ebee;
  outline-color: #e7ebee;
  background-color: #f3f5f6;
}
html.aspnet-demos .btn.btn-outlined-text:hover svg {
  fill: #596c7d;
}
html.aspnet-demos .btn.btn-outlined-text:hover svg path,
html.aspnet-demos .btn.btn-outlined-text:hover svg circle {
  fill: #596c7d;
}
html.aspnet-demos .btn.btn-outlined-text:active,
html.aspnet-demos .btn.btn-outlined-text:focus {
  color: #596c7d;
  border-color: #e7ebee;
  outline-color: #e7ebee;
  background-color: #edf0f2;
}
html.aspnet-demos .btn.btn-outlined-text:active svg,
html.aspnet-demos .btn.btn-outlined-text:focus svg {
  fill: #596c7d;
}
html.aspnet-demos .btn.btn-outlined-text:active svg path,
html.aspnet-demos .btn.btn-outlined-text:focus svg path,
html.aspnet-demos .btn.btn-outlined-text:active svg circle,
html.aspnet-demos .btn.btn-outlined-text:focus svg circle {
  fill: #596c7d;
}
html.aspnet-demos .btn.btn-blue-outline {
  background-color: white;
}
html.aspnet-demos .btn.btn-blue-outline:focus,
html.aspnet-demos .btn.btn-blue-outline:focus-visible {
  outline-color: #2190f7;
}
html.aspnet-demos .btn.btn-blue-outline:hover {
  background-color: rgba(28, 45, 54, 0.03);
}
html.aspnet-demos .btn.btn-blue-outline:active {
  background-color: rgba(28, 45, 54, 0.07);
}
html.aspnet-demos .btn.btn-orange {
  background-color: #ff9000;
}
html.aspnet-demos .btn.btn-orange:visited {
  color: white;
}
html.aspnet-demos .btn.btn-orange:hover {
  background-color: #f08700;
  color: white;
}
html.aspnet-demos .btn.btn-orange:visited:hover {
  color: white;
}
html.aspnet-demos .btn.btn-orange:active {
  background-color: #e07f00;
}
html.aspnet-demos .btn.btn-orange:focus-visible {
  outline-color: #cc7300;
}
html.aspnet-demos .btn.btn-orange svg,
html.aspnet-demos .btn.btn-orange path {
  fill: white;
}
html.aspnet-demos .btn.btn-text {
  color: #596c7d;
  border-color: white;
  outline-color: white;
  background-color: white;
}
html.aspnet-demos .btn.btn-text svg {
  fill: #596c7d;
}
html.aspnet-demos .btn.btn-text svg path,
html.aspnet-demos .btn.btn-text svg circle {
  fill: #596c7d;
}
html.aspnet-demos .btn.btn-text:hover {
  color: #596c7d;
  border-color: #f3f5f6;
  outline-color: #f3f5f6;
  background-color: #f3f5f6;
}
html.aspnet-demos .btn.btn-text:hover svg {
  fill: #596c7d;
}
html.aspnet-demos .btn.btn-text:hover svg path,
html.aspnet-demos .btn.btn-text:hover svg circle {
  fill: #596c7d;
}
html.aspnet-demos .btn.btn-text:active,
html.aspnet-demos .btn.btn-text:focus {
  color: #596c7d;
  border-color: #edf0f2;
  outline-color: #edf0f2;
  background-color: #edf0f2;
}
html.aspnet-demos .btn.btn-text:active svg,
html.aspnet-demos .btn.btn-text:focus svg {
  fill: #596c7d;
}
html.aspnet-demos .btn.btn-text:active svg path,
html.aspnet-demos .btn.btn-text:focus svg path,
html.aspnet-demos .btn.btn-text:active svg circle,
html.aspnet-demos .btn.btn-text:focus svg circle {
  fill: #596c7d;
}
html.aspnet-demos .btn.btn-text-accent {
  color: #512bd4;
  border-color: white;
  outline-color: white;
  background-color: white;
}
html.aspnet-demos .btn.btn-text-accent svg {
  fill: #512bd4;
}
html.aspnet-demos .btn.btn-text-accent svg path,
html.aspnet-demos .btn.btn-text-accent svg circle {
  fill: #512bd4;
}
html.aspnet-demos .btn.btn-text-accent:hover {
  color: #512bd4;
  border-color: #f3f5f6;
  outline-color: #f3f5f6;
  background-color: #f3f5f6;
}
html.aspnet-demos .btn.btn-text-accent:hover svg {
  fill: #512bd4;
}
html.aspnet-demos .btn.btn-text-accent:hover svg path,
html.aspnet-demos .btn.btn-text-accent:hover svg circle {
  fill: #512bd4;
}
html.aspnet-demos .btn.btn-text-accent:active,
html.aspnet-demos .btn.btn-text-accent:focus {
  color: #512bd4;
  border-color: #edf0f2;
  outline-color: #edf0f2;
  background-color: #edf0f2;
}
html.aspnet-demos .btn.btn-text-accent:active svg,
html.aspnet-demos .btn.btn-text-accent:focus svg {
  fill: #512bd4;
}
html.aspnet-demos .btn.btn-text-accent:active svg path,
html.aspnet-demos .btn.btn-text-accent:focus svg path,
html.aspnet-demos .btn.btn-text-accent:active svg circle,
html.aspnet-demos .btn.btn-text-accent:focus svg circle {
  fill: #512bd4;
}
html.aspnet-demos .btn.btn-text-outlined {
  color: white;
  border-color: white;
  outline-color: white;
  background-color: transparent;
}
html.aspnet-demos .btn.btn-text-outlined svg {
  fill: white;
}
html.aspnet-demos .btn.btn-text-outlined svg path,
html.aspnet-demos .btn.btn-text-outlined svg circle {
  fill: white;
}
html.aspnet-demos .btn.btn-text-outlined:hover {
  color: #512bd4;
  border-color: white;
  outline-color: white;
  background-color: white;
}
html.aspnet-demos .btn.btn-text-outlined:hover svg {
  fill: #512bd4;
}
html.aspnet-demos .btn.btn-text-outlined:hover svg path,
html.aspnet-demos .btn.btn-text-outlined:hover svg circle {
  fill: #512bd4;
}
html.aspnet-demos .btn.btn-text-outlined:active,
html.aspnet-demos .btn.btn-text-outlined:focus {
  color: #512bd4;
  border-color: #f3f5f6;
  outline-color: #f3f5f6;
  background-color: #f3f5f6;
}
html.aspnet-demos .btn.btn-text-outlined:active svg,
html.aspnet-demos .btn.btn-text-outlined:focus svg {
  fill: #512bd4;
}
html.aspnet-demos .btn.btn-text-outlined:active svg path,
html.aspnet-demos .btn.btn-text-outlined:focus svg path,
html.aspnet-demos .btn.btn-text-outlined:active svg circle,
html.aspnet-demos .btn.btn-text-outlined:focus svg circle {
  fill: #512bd4;
}
html.aspnet-demos .btn-read-more {
  color: #512bd4;
  background-color: white;
  border: none;
  outline: 1px solid #512bd4;
  display: flex;
  gap: 8px;
  font-family: Roboto;
  font-size: 16px;
  font-weight: 400;
  line-height: 20px;
  padding: 6px 16px 6px 8px;
  align-items: center;
  border-radius: 99px;
  cursor: pointer;
}
html.aspnet-demos .btn-read-more svg > path {
  fill: #512bd4;
}
html.aspnet-demos .btn-read-more .btn-read-more-text {
  background-image: linear-gradient(to right, #512bd4 4px, rgba(255, 255, 255, 0) 4px);
  background-position: bottom;
  background-size: 6px 1px;
  background-repeat: repeat-x;
  background-position-x: 1px;
}
html.aspnet-demos .btn-read-more:focus-visible {
  outline: 2px solid #512bd4;
}
html.aspnet-demos .btn-read-more:hover {
  background-color: rgba(81, 43, 212, 0.08);
}
html.aspnet-demos .btn-read-more:active {
  background-color: rgba(81, 43, 212, 0.12);
}
html.aspnet-demos .tbs {
  border-color: #e7ebee;
}
html.aspnet-demos .tbs-arrows,
html.aspnet-demos .tbs-arrow.btn {
  background-color: white;
  border: none;
}
html.aspnet-demos .tbs-item {
  color: #596c7d;
  background-color: white;
}
html.aspnet-demos .tbs-item:visited {
  color: #596c7d;
}
html.aspnet-demos .tbs-item-container:hover {
  background-color: #f3f5f6;
}
html.aspnet-demos .tbs-item-container:hover .tbs-item {
  background-color: #f3f5f6;
}
html.aspnet-demos .tbs-item-container.active .tbs-item {
  color: #512bd4;
}
html.aspnet-demos .tbs-item-container.active .tbs-item::after {
  background-color: #512bd4;
}
html.aspnet-demos .duo-card {
  background-color: #f3f5f6;
}
html.aspnet-demos .duo-card .wrapper-card:not(.active) svg path {
  fill: #596c7d;
}
html.aspnet-demos .duo-card .wrapper-card:not(.active) svg path.background {
  opacity: 0.5;
}
html.aspnet-demos .duo-card .wrapper-card:not(.active) svg path.letter {
  fill: #f3f5f6;
}
html.aspnet-demos .duo-card .wrapper-card.active input,
html.aspnet-demos .duo-card input.active {
  background-color: white;
}
html.aspnet-demos .duo-card input {
  color: #596c7d;
}
html.aspnet-demos .switch-toogle input:checked + .switch-slider {
  background-color: #512bd4;
}
html.aspnet-demos .switch-toogle input:checked + .switch-slider.disabled {
  background-color: #e7ebee;
}
html.aspnet-demos .switch-toogle input:checked + .switch-slider::before {
  background-color: white;
  box-shadow: 0px 1px 2px 0px rgba(0, 0, 0, 0.16);
}
html.aspnet-demos .switch-slider {
  background-color: white;
  border-color: #e7ebee;
}
html.aspnet-demos .switch-slider.disabled {
  background-color: #e7ebee;
}
html.aspnet-demos .switch-slider.disabled:before {
  background-color: white;
  box-shadow: 0px 1px 2px 0px rgba(0, 0, 0, 0.16);
}
html.aspnet-demos .switch-slider:before {
  background-color: #512bd4;
}
html.aspnet-demos .switch-label {
  color: #596c7d;
}
html.aspnet-demos .header-approach-selected {
  color: #512bd4;
  background-color: white;
}
html.aspnet-demos .header-approach-selected:hover {
  background-color: rgba(28, 45, 54, 0.03);
}
html.aspnet-demos .header-approach-selected:active {
  background-color: rgba(28, 45, 54, 0.07);
}
html.aspnet-demos .header-approach-selected::after {
  content: '';
  width: 0;
  height: 0;
  border-top: none;
  border-right: 6px solid transparent;
  border-left: 6px solid transparent;
  border-bottom: 6px solid #596c7d;
  transform: rotate(180deg);
}
html.aspnet-demos .header-approach-selected.active::after {
  content: '';
  width: 0;
  height: 0;
  border-top: none;
  border-right: 6px solid transparent;
  border-left: 6px solid transparent;
  border-bottom: 6px solid #596c7d;
  transform: rotate(0);
}
html.aspnet-demos .header-approach-list {
  background-color: white;
}
html.aspnet-demos .header-approach-list-item:hover {
  background-color: rgba(28, 45, 54, 0.03);
}
html.aspnet-demos .header-approach-list-item:active {
  background-color: rgba(28, 45, 54, 0.07);
}
html.aspnet-demos .header-approach-list-item-content {
  color: #596c7d;
}
html.aspnet-demos .header-approach-list {
  background-color: white;
}
html.aspnet-demos .header-approach-list-item:hover {
  background-color: rgba(28, 45, 54, 0.03);
}
html.aspnet-demos .header-approach-list-item:active {
  background-color: rgba(28, 45, 54, 0.07);
}
html.aspnet-demos .header-approach-list-item-content {
  color: #596c7d;
}
html.aspnet-demos .header-approach-selected {
  color: #512bd4;
  background-color: white;
}
html.aspnet-demos .header-approach-selected:hover {
  background-color: rgba(28, 45, 54, 0.03);
}
html.aspnet-demos .header-approach-selected:active {
  background-color: rgba(28, 45, 54, 0.07);
}
html.aspnet-demos .header-approach-selected::after {
  content: '';
  width: 0;
  height: 0;
  border-top: none;
  border-right: 6px solid transparent;
  border-left: 6px solid transparent;
  border-bottom: 6px solid #596c7d;
  transform: rotate(180deg);
}
html.aspnet-demos .header-approach-selected.active::after {
  content: '';
  width: 0;
  height: 0;
  border-top: none;
  border-right: 6px solid transparent;
  border-left: 6px solid transparent;
  border-bottom: 6px solid #596c7d;
  transform: rotate(0);
}
html.aspnet-demos .header-approach-list {
  background-color: white;
}
html.aspnet-demos .header-approach-list-item:hover {
  background-color: rgba(28, 45, 54, 0.03);
}
html.aspnet-demos .header-approach-list-item:active {
  background-color: rgba(28, 45, 54, 0.07);
}
html.aspnet-demos .header-approach-list-item-content {
  color: #596c7d;
}
html.aspnet-demos .header-approach-list {
  background-color: white;
}
html.aspnet-demos .header-approach-list-item:hover {
  background-color: rgba(28, 45, 54, 0.03);
}
html.aspnet-demos .header-approach-list-item:active {
  background-color: rgba(28, 45, 54, 0.07);
}
html.aspnet-demos .header-approach-list-item-content {
  color: #596c7d;
}
html.aspnet-demos .header-drawer {
  background-color: white;
}
html.aspnet-demos .header-drawer .header-link.selected {
  border-bottom-color: transparent;
  border-left-color: #512bd4;
}
html.aspnet-demos .header-drawer {
  background-color: white;
}
html.aspnet-demos .header-drawer .header-link.selected {
  border-bottom-color: transparent;
  border-left-color: #512bd4;
}
@media only screen and (max-width: 1160px) {
  html.aspnet-demos .drawer-menu-divider {
    background-color: #e7ebee;
  }
}
html.aspnet-demos header .header {
  background-color: white;
}
html.aspnet-demos .header--logo--js {
  fill: #512bd4;
}
html.aspnet-demos .header-drawer .header-link:focus {
  border-left-color: #512bd4;
}
html.aspnet-demos .header-drawer .header-link.selected:focus {
  border-left-color: #4525b4;
}
html.aspnet-demos .header button {
  background-color: transparent;
}
html.aspnet-demos .header-link-text {
  color: #596c7d;
}
html.aspnet-demos .header-link:focus {
  outline: none;
}
html.aspnet-demos .header-link:hover {
  background-color: rgba(28, 45, 54, 0.03);
}
html.aspnet-demos .header-link.active {
  background-color: rgba(28, 45, 54, 0.07);
}
html.aspnet-demos .header-container-left .header-link:focus,
html.aspnet-demos .header-container-right .header-link:focus,
html.aspnet-demos .header-container-left .header-link.active,
html.aspnet-demos .header-container-right .header-link.active,
html.aspnet-demos .header-container-left .header-link.selected,
html.aspnet-demos .header-container-right .header-link.selected {
  position: relative;
}
html.aspnet-demos .header-container-left .header-link:focus::after,
html.aspnet-demos .header-container-right .header-link:focus::after,
html.aspnet-demos .header-container-left .header-link.active::after,
html.aspnet-demos .header-container-right .header-link.active::after,
html.aspnet-demos .header-container-left .header-link.selected::after,
html.aspnet-demos .header-container-right .header-link.selected::after {
  position: absolute;
  bottom: 0;
  left: 12px;
  right: 12px;
  content: ' ';
  height: 4px;
  border-radius: 4px 4px 0 0;
  background-color: #512bd4;
}
html.aspnet-demos .header-container-left .header-link:focus::after,
html.aspnet-demos .header-container-right .header-link:focus::after,
html.aspnet-demos .header-container-left .header-link.active::after,
html.aspnet-demos .header-container-right .header-link.active::after,
html.aspnet-demos .header-container-left .header-link.selected::after,
html.aspnet-demos .header-container-right .header-link.selected::after {
  position: absolute;
  bottom: 0;
  left: 12px;
  right: 12px;
  content: ' ';
  height: 4px;
  border-radius: 4px 4px 0 0;
  background-color: #512bd4;
}
html.aspnet-demos .header-container-left .header-link.selected:focus::after,
html.aspnet-demos .header-container-right .header-link.selected:focus::after {
  background-color: #4525b4;
}
html.aspnet-demos .header-menu-item .header-menu-list {
  background-color: white;
}
html.aspnet-demos .header-menu-item .header-menu-list-item:hover {
  background-color: rgba(28, 45, 54, 0.03);
}
html.aspnet-demos .header-menu-item .header-menu-list-item:active {
  background-color: rgba(28, 45, 54, 0.07);
}
html.aspnet-demos .header-menu-item .header-menu-list-item-content {
  color: #596c7d;
}
html.aspnet-demos .header-menu-item .header-menu-list {
  background-color: white;
}
html.aspnet-demos .header-menu-item .header-menu-list-item:hover {
  background-color: rgba(28, 45, 54, 0.03);
}
html.aspnet-demos .header-menu-item .header-menu-list-item:active {
  background-color: rgba(28, 45, 54, 0.07);
}
html.aspnet-demos .header-menu-item .header-menu-list-item-content {
  color: #596c7d;
}
html.aspnet-demos .header-menu-item .header-menu-button::before {
  position: absolute;
  bottom: 10px;
  left: calc(44%);
  content: '';
  width: 0;
  height: 0;
  border-top: none;
  border-right: 6px solid transparent;
  border-left: 6px solid transparent;
  border-bottom: 6px solid #596c7d;
  transform: rotate(180deg);
}
html.aspnet-demos .header-approach-selected {
  color: #512bd4;
  background-color: white;
}
html.aspnet-demos .header-approach-selected:hover {
  background-color: rgba(28, 45, 54, 0.03);
}
html.aspnet-demos .header-approach-selected:active {
  background-color: rgba(28, 45, 54, 0.07);
}
html.aspnet-demos .header-approach-selected::after {
  content: '';
  width: 0;
  height: 0;
  border-top: none;
  border-right: 6px solid transparent;
  border-left: 6px solid transparent;
  border-bottom: 6px solid #596c7d;
  transform: rotate(180deg);
}
html.aspnet-demos .header-approach-selected.active::after {
  content: '';
  width: 0;
  height: 0;
  border-top: none;
  border-right: 6px solid transparent;
  border-left: 6px solid transparent;
  border-bottom: 6px solid #596c7d;
  transform: rotate(0);
}
html.aspnet-demos .header-approach-list {
  background-color: white;
}
html.aspnet-demos .header-approach-list-item:hover {
  background-color: rgba(28, 45, 54, 0.03);
}
html.aspnet-demos .header-approach-list-item:active {
  background-color: rgba(28, 45, 54, 0.07);
}
html.aspnet-demos .header-approach-list-item-content {
  color: #596c7d;
}
html.aspnet-demos .header-approach-list {
  background-color: white;
}
html.aspnet-demos .header-approach-list-item:hover {
  background-color: rgba(28, 45, 54, 0.03);
}
html.aspnet-demos .header-approach-list-item:active {
  background-color: rgba(28, 45, 54, 0.07);
}
html.aspnet-demos .header-approach-list-item-content {
  color: #596c7d;
}
html.aspnet-demos .header-approach-selected {
  color: #512bd4;
  background-color: white;
}
html.aspnet-demos .header-approach-selected:hover {
  background-color: rgba(28, 45, 54, 0.03);
}
html.aspnet-demos .header-approach-selected:active {
  background-color: rgba(28, 45, 54, 0.07);
}
html.aspnet-demos .header-approach-selected::after {
  content: '';
  width: 0;
  height: 0;
  border-top: none;
  border-right: 6px solid transparent;
  border-left: 6px solid transparent;
  border-bottom: 6px solid #596c7d;
  transform: rotate(180deg);
}
html.aspnet-demos .header-approach-selected.active::after {
  content: '';
  width: 0;
  height: 0;
  border-top: none;
  border-right: 6px solid transparent;
  border-left: 6px solid transparent;
  border-bottom: 6px solid #596c7d;
  transform: rotate(0);
}
html.aspnet-demos .header-approach-list {
  background-color: white;
}
html.aspnet-demos .header-approach-list-item:hover {
  background-color: rgba(28, 45, 54, 0.03);
}
html.aspnet-demos .header-approach-list-item:active {
  background-color: rgba(28, 45, 54, 0.07);
}
html.aspnet-demos .header-approach-list-item-content {
  color: #596c7d;
}
html.aspnet-demos .header-approach-list {
  background-color: white;
}
html.aspnet-demos .header-approach-list-item:hover {
  background-color: rgba(28, 45, 54, 0.03);
}
html.aspnet-demos .header-approach-list-item:active {
  background-color: rgba(28, 45, 54, 0.07);
}
html.aspnet-demos .header-approach-list-item-content {
  color: #596c7d;
}
html.aspnet-demos .header-drawer {
  background-color: white;
}
html.aspnet-demos .header-drawer .header-link.selected {
  border-bottom-color: transparent;
  border-left-color: #512bd4;
}
html.aspnet-demos .header-drawer {
  background-color: white;
}
html.aspnet-demos .header-drawer .header-link.selected {
  border-bottom-color: transparent;
  border-left-color: #512bd4;
}
@media only screen and (max-width: 1160px) {
  html.aspnet-demos .drawer-menu-divider {
    background-color: #e7ebee;
  }
}
html.aspnet-demos header .header {
  background-color: white;
}
html.aspnet-demos .header--logo--js {
  fill: #512bd4;
}
html.aspnet-demos .header-drawer .header-link:focus {
  border-left-color: #512bd4;
}
html.aspnet-demos .header-drawer .header-link.selected:focus {
  border-left-color: #4525b4;
}
html.aspnet-demos .header button {
  background-color: transparent;
}
html.aspnet-demos .header-link-text {
  color: #596c7d;
}
html.aspnet-demos .header-link:focus {
  outline: none;
}
html.aspnet-demos .header-link:hover {
  background-color: rgba(28, 45, 54, 0.03);
}
html.aspnet-demos .header-link.active {
  background-color: rgba(28, 45, 54, 0.07);
}
html.aspnet-demos .header-container-left .header-link:focus,
html.aspnet-demos .header-container-right .header-link:focus,
html.aspnet-demos .header-container-left .header-link.active,
html.aspnet-demos .header-container-right .header-link.active,
html.aspnet-demos .header-container-left .header-link.selected,
html.aspnet-demos .header-container-right .header-link.selected {
  position: relative;
}
html.aspnet-demos .header-container-left .header-link:focus::after,
html.aspnet-demos .header-container-right .header-link:focus::after,
html.aspnet-demos .header-container-left .header-link.active::after,
html.aspnet-demos .header-container-right .header-link.active::after,
html.aspnet-demos .header-container-left .header-link.selected::after,
html.aspnet-demos .header-container-right .header-link.selected::after {
  position: absolute;
  bottom: 0;
  left: 12px;
  right: 12px;
  content: ' ';
  height: 4px;
  border-radius: 4px 4px 0 0;
  background-color: #512bd4;
}
html.aspnet-demos .header-container-left .header-link:focus::after,
html.aspnet-demos .header-container-right .header-link:focus::after,
html.aspnet-demos .header-container-left .header-link.active::after,
html.aspnet-demos .header-container-right .header-link.active::after,
html.aspnet-demos .header-container-left .header-link.selected::after,
html.aspnet-demos .header-container-right .header-link.selected::after {
  position: absolute;
  bottom: 0;
  left: 12px;
  right: 12px;
  content: ' ';
  height: 4px;
  border-radius: 4px 4px 0 0;
  background-color: #512bd4;
}
html.aspnet-demos .header-container-left .header-link.selected:focus::after,
html.aspnet-demos .header-container-right .header-link.selected:focus::after {
  background-color: #4525b4;
}
html.aspnet-demos .header-menu-item .header-menu-list {
  background-color: white;
}
html.aspnet-demos .header-menu-item .header-menu-list-item:hover {
  background-color: rgba(28, 45, 54, 0.03);
}
html.aspnet-demos .header-menu-item .header-menu-list-item:active {
  background-color: rgba(28, 45, 54, 0.07);
}
html.aspnet-demos .header-menu-item .header-menu-list-item-content {
  color: #596c7d;
}
html.aspnet-demos .header-menu-item .header-menu-list {
  background-color: white;
}
html.aspnet-demos .header-menu-item .header-menu-list-item:hover {
  background-color: rgba(28, 45, 54, 0.03);
}
html.aspnet-demos .header-menu-item .header-menu-list-item:active {
  background-color: rgba(28, 45, 54, 0.07);
}
html.aspnet-demos .header-menu-item .header-menu-list-item-content {
  color: #596c7d;
}
html.aspnet-demos .header-menu-item .header-menu-button::before {
  position: absolute;
  bottom: 10px;
  left: calc(44%);
  content: '';
  width: 0;
  height: 0;
  border-top: none;
  border-right: 6px solid transparent;
  border-left: 6px solid transparent;
  border-bottom: 6px solid #596c7d;
  transform: rotate(180deg);
}
html.aspnet-demos #menu {
  background-color: #edf0f2;
}
html.aspnet-demos #menu a {
  color: #596c7d;
}
html.aspnet-demos #menu a[href]:hover {
  color: #512bd4;
}
html.aspnet-demos #menu span {
  color: #596c7d;
}
html.aspnet-demos #menu li::before,
html.aspnet-demos #menu li::after {
  color: #596c7d;
}
html.aspnet-demos #menu .breadcrumbs-svg {
  fill: #596c7d;
}
html.aspnet-demos #menu .tools-panel {
  border-color: #edf0f2;
}
html.aspnet-demos #menu .tools-panel .breadcrumbs .breadcrumbs-wrapper li.hint.active span {
  background-color: #f3f5f6;
}
html.aspnet-demos #menu .tools-panel .breadcrumbs .breadcrumbs-wrapper li a {
  color: #4c5d6b;
}
html.aspnet-demos #menu .tools-panel .breadcrumbs-dropdown.active {
  background-color: #edf0f2;
}
html.aspnet-demos #menu .tools-panel .breadcrumbs-dropdown.active a {
  color: #4c5d6b;
}
html.aspnet-demos .menu-state-button {
  background-color: #f3f5f6;
}
html.aspnet-demos .menu-state-button svg path {
  fill: #596c7d;
}
html.aspnet-demos .menu-state-button:hover {
  background-color: #596c7d;
  opacity: 0.8;
}
html.aspnet-demos .menu-state-button:hover svg path {
  fill: #f3f5f6;
}
html.aspnet-demos .hidden-menu .menu-state-button {
  background-color: #596c7d;
}
html.aspnet-demos .hidden-menu .menu-state-button svg path {
  fill: #f3f5f6;
}
html.aspnet-demos .hidden-menu .menu-state-button:hover {
  background-color: #f3f5f6;
  opacity: 0.8;
}
html.aspnet-demos .hidden-menu .menu-state-button:hover svg path {
  fill: #596c7d;
}
html.aspnet-demos #menu {
  background-color: #edf0f2;
}
html.aspnet-demos #menu a {
  color: #596c7d;
}
html.aspnet-demos #menu a[href]:hover {
  color: #512bd4;
}
html.aspnet-demos #menu span {
  color: #596c7d;
}
html.aspnet-demos #menu li::before,
html.aspnet-demos #menu li::after {
  color: #596c7d;
}
html.aspnet-demos #menu .breadcrumbs-svg {
  fill: #596c7d;
}
html.aspnet-demos #menu .tools-panel {
  border-color: #edf0f2;
}
html.aspnet-demos #menu .tools-panel .breadcrumbs .breadcrumbs-wrapper li.hint.active span {
  background-color: #f3f5f6;
}
html.aspnet-demos #menu .tools-panel .breadcrumbs .breadcrumbs-wrapper li a {
  color: #4c5d6b;
}
html.aspnet-demos #menu .tools-panel .breadcrumbs-dropdown.active {
  background-color: #edf0f2;
}
html.aspnet-demos #menu .tools-panel .breadcrumbs-dropdown.active a {
  color: #4c5d6b;
}
html.aspnet-demos .menu-state-button {
  background-color: #f3f5f6;
}
html.aspnet-demos .menu-state-button svg path {
  fill: #596c7d;
}
html.aspnet-demos .menu-state-button:hover {
  background-color: #596c7d;
  opacity: 0.8;
}
html.aspnet-demos .menu-state-button:hover svg path {
  fill: #f3f5f6;
}
html.aspnet-demos .hidden-menu .menu-state-button {
  background-color: #596c7d;
}
html.aspnet-demos .hidden-menu .menu-state-button svg path {
  fill: #f3f5f6;
}
html.aspnet-demos .hidden-menu .menu-state-button:hover {
  background-color: #f3f5f6;
  opacity: 0.8;
}
html.aspnet-demos .hidden-menu .menu-state-button:hover svg path {
  fill: #596c7d;
}
html.aspnet-demos .left-menu {
  background-color: white;
}
html.aspnet-demos .left-menu a {
  color: #3f4d5a;
}
html.aspnet-demos .left-menu a:visited {
  color: #596c7d;
}
html.aspnet-demos .left-menu a:focus-visible,
html.aspnet-demos .left-menu .first-level:focus-visible,
html.aspnet-demos .left-menu .group-name:focus-visible {
  outline: 2px solid #512bd4;
}
html.aspnet-demos .left-menu::after {
  opacity: 1;
  background-color: #e7ebee;
}
html.aspnet-demos .left-menu .left-menu-filter-wrapper {
  background-color: #edf0f2;
}
html.aspnet-demos .left-menu .left-menu-filter-wrapper .dx-icon-search {
  color: #667c8f;
}
html.aspnet-demos .left-menu .left-menu-filter-wrapper .left-menu-filter {
  background-color: transparent;
}
html.aspnet-demos .left-menu .left-menu-filter-wrapper .left-menu-filter .dx-placeholder {
  color: #596c7d;
}
html.aspnet-demos .left-menu .left-menu-filter-wrapper .left-menu-filter .dx-icon-clear::before {
  color: #667c8f;
}
html.aspnet-demos .left-menu .left-menu-filter-wrapper .left-menu-filter.dx-texteditor.dx-editor-outlined {
  background-color: transparent;
}
html.aspnet-demos .left-menu .left-menu-filter-wrapper .left-menu-filter.dx-texteditor .dx-texteditor-input {
  background-color: #edf0f2;
  color: #3f4d5a;
}
html.aspnet-demos .left-menu .widgets-menu .site-search-suggestion {
  color: #596c7d;
}
html.aspnet-demos .left-menu .widgets-menu span.search {
  background-color: rgba(81, 43, 212, 0.2);
}
html.aspnet-demos .left-menu .widgets-menu ul li {
  color: #222930;
}
html.aspnet-demos .left-menu .widgets-menu ul li .first-level::after {
  border-bottom-color: #e7ebee;
}
html.aspnet-demos .left-menu .widgets-menu ul li .first-level:hover,
html.aspnet-demos .left-menu .widgets-menu ul li .group-name:hover,
html.aspnet-demos .left-menu .widgets-menu ul li .ajax-link:hover {
  background-color: #f3f5f6;
  color: #3f4d5a;
}
html.aspnet-demos .left-menu .widgets-menu ul li .first-level .expander,
html.aspnet-demos .left-menu .widgets-menu ul li .group-name .expander,
html.aspnet-demos .left-menu .widgets-menu ul li .ajax-link .expander {
  color: #596c7d;
}
html.aspnet-demos .left-menu .widgets-menu ul li .first-level .link-text,
html.aspnet-demos .left-menu .widgets-menu ul li .group-name .link-text,
html.aspnet-demos .left-menu .widgets-menu ul li .ajax-link .link-text {
  flex: 1;
}
html.aspnet-demos .left-menu .widgets-menu ul li .group-name {
  color: #3f4d5a;
}
html.aspnet-demos .left-menu .widgets-menu ul li.opened.category > .first-level .expander {
  color: #512bd4;
  transform: rotate(180deg);
}
html.aspnet-demos .left-menu .widgets-menu ul li.opened:not(.category) > .group-name {
  font-weight: 700;
  color: #222930;
}
html.aspnet-demos .left-menu .widgets-menu ul li.opened:not(.category) > .group-name .expander {
  color: #512bd4;
}
html.aspnet-demos .left-menu .widgets-menu ul li.opened:not(.category) > .group-name .expander svg {
  transform: rotate(90deg);
}
html.aspnet-demos .left-menu .widgets-menu ul li .ajax-link.active {
  background-color: rgba(81, 43, 212, 0.08);
  color: #512bd4;
}
html.aspnet-demos .left-menu .widgets-menu ul .category.Updated .link-text:after,
html.aspnet-demos .left-menu .widgets-menu ul .category .Updated .link-text:after {
  background-color: #42b883;
}
html.aspnet-demos .left-menu .widgets-menu ul .category.New .link-text:after,
html.aspnet-demos .left-menu .widgets-menu ul .category .New .link-text:after {
  background-color: #dd1144;
}
html.aspnet-demos .left-menu .widgets-menu ul .category.Roadmap .link-text:after,
html.aspnet-demos .left-menu .widgets-menu ul .category .Roadmap .link-text:after {
  background-color: #ff9000;
}
html.aspnet-demos .left-menu .widgets-menu div.equivalents {
  color: #596c7d;
}
html.aspnet-demos .left-menu .widgets-menu .equivalents-header {
  color: #596c7d;
}
html.aspnet-demos .left-menu .widgets-menu .equivalents-header.second {
  border-top-color: #e7ebee;
}
html.aspnet-demos .left-menu {
  background-color: white;
}
html.aspnet-demos .left-menu a {
  color: #3f4d5a;
}
html.aspnet-demos .left-menu a:visited {
  color: #596c7d;
}
html.aspnet-demos .left-menu a:focus-visible,
html.aspnet-demos .left-menu .first-level:focus-visible,
html.aspnet-demos .left-menu .group-name:focus-visible {
  outline: 2px solid #512bd4;
}
html.aspnet-demos .left-menu::after {
  opacity: 1;
  background-color: #e7ebee;
}
html.aspnet-demos .left-menu .left-menu-filter-wrapper {
  background-color: #edf0f2;
}
html.aspnet-demos .left-menu .left-menu-filter-wrapper .dx-icon-search {
  color: #667c8f;
}
html.aspnet-demos .left-menu .left-menu-filter-wrapper .left-menu-filter {
  background-color: transparent;
}
html.aspnet-demos .left-menu .left-menu-filter-wrapper .left-menu-filter .dx-placeholder {
  color: #596c7d;
}
html.aspnet-demos .left-menu .left-menu-filter-wrapper .left-menu-filter .dx-icon-clear::before {
  color: #667c8f;
}
html.aspnet-demos .left-menu .left-menu-filter-wrapper .left-menu-filter.dx-texteditor.dx-editor-outlined {
  background-color: transparent;
}
html.aspnet-demos .left-menu .left-menu-filter-wrapper .left-menu-filter.dx-texteditor .dx-texteditor-input {
  background-color: #edf0f2;
  color: #3f4d5a;
}
html.aspnet-demos .left-menu .widgets-menu .site-search-suggestion {
  color: #596c7d;
}
html.aspnet-demos .left-menu .widgets-menu span.search {
  background-color: rgba(81, 43, 212, 0.2);
}
html.aspnet-demos .left-menu .widgets-menu ul li {
  color: #222930;
}
html.aspnet-demos .left-menu .widgets-menu ul li .first-level::after {
  border-bottom-color: #e7ebee;
}
html.aspnet-demos .left-menu .widgets-menu ul li .first-level:hover,
html.aspnet-demos .left-menu .widgets-menu ul li .group-name:hover,
html.aspnet-demos .left-menu .widgets-menu ul li .ajax-link:hover {
  background-color: #f3f5f6;
  color: #3f4d5a;
}
html.aspnet-demos .left-menu .widgets-menu ul li .first-level .expander,
html.aspnet-demos .left-menu .widgets-menu ul li .group-name .expander,
html.aspnet-demos .left-menu .widgets-menu ul li .ajax-link .expander {
  color: #596c7d;
}
html.aspnet-demos .left-menu .widgets-menu ul li .first-level .link-text,
html.aspnet-demos .left-menu .widgets-menu ul li .group-name .link-text,
html.aspnet-demos .left-menu .widgets-menu ul li .ajax-link .link-text {
  flex: 1;
}
html.aspnet-demos .left-menu .widgets-menu ul li .group-name {
  color: #3f4d5a;
}
html.aspnet-demos .left-menu .widgets-menu ul li.opened.category > .first-level .expander {
  color: #512bd4;
  transform: rotate(180deg);
}
html.aspnet-demos .left-menu .widgets-menu ul li.opened:not(.category) > .group-name {
  font-weight: 700;
  color: #222930;
}
html.aspnet-demos .left-menu .widgets-menu ul li.opened:not(.category) > .group-name .expander {
  color: #512bd4;
}
html.aspnet-demos .left-menu .widgets-menu ul li.opened:not(.category) > .group-name .expander svg {
  transform: rotate(90deg);
}
html.aspnet-demos .left-menu .widgets-menu ul li .ajax-link.active {
  background-color: rgba(81, 43, 212, 0.08);
  color: #512bd4;
}
html.aspnet-demos .left-menu .widgets-menu ul .category.Updated .link-text:after,
html.aspnet-demos .left-menu .widgets-menu ul .category .Updated .link-text:after {
  background-color: #42b883;
}
html.aspnet-demos .left-menu .widgets-menu ul .category.New .link-text:after,
html.aspnet-demos .left-menu .widgets-menu ul .category .New .link-text:after {
  background-color: #dd1144;
}
html.aspnet-demos .left-menu .widgets-menu ul .category.Roadmap .link-text:after,
html.aspnet-demos .left-menu .widgets-menu ul .category .Roadmap .link-text:after {
  background-color: #ff9000;
}
html.aspnet-demos .left-menu .widgets-menu div.equivalents {
  color: #596c7d;
}
html.aspnet-demos .left-menu .widgets-menu .equivalents-header {
  color: #596c7d;
}
html.aspnet-demos .left-menu .widgets-menu .equivalents-header.second {
  border-top-color: #e7ebee;
}
html.aspnet-demos .dx-loadpanel-content {
  color: #1e70b9;
}
html.aspnet-demos .dx-loadindicator-icon .dx-loadindicator-segment {
  background-color: #512bd4 !important;
}
html.aspnet-demos .background-block p {
  font-family: 'Roboto', sans-serif;
  color: #333333;
}
html.aspnet-demos a {
  color: #512bd4;
}
html.aspnet-demos a:hover,
html.aspnet-demos a:visited:hover {
  color: #512bd4;
}
html.aspnet-demos a:active {
  color: #512bd4;
}
html.aspnet-demos a:visited {
  color: #512bd4;
}
html.aspnet-demos a:focus-visible {
  color: #512bd4;
  outline: 2px solid #512bd4;
  border-radius: 4px;
}
html.aspnet-demos textarea {
  color: #333333;
}
html.aspnet-demos .full-description-offset p a code {
  color: #dd1144;
  text-decoration: underline #dd1144;
}
html.aspnet-demos .content {
  background: white;
}
html.aspnet-demos .content h1,
html.aspnet-demos .content h2,
html.aspnet-demos .content h3,
html.aspnet-demos .content li,
html.aspnet-demos .content p {
  color: #222930;
}
html.aspnet-demos .content .doc-content .components-list-container .category-title {
  color: #222930;
}
html.aspnet-demos .content .doc-content .axe-report {
  border-color: #e1e6ea;
}
html.aspnet-demos .content .doc-content .axe-report .axe-header {
  color: #222930;
}
html.aspnet-demos .content .doc-content .axe-report .axe-button {
  background-color: #512bd4;
  color: white;
}
html.aspnet-demos .content .doc-content .axe-report .axe-button:focus,
html.aspnet-demos .content .doc-content .axe-report .axe-button:focus-visible {
  background-color: #391e94;
}
html.aspnet-demos .content .doc-content .axe-report .axe-button:hover {
  background-color: #4525b4;
}
html.aspnet-demos .content .doc-content .axe-report .axe-text {
  color: #3f4d5a;
}
html.aspnet-demos .content .doc-content .axe-report .axe-trademark {
  color: #667c8f;
}
html.aspnet-demos .content .doc-content .axe-note {
  background-color: #f3f5f6;
  color: #667c8f;
}
html.aspnet-demos .content .doc-content .roadmap-survey-block {
  background-color: #ff900014;
  border-color: #ffaf47;
}
html.aspnet-demos .content .doc-content .roadmap-survey-header {
  color: #222930;
}
html.aspnet-demos .content .doc-content .roadmap-survey-text {
  color: #3f4d5a;
}
html.aspnet-demos .content .doc-content .roadmap-image-block {
  background-color: #f3f5f6;
  border-color: #e1e6ea;
}
html.aspnet-demos .content .doc-content .roadmap-image-block.bg-gif {
  background-color: white;
}
html.aspnet-demos .content .doc-content .roadmap-survey-button {
  color: white;
}
html.aspnet-demos .content .doc-content .note {
  background: rgba(221, 17, 68, 0.1);
}
html.aspnet-demos .content .doc-content .note .note-header {
  color: #dd1144;
}
html.aspnet-demos .content .doc-content .libs {
  color: #7f7f7f;
}
html.aspnet-demos .content .doc-content .accordion-content {
  border: none;
  background-color: white;
}
html.aspnet-demos .content .doc-content .accordion-content .dx-accordion-item.dx-accordion-item-closed {
  background-color: white;
  border-color: white;
}
html.aspnet-demos .content .doc-content .accordion-content .dx-accordion-item-selected,
html.aspnet-demos .content .doc-content .accordion-content .dx-accordion-item-opened {
  border-color: #627789;
  background-color: white;
}
html.aspnet-demos .content .doc-content .accordion-content .dx-accordion-item-selected .dx-accordion-item-title,
html.aspnet-demos .content .doc-content .accordion-content .dx-accordion-item-opened .dx-accordion-item-title {
  background-color: white;
}
html.aspnet-demos .content .doc-content .accordion-content .dx-accordion-item-selected .dx-accordion-item-title:hover,
html.aspnet-demos .content .doc-content .accordion-content .dx-accordion-item-opened .dx-accordion-item-title:hover {
  background-color: white;
}
html.aspnet-demos .content .doc-content .accordion-content .dx-accordion-item-title {
  background-color: #f8f8f8;
  color: #22587e;
}
html.aspnet-demos .content .doc-content .accordion-content .dx-accordion-item-title:hover {
  background-color: #eef0f2;
}
html.aspnet-demos .content .doc-content .accordion-content .dx-accordion-item-title:before {
  color: #22587e;
}
html.aspnet-demos .content .doc-content .dx-accordion-item.dx-state-focused {
  border-color: #627789;
  border-radius: 8px;
}
html.aspnet-demos .content .doc-content h5.see-also {
  border-top-color: #ededed;
  color: #333333;
}
html.aspnet-demos .content .doc-content .code-wrapper.code-tabs .code-type {
  background-color: #f8f8f8;
  border-color: #ededed;
  color: #22587e;
}
html.aspnet-demos .content .doc-content .code-wrapper.code-tabs .code-type.active {
  background-color: #1e70b9;
  border-color: #1e70b9;
  color: white;
}
html.aspnet-demos .content .doc-content .code-wrapper .code-type {
  background-color: #f8f8f8;
  border-color: #ededed;
  color: #22587e;
}
html.aspnet-demos .content .doc-content .code-wrapper .code-type.active {
  background-color: #1e70b9;
  border-color: #1e70b9;
  color: white;
}
html.aspnet-demos .content .doc-content .code-wrapper pre {
  border-color: #e1e1e8;
}
html.aspnet-demos .content .doc-content .api-header a {
  color: #22587e;
}
html.aspnet-demos .content .doc-content .api-property-block .api-property {
  border-left-color: #22587e;
  color: #333333;
}
html.aspnet-demos .content .doc-content .api-property-block .api-property span.api-property-name {
  color: #8b949c;
}
html.aspnet-demos .content .doc-content .api-property-block .api-property.no-margin {
  color: #8b949c;
}
html.aspnet-demos .content .doc-content .api-property-block .api-property.no-margin p {
  color: #8b949c;
}
html.aspnet-demos .content .doc-content .api-property-block .api-property .parameter-name {
  color: #8b949c;
}
html.aspnet-demos .content .doc-content .api-property-block p a {
  color: #22587e;
}
html.aspnet-demos .content .doc-content .api-property-block p a:hover {
  color: #1e70b9;
}
html.aspnet-demos .content .doc-content .api-property-block p a:visited {
  color: #6b58a1;
}
html.aspnet-demos .content .doc-content .api-property-block p a:visited:hover {
  color: #1e70b9;
}
html.aspnet-demos .content .doc-content .featured-components-container .component-container .component-icon svg path,
html.aspnet-demos .content .doc-content .featured-components-container .component-container .component-icon svg rect,
html.aspnet-demos .content .doc-content .featured-components-container .component-container .component-icon svg polygon,
html.aspnet-demos .content .doc-content .featured-components-container .component-container .component-icon svg circle {
  fill: #667c8f;
}
html.aspnet-demos .content .doc-content .featured-components-container .component-container .component-link {
  color: #596c7d;
}
html.aspnet-demos .content .doc-content .featured-components-container .component-container:hover {
  background-color: #512bd4;
}
html.aspnet-demos .content .doc-content .featured-components-container .component-container:hover svg path,
html.aspnet-demos .content .doc-content .featured-components-container .component-container:hover svg rect,
html.aspnet-demos .content .doc-content .featured-components-container .component-container:hover svg polygon,
html.aspnet-demos .content .doc-content .featured-components-container .component-container:hover svg circle {
  fill: white;
}
html.aspnet-demos .content .doc-content .featured-components-container .component-container:hover .component-link {
  color: white;
}
html.aspnet-demos .content .doc-content .deprecated-block .deprecated {
  color: red;
}
html.aspnet-demos .content .doc-content .simple-table table td:first-child {
  color: black;
}
html.aspnet-demos .content .doc-content .simple-table td,
html.aspnet-demos .content .doc-content .simple-table th {
  border-color: #ededed;
}
html.aspnet-demos .content .doc-content .simple-table th {
  background: #ededed;
}
html.aspnet-demos .content .doc-content .simple-table tr:nth-child(even) {
  background: #f8f8f8;
}
html.aspnet-demos .content .doc-content .simple-table tr:nth-child(odd) {
  background: white;
}
html.aspnet-demos .content .doc-content .dx-table tr {
  border-bottom-color: #e7ebee;
}
html.aspnet-demos .content .doc-content .dx-table tr th {
  background: white;
  color: #667c8f;
  border-color: #e7ebee;
}
html.aspnet-demos .content .doc-content .dx-table tr td {
  border-color: white;
  color: #3f4d5a;
}
html.aspnet-demos .content .doc-content .dx-table tr .parameter-type {
  color: #3f4d5a;
}
html.aspnet-demos .content .doc-content .dx-table tr:nth-child(even) {
  background: white;
}
html.aspnet-demos .content .doc-content .dx-table tr:nth-child(even) td {
  border-right-color: white;
}
html.aspnet-demos .content .doc-content .dx-table tr:nth-child(odd) {
  background: #edf0f2;
}
html.aspnet-demos .content .doc-content .dx-table tr:nth-child(odd) td {
  border-right-color: #edf0f2;
}
html.aspnet-demos .content .doc-content .dx-table tr a {
  color: #22587e;
}
html.aspnet-demos .content .doc-content .dx-table tr a:hover {
  color: #1e70b9;
}
html.aspnet-demos .content .doc-content .dx-table tr a:visited {
  color: #6b58a1;
}
html.aspnet-demos .content .doc-content .dx-table tr a:visited:hover {
  color: #1e70b9;
}
html.aspnet-demos .content .doc-content .footnotes {
  border-top-color: #ededed;
}
html.aspnet-demos .content .doc-content .documentation-gallery .gallery-border {
  border-color: #ededed;
}
html.aspnet-demos .content .doc-content .documentation-gallery .gallery-border .arrow {
  border-color: #ededed;
  background-color: white;
}
html.aspnet-demos .content .doc-content .documentation-gallery .gallery-item .image {
  border-left-color: transparent;
  border-right-color: transparent;
}
html.aspnet-demos .content .doc-content .api-example .show-text {
  color: #7f7f7f;
}
html.aspnet-demos .content .doc-content .api-example .approach-tab-container .button.approach-switcher {
  background-color: #eef0f2;
  color: #22587e;
}
html.aspnet-demos .content .doc-content .api-example .approach-tab-container .button.approach-switcher:after {
  border-top-color: #ededed;
}
html.aspnet-demos .content .doc-content .api-example .approach-tab-container .button.approach-switcher:hover {
  background-color: #f8f8f8;
  border-color: #ededed;
}
html.aspnet-demos .content .doc-content .api-example .approach-tab-container .button.approach-switcher.current {
  background-color: white;
  color: #1b4461;
}
html.aspnet-demos .content .doc-content .api-example .approach-tab-container .button.approach-switcher.current:after {
  border-bottom-color: #ededed;
}
html.aspnet-demos .content .doc-content.search-page .header h1 .keyword {
  color: #1e70b9;
}
html.aspnet-demos .content .doc-content.search-page .header ul.search-counts {
  border-bottom-color: #ededed;
}
html.aspnet-demos .content .doc-content.search-page .header ul.search-counts li .count {
  color: #22587e;
}
html.aspnet-demos .content .doc-content.search-page .header ul.search-counts li.active {
  background-color: white;
  border-bottom-color: #512bd4;
}
html.aspnet-demos .content .doc-content.search-page .header ul.search-counts li.active a {
  color: #512bd4;
}
html.aspnet-demos .content .doc-content.search-page .header ul.search-counts li.active a:visited {
  color: #6b58a1;
}
html.aspnet-demos .content .doc-content.search-page .header ul.search-counts li.active .count {
  color: #512bd4;
}
html.aspnet-demos .content .doc-content.search-page .article-type {
  color: rgba(51, 51, 51, 0.7);
}
html.aspnet-demos .content .doc-content.search-page .article-type p {
  color: #333333;
}
html.aspnet-demos .content .doc-content.search-page p {
  color: #333333;
}
html.aspnet-demos .content .doc-content.search-page .pagination a:hover,
html.aspnet-demos .content .doc-content.search-page .pagination a:visited,
html.aspnet-demos .content .doc-content.search-page .pagination a:visited:hover {
  color: #22587e;
}
html.aspnet-demos .content .doc-content.search-page .pagination .activeItem-item.ellipsis,
html.aspnet-demos .content .doc-content.search-page .pagination a.ellipsis {
  color: #22587e;
}
html.aspnet-demos .content .doc-content.search-page .pagination .activeItem-item {
  background-color: #22587e;
}
html.aspnet-demos .content .doc-content .api-header,
html.aspnet-demos .content .doc-content .article-section-header {
  color: #333333;
}
html.aspnet-demos .content .doc-content .article-header .badge,
html.aspnet-demos .content .doc-content .api-header .badge {
  color: #333333;
  background-color: #627789;
}
html.aspnet-demos .content .doc-content .description code,
html.aspnet-demos .content .doc-content .second-description code {
  background-color: #f8f8f8;
  border-color: #ededed;
}
html.aspnet-demos .content .doc-content .simulators {
  border-color: #e1e6ea;
}
html.aspnet-demos .content .doc-content .simulators .demo-device {
  background-color: white;
}
html.aspnet-demos .content .doc-content .simulators.Mobile .demo-device,
html.aspnet-demos .content .doc-content .simulators.TabletLandscape .demo-device,
html.aspnet-demos .content .doc-content .simulators.TabletPortrait .demo-device {
  border-color: #ededed;
  background-color: #f8f8f8;
}
html.aspnet-demos .content .doc-content .simulators.Mobile .demo-device .demo-display,
html.aspnet-demos .content .doc-content .simulators.TabletLandscape .demo-device .demo-display,
html.aspnet-demos .content .doc-content .simulators.TabletPortrait .demo-device .demo-display {
  border-color: #ededed;
}
html.aspnet-demos .content .marketing-demos {
  background-color: white;
}
html.aspnet-demos .content .marketing-demos .demos-container {
  background-color: #f3f5f6;
}
html.aspnet-demos .content .marketing-demos .demo-link-content {
  background-color: white;
  border-color: #e7ebee;
}
html.aspnet-demos .content .marketing-demos .demo-link-content h5 {
  color: #3f4d5a;
}
html.aspnet-demos .content .marketing-demos .demo-link-content p {
  color: #596c7d;
}
html.aspnet-demos .content .marketing-demos .demo-link:hover .demo-link-content {
  background-color: #512bd4;
}
html.aspnet-demos .content .marketing-demos .demo-link:hover .demo-link-content h5,
html.aspnet-demos .content .marketing-demos .demo-link:hover .demo-link-content p {
  color: white;
}
html.aspnet-demos .content .marketing-demos .demo-link-stub {
  display: none;
}
@media only screen and (max-width: 1600px) {
  html.aspnet-demos .content .marketing-demos .demo-link-stub {
    display: block;
  }
}
html.aspnet-demos .content .top-content__expand {
  color: #596c7d;
  border-color: #e7ebee;
  outline-color: #e7ebee;
  background-color: #f3f5f6;
}
html.aspnet-demos .content .top-content__expand svg {
  fill: #596c7d;
}
html.aspnet-demos .content .top-content__expand svg path,
html.aspnet-demos .content .top-content__expand svg circle {
  fill: #596c7d;
}
html.aspnet-demos .content .top-content__expand:hover,
html.aspnet-demos .content .top-content__expand:focus {
  color: #596c7d;
  border-color: #e7ebee;
  outline-color: #e7ebee;
  background-color: #edf0f2;
}
html.aspnet-demos .content .top-content__expand:hover svg,
html.aspnet-demos .content .top-content__expand:focus svg {
  fill: #596c7d;
}
html.aspnet-demos .content .top-content__expand:hover svg path,
html.aspnet-demos .content .top-content__expand:focus svg path,
html.aspnet-demos .content .top-content__expand:hover svg circle,
html.aspnet-demos .content .top-content__expand:focus svg circle {
  fill: #596c7d;
}
html.aspnet-demos .content .top-content__expand:active {
  color: #596c7d;
  border-color: #e7ebee;
  outline-color: #e7ebee;
  background-color: #e7ebee;
}
html.aspnet-demos .content .top-content__expand:active svg {
  fill: #596c7d;
}
html.aspnet-demos .content .top-content__expand:active svg path,
html.aspnet-demos .content .top-content__expand:active svg circle {
  fill: #596c7d;
}
html.aspnet-demos .content .top-content h1.Updated::after {
  background-color: #512bd4;
}
html.aspnet-demos .content .code {
  border-color: #e7ebee;
}
html.aspnet-demos .content .code .not-yet {
  color: #91a4b2;
}
html.aspnet-demos .content .code .tabs-container {
  border-color: #e7ebee;
  background-color: white;
}
html.aspnet-demos .content .code .tabs-container #code-tabs .switch::before {
  background-color: #e7ebee;
}
html.aspnet-demos .content .code .buttons-container {
  border-color: #e7ebee;
  background-color: white;
}
html.aspnet-demos .content .code .buttons-container .buttons.fixed {
  background-color: white;
  border-color: #e7ebee;
}
html.aspnet-demos .content .code .source-block {
  scrollbar-color: #bfbfbf #f8f8f8;
}
html.aspnet-demos .content .code .source-block::-webkit-scrollbar-track {
  background-color: #f8f8f8;
}
html.aspnet-demos .content .code .source-block::-webkit-scrollbar-thumb {
  background-color: #bfbfbf;
}
html.aspnet-demos .content .code .source-block .CodeMirror {
  background-color: white;
}
html.aspnet-demos .content .code .source-block .CodeMirror pre {
  color: #333333;
}
html.aspnet-demos .content .code .source-block .CodeMirror .read-only-line {
  color: #4f4f4f;
}
html.aspnet-demos .content .code .source-block .CodeMirror .read-only-line.cm-comment {
  color: #b48a5f;
}
html.aspnet-demos .content .code .source-block .CodeMirror .read-only-line.cm-string {
  color: #b66969;
}
html.aspnet-demos .content .code .source-block .CodeMirror .read-only-line.cm-atom {
  color: #6f67ac;
}
html.aspnet-demos .content .code .source-block .CodeMirror .read-only-line.cm-keyword {
  color: #975ba0;
}
html.aspnet-demos .content .code .source-block .CodeMirror .read-only-line.cm-tag {
  color: #6ca363;
}
html.aspnet-demos .content .code .source-block .CodeMirror .read-only-line.cm-tag.cm-error {
  color: red;
}
html.aspnet-demos .content .code .source-block .CodeMirror .read-only-line.cm-attribute {
  color: #6767d5;
}
html.aspnet-demos .content .code .move-demo-container .move-demo-button {
  border-color: #a7b8c6;
  background-color: #1b4461;
  color: white;
}
html.aspnet-demos .content .code .move-demo-container .move-demo-button:hover {
  border-color: #f05b41;
  background-color: #f05b41;
}
html.aspnet-demos .content .code .move-demo-container .move-demo-button .move-demo-icon path {
  stroke: white;
}
html.aspnet-demos .content .demo-nav-links {
  background-color: white;
  border-color: #e1e6ea;
}
html.aspnet-demos .content .demo-nav-links a:hover {
  background-color: rgba(28, 45, 54, 0.03);
}
html.aspnet-demos .content .demo-nav-links a:active {
  background-color: rgba(28, 45, 54, 0.07);
}
html.aspnet-demos .content .demo-nav-links a:focus-visible {
  outline-color: #512bd4;
}
html.aspnet-demos .content .demo-nav-links a svg {
  fill: #596c7d;
}
html.aspnet-demos .content .demo-nav-links a svg path {
  fill: #596c7d;
}
html.aspnet-demos .content .demo-nav-links a.adaptivity-switcher:hover {
  background-color: transparent;
}
html.aspnet-demos .content .demo-nav-links button .link-button path {
  fill: #596c7d;
}
html.aspnet-demos .content .demo-nav-links button#fullScreenLink {
  background-color: inherit;
}
html.aspnet-demos .content .demo-nav-links button#fullScreenLink:hover {
  background-color: rgba(28, 45, 54, 0.03);
}
html.aspnet-demos .content .demo-nav-links button#fullScreenLink:active {
  background-color: rgba(28, 45, 54, 0.07);
}
html.aspnet-demos .content .demo-nav-links button#fullScreenLink:focus-visible {
  outline: 2px solid #512bd4;
}
html.aspnet-demos .content .demo-nav-links span.nav-border {
  background-color: #ededed;
}
html.aspnet-demos .content .demo-nav-links span.separator {
  background-color: #e7ebee;
}
html.aspnet-demos .content .demo-nav-links .uitg-button {
  color: #596c7d !important;
}
html.aspnet-demos .content #copy-to-code-codepen,
html.aspnet-demos .content #copy-to-code-sandbox,
html.aspnet-demos .content #reset {
  background-color: white;
  border: none;
}
html.aspnet-demos .content #copy-to-code-codepen:active,
html.aspnet-demos .content #copy-to-code-sandbox:active,
html.aspnet-demos .content #reset:active {
  background-color: rgba(28, 45, 54, 0.07);
}
html.aspnet-demos .content #copy-to-code-codepen:focus,
html.aspnet-demos .content #copy-to-code-sandbox:focus,
html.aspnet-demos .content #reset:focus {
  outline: none;
}
html.aspnet-demos .content #copy-to-code-codepen:focus-visible,
html.aspnet-demos .content #copy-to-code-sandbox:focus-visible,
html.aspnet-demos .content #reset:focus-visible {
  outline: 2px solid #512bd4;
}
html.aspnet-demos .content #copy-to-code-codepen:hover,
html.aspnet-demos .content #copy-to-code-sandbox:hover,
html.aspnet-demos .content #reset:hover {
  background-color: rgba(28, 45, 54, 0.03);
  color: #596c7d !important;
}
html.aspnet-demos .content #copy-to-code-codepen.disabled,
html.aspnet-demos .content #copy-to-code-sandbox.disabled,
html.aspnet-demos .content #reset.disabled {
  opacity: 0.5;
}
html.aspnet-demos .content #copy-to-code-codepen.disabled:active,
html.aspnet-demos .content #copy-to-code-sandbox.disabled:active,
html.aspnet-demos .content #reset.disabled:active,
html.aspnet-demos .content #copy-to-code-codepen.disabled:focus,
html.aspnet-demos .content #copy-to-code-sandbox.disabled:focus,
html.aspnet-demos .content #reset.disabled:focus,
html.aspnet-demos .content #copy-to-code-codepen.disabled:focus-visible,
html.aspnet-demos .content #copy-to-code-sandbox.disabled:focus-visible,
html.aspnet-demos .content #reset.disabled:focus-visible {
  background-color: white;
  outline: none;
}
html.aspnet-demos .content #copy-to-code-codepen.disabled:hover,
html.aspnet-demos .content #copy-to-code-sandbox.disabled:hover,
html.aspnet-demos .content #reset.disabled:hover {
  background-image: repeating-linear-gradient(45deg, #cccccc, #cccccc 10px, #bbbbbb 10px, #bbbbbb 20px);
  cursor: not-allowed;
}
html.aspnet-demos .content #apply:focus,
html.aspnet-demos .content #apply:focus-visible {
  outline: none;
}
html.aspnet-demos .content:not(.document__body) .doc-content h5.see-also + ul li:before {
  border-color: #333333;
  color: yellow;
  background-color: #333333;
}
html.aspnet-demos .debug-invalid-model-popup {
  color: white;
  background-color: red;
}
html.aspnet-demos .highlight {
  background-color: rgba(81, 43, 212, 0.15);
}
html.aspnet-demos .highlight.current {
  background-color: rgba(81, 43, 212, 0.3);
}
html.aspnet-demos .diagram-shape {
  stroke: black;
}
html.aspnet-demos .doc-content .nav-tabs > .active > a,
html.aspnet-demos .doc-content .nav-tabs > .active > a:focus {
  color: #555555;
  background-color: white;
  border-color: #dddddd;
}
html.aspnet-demos .doc-content .codeTabs.nav.nav-tabs {
  border-bottom-color: #e5e5e5;
}
html.aspnet-demos .doc-content .codeTabs.nav.nav-tabs li a {
  color: #252525;
}
html.aspnet-demos .doc-content .codeTabs.nav.nav-tabs li a:visited {
  color: #6b58a1;
}
html.aspnet-demos .doc-content .codeTabs.nav.nav-tabs li.active {
  border-top-color: #e5e5e5;
  border-left-color: #e5e5e5;
  border-right-color: #e5e5e5;
}
html.aspnet-demos .doc-content .codeTabs.nav.nav-tabs li.active a {
  background: white;
}
html.aspnet-demos .doc-content .codeTabs.nav.nav-tabs li.active a:visited {
  color: #6b58a1;
}
html.aspnet-demos .doc-content .demo-nav-links .standalone {
  border-color: #e7ebee;
  color: #596c7d;
}
html.aspnet-demos .doc-content .demo-nav-links .standalone:hover {
  background-color: #f3f5f6;
}
html.aspnet-demos .doc-content .demo-nav-links .standalone:active {
  background-color: #edf0f2;
}
html.aspnet-demos .button:not(.feedback__button) {
  color: #4525b4;
  border-color: #512bd4;
}
html.aspnet-demos .button:not(.feedback__button):hover,
html.aspnet-demos .button:not(.feedback__button).hover {
  color: white;
  border-color: #4525b4;
  background-color: #4525b4;
}
html.aspnet-demos .button:not(.feedback__button):active,
html.aspnet-demos .button:not(.feedback__button).active {
  border-color: #391e94;
  background-color: #391e94;
}
html.aspnet-demos .button:not(.feedback__button).fiddle:hover svg path,
html.aspnet-demos .button:not(.feedback__button).fiddle.hover svg path {
  stroke: white;
}
html.aspnet-demos .button:not(.feedback__button).fiddle:hover svg g path,
html.aspnet-demos .button:not(.feedback__button).fiddle.hover svg g path {
  fill: white;
  stroke: none;
}
html.aspnet-demos .dx-list-group-header {
  background-color: rgba(30, 112, 185, 0.1);
  color: #8b949c;
}
html.aspnet-demos .dx-dropdownlist-popup-wrapper.dx-popup-wrapper .dx-overlay-content {
  background-color: white;
}
html.aspnet-demos .dx-dropdownlist-popup-wrapper .dx-list:not(.dx-list-select-decorator-enabled) .dx-list-item {
  color: #333333;
  background-color: #eef0f2;
}
html.aspnet-demos .dx-dropdownlist-popup-wrapper .dx-list:not(.dx-list-select-decorator-enabled) .dx-list-item.dx-state-hover {
  background-color: rgba(30, 112, 185, 0.5);
  color: #627789;
}
html.aspnet-demos .dx-dropdownlist-popup-wrapper .dx-list:not(.dx-list-select-decorator-enabled) .dx-list-item.dx-list-item-selected {
  background-color: rgba(30, 112, 185, 0.5);
  color: #512bd4;
}
html.aspnet-demos .dx-dropdownlist-popup-wrapper .dx-list:not(.dx-list-select-decorator-enabled) .dx-list-item.dx-list-item-selected.dx-state-hover:not(.dx-state-focused) {
  color: #627789;
}
html.aspnet-demos .page-wrapper {
  background-color: white;
}
html.aspnet-demos .adaptivity-switcher .switcher-item-wrapper.landscape .switcher-item .inner {
  background-color: white;
}
html.aspnet-demos .adaptivity-switcher .switcher-item-wrapper.portrait .switcher-item .inner {
  background-color: white;
}
html.aspnet-demos .adaptivity-switcher .switcher-item-wrapper .switcher-item {
  background-color: #22587e;
}
html.aspnet-demos .adaptivity-switcher .switcher-item-wrapper .switcher-item.active {
  background-color: #512bd4;
}
html.aspnet-demos .adaptivity-switcher .switcher-item-wrapper:hover {
  background-color: rgba(237, 237, 237, 0.7);
}
html.aspnet-demos .dx-popup-wrapper > .dx-overlay-content {
  border-color: #e7ebee;
  background-color: white;
}
html.aspnet-demos .dx-texteditor.dx-editor-outlined {
  background-color: white;
}
html.aspnet-demos #themeChooserPopup.dx-overlay-content {
  box-shadow: 0px 2px 8px 0px #0000001f, 0px 1px 2px 0px #0000000f;
}
html.aspnet-demos .dx-loadpanel-content {
  color: #1e70b9;
}
html.aspnet-demos .dx-loadindicator-icon .dx-loadindicator-segment {
  background-color: #512bd4 !important;
}
html.aspnet-demos .background-block p {
  font-family: 'Roboto', sans-serif;
  color: #333333;
}
html.aspnet-demos a {
  color: #512bd4;
}
html.aspnet-demos a:hover,
html.aspnet-demos a:visited:hover {
  color: #512bd4;
}
html.aspnet-demos a:active {
  color: #512bd4;
}
html.aspnet-demos a:visited {
  color: #512bd4;
}
html.aspnet-demos a:focus-visible {
  color: #512bd4;
  outline: 2px solid #512bd4;
  border-radius: 4px;
}
html.aspnet-demos textarea {
  color: #333333;
}
html.aspnet-demos .full-description-offset p a code {
  color: #dd1144;
  text-decoration: underline #dd1144;
}
html.aspnet-demos .content {
  background: white;
}
html.aspnet-demos .content h1,
html.aspnet-demos .content h2,
html.aspnet-demos .content h3,
html.aspnet-demos .content li,
html.aspnet-demos .content p {
  color: #222930;
}
html.aspnet-demos .content .doc-content .components-list-container .category-title {
  color: #222930;
}
html.aspnet-demos .content .doc-content .axe-report {
  border-color: #e1e6ea;
}
html.aspnet-demos .content .doc-content .axe-report .axe-header {
  color: #222930;
}
html.aspnet-demos .content .doc-content .axe-report .axe-button {
  background-color: #512bd4;
  color: white;
}
html.aspnet-demos .content .doc-content .axe-report .axe-button:focus,
html.aspnet-demos .content .doc-content .axe-report .axe-button:focus-visible {
  background-color: #391e94;
}
html.aspnet-demos .content .doc-content .axe-report .axe-button:hover {
  background-color: #4525b4;
}
html.aspnet-demos .content .doc-content .axe-report .axe-text {
  color: #3f4d5a;
}
html.aspnet-demos .content .doc-content .axe-report .axe-trademark {
  color: #667c8f;
}
html.aspnet-demos .content .doc-content .axe-note {
  background-color: #f3f5f6;
  color: #667c8f;
}
html.aspnet-demos .content .doc-content .roadmap-survey-block {
  background-color: #ff900014;
  border-color: #ffaf47;
}
html.aspnet-demos .content .doc-content .roadmap-survey-header {
  color: #222930;
}
html.aspnet-demos .content .doc-content .roadmap-survey-text {
  color: #3f4d5a;
}
html.aspnet-demos .content .doc-content .roadmap-image-block {
  background-color: #f3f5f6;
  border-color: #e1e6ea;
}
html.aspnet-demos .content .doc-content .roadmap-image-block.bg-gif {
  background-color: white;
}
html.aspnet-demos .content .doc-content .roadmap-survey-button {
  color: white;
}
html.aspnet-demos .content .doc-content .note {
  background: rgba(221, 17, 68, 0.1);
}
html.aspnet-demos .content .doc-content .note .note-header {
  color: #dd1144;
}
html.aspnet-demos .content .doc-content .libs {
  color: #7f7f7f;
}
html.aspnet-demos .content .doc-content .accordion-content {
  border: none;
  background-color: white;
}
html.aspnet-demos .content .doc-content .accordion-content .dx-accordion-item.dx-accordion-item-closed {
  background-color: white;
  border-color: white;
}
html.aspnet-demos .content .doc-content .accordion-content .dx-accordion-item-selected,
html.aspnet-demos .content .doc-content .accordion-content .dx-accordion-item-opened {
  border-color: #627789;
  background-color: white;
}
html.aspnet-demos .content .doc-content .accordion-content .dx-accordion-item-selected .dx-accordion-item-title,
html.aspnet-demos .content .doc-content .accordion-content .dx-accordion-item-opened .dx-accordion-item-title {
  background-color: white;
}
html.aspnet-demos .content .doc-content .accordion-content .dx-accordion-item-selected .dx-accordion-item-title:hover,
html.aspnet-demos .content .doc-content .accordion-content .dx-accordion-item-opened .dx-accordion-item-title:hover {
  background-color: white;
}
html.aspnet-demos .content .doc-content .accordion-content .dx-accordion-item-title {
  background-color: #f8f8f8;
  color: #22587e;
}
html.aspnet-demos .content .doc-content .accordion-content .dx-accordion-item-title:hover {
  background-color: #eef0f2;
}
html.aspnet-demos .content .doc-content .accordion-content .dx-accordion-item-title:before {
  color: #22587e;
}
html.aspnet-demos .content .doc-content .dx-accordion-item.dx-state-focused {
  border-color: #627789;
  border-radius: 8px;
}
html.aspnet-demos .content .doc-content h5.see-also {
  border-top-color: #ededed;
  color: #333333;
}
html.aspnet-demos .content .doc-content .code-wrapper.code-tabs .code-type {
  background-color: #f8f8f8;
  border-color: #ededed;
  color: #22587e;
}
html.aspnet-demos .content .doc-content .code-wrapper.code-tabs .code-type.active {
  background-color: #1e70b9;
  border-color: #1e70b9;
  color: white;
}
html.aspnet-demos .content .doc-content .code-wrapper .code-type {
  background-color: #f8f8f8;
  border-color: #ededed;
  color: #22587e;
}
html.aspnet-demos .content .doc-content .code-wrapper .code-type.active {
  background-color: #1e70b9;
  border-color: #1e70b9;
  color: white;
}
html.aspnet-demos .content .doc-content .code-wrapper pre {
  border-color: #e1e1e8;
}
html.aspnet-demos .content .doc-content .api-header a {
  color: #22587e;
}
html.aspnet-demos .content .doc-content .api-property-block .api-property {
  border-left-color: #22587e;
  color: #333333;
}
html.aspnet-demos .content .doc-content .api-property-block .api-property span.api-property-name {
  color: #8b949c;
}
html.aspnet-demos .content .doc-content .api-property-block .api-property.no-margin {
  color: #8b949c;
}
html.aspnet-demos .content .doc-content .api-property-block .api-property.no-margin p {
  color: #8b949c;
}
html.aspnet-demos .content .doc-content .api-property-block .api-property .parameter-name {
  color: #8b949c;
}
html.aspnet-demos .content .doc-content .api-property-block p a {
  color: #22587e;
}
html.aspnet-demos .content .doc-content .api-property-block p a:hover {
  color: #1e70b9;
}
html.aspnet-demos .content .doc-content .api-property-block p a:visited {
  color: #6b58a1;
}
html.aspnet-demos .content .doc-content .api-property-block p a:visited:hover {
  color: #1e70b9;
}
html.aspnet-demos .content .doc-content .featured-components-container .component-container .component-icon svg path,
html.aspnet-demos .content .doc-content .featured-components-container .component-container .component-icon svg rect,
html.aspnet-demos .content .doc-content .featured-components-container .component-container .component-icon svg polygon,
html.aspnet-demos .content .doc-content .featured-components-container .component-container .component-icon svg circle {
  fill: #667c8f;
}
html.aspnet-demos .content .doc-content .featured-components-container .component-container .component-link {
  color: #596c7d;
}
html.aspnet-demos .content .doc-content .featured-components-container .component-container:hover {
  background-color: #512bd4;
}
html.aspnet-demos .content .doc-content .featured-components-container .component-container:hover svg path,
html.aspnet-demos .content .doc-content .featured-components-container .component-container:hover svg rect,
html.aspnet-demos .content .doc-content .featured-components-container .component-container:hover svg polygon,
html.aspnet-demos .content .doc-content .featured-components-container .component-container:hover svg circle {
  fill: white;
}
html.aspnet-demos .content .doc-content .featured-components-container .component-container:hover .component-link {
  color: white;
}
html.aspnet-demos .content .doc-content .deprecated-block .deprecated {
  color: red;
}
html.aspnet-demos .content .doc-content .simple-table table td:first-child {
  color: black;
}
html.aspnet-demos .content .doc-content .simple-table td,
html.aspnet-demos .content .doc-content .simple-table th {
  border-color: #ededed;
}
html.aspnet-demos .content .doc-content .simple-table th {
  background: #ededed;
}
html.aspnet-demos .content .doc-content .simple-table tr:nth-child(even) {
  background: #f8f8f8;
}
html.aspnet-demos .content .doc-content .simple-table tr:nth-child(odd) {
  background: white;
}
html.aspnet-demos .content .doc-content .dx-table tr {
  border-bottom-color: #e7ebee;
}
html.aspnet-demos .content .doc-content .dx-table tr th {
  background: white;
  color: #667c8f;
  border-color: #e7ebee;
}
html.aspnet-demos .content .doc-content .dx-table tr td {
  border-color: white;
  color: #3f4d5a;
}
html.aspnet-demos .content .doc-content .dx-table tr .parameter-type {
  color: #3f4d5a;
}
html.aspnet-demos .content .doc-content .dx-table tr:nth-child(even) {
  background: white;
}
html.aspnet-demos .content .doc-content .dx-table tr:nth-child(even) td {
  border-right-color: white;
}
html.aspnet-demos .content .doc-content .dx-table tr:nth-child(odd) {
  background: #edf0f2;
}
html.aspnet-demos .content .doc-content .dx-table tr:nth-child(odd) td {
  border-right-color: #edf0f2;
}
html.aspnet-demos .content .doc-content .dx-table tr a {
  color: #22587e;
}
html.aspnet-demos .content .doc-content .dx-table tr a:hover {
  color: #1e70b9;
}
html.aspnet-demos .content .doc-content .dx-table tr a:visited {
  color: #6b58a1;
}
html.aspnet-demos .content .doc-content .dx-table tr a:visited:hover {
  color: #1e70b9;
}
html.aspnet-demos .content .doc-content .footnotes {
  border-top-color: #ededed;
}
html.aspnet-demos .content .doc-content .documentation-gallery .gallery-border {
  border-color: #ededed;
}
html.aspnet-demos .content .doc-content .documentation-gallery .gallery-border .arrow {
  border-color: #ededed;
  background-color: white;
}
html.aspnet-demos .content .doc-content .documentation-gallery .gallery-item .image {
  border-left-color: transparent;
  border-right-color: transparent;
}
html.aspnet-demos .content .doc-content .api-example .show-text {
  color: #7f7f7f;
}
html.aspnet-demos .content .doc-content .api-example .approach-tab-container .button.approach-switcher {
  background-color: #eef0f2;
  color: #22587e;
}
html.aspnet-demos .content .doc-content .api-example .approach-tab-container .button.approach-switcher:after {
  border-top-color: #ededed;
}
html.aspnet-demos .content .doc-content .api-example .approach-tab-container .button.approach-switcher:hover {
  background-color: #f8f8f8;
  border-color: #ededed;
}
html.aspnet-demos .content .doc-content .api-example .approach-tab-container .button.approach-switcher.current {
  background-color: white;
  color: #1b4461;
}
html.aspnet-demos .content .doc-content .api-example .approach-tab-container .button.approach-switcher.current:after {
  border-bottom-color: #ededed;
}
html.aspnet-demos .content .doc-content.search-page .header h1 .keyword {
  color: #1e70b9;
}
html.aspnet-demos .content .doc-content.search-page .header ul.search-counts {
  border-bottom-color: #ededed;
}
html.aspnet-demos .content .doc-content.search-page .header ul.search-counts li .count {
  color: #22587e;
}
html.aspnet-demos .content .doc-content.search-page .header ul.search-counts li.active {
  background-color: white;
  border-bottom-color: #512bd4;
}
html.aspnet-demos .content .doc-content.search-page .header ul.search-counts li.active a {
  color: #512bd4;
}
html.aspnet-demos .content .doc-content.search-page .header ul.search-counts li.active a:visited {
  color: #6b58a1;
}
html.aspnet-demos .content .doc-content.search-page .header ul.search-counts li.active .count {
  color: #512bd4;
}
html.aspnet-demos .content .doc-content.search-page .article-type {
  color: rgba(51, 51, 51, 0.7);
}
html.aspnet-demos .content .doc-content.search-page .article-type p {
  color: #333333;
}
html.aspnet-demos .content .doc-content.search-page p {
  color: #333333;
}
html.aspnet-demos .content .doc-content.search-page .pagination a:hover,
html.aspnet-demos .content .doc-content.search-page .pagination a:visited,
html.aspnet-demos .content .doc-content.search-page .pagination a:visited:hover {
  color: #22587e;
}
html.aspnet-demos .content .doc-content.search-page .pagination .activeItem-item.ellipsis,
html.aspnet-demos .content .doc-content.search-page .pagination a.ellipsis {
  color: #22587e;
}
html.aspnet-demos .content .doc-content.search-page .pagination .activeItem-item {
  background-color: #22587e;
}
html.aspnet-demos .content .doc-content .api-header,
html.aspnet-demos .content .doc-content .article-section-header {
  color: #333333;
}
html.aspnet-demos .content .doc-content .article-header .badge,
html.aspnet-demos .content .doc-content .api-header .badge {
  color: #333333;
  background-color: #627789;
}
html.aspnet-demos .content .doc-content .description code,
html.aspnet-demos .content .doc-content .second-description code {
  background-color: #f8f8f8;
  border-color: #ededed;
}
html.aspnet-demos .content .doc-content .simulators {
  border-color: #e1e6ea;
}
html.aspnet-demos .content .doc-content .simulators .demo-device {
  background-color: white;
}
html.aspnet-demos .content .doc-content .simulators.Mobile .demo-device,
html.aspnet-demos .content .doc-content .simulators.TabletLandscape .demo-device,
html.aspnet-demos .content .doc-content .simulators.TabletPortrait .demo-device {
  border-color: #ededed;
  background-color: #f8f8f8;
}
html.aspnet-demos .content .doc-content .simulators.Mobile .demo-device .demo-display,
html.aspnet-demos .content .doc-content .simulators.TabletLandscape .demo-device .demo-display,
html.aspnet-demos .content .doc-content .simulators.TabletPortrait .demo-device .demo-display {
  border-color: #ededed;
}
html.aspnet-demos .content .marketing-demos {
  background-color: white;
}
html.aspnet-demos .content .marketing-demos .demos-container {
  background-color: #f3f5f6;
}
html.aspnet-demos .content .marketing-demos .demo-link-content {
  background-color: white;
  border-color: #e7ebee;
}
html.aspnet-demos .content .marketing-demos .demo-link-content h5 {
  color: #3f4d5a;
}
html.aspnet-demos .content .marketing-demos .demo-link-content p {
  color: #596c7d;
}
html.aspnet-demos .content .marketing-demos .demo-link:hover .demo-link-content {
  background-color: #512bd4;
}
html.aspnet-demos .content .marketing-demos .demo-link:hover .demo-link-content h5,
html.aspnet-demos .content .marketing-demos .demo-link:hover .demo-link-content p {
  color: white;
}
html.aspnet-demos .content .marketing-demos .demo-link-stub {
  display: none;
}
@media only screen and (max-width: 1600px) {
  html.aspnet-demos .content .marketing-demos .demo-link-stub {
    display: block;
  }
}
html.aspnet-demos .content .top-content__expand {
  color: #596c7d;
  border-color: #e7ebee;
  outline-color: #e7ebee;
  background-color: #f3f5f6;
}
html.aspnet-demos .content .top-content__expand svg {
  fill: #596c7d;
}
html.aspnet-demos .content .top-content__expand svg path,
html.aspnet-demos .content .top-content__expand svg circle {
  fill: #596c7d;
}
html.aspnet-demos .content .top-content__expand:hover,
html.aspnet-demos .content .top-content__expand:focus {
  color: #596c7d;
  border-color: #e7ebee;
  outline-color: #e7ebee;
  background-color: #edf0f2;
}
html.aspnet-demos .content .top-content__expand:hover svg,
html.aspnet-demos .content .top-content__expand:focus svg {
  fill: #596c7d;
}
html.aspnet-demos .content .top-content__expand:hover svg path,
html.aspnet-demos .content .top-content__expand:focus svg path,
html.aspnet-demos .content .top-content__expand:hover svg circle,
html.aspnet-demos .content .top-content__expand:focus svg circle {
  fill: #596c7d;
}
html.aspnet-demos .content .top-content__expand:active {
  color: #596c7d;
  border-color: #e7ebee;
  outline-color: #e7ebee;
  background-color: #e7ebee;
}
html.aspnet-demos .content .top-content__expand:active svg {
  fill: #596c7d;
}
html.aspnet-demos .content .top-content__expand:active svg path,
html.aspnet-demos .content .top-content__expand:active svg circle {
  fill: #596c7d;
}
html.aspnet-demos .content .top-content h1.Updated::after {
  background-color: #512bd4;
}
html.aspnet-demos .content .code {
  border-color: #e7ebee;
}
html.aspnet-demos .content .code .not-yet {
  color: #91a4b2;
}
html.aspnet-demos .content .code .tabs-container {
  border-color: #e7ebee;
  background-color: white;
}
html.aspnet-demos .content .code .tabs-container #code-tabs .switch::before {
  background-color: #e7ebee;
}
html.aspnet-demos .content .code .buttons-container {
  border-color: #e7ebee;
  background-color: white;
}
html.aspnet-demos .content .code .buttons-container .buttons.fixed {
  background-color: white;
  border-color: #e7ebee;
}
html.aspnet-demos .content .code .source-block {
  scrollbar-color: #bfbfbf #f8f8f8;
}
html.aspnet-demos .content .code .source-block::-webkit-scrollbar-track {
  background-color: #f8f8f8;
}
html.aspnet-demos .content .code .source-block::-webkit-scrollbar-thumb {
  background-color: #bfbfbf;
}
html.aspnet-demos .content .code .source-block .CodeMirror {
  background-color: white;
}
html.aspnet-demos .content .code .source-block .CodeMirror pre {
  color: #333333;
}
html.aspnet-demos .content .code .source-block .CodeMirror .read-only-line {
  color: #4f4f4f;
}
html.aspnet-demos .content .code .source-block .CodeMirror .read-only-line.cm-comment {
  color: #b48a5f;
}
html.aspnet-demos .content .code .source-block .CodeMirror .read-only-line.cm-string {
  color: #b66969;
}
html.aspnet-demos .content .code .source-block .CodeMirror .read-only-line.cm-atom {
  color: #6f67ac;
}
html.aspnet-demos .content .code .source-block .CodeMirror .read-only-line.cm-keyword {
  color: #975ba0;
}
html.aspnet-demos .content .code .source-block .CodeMirror .read-only-line.cm-tag {
  color: #6ca363;
}
html.aspnet-demos .content .code .source-block .CodeMirror .read-only-line.cm-tag.cm-error {
  color: red;
}
html.aspnet-demos .content .code .source-block .CodeMirror .read-only-line.cm-attribute {
  color: #6767d5;
}
html.aspnet-demos .content .code .move-demo-container .move-demo-button {
  border-color: #a7b8c6;
  background-color: #1b4461;
  color: white;
}
html.aspnet-demos .content .code .move-demo-container .move-demo-button:hover {
  border-color: #f05b41;
  background-color: #f05b41;
}
html.aspnet-demos .content .code .move-demo-container .move-demo-button .move-demo-icon path {
  stroke: white;
}
html.aspnet-demos .content .demo-nav-links {
  background-color: white;
  border-color: #e1e6ea;
}
html.aspnet-demos .content .demo-nav-links a:hover {
  background-color: rgba(28, 45, 54, 0.03);
}
html.aspnet-demos .content .demo-nav-links a:active {
  background-color: rgba(28, 45, 54, 0.07);
}
html.aspnet-demos .content .demo-nav-links a:focus-visible {
  outline-color: #512bd4;
}
html.aspnet-demos .content .demo-nav-links a svg {
  fill: #596c7d;
}
html.aspnet-demos .content .demo-nav-links a svg path {
  fill: #596c7d;
}
html.aspnet-demos .content .demo-nav-links a.adaptivity-switcher:hover {
  background-color: transparent;
}
html.aspnet-demos .content .demo-nav-links button .link-button path {
  fill: #596c7d;
}
html.aspnet-demos .content .demo-nav-links button#fullScreenLink {
  background-color: inherit;
}
html.aspnet-demos .content .demo-nav-links button#fullScreenLink:hover {
  background-color: rgba(28, 45, 54, 0.03);
}
html.aspnet-demos .content .demo-nav-links button#fullScreenLink:active {
  background-color: rgba(28, 45, 54, 0.07);
}
html.aspnet-demos .content .demo-nav-links button#fullScreenLink:focus-visible {
  outline: 2px solid #512bd4;
}
html.aspnet-demos .content .demo-nav-links span.nav-border {
  background-color: #ededed;
}
html.aspnet-demos .content .demo-nav-links span.separator {
  background-color: #e7ebee;
}
html.aspnet-demos .content .demo-nav-links .uitg-button {
  color: #596c7d !important;
}
html.aspnet-demos .content #copy-to-code-codepen,
html.aspnet-demos .content #copy-to-code-sandbox,
html.aspnet-demos .content #reset {
  background-color: white;
  border: none;
}
html.aspnet-demos .content #copy-to-code-codepen:active,
html.aspnet-demos .content #copy-to-code-sandbox:active,
html.aspnet-demos .content #reset:active {
  background-color: rgba(28, 45, 54, 0.07);
}
html.aspnet-demos .content #copy-to-code-codepen:focus,
html.aspnet-demos .content #copy-to-code-sandbox:focus,
html.aspnet-demos .content #reset:focus {
  outline: none;
}
html.aspnet-demos .content #copy-to-code-codepen:focus-visible,
html.aspnet-demos .content #copy-to-code-sandbox:focus-visible,
html.aspnet-demos .content #reset:focus-visible {
  outline: 2px solid #512bd4;
}
html.aspnet-demos .content #copy-to-code-codepen:hover,
html.aspnet-demos .content #copy-to-code-sandbox:hover,
html.aspnet-demos .content #reset:hover {
  background-color: rgba(28, 45, 54, 0.03);
  color: #596c7d !important;
}
html.aspnet-demos .content #copy-to-code-codepen.disabled,
html.aspnet-demos .content #copy-to-code-sandbox.disabled,
html.aspnet-demos .content #reset.disabled {
  opacity: 0.5;
}
html.aspnet-demos .content #copy-to-code-codepen.disabled:active,
html.aspnet-demos .content #copy-to-code-sandbox.disabled:active,
html.aspnet-demos .content #reset.disabled:active,
html.aspnet-demos .content #copy-to-code-codepen.disabled:focus,
html.aspnet-demos .content #copy-to-code-sandbox.disabled:focus,
html.aspnet-demos .content #reset.disabled:focus,
html.aspnet-demos .content #copy-to-code-codepen.disabled:focus-visible,
html.aspnet-demos .content #copy-to-code-sandbox.disabled:focus-visible,
html.aspnet-demos .content #reset.disabled:focus-visible {
  background-color: white;
  outline: none;
}
html.aspnet-demos .content #copy-to-code-codepen.disabled:hover,
html.aspnet-demos .content #copy-to-code-sandbox.disabled:hover,
html.aspnet-demos .content #reset.disabled:hover {
  background-image: repeating-linear-gradient(45deg, #cccccc, #cccccc 10px, #bbbbbb 10px, #bbbbbb 20px);
  cursor: not-allowed;
}
html.aspnet-demos .content #apply:focus,
html.aspnet-demos .content #apply:focus-visible {
  outline: none;
}
html.aspnet-demos .content:not(.document__body) .doc-content h5.see-also + ul li:before {
  border-color: #333333;
  color: yellow;
  background-color: #333333;
}
html.aspnet-demos .debug-invalid-model-popup {
  color: white;
  background-color: red;
}
html.aspnet-demos .highlight {
  background-color: rgba(81, 43, 212, 0.15);
}
html.aspnet-demos .highlight.current {
  background-color: rgba(81, 43, 212, 0.3);
}
html.aspnet-demos .diagram-shape {
  stroke: black;
}
html.aspnet-demos .doc-content .nav-tabs > .active > a,
html.aspnet-demos .doc-content .nav-tabs > .active > a:focus {
  color: #555555;
  background-color: white;
  border-color: #dddddd;
}
html.aspnet-demos .doc-content .codeTabs.nav.nav-tabs {
  border-bottom-color: #e5e5e5;
}
html.aspnet-demos .doc-content .codeTabs.nav.nav-tabs li a {
  color: #252525;
}
html.aspnet-demos .doc-content .codeTabs.nav.nav-tabs li a:visited {
  color: #6b58a1;
}
html.aspnet-demos .doc-content .codeTabs.nav.nav-tabs li.active {
  border-top-color: #e5e5e5;
  border-left-color: #e5e5e5;
  border-right-color: #e5e5e5;
}
html.aspnet-demos .doc-content .codeTabs.nav.nav-tabs li.active a {
  background: white;
}
html.aspnet-demos .doc-content .codeTabs.nav.nav-tabs li.active a:visited {
  color: #6b58a1;
}
html.aspnet-demos .doc-content .demo-nav-links .standalone {
  border-color: #e7ebee;
  color: #596c7d;
}
html.aspnet-demos .doc-content .demo-nav-links .standalone:hover {
  background-color: #f3f5f6;
}
html.aspnet-demos .doc-content .demo-nav-links .standalone:active {
  background-color: #edf0f2;
}
html.aspnet-demos .button:not(.feedback__button) {
  color: #4525b4;
  border-color: #512bd4;
}
html.aspnet-demos .button:not(.feedback__button):hover,
html.aspnet-demos .button:not(.feedback__button).hover {
  color: white;
  border-color: #4525b4;
  background-color: #4525b4;
}
html.aspnet-demos .button:not(.feedback__button):active,
html.aspnet-demos .button:not(.feedback__button).active {
  border-color: #391e94;
  background-color: #391e94;
}
html.aspnet-demos .button:not(.feedback__button).fiddle:hover svg path,
html.aspnet-demos .button:not(.feedback__button).fiddle.hover svg path {
  stroke: white;
}
html.aspnet-demos .button:not(.feedback__button).fiddle:hover svg g path,
html.aspnet-demos .button:not(.feedback__button).fiddle.hover svg g path {
  fill: white;
  stroke: none;
}
html.aspnet-demos .dx-list-group-header {
  background-color: rgba(30, 112, 185, 0.1);
  color: #8b949c;
}
html.aspnet-demos .dx-dropdownlist-popup-wrapper.dx-popup-wrapper .dx-overlay-content {
  background-color: white;
}
html.aspnet-demos .dx-dropdownlist-popup-wrapper .dx-list:not(.dx-list-select-decorator-enabled) .dx-list-item {
  color: #333333;
  background-color: #eef0f2;
}
html.aspnet-demos .dx-dropdownlist-popup-wrapper .dx-list:not(.dx-list-select-decorator-enabled) .dx-list-item.dx-state-hover {
  background-color: rgba(30, 112, 185, 0.5);
  color: #627789;
}
html.aspnet-demos .dx-dropdownlist-popup-wrapper .dx-list:not(.dx-list-select-decorator-enabled) .dx-list-item.dx-list-item-selected {
  background-color: rgba(30, 112, 185, 0.5);
  color: #512bd4;
}
html.aspnet-demos .dx-dropdownlist-popup-wrapper .dx-list:not(.dx-list-select-decorator-enabled) .dx-list-item.dx-list-item-selected.dx-state-hover:not(.dx-state-focused) {
  color: #627789;
}
html.aspnet-demos .page-wrapper {
  background-color: white;
}
html.aspnet-demos .adaptivity-switcher .switcher-item-wrapper.landscape .switcher-item .inner {
  background-color: white;
}
html.aspnet-demos .adaptivity-switcher .switcher-item-wrapper.portrait .switcher-item .inner {
  background-color: white;
}
html.aspnet-demos .adaptivity-switcher .switcher-item-wrapper .switcher-item {
  background-color: #22587e;
}
html.aspnet-demos .adaptivity-switcher .switcher-item-wrapper .switcher-item.active {
  background-color: #512bd4;
}
html.aspnet-demos .adaptivity-switcher .switcher-item-wrapper:hover {
  background-color: rgba(237, 237, 237, 0.7);
}
html.aspnet-demos .dx-popup-wrapper > .dx-overlay-content {
  border-color: #e7ebee;
  background-color: white;
}
html.aspnet-demos .dx-texteditor.dx-editor-outlined {
  background-color: white;
}
html.aspnet-demos #themeChooserPopup.dx-overlay-content {
  box-shadow: 0px 2px 8px 0px #0000001f, 0px 1px 2px 0px #0000000f;
}
html.aspnet-demos .theme-popup-header {
  background-color: white;
  box-shadow: 0px 1px 2px 0px #0000000f, 0px 2px 8px 0px #0000000a;
}
html.aspnet-demos .theme-popup-window {
  background-color: white;
  color: #3f4d5a;
}
html.aspnet-demos .theme-popup-window:focus-visible {
  outline: none;
}
html.aspnet-demos .theme-popup-window .theme-item {
  color: #596c7d;
}
html.aspnet-demos .theme-popup-window .theme-item:hover {
  background-color: rgba(28, 45, 54, 0.03);
}
html.aspnet-demos .theme-popup-window .theme-item.selected {
  background-color: rgba(28, 45, 54, 0.07);
}
html.aspnet-demos .theme-popup-window .theme-item:focus {
  outline-color: #512bd4;
}
html.aspnet-demos .theme-popup-window .theme-trademark-warning-icon {
  fill: #596c7d;
}
html.aspnet-demos .theme-popup-window .theme-selector-group-container:hover,
html.aspnet-demos .theme-popup-window .theme-selector-group-container:focus-visible {
  background-color: rgba(28, 45, 54, 0.03);
}
html.aspnet-demos .theme-popup-window .theme-selector-group-container:focus {
  outline: none;
}
html.aspnet-demos .theme-popup-window .theme-selector-group.active span {
  color: #512bd4;
}
html.aspnet-demos .theme-popup-window .theme-selector-group.active span::after {
  background-color: #512bd4;
}
html.aspnet-demos .theme-popup-window .themebuilder-group {
  border-color: #e7ebee;
  background-color: white;
}
html.aspnet-demos .theme-popup-window .themebuilder-group .theme-popup-button {
  background-color: inherit;
}
html.aspnet-demos .theme-popup-window .themebuilder-group .theme-popup-button:hover {
  background-color: rgba(28, 45, 54, 0.03);
}
html.aspnet-demos .theme-popup-window .themebuilder-group .theme-popup-button:focus,
html.aspnet-demos .theme-popup-window .themebuilder-group .theme-popup-button:active {
  background-color: rgba(28, 45, 54, 0.07);
}
html.aspnet-demos .theme-popup-window .themebuilder-group .theme-popup-button:focus {
  outline: none;
}
html.aspnet-demos .theme-popup-window .themebuilder-group .theme-popup-button span {
  color: #512bd4;
}
html.aspnet-demos .theme-popup-window .themebuilder-group .theme-popup-button svg,
html.aspnet-demos .theme-popup-window .themebuilder-group .theme-popup-button path {
  fill: #512bd4 !important;
}
html.aspnet-demos .theme-popup-group-title {
  border-color: #e7ebee;
}
html.aspnet-demos #theme-selector-button.btn {
  background-color: white;
}
html.aspnet-demos #theme-selector-button.btn:focus,
html.aspnet-demos #theme-selector-button.btn:focus-visible {
  outline-color: #512bd4;
}
html.aspnet-demos #theme-selector-button.btn:hover {
  background-color: rgba(28, 45, 54, 0.03);
}
html.aspnet-demos #theme-selector-button.btn:active {
  background-color: rgba(28, 45, 54, 0.07);
}
html.aspnet-demos .theme-warning-tooltip .dx-overlay-content .dx-popover-arrow {
  bottom: -9px !important;
}
html.aspnet-demos .theme-warning-tooltip .dx-overlay-content .dx-popup-content {
  font-family: 'Roboto', sans-serif;
  font-size: 14px;
  padding: 8px 12px;
  text-align: left;
  white-space: normal;
  background-color: white !important;
  border-radius: 4px;
}
html.aspnet-demos .theme-popup-header {
  background-color: white;
  box-shadow: 0px 1px 2px 0px #0000000f, 0px 2px 8px 0px #0000000a;
}
html.aspnet-demos .theme-popup-window {
  background-color: white;
  color: #3f4d5a;
}
html.aspnet-demos .theme-popup-window:focus-visible {
  outline: none;
}
html.aspnet-demos .theme-popup-window .theme-item {
  color: #596c7d;
}
html.aspnet-demos .theme-popup-window .theme-item:hover {
  background-color: rgba(28, 45, 54, 0.03);
}
html.aspnet-demos .theme-popup-window .theme-item.selected {
  background-color: rgba(28, 45, 54, 0.07);
}
html.aspnet-demos .theme-popup-window .theme-item:focus {
  outline-color: #512bd4;
}
html.aspnet-demos .theme-popup-window .theme-trademark-warning-icon {
  fill: #596c7d;
}
html.aspnet-demos .theme-popup-window .theme-selector-group-container:hover,
html.aspnet-demos .theme-popup-window .theme-selector-group-container:focus-visible {
  background-color: rgba(28, 45, 54, 0.03);
}
html.aspnet-demos .theme-popup-window .theme-selector-group-container:focus {
  outline: none;
}
html.aspnet-demos .theme-popup-window .theme-selector-group.active span {
  color: #512bd4;
}
html.aspnet-demos .theme-popup-window .theme-selector-group.active span::after {
  background-color: #512bd4;
}
html.aspnet-demos .theme-popup-window .themebuilder-group {
  border-color: #e7ebee;
  background-color: white;
}
html.aspnet-demos .theme-popup-window .themebuilder-group .theme-popup-button {
  background-color: inherit;
}
html.aspnet-demos .theme-popup-window .themebuilder-group .theme-popup-button:hover {
  background-color: rgba(28, 45, 54, 0.03);
}
html.aspnet-demos .theme-popup-window .themebuilder-group .theme-popup-button:focus,
html.aspnet-demos .theme-popup-window .themebuilder-group .theme-popup-button:active {
  background-color: rgba(28, 45, 54, 0.07);
}
html.aspnet-demos .theme-popup-window .themebuilder-group .theme-popup-button:focus {
  outline: none;
}
html.aspnet-demos .theme-popup-window .themebuilder-group .theme-popup-button span {
  color: #512bd4;
}
html.aspnet-demos .theme-popup-window .themebuilder-group .theme-popup-button svg,
html.aspnet-demos .theme-popup-window .themebuilder-group .theme-popup-button path {
  fill: #512bd4 !important;
}
html.aspnet-demos .theme-popup-group-title {
  border-color: #e7ebee;
}
html.aspnet-demos #theme-selector-button.btn {
  background-color: white;
}
html.aspnet-demos #theme-selector-button.btn:focus,
html.aspnet-demos #theme-selector-button.btn:focus-visible {
  outline-color: #512bd4;
}
html.aspnet-demos #theme-selector-button.btn:hover {
  background-color: rgba(28, 45, 54, 0.03);
}
html.aspnet-demos #theme-selector-button.btn:active {
  background-color: rgba(28, 45, 54, 0.07);
}
html.aspnet-demos .theme-warning-tooltip .dx-overlay-content .dx-popover-arrow {
  bottom: -9px !important;
}
html.aspnet-demos .theme-warning-tooltip .dx-overlay-content .dx-popup-content {
  font-family: 'Roboto', sans-serif;
  font-size: 14px;
  padding: 8px 12px;
  text-align: left;
  white-space: normal;
  background-color: white !important;
  border-radius: 4px;
}
html.aspnet-demos .footer {
  background-color: #4c5d6b;
}
html.aspnet-demos .footer a {
  color: white;
}
html.aspnet-demos .footer a:visited {
  color: white;
}
html.aspnet-demos .footer a:hover,
html.aspnet-demos .footer a:visited:hover {
  color: #d9d9d9;
}
html.aspnet-demos .footer a:active {
  color: #b3b3b3;
}
html.aspnet-demos .footer {
  background-color: #4c5d6b;
}
html.aspnet-demos .footer a {
  color: white;
}
html.aspnet-demos .footer a:visited {
  color: white;
}
html.aspnet-demos .footer a:hover,
html.aspnet-demos .footer a:visited:hover {
  color: #d9d9d9;
}
html.aspnet-demos .footer a:active {
  color: #b3b3b3;
}
html.aspnet-demos .theme-switch {
  background-color: white;
  border-color: #e7ebee;
}
html.aspnet-demos .theme-input {
  background-color: #512bd4;
}
html.aspnet-demos .theme-switch {
  background-color: white;
  border-color: #e7ebee;
}
html.aspnet-demos .theme-input {
  background-color: #512bd4;
}
html.aspnet-demos .front-toggle {
  background-color: whitesmoke;
  border: 1px solid #e1e6ea;
  color: #3f4d5a;
  font-size: 14px;
  line-height: 16px;
  font-weight: 400;
}
html.aspnet-demos .front-toggle .selected {
  color: #222930;
  font-weight: 600;
}
html.aspnet-demos .front-toggle .front-toggle-track {
  background-color: white;
  box-shadow: 0px 2px 2px 0px #00000014, 0px 0px 4px 0px #00000014;
}
html.aspnet-demos .front-toggle {
  background-color: whitesmoke;
  border: 1px solid #e1e6ea;
  color: #3f4d5a;
  font-size: 14px;
  line-height: 16px;
  font-weight: 400;
}
html.aspnet-demos .front-toggle .selected {
  color: #222930;
  font-weight: 600;
}
html.aspnet-demos .front-toggle .front-toggle-track {
  background-color: white;
  box-shadow: 0px 2px 2px 0px #00000014, 0px 0px 4px 0px #00000014;
}
html.aspnet-demos .survey--part {
  color: white;
}
html.aspnet-demos .survey--part a,
html.aspnet-demos .survey--part a:hover,
html.aspnet-demos .survey--part a:visited,
html.aspnet-demos .survey--part a:focus,
html.aspnet-demos .survey--part a:active {
  color: white;
}
html.aspnet-demos .survey--container {
  background-color: #512bd4;
}
html.aspnet-demos .survey--svg-fill-accent {
  fill: #512bd4;
}
html.aspnet-demos .survey--svg-linear-stop-accent {
  stop-color: #512bd4;
}
html.aspnet-demos .survey--button:hover {
  background-color: #856be1;
}
html.aspnet-demos .survey--button:active {
  background-color: #b9aaee;
}
html.aspnet-demos .survey--button:focus-visible {
  outline: white solid 2px;
}
html.aspnet-demos .survey--part {
  color: white;
}
html.aspnet-demos .survey--part a,
html.aspnet-demos .survey--part a:hover,
html.aspnet-demos .survey--part a:visited,
html.aspnet-demos .survey--part a:focus,
html.aspnet-demos .survey--part a:active {
  color: white;
}
html.aspnet-demos .survey--container {
  background-color: #512bd4;
}
html.aspnet-demos .survey--svg-fill-accent {
  fill: #512bd4;
}
html.aspnet-demos .survey--svg-linear-stop-accent {
  stop-color: #512bd4;
}
html.aspnet-demos .survey--button:hover {
  background-color: #856be1;
}
html.aspnet-demos .survey--button:active {
  background-color: #b9aaee;
}
html.aspnet-demos .survey--button:focus-visible {
  outline: white solid 2px;
}
html.aspnet-demos #onetrust-consent-sdk #onetrust-banner-sdk {
  background-color: white;
}
html.aspnet-demos #onetrust-consent-sdk #onetrust-banner-sdk #onetrust-button-group-parent .banner-actions-container button {
  background-color: #512bd4;
  border-color: #512bd4;
}
html.aspnet-demos #onetrust-consent-sdk #onetrust-banner-sdk #onetrust-button-group-parent button#onetrust-pc-btn-handler {
  background-color: white;
  border: 2px solid #3f4d5a;
  color: #3f4d5a;
}
html.aspnet-demos #onetrust-consent-sdk #onetrust-banner-sdk #onetrust-button-group-parent button#onetrust-pc-btn-handler:hover {
  background-color: #3f4d5a;
  color: white;
}
html.aspnet-demos #onetrust-consent-sdk #onetrust-pc-sdk {
  background-color: white;
}
html.aspnet-demos #onetrust-consent-sdk #onetrust-pc-sdk h3,
html.aspnet-demos #onetrust-consent-sdk #onetrust-pc-sdk h4,
html.aspnet-demos #onetrust-consent-sdk #onetrust-pc-sdk p,
html.aspnet-demos #onetrust-consent-sdk #onetrust-pc-sdk #ot-pc-title,
html.aspnet-demos #onetrust-consent-sdk #onetrust-pc-sdk #ot-pc-desc {
  color: #3f4d5a;
}
html.aspnet-demos #onetrust-consent-sdk #onetrust-pc-sdk .ot-pc-header,
html.aspnet-demos #onetrust-consent-sdk #onetrust-pc-sdk .ot-pc-footer,
html.aspnet-demos #onetrust-consent-sdk #onetrust-pc-sdk .ot-pc-footer-logo,
html.aspnet-demos #onetrust-consent-sdk #onetrust-pc-sdk .ot-accordion-layout.ot-cat-item {
  border-color: #edf0f2;
}
html.aspnet-demos #onetrust-consent-sdk #onetrust-pc-sdk .ot-plus-minus span {
  background-color: #3f4d5a;
}
html.aspnet-demos #onetrust-consent-sdk #onetrust-pc-sdk .ot-pc-footer-logo,
html.aspnet-demos #onetrust-consent-sdk #onetrust-pc-sdk .ot-acc-grpcntr.ot-acc-txt,
html.aspnet-demos #onetrust-consent-sdk #onetrust-pc-sdk .ot-acc-txt .ot-subgrp-tgl .ot-switch.ot-toggle {
  background-color: white;
}
html.aspnet-demos #onetrust-consent-sdk #onetrust-pc-sdk .ot-vs-list .ot-always-active,
html.aspnet-demos #onetrust-consent-sdk #onetrust-pc-sdk .ot-cat-grp .ot-always-active {
  color: #512bd4;
}
html.aspnet-demos #onetrust-consent-sdk #onetrust-pc-sdk .category-host-list-handler {
  color: #512bd4 !important;
}
html.aspnet-demos #onetrust-consent-sdk #onetrust-pc-sdk button:not(#clear-filters-handler):not(.ot-close-icon):not(#filter-btn-handler):not(.ot-remove-objection-handler):not(.ot-obj-leg-btn-handler):not([aria-expanded]):not(.ot-link-btn) {
  background-color: #512bd4 !important;
  border-color: #512bd4 !important;
}
html.aspnet-demos #onetrust-consent-sdk #onetrust-pc-sdk button:not(#clear-filters-handler):not(.ot-close-icon):not(#filter-btn-handler):not(.ot-remove-objection-handler):not(.ot-obj-leg-btn-handler):not([aria-expanded]):not(.ot-link-btn):hover {
  background-color: #4525b4 !important;
  border-color: #4525b4 !important;
}
html.aspnet-demos #onetrust-consent-sdk #onetrust-pc-sdk button:not(#clear-filters-handler):not(.ot-close-icon):not(#filter-btn-handler):not(.ot-remove-objection-handler):not(.ot-obj-leg-btn-handler):not([aria-expanded]):not(.ot-link-btn):active,
html.aspnet-demos #onetrust-consent-sdk #onetrust-pc-sdk button:not(#clear-filters-handler):not(.ot-close-icon):not(#filter-btn-handler):not(.ot-remove-objection-handler):not(.ot-obj-leg-btn-handler):not([aria-expanded]):not(.ot-link-btn):focus {
  background-color: #391e94 !important;
  border-color: #391e94 !important;
}
html.aspnet-demos #onetrust-consent-sdk #onetrust-pc-sdk button:not(#clear-filters-handler):not(.ot-close-icon):not(#filter-btn-handler):not(.ot-remove-objection-handler):not(.ot-obj-leg-btn-handler):not([aria-expanded]):not(.ot-link-btn):focus {
  outline-width: 0;
}
html.aspnet-demos #onetrust-consent-sdk #onetrust-pc-sdk .ot-tgl input:checked + .ot-switch .ot-switch-nob {
  border-color: #512bd4;
  background-color: rgba(81, 43, 212, 0.1);
}
html.aspnet-demos #onetrust-consent-sdk #onetrust-pc-sdk .ot-tgl input:checked + .ot-switch .ot-switch-nob:before {
  background-color: #512bd4;
}
html.aspnet-demos #onetrust-consent-sdk #onetrust-pc-sdk.otPcCenter {
  box-shadow: 0px 4px 12px rgba(0, 0, 0, 0.16);
}
html.aspnet-demos #onetrust-consent-sdk #onetrust-policy-text {
  color: #3f4d5a;
}
html.aspnet-demos #onetrust-consent-sdk #onetrust-banner-sdk {
  background-color: white;
}
html.aspnet-demos #onetrust-consent-sdk #onetrust-banner-sdk #onetrust-button-group-parent .banner-actions-container button {
  background-color: #512bd4;
  border-color: #512bd4;
}
html.aspnet-demos #onetrust-consent-sdk #onetrust-banner-sdk #onetrust-button-group-parent button#onetrust-pc-btn-handler {
  background-color: white;
  border: 2px solid #3f4d5a;
  color: #3f4d5a;
}
html.aspnet-demos #onetrust-consent-sdk #onetrust-banner-sdk #onetrust-button-group-parent button#onetrust-pc-btn-handler:hover {
  background-color: #3f4d5a;
  color: white;
}
html.aspnet-demos #onetrust-consent-sdk #onetrust-pc-sdk {
  background-color: white;
}
html.aspnet-demos #onetrust-consent-sdk #onetrust-pc-sdk h3,
html.aspnet-demos #onetrust-consent-sdk #onetrust-pc-sdk h4,
html.aspnet-demos #onetrust-consent-sdk #onetrust-pc-sdk p,
html.aspnet-demos #onetrust-consent-sdk #onetrust-pc-sdk #ot-pc-title,
html.aspnet-demos #onetrust-consent-sdk #onetrust-pc-sdk #ot-pc-desc {
  color: #3f4d5a;
}
html.aspnet-demos #onetrust-consent-sdk #onetrust-pc-sdk .ot-pc-header,
html.aspnet-demos #onetrust-consent-sdk #onetrust-pc-sdk .ot-pc-footer,
html.aspnet-demos #onetrust-consent-sdk #onetrust-pc-sdk .ot-pc-footer-logo,
html.aspnet-demos #onetrust-consent-sdk #onetrust-pc-sdk .ot-accordion-layout.ot-cat-item {
  border-color: #edf0f2;
}
html.aspnet-demos #onetrust-consent-sdk #onetrust-pc-sdk .ot-plus-minus span {
  background-color: #3f4d5a;
}
html.aspnet-demos #onetrust-consent-sdk #onetrust-pc-sdk .ot-pc-footer-logo,
html.aspnet-demos #onetrust-consent-sdk #onetrust-pc-sdk .ot-acc-grpcntr.ot-acc-txt,
html.aspnet-demos #onetrust-consent-sdk #onetrust-pc-sdk .ot-acc-txt .ot-subgrp-tgl .ot-switch.ot-toggle {
  background-color: white;
}
html.aspnet-demos #onetrust-consent-sdk #onetrust-pc-sdk .ot-vs-list .ot-always-active,
html.aspnet-demos #onetrust-consent-sdk #onetrust-pc-sdk .ot-cat-grp .ot-always-active {
  color: #512bd4;
}
html.aspnet-demos #onetrust-consent-sdk #onetrust-pc-sdk .category-host-list-handler {
  color: #512bd4 !important;
}
html.aspnet-demos #onetrust-consent-sdk #onetrust-pc-sdk button:not(#clear-filters-handler):not(.ot-close-icon):not(#filter-btn-handler):not(.ot-remove-objection-handler):not(.ot-obj-leg-btn-handler):not([aria-expanded]):not(.ot-link-btn) {
  background-color: #512bd4 !important;
  border-color: #512bd4 !important;
}
html.aspnet-demos #onetrust-consent-sdk #onetrust-pc-sdk button:not(#clear-filters-handler):not(.ot-close-icon):not(#filter-btn-handler):not(.ot-remove-objection-handler):not(.ot-obj-leg-btn-handler):not([aria-expanded]):not(.ot-link-btn):hover {
  background-color: #4525b4 !important;
  border-color: #4525b4 !important;
}
html.aspnet-demos #onetrust-consent-sdk #onetrust-pc-sdk button:not(#clear-filters-handler):not(.ot-close-icon):not(#filter-btn-handler):not(.ot-remove-objection-handler):not(.ot-obj-leg-btn-handler):not([aria-expanded]):not(.ot-link-btn):active,
html.aspnet-demos #onetrust-consent-sdk #onetrust-pc-sdk button:not(#clear-filters-handler):not(.ot-close-icon):not(#filter-btn-handler):not(.ot-remove-objection-handler):not(.ot-obj-leg-btn-handler):not([aria-expanded]):not(.ot-link-btn):focus {
  background-color: #391e94 !important;
  border-color: #391e94 !important;
}
html.aspnet-demos #onetrust-consent-sdk #onetrust-pc-sdk button:not(#clear-filters-handler):not(.ot-close-icon):not(#filter-btn-handler):not(.ot-remove-objection-handler):not(.ot-obj-leg-btn-handler):not([aria-expanded]):not(.ot-link-btn):focus {
  outline-width: 0;
}
html.aspnet-demos #onetrust-consent-sdk #onetrust-pc-sdk .ot-tgl input:checked + .ot-switch .ot-switch-nob {
  border-color: #512bd4;
  background-color: rgba(81, 43, 212, 0.1);
}
html.aspnet-demos #onetrust-consent-sdk #onetrust-pc-sdk .ot-tgl input:checked + .ot-switch .ot-switch-nob:before {
  background-color: #512bd4;
}
html.aspnet-demos #onetrust-consent-sdk #onetrust-pc-sdk.otPcCenter {
  box-shadow: 0px 4px 12px rgba(0, 0, 0, 0.16);
}
html.aspnet-demos #onetrust-consent-sdk #onetrust-policy-text {
  color: #3f4d5a;
}
html.aspnet-demos .btn.btn-accent {
  color: white;
  border-color: #512bd4;
  outline-color: #512bd4;
  background-color: #512bd4;
}
html.aspnet-demos .btn.btn-accent svg {
  fill: white;
}
html.aspnet-demos .btn.btn-accent svg path,
html.aspnet-demos .btn.btn-accent svg circle {
  fill: white;
}
html.aspnet-demos .btn.btn-accent:hover {
  color: white;
  border-color: #4525b4;
  outline-color: #4525b4;
  background-color: #4525b4;
}
html.aspnet-demos .btn.btn-accent:hover svg {
  fill: white;
}
html.aspnet-demos .btn.btn-accent:hover svg path,
html.aspnet-demos .btn.btn-accent:hover svg circle {
  fill: white;
}
html.aspnet-demos .btn.btn-accent:active,
html.aspnet-demos .btn.btn-accent:focus {
  color: white;
  border-color: #391e94;
  outline-color: #391e94;
  background-color: #391e94;
}
html.aspnet-demos .btn.btn-accent:active svg,
html.aspnet-demos .btn.btn-accent:focus svg {
  fill: white;
}
html.aspnet-demos .btn.btn-accent:active svg path,
html.aspnet-demos .btn.btn-accent:focus svg path,
html.aspnet-demos .btn.btn-accent:active svg circle,
html.aspnet-demos .btn.btn-accent:focus svg circle {
  fill: white;
}
html.aspnet-demos .btn.btn-outlined {
  color: #512bd4;
  border-color: #512bd4;
  outline-color: #512bd4;
  background-color: transparent;
}
html.aspnet-demos .btn.btn-outlined svg {
  fill: #512bd4;
}
html.aspnet-demos .btn.btn-outlined svg path,
html.aspnet-demos .btn.btn-outlined svg circle {
  fill: #512bd4;
}
html.aspnet-demos .btn.btn-outlined:hover {
  color: white;
  border-color: #4525b4;
  outline-color: #4525b4;
  background-color: #4525b4;
}
html.aspnet-demos .btn.btn-outlined:hover svg {
  fill: white;
}
html.aspnet-demos .btn.btn-outlined:hover svg path,
html.aspnet-demos .btn.btn-outlined:hover svg circle {
  fill: white;
}
html.aspnet-demos .btn.btn-outlined:active,
html.aspnet-demos .btn.btn-outlined:focus {
  color: white;
  border-color: #391e94;
  outline-color: #391e94;
  background-color: #391e94;
}
html.aspnet-demos .btn.btn-outlined:active svg,
html.aspnet-demos .btn.btn-outlined:focus svg {
  fill: white;
}
html.aspnet-demos .btn.btn-outlined:active svg path,
html.aspnet-demos .btn.btn-outlined:focus svg path,
html.aspnet-demos .btn.btn-outlined:active svg circle,
html.aspnet-demos .btn.btn-outlined:focus svg circle {
  fill: white;
}
html.aspnet-demos .btn.btn-outlined-text {
  color: #596c7d;
  border-color: #e7ebee;
  outline-color: #e7ebee;
  background-color: white;
}
html.aspnet-demos .btn.btn-outlined-text svg {
  fill: #596c7d;
}
html.aspnet-demos .btn.btn-outlined-text svg path,
html.aspnet-demos .btn.btn-outlined-text svg circle {
  fill: #596c7d;
}
html.aspnet-demos .btn.btn-outlined-text:hover {
  color: #596c7d;
  border-color: #e7ebee;
  outline-color: #e7ebee;
  background-color: #f3f5f6;
}
html.aspnet-demos .btn.btn-outlined-text:hover svg {
  fill: #596c7d;
}
html.aspnet-demos .btn.btn-outlined-text:hover svg path,
html.aspnet-demos .btn.btn-outlined-text:hover svg circle {
  fill: #596c7d;
}
html.aspnet-demos .btn.btn-outlined-text:active,
html.aspnet-demos .btn.btn-outlined-text:focus {
  color: #596c7d;
  border-color: #e7ebee;
  outline-color: #e7ebee;
  background-color: #edf0f2;
}
html.aspnet-demos .btn.btn-outlined-text:active svg,
html.aspnet-demos .btn.btn-outlined-text:focus svg {
  fill: #596c7d;
}
html.aspnet-demos .btn.btn-outlined-text:active svg path,
html.aspnet-demos .btn.btn-outlined-text:focus svg path,
html.aspnet-demos .btn.btn-outlined-text:active svg circle,
html.aspnet-demos .btn.btn-outlined-text:focus svg circle {
  fill: #596c7d;
}
html.aspnet-demos .btn.btn-blue-outline {
  background-color: white;
}
html.aspnet-demos .btn.btn-blue-outline:focus,
html.aspnet-demos .btn.btn-blue-outline:focus-visible {
  outline-color: #2190f7;
}
html.aspnet-demos .btn.btn-blue-outline:hover {
  background-color: rgba(28, 45, 54, 0.03);
}
html.aspnet-demos .btn.btn-blue-outline:active {
  background-color: rgba(28, 45, 54, 0.07);
}
html.aspnet-demos .btn.btn-orange {
  background-color: #ff9000;
}
html.aspnet-demos .btn.btn-orange:visited {
  color: white;
}
html.aspnet-demos .btn.btn-orange:hover {
  background-color: #f08700;
  color: white;
}
html.aspnet-demos .btn.btn-orange:visited:hover {
  color: white;
}
html.aspnet-demos .btn.btn-orange:active {
  background-color: #e07f00;
}
html.aspnet-demos .btn.btn-orange:focus-visible {
  outline-color: #cc7300;
}
html.aspnet-demos .btn.btn-orange svg,
html.aspnet-demos .btn.btn-orange path {
  fill: white;
}
html.aspnet-demos .btn.btn-text {
  color: #596c7d;
  border-color: white;
  outline-color: white;
  background-color: white;
}
html.aspnet-demos .btn.btn-text svg {
  fill: #596c7d;
}
html.aspnet-demos .btn.btn-text svg path,
html.aspnet-demos .btn.btn-text svg circle {
  fill: #596c7d;
}
html.aspnet-demos .btn.btn-text:hover {
  color: #596c7d;
  border-color: #f3f5f6;
  outline-color: #f3f5f6;
  background-color: #f3f5f6;
}
html.aspnet-demos .btn.btn-text:hover svg {
  fill: #596c7d;
}
html.aspnet-demos .btn.btn-text:hover svg path,
html.aspnet-demos .btn.btn-text:hover svg circle {
  fill: #596c7d;
}
html.aspnet-demos .btn.btn-text:active,
html.aspnet-demos .btn.btn-text:focus {
  color: #596c7d;
  border-color: #edf0f2;
  outline-color: #edf0f2;
  background-color: #edf0f2;
}
html.aspnet-demos .btn.btn-text:active svg,
html.aspnet-demos .btn.btn-text:focus svg {
  fill: #596c7d;
}
html.aspnet-demos .btn.btn-text:active svg path,
html.aspnet-demos .btn.btn-text:focus svg path,
html.aspnet-demos .btn.btn-text:active svg circle,
html.aspnet-demos .btn.btn-text:focus svg circle {
  fill: #596c7d;
}
html.aspnet-demos .btn.btn-text-accent {
  color: #512bd4;
  border-color: white;
  outline-color: white;
  background-color: white;
}
html.aspnet-demos .btn.btn-text-accent svg {
  fill: #512bd4;
}
html.aspnet-demos .btn.btn-text-accent svg path,
html.aspnet-demos .btn.btn-text-accent svg circle {
  fill: #512bd4;
}
html.aspnet-demos .btn.btn-text-accent:hover {
  color: #512bd4;
  border-color: #f3f5f6;
  outline-color: #f3f5f6;
  background-color: #f3f5f6;
}
html.aspnet-demos .btn.btn-text-accent:hover svg {
  fill: #512bd4;
}
html.aspnet-demos .btn.btn-text-accent:hover svg path,
html.aspnet-demos .btn.btn-text-accent:hover svg circle {
  fill: #512bd4;
}
html.aspnet-demos .btn.btn-text-accent:active,
html.aspnet-demos .btn.btn-text-accent:focus {
  color: #512bd4;
  border-color: #edf0f2;
  outline-color: #edf0f2;
  background-color: #edf0f2;
}
html.aspnet-demos .btn.btn-text-accent:active svg,
html.aspnet-demos .btn.btn-text-accent:focus svg {
  fill: #512bd4;
}
html.aspnet-demos .btn.btn-text-accent:active svg path,
html.aspnet-demos .btn.btn-text-accent:focus svg path,
html.aspnet-demos .btn.btn-text-accent:active svg circle,
html.aspnet-demos .btn.btn-text-accent:focus svg circle {
  fill: #512bd4;
}
html.aspnet-demos .btn.btn-text-outlined {
  color: white;
  border-color: white;
  outline-color: white;
  background-color: transparent;
}
html.aspnet-demos .btn.btn-text-outlined svg {
  fill: white;
}
html.aspnet-demos .btn.btn-text-outlined svg path,
html.aspnet-demos .btn.btn-text-outlined svg circle {
  fill: white;
}
html.aspnet-demos .btn.btn-text-outlined:hover {
  color: #512bd4;
  border-color: white;
  outline-color: white;
  background-color: white;
}
html.aspnet-demos .btn.btn-text-outlined:hover svg {
  fill: #512bd4;
}
html.aspnet-demos .btn.btn-text-outlined:hover svg path,
html.aspnet-demos .btn.btn-text-outlined:hover svg circle {
  fill: #512bd4;
}
html.aspnet-demos .btn.btn-text-outlined:active,
html.aspnet-demos .btn.btn-text-outlined:focus {
  color: #512bd4;
  border-color: #f3f5f6;
  outline-color: #f3f5f6;
  background-color: #f3f5f6;
}
html.aspnet-demos .btn.btn-text-outlined:active svg,
html.aspnet-demos .btn.btn-text-outlined:focus svg {
  fill: #512bd4;
}
html.aspnet-demos .btn.btn-text-outlined:active svg path,
html.aspnet-demos .btn.btn-text-outlined:focus svg path,
html.aspnet-demos .btn.btn-text-outlined:active svg circle,
html.aspnet-demos .btn.btn-text-outlined:focus svg circle {
  fill: #512bd4;
}
html.aspnet-demos .btn-read-more {
  color: #512bd4;
  background-color: white;
  border: none;
  outline: 1px solid #512bd4;
  display: flex;
  gap: 8px;
  font-family: Roboto;
  font-size: 16px;
  font-weight: 400;
  line-height: 20px;
  padding: 6px 16px 6px 8px;
  align-items: center;
  border-radius: 99px;
  cursor: pointer;
}
html.aspnet-demos .btn-read-more svg > path {
  fill: #512bd4;
}
html.aspnet-demos .btn-read-more .btn-read-more-text {
  background-image: linear-gradient(to right, #512bd4 4px, rgba(255, 255, 255, 0) 4px);
  background-position: bottom;
  background-size: 6px 1px;
  background-repeat: repeat-x;
  background-position-x: 1px;
}
html.aspnet-demos .btn-read-more:focus-visible {
  outline: 2px solid #512bd4;
}
html.aspnet-demos .btn-read-more:hover {
  background-color: rgba(81, 43, 212, 0.08);
}
html.aspnet-demos .btn-read-more:active {
  background-color: rgba(81, 43, 212, 0.12);
}
html.aspnet-demos .tbs {
  border-color: #e7ebee;
}
html.aspnet-demos .tbs-arrows,
html.aspnet-demos .tbs-arrow.btn {
  background-color: white;
  border: none;
}
html.aspnet-demos .tbs-item {
  color: #596c7d;
  background-color: white;
}
html.aspnet-demos .tbs-item:visited {
  color: #596c7d;
}
html.aspnet-demos .tbs-item-container:hover {
  background-color: #f3f5f6;
}
html.aspnet-demos .tbs-item-container:hover .tbs-item {
  background-color: #f3f5f6;
}
html.aspnet-demos .tbs-item-container.active .tbs-item {
  color: #512bd4;
}
html.aspnet-demos .tbs-item-container.active .tbs-item::after {
  background-color: #512bd4;
}
html.aspnet-demos .duo-card {
  background-color: #f3f5f6;
}
html.aspnet-demos .duo-card .wrapper-card:not(.active) svg path {
  fill: #596c7d;
}
html.aspnet-demos .duo-card .wrapper-card:not(.active) svg path.background {
  opacity: 0.5;
}
html.aspnet-demos .duo-card .wrapper-card:not(.active) svg path.letter {
  fill: #f3f5f6;
}
html.aspnet-demos .duo-card .wrapper-card.active input,
html.aspnet-demos .duo-card input.active {
  background-color: white;
}
html.aspnet-demos .duo-card input {
  color: #596c7d;
}
html.aspnet-demos .switch-toogle input:checked + .switch-slider {
  background-color: #512bd4;
}
html.aspnet-demos .switch-toogle input:checked + .switch-slider.disabled {
  background-color: #e7ebee;
}
html.aspnet-demos .switch-toogle input:checked + .switch-slider::before {
  background-color: white;
  box-shadow: 0px 1px 2px 0px rgba(0, 0, 0, 0.16);
}
html.aspnet-demos .switch-slider {
  background-color: white;
  border-color: #e7ebee;
}
html.aspnet-demos .switch-slider.disabled {
  background-color: #e7ebee;
}
html.aspnet-demos .switch-slider.disabled:before {
  background-color: white;
  box-shadow: 0px 1px 2px 0px rgba(0, 0, 0, 0.16);
}
html.aspnet-demos .switch-slider:before {
  background-color: #512bd4;
}
html.aspnet-demos .switch-label {
  color: #596c7d;
}
html.aspnet-demos .btn.btn-accent {
  color: white;
  border-color: #512bd4;
  outline-color: #512bd4;
  background-color: #512bd4;
}
html.aspnet-demos .btn.btn-accent svg {
  fill: white;
}
html.aspnet-demos .btn.btn-accent svg path,
html.aspnet-demos .btn.btn-accent svg circle {
  fill: white;
}
html.aspnet-demos .btn.btn-accent:hover {
  color: white;
  border-color: #4525b4;
  outline-color: #4525b4;
  background-color: #4525b4;
}
html.aspnet-demos .btn.btn-accent:hover svg {
  fill: white;
}
html.aspnet-demos .btn.btn-accent:hover svg path,
html.aspnet-demos .btn.btn-accent:hover svg circle {
  fill: white;
}
html.aspnet-demos .btn.btn-accent:active,
html.aspnet-demos .btn.btn-accent:focus {
  color: white;
  border-color: #391e94;
  outline-color: #391e94;
  background-color: #391e94;
}
html.aspnet-demos .btn.btn-accent:active svg,
html.aspnet-demos .btn.btn-accent:focus svg {
  fill: white;
}
html.aspnet-demos .btn.btn-accent:active svg path,
html.aspnet-demos .btn.btn-accent:focus svg path,
html.aspnet-demos .btn.btn-accent:active svg circle,
html.aspnet-demos .btn.btn-accent:focus svg circle {
  fill: white;
}
html.aspnet-demos .btn.btn-outlined {
  color: #512bd4;
  border-color: #512bd4;
  outline-color: #512bd4;
  background-color: transparent;
}
html.aspnet-demos .btn.btn-outlined svg {
  fill: #512bd4;
}
html.aspnet-demos .btn.btn-outlined svg path,
html.aspnet-demos .btn.btn-outlined svg circle {
  fill: #512bd4;
}
html.aspnet-demos .btn.btn-outlined:hover {
  color: white;
  border-color: #4525b4;
  outline-color: #4525b4;
  background-color: #4525b4;
}
html.aspnet-demos .btn.btn-outlined:hover svg {
  fill: white;
}
html.aspnet-demos .btn.btn-outlined:hover svg path,
html.aspnet-demos .btn.btn-outlined:hover svg circle {
  fill: white;
}
html.aspnet-demos .btn.btn-outlined:active,
html.aspnet-demos .btn.btn-outlined:focus {
  color: white;
  border-color: #391e94;
  outline-color: #391e94;
  background-color: #391e94;
}
html.aspnet-demos .btn.btn-outlined:active svg,
html.aspnet-demos .btn.btn-outlined:focus svg {
  fill: white;
}
html.aspnet-demos .btn.btn-outlined:active svg path,
html.aspnet-demos .btn.btn-outlined:focus svg path,
html.aspnet-demos .btn.btn-outlined:active svg circle,
html.aspnet-demos .btn.btn-outlined:focus svg circle {
  fill: white;
}
html.aspnet-demos .btn.btn-outlined-text {
  color: #596c7d;
  border-color: #e7ebee;
  outline-color: #e7ebee;
  background-color: white;
}
html.aspnet-demos .btn.btn-outlined-text svg {
  fill: #596c7d;
}
html.aspnet-demos .btn.btn-outlined-text svg path,
html.aspnet-demos .btn.btn-outlined-text svg circle {
  fill: #596c7d;
}
html.aspnet-demos .btn.btn-outlined-text:hover {
  color: #596c7d;
  border-color: #e7ebee;
  outline-color: #e7ebee;
  background-color: #f3f5f6;
}
html.aspnet-demos .btn.btn-outlined-text:hover svg {
  fill: #596c7d;
}
html.aspnet-demos .btn.btn-outlined-text:hover svg path,
html.aspnet-demos .btn.btn-outlined-text:hover svg circle {
  fill: #596c7d;
}
html.aspnet-demos .btn.btn-outlined-text:active,
html.aspnet-demos .btn.btn-outlined-text:focus {
  color: #596c7d;
  border-color: #e7ebee;
  outline-color: #e7ebee;
  background-color: #edf0f2;
}
html.aspnet-demos .btn.btn-outlined-text:active svg,
html.aspnet-demos .btn.btn-outlined-text:focus svg {
  fill: #596c7d;
}
html.aspnet-demos .btn.btn-outlined-text:active svg path,
html.aspnet-demos .btn.btn-outlined-text:focus svg path,
html.aspnet-demos .btn.btn-outlined-text:active svg circle,
html.aspnet-demos .btn.btn-outlined-text:focus svg circle {
  fill: #596c7d;
}
html.aspnet-demos .btn.btn-blue-outline {
  background-color: white;
}
html.aspnet-demos .btn.btn-blue-outline:focus,
html.aspnet-demos .btn.btn-blue-outline:focus-visible {
  outline-color: #2190f7;
}
html.aspnet-demos .btn.btn-blue-outline:hover {
  background-color: rgba(28, 45, 54, 0.03);
}
html.aspnet-demos .btn.btn-blue-outline:active {
  background-color: rgba(28, 45, 54, 0.07);
}
html.aspnet-demos .btn.btn-orange {
  background-color: #ff9000;
}
html.aspnet-demos .btn.btn-orange:visited {
  color: white;
}
html.aspnet-demos .btn.btn-orange:hover {
  background-color: #f08700;
  color: white;
}
html.aspnet-demos .btn.btn-orange:visited:hover {
  color: white;
}
html.aspnet-demos .btn.btn-orange:active {
  background-color: #e07f00;
}
html.aspnet-demos .btn.btn-orange:focus-visible {
  outline-color: #cc7300;
}
html.aspnet-demos .btn.btn-orange svg,
html.aspnet-demos .btn.btn-orange path {
  fill: white;
}
html.aspnet-demos .btn.btn-text {
  color: #596c7d;
  border-color: white;
  outline-color: white;
  background-color: white;
}
html.aspnet-demos .btn.btn-text svg {
  fill: #596c7d;
}
html.aspnet-demos .btn.btn-text svg path,
html.aspnet-demos .btn.btn-text svg circle {
  fill: #596c7d;
}
html.aspnet-demos .btn.btn-text:hover {
  color: #596c7d;
  border-color: #f3f5f6;
  outline-color: #f3f5f6;
  background-color: #f3f5f6;
}
html.aspnet-demos .btn.btn-text:hover svg {
  fill: #596c7d;
}
html.aspnet-demos .btn.btn-text:hover svg path,
html.aspnet-demos .btn.btn-text:hover svg circle {
  fill: #596c7d;
}
html.aspnet-demos .btn.btn-text:active,
html.aspnet-demos .btn.btn-text:focus {
  color: #596c7d;
  border-color: #edf0f2;
  outline-color: #edf0f2;
  background-color: #edf0f2;
}
html.aspnet-demos .btn.btn-text:active svg,
html.aspnet-demos .btn.btn-text:focus svg {
  fill: #596c7d;
}
html.aspnet-demos .btn.btn-text:active svg path,
html.aspnet-demos .btn.btn-text:focus svg path,
html.aspnet-demos .btn.btn-text:active svg circle,
html.aspnet-demos .btn.btn-text:focus svg circle {
  fill: #596c7d;
}
html.aspnet-demos .btn.btn-text-accent {
  color: #512bd4;
  border-color: white;
  outline-color: white;
  background-color: white;
}
html.aspnet-demos .btn.btn-text-accent svg {
  fill: #512bd4;
}
html.aspnet-demos .btn.btn-text-accent svg path,
html.aspnet-demos .btn.btn-text-accent svg circle {
  fill: #512bd4;
}
html.aspnet-demos .btn.btn-text-accent:hover {
  color: #512bd4;
  border-color: #f3f5f6;
  outline-color: #f3f5f6;
  background-color: #f3f5f6;
}
html.aspnet-demos .btn.btn-text-accent:hover svg {
  fill: #512bd4;
}
html.aspnet-demos .btn.btn-text-accent:hover svg path,
html.aspnet-demos .btn.btn-text-accent:hover svg circle {
  fill: #512bd4;
}
html.aspnet-demos .btn.btn-text-accent:active,
html.aspnet-demos .btn.btn-text-accent:focus {
  color: #512bd4;
  border-color: #edf0f2;
  outline-color: #edf0f2;
  background-color: #edf0f2;
}
html.aspnet-demos .btn.btn-text-accent:active svg,
html.aspnet-demos .btn.btn-text-accent:focus svg {
  fill: #512bd4;
}
html.aspnet-demos .btn.btn-text-accent:active svg path,
html.aspnet-demos .btn.btn-text-accent:focus svg path,
html.aspnet-demos .btn.btn-text-accent:active svg circle,
html.aspnet-demos .btn.btn-text-accent:focus svg circle {
  fill: #512bd4;
}
html.aspnet-demos .btn.btn-text-outlined {
  color: white;
  border-color: white;
  outline-color: white;
  background-color: transparent;
}
html.aspnet-demos .btn.btn-text-outlined svg {
  fill: white;
}
html.aspnet-demos .btn.btn-text-outlined svg path,
html.aspnet-demos .btn.btn-text-outlined svg circle {
  fill: white;
}
html.aspnet-demos .btn.btn-text-outlined:hover {
  color: #512bd4;
  border-color: white;
  outline-color: white;
  background-color: white;
}
html.aspnet-demos .btn.btn-text-outlined:hover svg {
  fill: #512bd4;
}
html.aspnet-demos .btn.btn-text-outlined:hover svg path,
html.aspnet-demos .btn.btn-text-outlined:hover svg circle {
  fill: #512bd4;
}
html.aspnet-demos .btn.btn-text-outlined:active,
html.aspnet-demos .btn.btn-text-outlined:focus {
  color: #512bd4;
  border-color: #f3f5f6;
  outline-color: #f3f5f6;
  background-color: #f3f5f6;
}
html.aspnet-demos .btn.btn-text-outlined:active svg,
html.aspnet-demos .btn.btn-text-outlined:focus svg {
  fill: #512bd4;
}
html.aspnet-demos .btn.btn-text-outlined:active svg path,
html.aspnet-demos .btn.btn-text-outlined:focus svg path,
html.aspnet-demos .btn.btn-text-outlined:active svg circle,
html.aspnet-demos .btn.btn-text-outlined:focus svg circle {
  fill: #512bd4;
}
html.aspnet-demos .btn-read-more {
  color: #512bd4;
  background-color: white;
  border: none;
  outline: 1px solid #512bd4;
  display: flex;
  gap: 8px;
  font-family: Roboto;
  font-size: 16px;
  font-weight: 400;
  line-height: 20px;
  padding: 6px 16px 6px 8px;
  align-items: center;
  border-radius: 99px;
  cursor: pointer;
}
html.aspnet-demos .btn-read-more svg > path {
  fill: #512bd4;
}
html.aspnet-demos .btn-read-more .btn-read-more-text {
  background-image: linear-gradient(to right, #512bd4 4px, rgba(255, 255, 255, 0) 4px);
  background-position: bottom;
  background-size: 6px 1px;
  background-repeat: repeat-x;
  background-position-x: 1px;
}
html.aspnet-demos .btn-read-more:focus-visible {
  outline: 2px solid #512bd4;
}
html.aspnet-demos .btn-read-more:hover {
  background-color: rgba(81, 43, 212, 0.08);
}
html.aspnet-demos .btn-read-more:active {
  background-color: rgba(81, 43, 212, 0.12);
}
html.aspnet-demos .tbs {
  border-color: #e7ebee;
}
html.aspnet-demos .tbs-arrows,
html.aspnet-demos .tbs-arrow.btn {
  background-color: white;
  border: none;
}
html.aspnet-demos .tbs-item {
  color: #596c7d;
  background-color: white;
}
html.aspnet-demos .tbs-item:visited {
  color: #596c7d;
}
html.aspnet-demos .tbs-item-container:hover {
  background-color: #f3f5f6;
}
html.aspnet-demos .tbs-item-container:hover .tbs-item {
  background-color: #f3f5f6;
}
html.aspnet-demos .tbs-item-container.active .tbs-item {
  color: #512bd4;
}
html.aspnet-demos .tbs-item-container.active .tbs-item::after {
  background-color: #512bd4;
}
html.aspnet-demos .duo-card {
  background-color: #f3f5f6;
}
html.aspnet-demos .duo-card .wrapper-card:not(.active) svg path {
  fill: #596c7d;
}
html.aspnet-demos .duo-card .wrapper-card:not(.active) svg path.background {
  opacity: 0.5;
}
html.aspnet-demos .duo-card .wrapper-card:not(.active) svg path.letter {
  fill: #f3f5f6;
}
html.aspnet-demos .duo-card .wrapper-card.active input,
html.aspnet-demos .duo-card input.active {
  background-color: white;
}
html.aspnet-demos .duo-card input {
  color: #596c7d;
}
html.aspnet-demos .switch-toogle input:checked + .switch-slider {
  background-color: #512bd4;
}
html.aspnet-demos .switch-toogle input:checked + .switch-slider.disabled {
  background-color: #e7ebee;
}
html.aspnet-demos .switch-toogle input:checked + .switch-slider::before {
  background-color: white;
  box-shadow: 0px 1px 2px 0px rgba(0, 0, 0, 0.16);
}
html.aspnet-demos .switch-slider {
  background-color: white;
  border-color: #e7ebee;
}
html.aspnet-demos .switch-slider.disabled {
  background-color: #e7ebee;
}
html.aspnet-demos .switch-slider.disabled:before {
  background-color: white;
  box-shadow: 0px 1px 2px 0px rgba(0, 0, 0, 0.16);
}
html.aspnet-demos .switch-slider:before {
  background-color: #512bd4;
}
html.aspnet-demos .switch-label {
  color: #596c7d;
}
html.aspnet-demos .btn.btn-accent {
  color: white;
  border-color: #512bd4;
  outline-color: #512bd4;
  background-color: #512bd4;
}
html.aspnet-demos .btn.btn-accent svg {
  fill: white;
}
html.aspnet-demos .btn.btn-accent svg path,
html.aspnet-demos .btn.btn-accent svg circle {
  fill: white;
}
html.aspnet-demos .btn.btn-accent:hover {
  color: white;
  border-color: #4525b4;
  outline-color: #4525b4;
  background-color: #4525b4;
}
html.aspnet-demos .btn.btn-accent:hover svg {
  fill: white;
}
html.aspnet-demos .btn.btn-accent:hover svg path,
html.aspnet-demos .btn.btn-accent:hover svg circle {
  fill: white;
}
html.aspnet-demos .btn.btn-accent:active,
html.aspnet-demos .btn.btn-accent:focus {
  color: white;
  border-color: #391e94;
  outline-color: #391e94;
  background-color: #391e94;
}
html.aspnet-demos .btn.btn-accent:active svg,
html.aspnet-demos .btn.btn-accent:focus svg {
  fill: white;
}
html.aspnet-demos .btn.btn-accent:active svg path,
html.aspnet-demos .btn.btn-accent:focus svg path,
html.aspnet-demos .btn.btn-accent:active svg circle,
html.aspnet-demos .btn.btn-accent:focus svg circle {
  fill: white;
}
html.aspnet-demos .btn.btn-outlined {
  color: #512bd4;
  border-color: #512bd4;
  outline-color: #512bd4;
  background-color: transparent;
}
html.aspnet-demos .btn.btn-outlined svg {
  fill: #512bd4;
}
html.aspnet-demos .btn.btn-outlined svg path,
html.aspnet-demos .btn.btn-outlined svg circle {
  fill: #512bd4;
}
html.aspnet-demos .btn.btn-outlined:hover {
  color: white;
  border-color: #4525b4;
  outline-color: #4525b4;
  background-color: #4525b4;
}
html.aspnet-demos .btn.btn-outlined:hover svg {
  fill: white;
}
html.aspnet-demos .btn.btn-outlined:hover svg path,
html.aspnet-demos .btn.btn-outlined:hover svg circle {
  fill: white;
}
html.aspnet-demos .btn.btn-outlined:active,
html.aspnet-demos .btn.btn-outlined:focus {
  color: white;
  border-color: #391e94;
  outline-color: #391e94;
  background-color: #391e94;
}
html.aspnet-demos .btn.btn-outlined:active svg,
html.aspnet-demos .btn.btn-outlined:focus svg {
  fill: white;
}
html.aspnet-demos .btn.btn-outlined:active svg path,
html.aspnet-demos .btn.btn-outlined:focus svg path,
html.aspnet-demos .btn.btn-outlined:active svg circle,
html.aspnet-demos .btn.btn-outlined:focus svg circle {
  fill: white;
}
html.aspnet-demos .btn.btn-outlined-text {
  color: #596c7d;
  border-color: #e7ebee;
  outline-color: #e7ebee;
  background-color: white;
}
html.aspnet-demos .btn.btn-outlined-text svg {
  fill: #596c7d;
}
html.aspnet-demos .btn.btn-outlined-text svg path,
html.aspnet-demos .btn.btn-outlined-text svg circle {
  fill: #596c7d;
}
html.aspnet-demos .btn.btn-outlined-text:hover {
  color: #596c7d;
  border-color: #e7ebee;
  outline-color: #e7ebee;
  background-color: #f3f5f6;
}
html.aspnet-demos .btn.btn-outlined-text:hover svg {
  fill: #596c7d;
}
html.aspnet-demos .btn.btn-outlined-text:hover svg path,
html.aspnet-demos .btn.btn-outlined-text:hover svg circle {
  fill: #596c7d;
}
html.aspnet-demos .btn.btn-outlined-text:active,
html.aspnet-demos .btn.btn-outlined-text:focus {
  color: #596c7d;
  border-color: #e7ebee;
  outline-color: #e7ebee;
  background-color: #edf0f2;
}
html.aspnet-demos .btn.btn-outlined-text:active svg,
html.aspnet-demos .btn.btn-outlined-text:focus svg {
  fill: #596c7d;
}
html.aspnet-demos .btn.btn-outlined-text:active svg path,
html.aspnet-demos .btn.btn-outlined-text:focus svg path,
html.aspnet-demos .btn.btn-outlined-text:active svg circle,
html.aspnet-demos .btn.btn-outlined-text:focus svg circle {
  fill: #596c7d;
}
html.aspnet-demos .btn.btn-blue-outline {
  background-color: white;
}
html.aspnet-demos .btn.btn-blue-outline:focus,
html.aspnet-demos .btn.btn-blue-outline:focus-visible {
  outline-color: #2190f7;
}
html.aspnet-demos .btn.btn-blue-outline:hover {
  background-color: rgba(28, 45, 54, 0.03);
}
html.aspnet-demos .btn.btn-blue-outline:active {
  background-color: rgba(28, 45, 54, 0.07);
}
html.aspnet-demos .btn.btn-orange {
  background-color: #ff9000;
}
html.aspnet-demos .btn.btn-orange:visited {
  color: white;
}
html.aspnet-demos .btn.btn-orange:hover {
  background-color: #f08700;
  color: white;
}
html.aspnet-demos .btn.btn-orange:visited:hover {
  color: white;
}
html.aspnet-demos .btn.btn-orange:active {
  background-color: #e07f00;
}
html.aspnet-demos .btn.btn-orange:focus-visible {
  outline-color: #cc7300;
}
html.aspnet-demos .btn.btn-orange svg,
html.aspnet-demos .btn.btn-orange path {
  fill: white;
}
html.aspnet-demos .btn.btn-text {
  color: #596c7d;
  border-color: white;
  outline-color: white;
  background-color: white;
}
html.aspnet-demos .btn.btn-text svg {
  fill: #596c7d;
}
html.aspnet-demos .btn.btn-text svg path,
html.aspnet-demos .btn.btn-text svg circle {
  fill: #596c7d;
}
html.aspnet-demos .btn.btn-text:hover {
  color: #596c7d;
  border-color: #f3f5f6;
  outline-color: #f3f5f6;
  background-color: #f3f5f6;
}
html.aspnet-demos .btn.btn-text:hover svg {
  fill: #596c7d;
}
html.aspnet-demos .btn.btn-text:hover svg path,
html.aspnet-demos .btn.btn-text:hover svg circle {
  fill: #596c7d;
}
html.aspnet-demos .btn.btn-text:active,
html.aspnet-demos .btn.btn-text:focus {
  color: #596c7d;
  border-color: #edf0f2;
  outline-color: #edf0f2;
  background-color: #edf0f2;
}
html.aspnet-demos .btn.btn-text:active svg,
html.aspnet-demos .btn.btn-text:focus svg {
  fill: #596c7d;
}
html.aspnet-demos .btn.btn-text:active svg path,
html.aspnet-demos .btn.btn-text:focus svg path,
html.aspnet-demos .btn.btn-text:active svg circle,
html.aspnet-demos .btn.btn-text:focus svg circle {
  fill: #596c7d;
}
html.aspnet-demos .btn.btn-text-accent {
  color: #512bd4;
  border-color: white;
  outline-color: white;
  background-color: white;
}
html.aspnet-demos .btn.btn-text-accent svg {
  fill: #512bd4;
}
html.aspnet-demos .btn.btn-text-accent svg path,
html.aspnet-demos .btn.btn-text-accent svg circle {
  fill: #512bd4;
}
html.aspnet-demos .btn.btn-text-accent:hover {
  color: #512bd4;
  border-color: #f3f5f6;
  outline-color: #f3f5f6;
  background-color: #f3f5f6;
}
html.aspnet-demos .btn.btn-text-accent:hover svg {
  fill: #512bd4;
}
html.aspnet-demos .btn.btn-text-accent:hover svg path,
html.aspnet-demos .btn.btn-text-accent:hover svg circle {
  fill: #512bd4;
}
html.aspnet-demos .btn.btn-text-accent:active,
html.aspnet-demos .btn.btn-text-accent:focus {
  color: #512bd4;
  border-color: #edf0f2;
  outline-color: #edf0f2;
  background-color: #edf0f2;
}
html.aspnet-demos .btn.btn-text-accent:active svg,
html.aspnet-demos .btn.btn-text-accent:focus svg {
  fill: #512bd4;
}
html.aspnet-demos .btn.btn-text-accent:active svg path,
html.aspnet-demos .btn.btn-text-accent:focus svg path,
html.aspnet-demos .btn.btn-text-accent:active svg circle,
html.aspnet-demos .btn.btn-text-accent:focus svg circle {
  fill: #512bd4;
}
html.aspnet-demos .btn.btn-text-outlined {
  color: white;
  border-color: white;
  outline-color: white;
  background-color: transparent;
}
html.aspnet-demos .btn.btn-text-outlined svg {
  fill: white;
}
html.aspnet-demos .btn.btn-text-outlined svg path,
html.aspnet-demos .btn.btn-text-outlined svg circle {
  fill: white;
}
html.aspnet-demos .btn.btn-text-outlined:hover {
  color: #512bd4;
  border-color: white;
  outline-color: white;
  background-color: white;
}
html.aspnet-demos .btn.btn-text-outlined:hover svg {
  fill: #512bd4;
}
html.aspnet-demos .btn.btn-text-outlined:hover svg path,
html.aspnet-demos .btn.btn-text-outlined:hover svg circle {
  fill: #512bd4;
}
html.aspnet-demos .btn.btn-text-outlined:active,
html.aspnet-demos .btn.btn-text-outlined:focus {
  color: #512bd4;
  border-color: #f3f5f6;
  outline-color: #f3f5f6;
  background-color: #f3f5f6;
}
html.aspnet-demos .btn.btn-text-outlined:active svg,
html.aspnet-demos .btn.btn-text-outlined:focus svg {
  fill: #512bd4;
}
html.aspnet-demos .btn.btn-text-outlined:active svg path,
html.aspnet-demos .btn.btn-text-outlined:focus svg path,
html.aspnet-demos .btn.btn-text-outlined:active svg circle,
html.aspnet-demos .btn.btn-text-outlined:focus svg circle {
  fill: #512bd4;
}
html.aspnet-demos .btn-read-more {
  color: #512bd4;
  background-color: white;
  border: none;
  outline: 1px solid #512bd4;
  display: flex;
  gap: 8px;
  font-family: Roboto;
  font-size: 16px;
  font-weight: 400;
  line-height: 20px;
  padding: 6px 16px 6px 8px;
  align-items: center;
  border-radius: 99px;
  cursor: pointer;
}
html.aspnet-demos .btn-read-more svg > path {
  fill: #512bd4;
}
html.aspnet-demos .btn-read-more .btn-read-more-text {
  background-image: linear-gradient(to right, #512bd4 4px, rgba(255, 255, 255, 0) 4px);
  background-position: bottom;
  background-size: 6px 1px;
  background-repeat: repeat-x;
  background-position-x: 1px;
}
html.aspnet-demos .btn-read-more:focus-visible {
  outline: 2px solid #512bd4;
}
html.aspnet-demos .btn-read-more:hover {
  background-color: rgba(81, 43, 212, 0.08);
}
html.aspnet-demos .btn-read-more:active {
  background-color: rgba(81, 43, 212, 0.12);
}
html.aspnet-demos .tbs {
  border-color: #e7ebee;
}
html.aspnet-demos .tbs-arrows,
html.aspnet-demos .tbs-arrow.btn {
  background-color: white;
  border: none;
}
html.aspnet-demos .tbs-item {
  color: #596c7d;
  background-color: white;
}
html.aspnet-demos .tbs-item:visited {
  color: #596c7d;
}
html.aspnet-demos .tbs-item-container:hover {
  background-color: #f3f5f6;
}
html.aspnet-demos .tbs-item-container:hover .tbs-item {
  background-color: #f3f5f6;
}
html.aspnet-demos .tbs-item-container.active .tbs-item {
  color: #512bd4;
}
html.aspnet-demos .tbs-item-container.active .tbs-item::after {
  background-color: #512bd4;
}
html.aspnet-demos .duo-card {
  background-color: #f3f5f6;
}
html.aspnet-demos .duo-card .wrapper-card:not(.active) svg path {
  fill: #596c7d;
}
html.aspnet-demos .duo-card .wrapper-card:not(.active) svg path.background {
  opacity: 0.5;
}
html.aspnet-demos .duo-card .wrapper-card:not(.active) svg path.letter {
  fill: #f3f5f6;
}
html.aspnet-demos .duo-card .wrapper-card.active input,
html.aspnet-demos .duo-card input.active {
  background-color: white;
}
html.aspnet-demos .duo-card input {
  color: #596c7d;
}
html.aspnet-demos .switch-toogle input:checked + .switch-slider {
  background-color: #512bd4;
}
html.aspnet-demos .switch-toogle input:checked + .switch-slider.disabled {
  background-color: #e7ebee;
}
html.aspnet-demos .switch-toogle input:checked + .switch-slider::before {
  background-color: white;
  box-shadow: 0px 1px 2px 0px rgba(0, 0, 0, 0.16);
}
html.aspnet-demos .switch-slider {
  background-color: white;
  border-color: #e7ebee;
}
html.aspnet-demos .switch-slider.disabled {
  background-color: #e7ebee;
}
html.aspnet-demos .switch-slider.disabled:before {
  background-color: white;
  box-shadow: 0px 1px 2px 0px rgba(0, 0, 0, 0.16);
}
html.aspnet-demos .switch-slider:before {
  background-color: #512bd4;
}
html.aspnet-demos .switch-label {
  color: #596c7d;
}
html.aspnet-demos .btn.btn-accent {
  color: white;
  border-color: #512bd4;
  outline-color: #512bd4;
  background-color: #512bd4;
}
html.aspnet-demos .btn.btn-accent svg {
  fill: white;
}
html.aspnet-demos .btn.btn-accent svg path,
html.aspnet-demos .btn.btn-accent svg circle {
  fill: white;
}
html.aspnet-demos .btn.btn-accent:hover {
  color: white;
  border-color: #4525b4;
  outline-color: #4525b4;
  background-color: #4525b4;
}
html.aspnet-demos .btn.btn-accent:hover svg {
  fill: white;
}
html.aspnet-demos .btn.btn-accent:hover svg path,
html.aspnet-demos .btn.btn-accent:hover svg circle {
  fill: white;
}
html.aspnet-demos .btn.btn-accent:active,
html.aspnet-demos .btn.btn-accent:focus {
  color: white;
  border-color: #391e94;
  outline-color: #391e94;
  background-color: #391e94;
}
html.aspnet-demos .btn.btn-accent:active svg,
html.aspnet-demos .btn.btn-accent:focus svg {
  fill: white;
}
html.aspnet-demos .btn.btn-accent:active svg path,
html.aspnet-demos .btn.btn-accent:focus svg path,
html.aspnet-demos .btn.btn-accent:active svg circle,
html.aspnet-demos .btn.btn-accent:focus svg circle {
  fill: white;
}
html.aspnet-demos .btn.btn-outlined {
  color: #512bd4;
  border-color: #512bd4;
  outline-color: #512bd4;
  background-color: transparent;
}
html.aspnet-demos .btn.btn-outlined svg {
  fill: #512bd4;
}
html.aspnet-demos .btn.btn-outlined svg path,
html.aspnet-demos .btn.btn-outlined svg circle {
  fill: #512bd4;
}
html.aspnet-demos .btn.btn-outlined:hover {
  color: white;
  border-color: #4525b4;
  outline-color: #4525b4;
  background-color: #4525b4;
}
html.aspnet-demos .btn.btn-outlined:hover svg {
  fill: white;
}
html.aspnet-demos .btn.btn-outlined:hover svg path,
html.aspnet-demos .btn.btn-outlined:hover svg circle {
  fill: white;
}
html.aspnet-demos .btn.btn-outlined:active,
html.aspnet-demos .btn.btn-outlined:focus {
  color: white;
  border-color: #391e94;
  outline-color: #391e94;
  background-color: #391e94;
}
html.aspnet-demos .btn.btn-outlined:active svg,
html.aspnet-demos .btn.btn-outlined:focus svg {
  fill: white;
}
html.aspnet-demos .btn.btn-outlined:active svg path,
html.aspnet-demos .btn.btn-outlined:focus svg path,
html.aspnet-demos .btn.btn-outlined:active svg circle,
html.aspnet-demos .btn.btn-outlined:focus svg circle {
  fill: white;
}
html.aspnet-demos .btn.btn-outlined-text {
  color: #596c7d;
  border-color: #e7ebee;
  outline-color: #e7ebee;
  background-color: white;
}
html.aspnet-demos .btn.btn-outlined-text svg {
  fill: #596c7d;
}
html.aspnet-demos .btn.btn-outlined-text svg path,
html.aspnet-demos .btn.btn-outlined-text svg circle {
  fill: #596c7d;
}
html.aspnet-demos .btn.btn-outlined-text:hover {
  color: #596c7d;
  border-color: #e7ebee;
  outline-color: #e7ebee;
  background-color: #f3f5f6;
}
html.aspnet-demos .btn.btn-outlined-text:hover svg {
  fill: #596c7d;
}
html.aspnet-demos .btn.btn-outlined-text:hover svg path,
html.aspnet-demos .btn.btn-outlined-text:hover svg circle {
  fill: #596c7d;
}
html.aspnet-demos .btn.btn-outlined-text:active,
html.aspnet-demos .btn.btn-outlined-text:focus {
  color: #596c7d;
  border-color: #e7ebee;
  outline-color: #e7ebee;
  background-color: #edf0f2;
}
html.aspnet-demos .btn.btn-outlined-text:active svg,
html.aspnet-demos .btn.btn-outlined-text:focus svg {
  fill: #596c7d;
}
html.aspnet-demos .btn.btn-outlined-text:active svg path,
html.aspnet-demos .btn.btn-outlined-text:focus svg path,
html.aspnet-demos .btn.btn-outlined-text:active svg circle,
html.aspnet-demos .btn.btn-outlined-text:focus svg circle {
  fill: #596c7d;
}
html.aspnet-demos .btn.btn-blue-outline {
  background-color: white;
}
html.aspnet-demos .btn.btn-blue-outline:focus,
html.aspnet-demos .btn.btn-blue-outline:focus-visible {
  outline-color: #2190f7;
}
html.aspnet-demos .btn.btn-blue-outline:hover {
  background-color: rgba(28, 45, 54, 0.03);
}
html.aspnet-demos .btn.btn-blue-outline:active {
  background-color: rgba(28, 45, 54, 0.07);
}
html.aspnet-demos .btn.btn-orange {
  background-color: #ff9000;
}
html.aspnet-demos .btn.btn-orange:visited {
  color: white;
}
html.aspnet-demos .btn.btn-orange:hover {
  background-color: #f08700;
  color: white;
}
html.aspnet-demos .btn.btn-orange:visited:hover {
  color: white;
}
html.aspnet-demos .btn.btn-orange:active {
  background-color: #e07f00;
}
html.aspnet-demos .btn.btn-orange:focus-visible {
  outline-color: #cc7300;
}
html.aspnet-demos .btn.btn-orange svg,
html.aspnet-demos .btn.btn-orange path {
  fill: white;
}
html.aspnet-demos .btn.btn-text {
  color: #596c7d;
  border-color: white;
  outline-color: white;
  background-color: white;
}
html.aspnet-demos .btn.btn-text svg {
  fill: #596c7d;
}
html.aspnet-demos .btn.btn-text svg path,
html.aspnet-demos .btn.btn-text svg circle {
  fill: #596c7d;
}
html.aspnet-demos .btn.btn-text:hover {
  color: #596c7d;
  border-color: #f3f5f6;
  outline-color: #f3f5f6;
  background-color: #f3f5f6;
}
html.aspnet-demos .btn.btn-text:hover svg {
  fill: #596c7d;
}
html.aspnet-demos .btn.btn-text:hover svg path,
html.aspnet-demos .btn.btn-text:hover svg circle {
  fill: #596c7d;
}
html.aspnet-demos .btn.btn-text:active,
html.aspnet-demos .btn.btn-text:focus {
  color: #596c7d;
  border-color: #edf0f2;
  outline-color: #edf0f2;
  background-color: #edf0f2;
}
html.aspnet-demos .btn.btn-text:active svg,
html.aspnet-demos .btn.btn-text:focus svg {
  fill: #596c7d;
}
html.aspnet-demos .btn.btn-text:active svg path,
html.aspnet-demos .btn.btn-text:focus svg path,
html.aspnet-demos .btn.btn-text:active svg circle,
html.aspnet-demos .btn.btn-text:focus svg circle {
  fill: #596c7d;
}
html.aspnet-demos .btn.btn-text-accent {
  color: #512bd4;
  border-color: white;
  outline-color: white;
  background-color: white;
}
html.aspnet-demos .btn.btn-text-accent svg {
  fill: #512bd4;
}
html.aspnet-demos .btn.btn-text-accent svg path,
html.aspnet-demos .btn.btn-text-accent svg circle {
  fill: #512bd4;
}
html.aspnet-demos .btn.btn-text-accent:hover {
  color: #512bd4;
  border-color: #f3f5f6;
  outline-color: #f3f5f6;
  background-color: #f3f5f6;
}
html.aspnet-demos .btn.btn-text-accent:hover svg {
  fill: #512bd4;
}
html.aspnet-demos .btn.btn-text-accent:hover svg path,
html.aspnet-demos .btn.btn-text-accent:hover svg circle {
  fill: #512bd4;
}
html.aspnet-demos .btn.btn-text-accent:active,
html.aspnet-demos .btn.btn-text-accent:focus {
  color: #512bd4;
  border-color: #edf0f2;
  outline-color: #edf0f2;
  background-color: #edf0f2;
}
html.aspnet-demos .btn.btn-text-accent:active svg,
html.aspnet-demos .btn.btn-text-accent:focus svg {
  fill: #512bd4;
}
html.aspnet-demos .btn.btn-text-accent:active svg path,
html.aspnet-demos .btn.btn-text-accent:focus svg path,
html.aspnet-demos .btn.btn-text-accent:active svg circle,
html.aspnet-demos .btn.btn-text-accent:focus svg circle {
  fill: #512bd4;
}
html.aspnet-demos .btn.btn-text-outlined {
  color: white;
  border-color: white;
  outline-color: white;
  background-color: transparent;
}
html.aspnet-demos .btn.btn-text-outlined svg {
  fill: white;
}
html.aspnet-demos .btn.btn-text-outlined svg path,
html.aspnet-demos .btn.btn-text-outlined svg circle {
  fill: white;
}
html.aspnet-demos .btn.btn-text-outlined:hover {
  color: #512bd4;
  border-color: white;
  outline-color: white;
  background-color: white;
}
html.aspnet-demos .btn.btn-text-outlined:hover svg {
  fill: #512bd4;
}
html.aspnet-demos .btn.btn-text-outlined:hover svg path,
html.aspnet-demos .btn.btn-text-outlined:hover svg circle {
  fill: #512bd4;
}
html.aspnet-demos .btn.btn-text-outlined:active,
html.aspnet-demos .btn.btn-text-outlined:focus {
  color: #512bd4;
  border-color: #f3f5f6;
  outline-color: #f3f5f6;
  background-color: #f3f5f6;
}
html.aspnet-demos .btn.btn-text-outlined:active svg,
html.aspnet-demos .btn.btn-text-outlined:focus svg {
  fill: #512bd4;
}
html.aspnet-demos .btn.btn-text-outlined:active svg path,
html.aspnet-demos .btn.btn-text-outlined:focus svg path,
html.aspnet-demos .btn.btn-text-outlined:active svg circle,
html.aspnet-demos .btn.btn-text-outlined:focus svg circle {
  fill: #512bd4;
}
html.aspnet-demos .btn-read-more {
  color: #512bd4;
  background-color: white;
  border: none;
  outline: 1px solid #512bd4;
  display: flex;
  gap: 8px;
  font-family: Roboto;
  font-size: 16px;
  font-weight: 400;
  line-height: 20px;
  padding: 6px 16px 6px 8px;
  align-items: center;
  border-radius: 99px;
  cursor: pointer;
}
html.aspnet-demos .btn-read-more svg > path {
  fill: #512bd4;
}
html.aspnet-demos .btn-read-more .btn-read-more-text {
  background-image: linear-gradient(to right, #512bd4 4px, rgba(255, 255, 255, 0) 4px);
  background-position: bottom;
  background-size: 6px 1px;
  background-repeat: repeat-x;
  background-position-x: 1px;
}
html.aspnet-demos .btn-read-more:focus-visible {
  outline: 2px solid #512bd4;
}
html.aspnet-demos .btn-read-more:hover {
  background-color: rgba(81, 43, 212, 0.08);
}
html.aspnet-demos .btn-read-more:active {
  background-color: rgba(81, 43, 212, 0.12);
}
html.aspnet-demos .tbs {
  border-color: #e7ebee;
}
html.aspnet-demos .tbs-arrows,
html.aspnet-demos .tbs-arrow.btn {
  background-color: white;
  border: none;
}
html.aspnet-demos .tbs-item {
  color: #596c7d;
  background-color: white;
}
html.aspnet-demos .tbs-item:visited {
  color: #596c7d;
}
html.aspnet-demos .tbs-item-container:hover {
  background-color: #f3f5f6;
}
html.aspnet-demos .tbs-item-container:hover .tbs-item {
  background-color: #f3f5f6;
}
html.aspnet-demos .tbs-item-container.active .tbs-item {
  color: #512bd4;
}
html.aspnet-demos .tbs-item-container.active .tbs-item::after {
  background-color: #512bd4;
}
html.aspnet-demos .duo-card {
  background-color: #f3f5f6;
}
html.aspnet-demos .duo-card .wrapper-card:not(.active) svg path {
  fill: #596c7d;
}
html.aspnet-demos .duo-card .wrapper-card:not(.active) svg path.background {
  opacity: 0.5;
}
html.aspnet-demos .duo-card .wrapper-card:not(.active) svg path.letter {
  fill: #f3f5f6;
}
html.aspnet-demos .duo-card .wrapper-card.active input,
html.aspnet-demos .duo-card input.active {
  background-color: white;
}
html.aspnet-demos .duo-card input {
  color: #596c7d;
}
html.aspnet-demos .switch-toogle input:checked + .switch-slider {
  background-color: #512bd4;
}
html.aspnet-demos .switch-toogle input:checked + .switch-slider.disabled {
  background-color: #e7ebee;
}
html.aspnet-demos .switch-toogle input:checked + .switch-slider::before {
  background-color: white;
  box-shadow: 0px 1px 2px 0px rgba(0, 0, 0, 0.16);
}
html.aspnet-demos .switch-slider {
  background-color: white;
  border-color: #e7ebee;
}
html.aspnet-demos .switch-slider.disabled {
  background-color: #e7ebee;
}
html.aspnet-demos .switch-slider.disabled:before {
  background-color: white;
  box-shadow: 0px 1px 2px 0px rgba(0, 0, 0, 0.16);
}
html.aspnet-demos .switch-slider:before {
  background-color: #512bd4;
}
html.aspnet-demos .switch-label {
  color: #596c7d;
}
html.aspnet-demos .header-approach-selected {
  color: #512bd4;
  background-color: white;
}
html.aspnet-demos .header-approach-selected:hover {
  background-color: rgba(28, 45, 54, 0.03);
}
html.aspnet-demos .header-approach-selected:active {
  background-color: rgba(28, 45, 54, 0.07);
}
html.aspnet-demos .header-approach-selected::after {
  content: '';
  width: 0;
  height: 0;
  border-top: none;
  border-right: 6px solid transparent;
  border-left: 6px solid transparent;
  border-bottom: 6px solid #596c7d;
  transform: rotate(180deg);
}
html.aspnet-demos .header-approach-selected.active::after {
  content: '';
  width: 0;
  height: 0;
  border-top: none;
  border-right: 6px solid transparent;
  border-left: 6px solid transparent;
  border-bottom: 6px solid #596c7d;
  transform: rotate(0);
}
html.aspnet-demos .header-approach-list {
  background-color: white;
}
html.aspnet-demos .header-approach-list-item:hover {
  background-color: rgba(28, 45, 54, 0.03);
}
html.aspnet-demos .header-approach-list-item:active {
  background-color: rgba(28, 45, 54, 0.07);
}
html.aspnet-demos .header-approach-list-item-content {
  color: #596c7d;
}
html.aspnet-demos .header-approach-list {
  background-color: white;
}
html.aspnet-demos .header-approach-list-item:hover {
  background-color: rgba(28, 45, 54, 0.03);
}
html.aspnet-demos .header-approach-list-item:active {
  background-color: rgba(28, 45, 54, 0.07);
}
html.aspnet-demos .header-approach-list-item-content {
  color: #596c7d;
}
html.aspnet-demos .header-approach-selected {
  color: #512bd4;
  background-color: white;
}
html.aspnet-demos .header-approach-selected:hover {
  background-color: rgba(28, 45, 54, 0.03);
}
html.aspnet-demos .header-approach-selected:active {
  background-color: rgba(28, 45, 54, 0.07);
}
html.aspnet-demos .header-approach-selected::after {
  content: '';
  width: 0;
  height: 0;
  border-top: none;
  border-right: 6px solid transparent;
  border-left: 6px solid transparent;
  border-bottom: 6px solid #596c7d;
  transform: rotate(180deg);
}
html.aspnet-demos .header-approach-selected.active::after {
  content: '';
  width: 0;
  height: 0;
  border-top: none;
  border-right: 6px solid transparent;
  border-left: 6px solid transparent;
  border-bottom: 6px solid #596c7d;
  transform: rotate(0);
}
html.aspnet-demos .header-approach-list {
  background-color: white;
}
html.aspnet-demos .header-approach-list-item:hover {
  background-color: rgba(28, 45, 54, 0.03);
}
html.aspnet-demos .header-approach-list-item:active {
  background-color: rgba(28, 45, 54, 0.07);
}
html.aspnet-demos .header-approach-list-item-content {
  color: #596c7d;
}
html.aspnet-demos .header-approach-list {
  background-color: white;
}
html.aspnet-demos .header-approach-list-item:hover {
  background-color: rgba(28, 45, 54, 0.03);
}
html.aspnet-demos .header-approach-list-item:active {
  background-color: rgba(28, 45, 54, 0.07);
}
html.aspnet-demos .header-approach-list-item-content {
  color: #596c7d;
}
html.aspnet-demos .header-drawer {
  background-color: white;
}
html.aspnet-demos .header-drawer .header-link.selected {
  border-bottom-color: transparent;
  border-left-color: #512bd4;
}
html.aspnet-demos .header-drawer {
  background-color: white;
}
html.aspnet-demos .header-drawer .header-link.selected {
  border-bottom-color: transparent;
  border-left-color: #512bd4;
}
@media only screen and (max-width: 1160px) {
  html.aspnet-demos .drawer-menu-divider {
    background-color: #e7ebee;
  }
}
html.aspnet-demos header .header {
  background-color: white;
}
html.aspnet-demos .header--logo--js {
  fill: #512bd4;
}
html.aspnet-demos .header-drawer .header-link:focus {
  border-left-color: #512bd4;
}
html.aspnet-demos .header-drawer .header-link.selected:focus {
  border-left-color: #4525b4;
}
html.aspnet-demos .header button {
  background-color: transparent;
}
html.aspnet-demos .header-link-text {
  color: #596c7d;
}
html.aspnet-demos .header-link:focus {
  outline: none;
}
html.aspnet-demos .header-link:hover {
  background-color: rgba(28, 45, 54, 0.03);
}
html.aspnet-demos .header-link.active {
  background-color: rgba(28, 45, 54, 0.07);
}
html.aspnet-demos .header-container-left .header-link:focus,
html.aspnet-demos .header-container-right .header-link:focus,
html.aspnet-demos .header-container-left .header-link.active,
html.aspnet-demos .header-container-right .header-link.active,
html.aspnet-demos .header-container-left .header-link.selected,
html.aspnet-demos .header-container-right .header-link.selected {
  position: relative;
}
html.aspnet-demos .header-container-left .header-link:focus::after,
html.aspnet-demos .header-container-right .header-link:focus::after,
html.aspnet-demos .header-container-left .header-link.active::after,
html.aspnet-demos .header-container-right .header-link.active::after,
html.aspnet-demos .header-container-left .header-link.selected::after,
html.aspnet-demos .header-container-right .header-link.selected::after {
  position: absolute;
  bottom: 0;
  left: 12px;
  right: 12px;
  content: ' ';
  height: 4px;
  border-radius: 4px 4px 0 0;
  background-color: #512bd4;
}
html.aspnet-demos .header-container-left .header-link:focus::after,
html.aspnet-demos .header-container-right .header-link:focus::after,
html.aspnet-demos .header-container-left .header-link.active::after,
html.aspnet-demos .header-container-right .header-link.active::after,
html.aspnet-demos .header-container-left .header-link.selected::after,
html.aspnet-demos .header-container-right .header-link.selected::after {
  position: absolute;
  bottom: 0;
  left: 12px;
  right: 12px;
  content: ' ';
  height: 4px;
  border-radius: 4px 4px 0 0;
  background-color: #512bd4;
}
html.aspnet-demos .header-container-left .header-link.selected:focus::after,
html.aspnet-demos .header-container-right .header-link.selected:focus::after {
  background-color: #4525b4;
}
html.aspnet-demos .header-menu-item .header-menu-list {
  background-color: white;
}
html.aspnet-demos .header-menu-item .header-menu-list-item:hover {
  background-color: rgba(28, 45, 54, 0.03);
}
html.aspnet-demos .header-menu-item .header-menu-list-item:active {
  background-color: rgba(28, 45, 54, 0.07);
}
html.aspnet-demos .header-menu-item .header-menu-list-item-content {
  color: #596c7d;
}
html.aspnet-demos .header-menu-item .header-menu-list {
  background-color: white;
}
html.aspnet-demos .header-menu-item .header-menu-list-item:hover {
  background-color: rgba(28, 45, 54, 0.03);
}
html.aspnet-demos .header-menu-item .header-menu-list-item:active {
  background-color: rgba(28, 45, 54, 0.07);
}
html.aspnet-demos .header-menu-item .header-menu-list-item-content {
  color: #596c7d;
}
html.aspnet-demos .header-menu-item .header-menu-button::before {
  position: absolute;
  bottom: 10px;
  left: calc(44%);
  content: '';
  width: 0;
  height: 0;
  border-top: none;
  border-right: 6px solid transparent;
  border-left: 6px solid transparent;
  border-bottom: 6px solid #596c7d;
  transform: rotate(180deg);
}
html.aspnet-demos .header-approach-selected {
  color: #512bd4;
  background-color: white;
}
html.aspnet-demos .header-approach-selected:hover {
  background-color: rgba(28, 45, 54, 0.03);
}
html.aspnet-demos .header-approach-selected:active {
  background-color: rgba(28, 45, 54, 0.07);
}
html.aspnet-demos .header-approach-selected::after {
  content: '';
  width: 0;
  height: 0;
  border-top: none;
  border-right: 6px solid transparent;
  border-left: 6px solid transparent;
  border-bottom: 6px solid #596c7d;
  transform: rotate(180deg);
}
html.aspnet-demos .header-approach-selected.active::after {
  content: '';
  width: 0;
  height: 0;
  border-top: none;
  border-right: 6px solid transparent;
  border-left: 6px solid transparent;
  border-bottom: 6px solid #596c7d;
  transform: rotate(0);
}
html.aspnet-demos .header-approach-list {
  background-color: white;
}
html.aspnet-demos .header-approach-list-item:hover {
  background-color: rgba(28, 45, 54, 0.03);
}
html.aspnet-demos .header-approach-list-item:active {
  background-color: rgba(28, 45, 54, 0.07);
}
html.aspnet-demos .header-approach-list-item-content {
  color: #596c7d;
}
html.aspnet-demos .header-approach-list {
  background-color: white;
}
html.aspnet-demos .header-approach-list-item:hover {
  background-color: rgba(28, 45, 54, 0.03);
}
html.aspnet-demos .header-approach-list-item:active {
  background-color: rgba(28, 45, 54, 0.07);
}
html.aspnet-demos .header-approach-list-item-content {
  color: #596c7d;
}
html.aspnet-demos .header-approach-selected {
  color: #512bd4;
  background-color: white;
}
html.aspnet-demos .header-approach-selected:hover {
  background-color: rgba(28, 45, 54, 0.03);
}
html.aspnet-demos .header-approach-selected:active {
  background-color: rgba(28, 45, 54, 0.07);
}
html.aspnet-demos .header-approach-selected::after {
  content: '';
  width: 0;
  height: 0;
  border-top: none;
  border-right: 6px solid transparent;
  border-left: 6px solid transparent;
  border-bottom: 6px solid #596c7d;
  transform: rotate(180deg);
}
html.aspnet-demos .header-approach-selected.active::after {
  content: '';
  width: 0;
  height: 0;
  border-top: none;
  border-right: 6px solid transparent;
  border-left: 6px solid transparent;
  border-bottom: 6px solid #596c7d;
  transform: rotate(0);
}
html.aspnet-demos .header-approach-list {
  background-color: white;
}
html.aspnet-demos .header-approach-list-item:hover {
  background-color: rgba(28, 45, 54, 0.03);
}
html.aspnet-demos .header-approach-list-item:active {
  background-color: rgba(28, 45, 54, 0.07);
}
html.aspnet-demos .header-approach-list-item-content {
  color: #596c7d;
}
html.aspnet-demos .header-approach-list {
  background-color: white;
}
html.aspnet-demos .header-approach-list-item:hover {
  background-color: rgba(28, 45, 54, 0.03);
}
html.aspnet-demos .header-approach-list-item:active {
  background-color: rgba(28, 45, 54, 0.07);
}
html.aspnet-demos .header-approach-list-item-content {
  color: #596c7d;
}
html.aspnet-demos .header-drawer {
  background-color: white;
}
html.aspnet-demos .header-drawer .header-link.selected {
  border-bottom-color: transparent;
  border-left-color: #512bd4;
}
html.aspnet-demos .header-drawer {
  background-color: white;
}
html.aspnet-demos .header-drawer .header-link.selected {
  border-bottom-color: transparent;
  border-left-color: #512bd4;
}
@media only screen and (max-width: 1160px) {
  html.aspnet-demos .drawer-menu-divider {
    background-color: #e7ebee;
  }
}
html.aspnet-demos header .header {
  background-color: white;
}
html.aspnet-demos .header--logo--js {
  fill: #512bd4;
}
html.aspnet-demos .header-drawer .header-link:focus {
  border-left-color: #512bd4;
}
html.aspnet-demos .header-drawer .header-link.selected:focus {
  border-left-color: #4525b4;
}
html.aspnet-demos .header button {
  background-color: transparent;
}
html.aspnet-demos .header-link-text {
  color: #596c7d;
}
html.aspnet-demos .header-link:focus {
  outline: none;
}
html.aspnet-demos .header-link:hover {
  background-color: rgba(28, 45, 54, 0.03);
}
html.aspnet-demos .header-link.active {
  background-color: rgba(28, 45, 54, 0.07);
}
html.aspnet-demos .header-container-left .header-link:focus,
html.aspnet-demos .header-container-right .header-link:focus,
html.aspnet-demos .header-container-left .header-link.active,
html.aspnet-demos .header-container-right .header-link.active,
html.aspnet-demos .header-container-left .header-link.selected,
html.aspnet-demos .header-container-right .header-link.selected {
  position: relative;
}
html.aspnet-demos .header-container-left .header-link:focus::after,
html.aspnet-demos .header-container-right .header-link:focus::after,
html.aspnet-demos .header-container-left .header-link.active::after,
html.aspnet-demos .header-container-right .header-link.active::after,
html.aspnet-demos .header-container-left .header-link.selected::after,
html.aspnet-demos .header-container-right .header-link.selected::after {
  position: absolute;
  bottom: 0;
  left: 12px;
  right: 12px;
  content: ' ';
  height: 4px;
  border-radius: 4px 4px 0 0;
  background-color: #512bd4;
}
html.aspnet-demos .header-container-left .header-link:focus::after,
html.aspnet-demos .header-container-right .header-link:focus::after,
html.aspnet-demos .header-container-left .header-link.active::after,
html.aspnet-demos .header-container-right .header-link.active::after,
html.aspnet-demos .header-container-left .header-link.selected::after,
html.aspnet-demos .header-container-right .header-link.selected::after {
  position: absolute;
  bottom: 0;
  left: 12px;
  right: 12px;
  content: ' ';
  height: 4px;
  border-radius: 4px 4px 0 0;
  background-color: #512bd4;
}
html.aspnet-demos .header-container-left .header-link.selected:focus::after,
html.aspnet-demos .header-container-right .header-link.selected:focus::after {
  background-color: #4525b4;
}
html.aspnet-demos .header-menu-item .header-menu-list {
  background-color: white;
}
html.aspnet-demos .header-menu-item .header-menu-list-item:hover {
  background-color: rgba(28, 45, 54, 0.03);
}
html.aspnet-demos .header-menu-item .header-menu-list-item:active {
  background-color: rgba(28, 45, 54, 0.07);
}
html.aspnet-demos .header-menu-item .header-menu-list-item-content {
  color: #596c7d;
}
html.aspnet-demos .header-menu-item .header-menu-list {
  background-color: white;
}
html.aspnet-demos .header-menu-item .header-menu-list-item:hover {
  background-color: rgba(28, 45, 54, 0.03);
}
html.aspnet-demos .header-menu-item .header-menu-list-item:active {
  background-color: rgba(28, 45, 54, 0.07);
}
html.aspnet-demos .header-menu-item .header-menu-list-item-content {
  color: #596c7d;
}
html.aspnet-demos .header-menu-item .header-menu-button::before {
  position: absolute;
  bottom: 10px;
  left: calc(44%);
  content: '';
  width: 0;
  height: 0;
  border-top: none;
  border-right: 6px solid transparent;
  border-left: 6px solid transparent;
  border-bottom: 6px solid #596c7d;
  transform: rotate(180deg);
}
html.aspnet-demos #menu {
  background-color: #edf0f2;
}
html.aspnet-demos #menu a {
  color: #596c7d;
}
html.aspnet-demos #menu a[href]:hover {
  color: #512bd4;
}
html.aspnet-demos #menu span {
  color: #596c7d;
}
html.aspnet-demos #menu li::before,
html.aspnet-demos #menu li::after {
  color: #596c7d;
}
html.aspnet-demos #menu .breadcrumbs-svg {
  fill: #596c7d;
}
html.aspnet-demos #menu .tools-panel {
  border-color: #edf0f2;
}
html.aspnet-demos #menu .tools-panel .breadcrumbs .breadcrumbs-wrapper li.hint.active span {
  background-color: #f3f5f6;
}
html.aspnet-demos #menu .tools-panel .breadcrumbs .breadcrumbs-wrapper li a {
  color: #4c5d6b;
}
html.aspnet-demos #menu .tools-panel .breadcrumbs-dropdown.active {
  background-color: #edf0f2;
}
html.aspnet-demos #menu .tools-panel .breadcrumbs-dropdown.active a {
  color: #4c5d6b;
}
html.aspnet-demos .menu-state-button {
  background-color: #f3f5f6;
}
html.aspnet-demos .menu-state-button svg path {
  fill: #596c7d;
}
html.aspnet-demos .menu-state-button:hover {
  background-color: #596c7d;
  opacity: 0.8;
}
html.aspnet-demos .menu-state-button:hover svg path {
  fill: #f3f5f6;
}
html.aspnet-demos .hidden-menu .menu-state-button {
  background-color: #596c7d;
}
html.aspnet-demos .hidden-menu .menu-state-button svg path {
  fill: #f3f5f6;
}
html.aspnet-demos .hidden-menu .menu-state-button:hover {
  background-color: #f3f5f6;
  opacity: 0.8;
}
html.aspnet-demos .hidden-menu .menu-state-button:hover svg path {
  fill: #596c7d;
}
html.aspnet-demos #menu {
  background-color: #edf0f2;
}
html.aspnet-demos #menu a {
  color: #596c7d;
}
html.aspnet-demos #menu a[href]:hover {
  color: #512bd4;
}
html.aspnet-demos #menu span {
  color: #596c7d;
}
html.aspnet-demos #menu li::before,
html.aspnet-demos #menu li::after {
  color: #596c7d;
}
html.aspnet-demos #menu .breadcrumbs-svg {
  fill: #596c7d;
}
html.aspnet-demos #menu .tools-panel {
  border-color: #edf0f2;
}
html.aspnet-demos #menu .tools-panel .breadcrumbs .breadcrumbs-wrapper li.hint.active span {
  background-color: #f3f5f6;
}
html.aspnet-demos #menu .tools-panel .breadcrumbs .breadcrumbs-wrapper li a {
  color: #4c5d6b;
}
html.aspnet-demos #menu .tools-panel .breadcrumbs-dropdown.active {
  background-color: #edf0f2;
}
html.aspnet-demos #menu .tools-panel .breadcrumbs-dropdown.active a {
  color: #4c5d6b;
}
html.aspnet-demos .menu-state-button {
  background-color: #f3f5f6;
}
html.aspnet-demos .menu-state-button svg path {
  fill: #596c7d;
}
html.aspnet-demos .menu-state-button:hover {
  background-color: #596c7d;
  opacity: 0.8;
}
html.aspnet-demos .menu-state-button:hover svg path {
  fill: #f3f5f6;
}
html.aspnet-demos .hidden-menu .menu-state-button {
  background-color: #596c7d;
}
html.aspnet-demos .hidden-menu .menu-state-button svg path {
  fill: #f3f5f6;
}
html.aspnet-demos .hidden-menu .menu-state-button:hover {
  background-color: #f3f5f6;
  opacity: 0.8;
}
html.aspnet-demos .hidden-menu .menu-state-button:hover svg path {
  fill: #596c7d;
}
html.aspnet-demos .left-menu {
  background-color: white;
}
html.aspnet-demos .left-menu a {
  color: #3f4d5a;
}
html.aspnet-demos .left-menu a:visited {
  color: #596c7d;
}
html.aspnet-demos .left-menu a:focus-visible,
html.aspnet-demos .left-menu .first-level:focus-visible,
html.aspnet-demos .left-menu .group-name:focus-visible {
  outline: 2px solid #512bd4;
}
html.aspnet-demos .left-menu::after {
  opacity: 1;
  background-color: #e7ebee;
}
html.aspnet-demos .left-menu .left-menu-filter-wrapper {
  background-color: #edf0f2;
}
html.aspnet-demos .left-menu .left-menu-filter-wrapper .dx-icon-search {
  color: #667c8f;
}
html.aspnet-demos .left-menu .left-menu-filter-wrapper .left-menu-filter {
  background-color: transparent;
}
html.aspnet-demos .left-menu .left-menu-filter-wrapper .left-menu-filter .dx-placeholder {
  color: #596c7d;
}
html.aspnet-demos .left-menu .left-menu-filter-wrapper .left-menu-filter .dx-icon-clear::before {
  color: #667c8f;
}
html.aspnet-demos .left-menu .left-menu-filter-wrapper .left-menu-filter.dx-texteditor.dx-editor-outlined {
  background-color: transparent;
}
html.aspnet-demos .left-menu .left-menu-filter-wrapper .left-menu-filter.dx-texteditor .dx-texteditor-input {
  background-color: #edf0f2;
  color: #3f4d5a;
}
html.aspnet-demos .left-menu .widgets-menu .site-search-suggestion {
  color: #596c7d;
}
html.aspnet-demos .left-menu .widgets-menu span.search {
  background-color: rgba(81, 43, 212, 0.2);
}
html.aspnet-demos .left-menu .widgets-menu ul li {
  color: #222930;
}
html.aspnet-demos .left-menu .widgets-menu ul li .first-level::after {
  border-bottom-color: #e7ebee;
}
html.aspnet-demos .left-menu .widgets-menu ul li .first-level:hover,
html.aspnet-demos .left-menu .widgets-menu ul li .group-name:hover,
html.aspnet-demos .left-menu .widgets-menu ul li .ajax-link:hover {
  background-color: #f3f5f6;
  color: #3f4d5a;
}
html.aspnet-demos .left-menu .widgets-menu ul li .first-level .expander,
html.aspnet-demos .left-menu .widgets-menu ul li .group-name .expander,
html.aspnet-demos .left-menu .widgets-menu ul li .ajax-link .expander {
  color: #596c7d;
}
html.aspnet-demos .left-menu .widgets-menu ul li .first-level .link-text,
html.aspnet-demos .left-menu .widgets-menu ul li .group-name .link-text,
html.aspnet-demos .left-menu .widgets-menu ul li .ajax-link .link-text {
  flex: 1;
}
html.aspnet-demos .left-menu .widgets-menu ul li .group-name {
  color: #3f4d5a;
}
html.aspnet-demos .left-menu .widgets-menu ul li.opened.category > .first-level .expander {
  color: #512bd4;
  transform: rotate(180deg);
}
html.aspnet-demos .left-menu .widgets-menu ul li.opened:not(.category) > .group-name {
  font-weight: 700;
  color: #222930;
}
html.aspnet-demos .left-menu .widgets-menu ul li.opened:not(.category) > .group-name .expander {
  color: #512bd4;
}
html.aspnet-demos .left-menu .widgets-menu ul li.opened:not(.category) > .group-name .expander svg {
  transform: rotate(90deg);
}
html.aspnet-demos .left-menu .widgets-menu ul li .ajax-link.active {
  background-color: rgba(81, 43, 212, 0.08);
  color: #512bd4;
}
html.aspnet-demos .left-menu .widgets-menu ul .category.Updated .link-text:after,
html.aspnet-demos .left-menu .widgets-menu ul .category .Updated .link-text:after {
  background-color: #42b883;
}
html.aspnet-demos .left-menu .widgets-menu ul .category.New .link-text:after,
html.aspnet-demos .left-menu .widgets-menu ul .category .New .link-text:after {
  background-color: #dd1144;
}
html.aspnet-demos .left-menu .widgets-menu ul .category.Roadmap .link-text:after,
html.aspnet-demos .left-menu .widgets-menu ul .category .Roadmap .link-text:after {
  background-color: #ff9000;
}
html.aspnet-demos .left-menu .widgets-menu div.equivalents {
  color: #596c7d;
}
html.aspnet-demos .left-menu .widgets-menu .equivalents-header {
  color: #596c7d;
}
html.aspnet-demos .left-menu .widgets-menu .equivalents-header.second {
  border-top-color: #e7ebee;
}
html.aspnet-demos .left-menu {
  background-color: white;
}
html.aspnet-demos .left-menu a {
  color: #3f4d5a;
}
html.aspnet-demos .left-menu a:visited {
  color: #596c7d;
}
html.aspnet-demos .left-menu a:focus-visible,
html.aspnet-demos .left-menu .first-level:focus-visible,
html.aspnet-demos .left-menu .group-name:focus-visible {
  outline: 2px solid #512bd4;
}
html.aspnet-demos .left-menu::after {
  opacity: 1;
  background-color: #e7ebee;
}
html.aspnet-demos .left-menu .left-menu-filter-wrapper {
  background-color: #edf0f2;
}
html.aspnet-demos .left-menu .left-menu-filter-wrapper .dx-icon-search {
  color: #667c8f;
}
html.aspnet-demos .left-menu .left-menu-filter-wrapper .left-menu-filter {
  background-color: transparent;
}
html.aspnet-demos .left-menu .left-menu-filter-wrapper .left-menu-filter .dx-placeholder {
  color: #596c7d;
}
html.aspnet-demos .left-menu .left-menu-filter-wrapper .left-menu-filter .dx-icon-clear::before {
  color: #667c8f;
}
html.aspnet-demos .left-menu .left-menu-filter-wrapper .left-menu-filter.dx-texteditor.dx-editor-outlined {
  background-color: transparent;
}
html.aspnet-demos .left-menu .left-menu-filter-wrapper .left-menu-filter.dx-texteditor .dx-texteditor-input {
  background-color: #edf0f2;
  color: #3f4d5a;
}
html.aspnet-demos .left-menu .widgets-menu .site-search-suggestion {
  color: #596c7d;
}
html.aspnet-demos .left-menu .widgets-menu span.search {
  background-color: rgba(81, 43, 212, 0.2);
}
html.aspnet-demos .left-menu .widgets-menu ul li {
  color: #222930;
}
html.aspnet-demos .left-menu .widgets-menu ul li .first-level::after {
  border-bottom-color: #e7ebee;
}
html.aspnet-demos .left-menu .widgets-menu ul li .first-level:hover,
html.aspnet-demos .left-menu .widgets-menu ul li .group-name:hover,
html.aspnet-demos .left-menu .widgets-menu ul li .ajax-link:hover {
  background-color: #f3f5f6;
  color: #3f4d5a;
}
html.aspnet-demos .left-menu .widgets-menu ul li .first-level .expander,
html.aspnet-demos .left-menu .widgets-menu ul li .group-name .expander,
html.aspnet-demos .left-menu .widgets-menu ul li .ajax-link .expander {
  color: #596c7d;
}
html.aspnet-demos .left-menu .widgets-menu ul li .first-level .link-text,
html.aspnet-demos .left-menu .widgets-menu ul li .group-name .link-text,
html.aspnet-demos .left-menu .widgets-menu ul li .ajax-link .link-text {
  flex: 1;
}
html.aspnet-demos .left-menu .widgets-menu ul li .group-name {
  color: #3f4d5a;
}
html.aspnet-demos .left-menu .widgets-menu ul li.opened.category > .first-level .expander {
  color: #512bd4;
  transform: rotate(180deg);
}
html.aspnet-demos .left-menu .widgets-menu ul li.opened:not(.category) > .group-name {
  font-weight: 700;
  color: #222930;
}
html.aspnet-demos .left-menu .widgets-menu ul li.opened:not(.category) > .group-name .expander {
  color: #512bd4;
}
html.aspnet-demos .left-menu .widgets-menu ul li.opened:not(.category) > .group-name .expander svg {
  transform: rotate(90deg);
}
html.aspnet-demos .left-menu .widgets-menu ul li .ajax-link.active {
  background-color: rgba(81, 43, 212, 0.08);
  color: #512bd4;
}
html.aspnet-demos .left-menu .widgets-menu ul .category.Updated .link-text:after,
html.aspnet-demos .left-menu .widgets-menu ul .category .Updated .link-text:after {
  background-color: #42b883;
}
html.aspnet-demos .left-menu .widgets-menu ul .category.New .link-text:after,
html.aspnet-demos .left-menu .widgets-menu ul .category .New .link-text:after {
  background-color: #dd1144;
}
html.aspnet-demos .left-menu .widgets-menu ul .category.Roadmap .link-text:after,
html.aspnet-demos .left-menu .widgets-menu ul .category .Roadmap .link-text:after {
  background-color: #ff9000;
}
html.aspnet-demos .left-menu .widgets-menu div.equivalents {
  color: #596c7d;
}
html.aspnet-demos .left-menu .widgets-menu .equivalents-header {
  color: #596c7d;
}
html.aspnet-demos .left-menu .widgets-menu .equivalents-header.second {
  border-top-color: #e7ebee;
}
html.aspnet-demos .dx-loadpanel-content {
  color: #1e70b9;
}
html.aspnet-demos .dx-loadindicator-icon .dx-loadindicator-segment {
  background-color: #512bd4 !important;
}
html.aspnet-demos .background-block p {
  font-family: 'Roboto', sans-serif;
  color: #333333;
}
html.aspnet-demos a {
  color: #512bd4;
}
html.aspnet-demos a:hover,
html.aspnet-demos a:visited:hover {
  color: #512bd4;
}
html.aspnet-demos a:active {
  color: #512bd4;
}
html.aspnet-demos a:visited {
  color: #512bd4;
}
html.aspnet-demos a:focus-visible {
  color: #512bd4;
  outline: 2px solid #512bd4;
  border-radius: 4px;
}
html.aspnet-demos textarea {
  color: #333333;
}
html.aspnet-demos .full-description-offset p a code {
  color: #dd1144;
  text-decoration: underline #dd1144;
}
html.aspnet-demos .content {
  background: white;
}
html.aspnet-demos .content h1,
html.aspnet-demos .content h2,
html.aspnet-demos .content h3,
html.aspnet-demos .content li,
html.aspnet-demos .content p {
  color: #222930;
}
html.aspnet-demos .content .doc-content .components-list-container .category-title {
  color: #222930;
}
html.aspnet-demos .content .doc-content .axe-report {
  border-color: #e1e6ea;
}
html.aspnet-demos .content .doc-content .axe-report .axe-header {
  color: #222930;
}
html.aspnet-demos .content .doc-content .axe-report .axe-button {
  background-color: #512bd4;
  color: white;
}
html.aspnet-demos .content .doc-content .axe-report .axe-button:focus,
html.aspnet-demos .content .doc-content .axe-report .axe-button:focus-visible {
  background-color: #391e94;
}
html.aspnet-demos .content .doc-content .axe-report .axe-button:hover {
  background-color: #4525b4;
}
html.aspnet-demos .content .doc-content .axe-report .axe-text {
  color: #3f4d5a;
}
html.aspnet-demos .content .doc-content .axe-report .axe-trademark {
  color: #667c8f;
}
html.aspnet-demos .content .doc-content .axe-note {
  background-color: #f3f5f6;
  color: #667c8f;
}
html.aspnet-demos .content .doc-content .roadmap-survey-block {
  background-color: #ff900014;
  border-color: #ffaf47;
}
html.aspnet-demos .content .doc-content .roadmap-survey-header {
  color: #222930;
}
html.aspnet-demos .content .doc-content .roadmap-survey-text {
  color: #3f4d5a;
}
html.aspnet-demos .content .doc-content .roadmap-image-block {
  background-color: #f3f5f6;
  border-color: #e1e6ea;
}
html.aspnet-demos .content .doc-content .roadmap-image-block.bg-gif {
  background-color: white;
}
html.aspnet-demos .content .doc-content .roadmap-survey-button {
  color: white;
}
html.aspnet-demos .content .doc-content .note {
  background: rgba(221, 17, 68, 0.1);
}
html.aspnet-demos .content .doc-content .note .note-header {
  color: #dd1144;
}
html.aspnet-demos .content .doc-content .libs {
  color: #7f7f7f;
}
html.aspnet-demos .content .doc-content .accordion-content {
  border: none;
  background-color: white;
}
html.aspnet-demos .content .doc-content .accordion-content .dx-accordion-item.dx-accordion-item-closed {
  background-color: white;
  border-color: white;
}
html.aspnet-demos .content .doc-content .accordion-content .dx-accordion-item-selected,
html.aspnet-demos .content .doc-content .accordion-content .dx-accordion-item-opened {
  border-color: #627789;
  background-color: white;
}
html.aspnet-demos .content .doc-content .accordion-content .dx-accordion-item-selected .dx-accordion-item-title,
html.aspnet-demos .content .doc-content .accordion-content .dx-accordion-item-opened .dx-accordion-item-title {
  background-color: white;
}
html.aspnet-demos .content .doc-content .accordion-content .dx-accordion-item-selected .dx-accordion-item-title:hover,
html.aspnet-demos .content .doc-content .accordion-content .dx-accordion-item-opened .dx-accordion-item-title:hover {
  background-color: white;
}
html.aspnet-demos .content .doc-content .accordion-content .dx-accordion-item-title {
  background-color: #f8f8f8;
  color: #22587e;
}
html.aspnet-demos .content .doc-content .accordion-content .dx-accordion-item-title:hover {
  background-color: #eef0f2;
}
html.aspnet-demos .content .doc-content .accordion-content .dx-accordion-item-title:before {
  color: #22587e;
}
html.aspnet-demos .content .doc-content .dx-accordion-item.dx-state-focused {
  border-color: #627789;
  border-radius: 8px;
}
html.aspnet-demos .content .doc-content h5.see-also {
  border-top-color: #ededed;
  color: #333333;
}
html.aspnet-demos .content .doc-content .code-wrapper.code-tabs .code-type {
  background-color: #f8f8f8;
  border-color: #ededed;
  color: #22587e;
}
html.aspnet-demos .content .doc-content .code-wrapper.code-tabs .code-type.active {
  background-color: #1e70b9;
  border-color: #1e70b9;
  color: white;
}
html.aspnet-demos .content .doc-content .code-wrapper .code-type {
  background-color: #f8f8f8;
  border-color: #ededed;
  color: #22587e;
}
html.aspnet-demos .content .doc-content .code-wrapper .code-type.active {
  background-color: #1e70b9;
  border-color: #1e70b9;
  color: white;
}
html.aspnet-demos .content .doc-content .code-wrapper pre {
  border-color: #e1e1e8;
}
html.aspnet-demos .content .doc-content .api-header a {
  color: #22587e;
}
html.aspnet-demos .content .doc-content .api-property-block .api-property {
  border-left-color: #22587e;
  color: #333333;
}
html.aspnet-demos .content .doc-content .api-property-block .api-property span.api-property-name {
  color: #8b949c;
}
html.aspnet-demos .content .doc-content .api-property-block .api-property.no-margin {
  color: #8b949c;
}
html.aspnet-demos .content .doc-content .api-property-block .api-property.no-margin p {
  color: #8b949c;
}
html.aspnet-demos .content .doc-content .api-property-block .api-property .parameter-name {
  color: #8b949c;
}
html.aspnet-demos .content .doc-content .api-property-block p a {
  color: #22587e;
}
html.aspnet-demos .content .doc-content .api-property-block p a:hover {
  color: #1e70b9;
}
html.aspnet-demos .content .doc-content .api-property-block p a:visited {
  color: #6b58a1;
}
html.aspnet-demos .content .doc-content .api-property-block p a:visited:hover {
  color: #1e70b9;
}
html.aspnet-demos .content .doc-content .featured-components-container .component-container .component-icon svg path,
html.aspnet-demos .content .doc-content .featured-components-container .component-container .component-icon svg rect,
html.aspnet-demos .content .doc-content .featured-components-container .component-container .component-icon svg polygon,
html.aspnet-demos .content .doc-content .featured-components-container .component-container .component-icon svg circle {
  fill: #667c8f;
}
html.aspnet-demos .content .doc-content .featured-components-container .component-container .component-link {
  color: #596c7d;
}
html.aspnet-demos .content .doc-content .featured-components-container .component-container:hover {
  background-color: #512bd4;
}
html.aspnet-demos .content .doc-content .featured-components-container .component-container:hover svg path,
html.aspnet-demos .content .doc-content .featured-components-container .component-container:hover svg rect,
html.aspnet-demos .content .doc-content .featured-components-container .component-container:hover svg polygon,
html.aspnet-demos .content .doc-content .featured-components-container .component-container:hover svg circle {
  fill: white;
}
html.aspnet-demos .content .doc-content .featured-components-container .component-container:hover .component-link {
  color: white;
}
html.aspnet-demos .content .doc-content .deprecated-block .deprecated {
  color: red;
}
html.aspnet-demos .content .doc-content .simple-table table td:first-child {
  color: black;
}
html.aspnet-demos .content .doc-content .simple-table td,
html.aspnet-demos .content .doc-content .simple-table th {
  border-color: #ededed;
}
html.aspnet-demos .content .doc-content .simple-table th {
  background: #ededed;
}
html.aspnet-demos .content .doc-content .simple-table tr:nth-child(even) {
  background: #f8f8f8;
}
html.aspnet-demos .content .doc-content .simple-table tr:nth-child(odd) {
  background: white;
}
html.aspnet-demos .content .doc-content .dx-table tr {
  border-bottom-color: #e7ebee;
}
html.aspnet-demos .content .doc-content .dx-table tr th {
  background: white;
  color: #667c8f;
  border-color: #e7ebee;
}
html.aspnet-demos .content .doc-content .dx-table tr td {
  border-color: white;
  color: #3f4d5a;
}
html.aspnet-demos .content .doc-content .dx-table tr .parameter-type {
  color: #3f4d5a;
}
html.aspnet-demos .content .doc-content .dx-table tr:nth-child(even) {
  background: white;
}
html.aspnet-demos .content .doc-content .dx-table tr:nth-child(even) td {
  border-right-color: white;
}
html.aspnet-demos .content .doc-content .dx-table tr:nth-child(odd) {
  background: #edf0f2;
}
html.aspnet-demos .content .doc-content .dx-table tr:nth-child(odd) td {
  border-right-color: #edf0f2;
}
html.aspnet-demos .content .doc-content .dx-table tr a {
  color: #22587e;
}
html.aspnet-demos .content .doc-content .dx-table tr a:hover {
  color: #1e70b9;
}
html.aspnet-demos .content .doc-content .dx-table tr a:visited {
  color: #6b58a1;
}
html.aspnet-demos .content .doc-content .dx-table tr a:visited:hover {
  color: #1e70b9;
}
html.aspnet-demos .content .doc-content .footnotes {
  border-top-color: #ededed;
}
html.aspnet-demos .content .doc-content .documentation-gallery .gallery-border {
  border-color: #ededed;
}
html.aspnet-demos .content .doc-content .documentation-gallery .gallery-border .arrow {
  border-color: #ededed;
  background-color: white;
}
html.aspnet-demos .content .doc-content .documentation-gallery .gallery-item .image {
  border-left-color: transparent;
  border-right-color: transparent;
}
html.aspnet-demos .content .doc-content .api-example .show-text {
  color: #7f7f7f;
}
html.aspnet-demos .content .doc-content .api-example .approach-tab-container .button.approach-switcher {
  background-color: #eef0f2;
  color: #22587e;
}
html.aspnet-demos .content .doc-content .api-example .approach-tab-container .button.approach-switcher:after {
  border-top-color: #ededed;
}
html.aspnet-demos .content .doc-content .api-example .approach-tab-container .button.approach-switcher:hover {
  background-color: #f8f8f8;
  border-color: #ededed;
}
html.aspnet-demos .content .doc-content .api-example .approach-tab-container .button.approach-switcher.current {
  background-color: white;
  color: #1b4461;
}
html.aspnet-demos .content .doc-content .api-example .approach-tab-container .button.approach-switcher.current:after {
  border-bottom-color: #ededed;
}
html.aspnet-demos .content .doc-content.search-page .header h1 .keyword {
  color: #1e70b9;
}
html.aspnet-demos .content .doc-content.search-page .header ul.search-counts {
  border-bottom-color: #ededed;
}
html.aspnet-demos .content .doc-content.search-page .header ul.search-counts li .count {
  color: #22587e;
}
html.aspnet-demos .content .doc-content.search-page .header ul.search-counts li.active {
  background-color: white;
  border-bottom-color: #512bd4;
}
html.aspnet-demos .content .doc-content.search-page .header ul.search-counts li.active a {
  color: #512bd4;
}
html.aspnet-demos .content .doc-content.search-page .header ul.search-counts li.active a:visited {
  color: #6b58a1;
}
html.aspnet-demos .content .doc-content.search-page .header ul.search-counts li.active .count {
  color: #512bd4;
}
html.aspnet-demos .content .doc-content.search-page .article-type {
  color: rgba(51, 51, 51, 0.7);
}
html.aspnet-demos .content .doc-content.search-page .article-type p {
  color: #333333;
}
html.aspnet-demos .content .doc-content.search-page p {
  color: #333333;
}
html.aspnet-demos .content .doc-content.search-page .pagination a:hover,
html.aspnet-demos .content .doc-content.search-page .pagination a:visited,
html.aspnet-demos .content .doc-content.search-page .pagination a:visited:hover {
  color: #22587e;
}
html.aspnet-demos .content .doc-content.search-page .pagination .activeItem-item.ellipsis,
html.aspnet-demos .content .doc-content.search-page .pagination a.ellipsis {
  color: #22587e;
}
html.aspnet-demos .content .doc-content.search-page .pagination .activeItem-item {
  background-color: #22587e;
}
html.aspnet-demos .content .doc-content .api-header,
html.aspnet-demos .content .doc-content .article-section-header {
  color: #333333;
}
html.aspnet-demos .content .doc-content .article-header .badge,
html.aspnet-demos .content .doc-content .api-header .badge {
  color: #333333;
  background-color: #627789;
}
html.aspnet-demos .content .doc-content .description code,
html.aspnet-demos .content .doc-content .second-description code {
  background-color: #f8f8f8;
  border-color: #ededed;
}
html.aspnet-demos .content .doc-content .simulators {
  border-color: #e1e6ea;
}
html.aspnet-demos .content .doc-content .simulators .demo-device {
  background-color: white;
}
html.aspnet-demos .content .doc-content .simulators.Mobile .demo-device,
html.aspnet-demos .content .doc-content .simulators.TabletLandscape .demo-device,
html.aspnet-demos .content .doc-content .simulators.TabletPortrait .demo-device {
  border-color: #ededed;
  background-color: #f8f8f8;
}
html.aspnet-demos .content .doc-content .simulators.Mobile .demo-device .demo-display,
html.aspnet-demos .content .doc-content .simulators.TabletLandscape .demo-device .demo-display,
html.aspnet-demos .content .doc-content .simulators.TabletPortrait .demo-device .demo-display {
  border-color: #ededed;
}
html.aspnet-demos .content .marketing-demos {
  background-color: white;
}
html.aspnet-demos .content .marketing-demos .demos-container {
  background-color: #f3f5f6;
}
html.aspnet-demos .content .marketing-demos .demo-link-content {
  background-color: white;
  border-color: #e7ebee;
}
html.aspnet-demos .content .marketing-demos .demo-link-content h5 {
  color: #3f4d5a;
}
html.aspnet-demos .content .marketing-demos .demo-link-content p {
  color: #596c7d;
}
html.aspnet-demos .content .marketing-demos .demo-link:hover .demo-link-content {
  background-color: #512bd4;
}
html.aspnet-demos .content .marketing-demos .demo-link:hover .demo-link-content h5,
html.aspnet-demos .content .marketing-demos .demo-link:hover .demo-link-content p {
  color: white;
}
html.aspnet-demos .content .marketing-demos .demo-link-stub {
  display: none;
}
@media only screen and (max-width: 1600px) {
  html.aspnet-demos .content .marketing-demos .demo-link-stub {
    display: block;
  }
}
html.aspnet-demos .content .top-content__expand {
  color: #596c7d;
  border-color: #e7ebee;
  outline-color: #e7ebee;
  background-color: #f3f5f6;
}
html.aspnet-demos .content .top-content__expand svg {
  fill: #596c7d;
}
html.aspnet-demos .content .top-content__expand svg path,
html.aspnet-demos .content .top-content__expand svg circle {
  fill: #596c7d;
}
html.aspnet-demos .content .top-content__expand:hover,
html.aspnet-demos .content .top-content__expand:focus {
  color: #596c7d;
  border-color: #e7ebee;
  outline-color: #e7ebee;
  background-color: #edf0f2;
}
html.aspnet-demos .content .top-content__expand:hover svg,
html.aspnet-demos .content .top-content__expand:focus svg {
  fill: #596c7d;
}
html.aspnet-demos .content .top-content__expand:hover svg path,
html.aspnet-demos .content .top-content__expand:focus svg path,
html.aspnet-demos .content .top-content__expand:hover svg circle,
html.aspnet-demos .content .top-content__expand:focus svg circle {
  fill: #596c7d;
}
html.aspnet-demos .content .top-content__expand:active {
  color: #596c7d;
  border-color: #e7ebee;
  outline-color: #e7ebee;
  background-color: #e7ebee;
}
html.aspnet-demos .content .top-content__expand:active svg {
  fill: #596c7d;
}
html.aspnet-demos .content .top-content__expand:active svg path,
html.aspnet-demos .content .top-content__expand:active svg circle {
  fill: #596c7d;
}
html.aspnet-demos .content .top-content h1.Updated::after {
  background-color: #512bd4;
}
html.aspnet-demos .content .code {
  border-color: #e7ebee;
}
html.aspnet-demos .content .code .not-yet {
  color: #91a4b2;
}
html.aspnet-demos .content .code .tabs-container {
  border-color: #e7ebee;
  background-color: white;
}
html.aspnet-demos .content .code .tabs-container #code-tabs .switch::before {
  background-color: #e7ebee;
}
html.aspnet-demos .content .code .buttons-container {
  border-color: #e7ebee;
  background-color: white;
}
html.aspnet-demos .content .code .buttons-container .buttons.fixed {
  background-color: white;
  border-color: #e7ebee;
}
html.aspnet-demos .content .code .source-block {
  scrollbar-color: #bfbfbf #f8f8f8;
}
html.aspnet-demos .content .code .source-block::-webkit-scrollbar-track {
  background-color: #f8f8f8;
}
html.aspnet-demos .content .code .source-block::-webkit-scrollbar-thumb {
  background-color: #bfbfbf;
}
html.aspnet-demos .content .code .source-block .CodeMirror {
  background-color: white;
}
html.aspnet-demos .content .code .source-block .CodeMirror pre {
  color: #333333;
}
html.aspnet-demos .content .code .source-block .CodeMirror .read-only-line {
  color: #4f4f4f;
}
html.aspnet-demos .content .code .source-block .CodeMirror .read-only-line.cm-comment {
  color: #b48a5f;
}
html.aspnet-demos .content .code .source-block .CodeMirror .read-only-line.cm-string {
  color: #b66969;
}
html.aspnet-demos .content .code .source-block .CodeMirror .read-only-line.cm-atom {
  color: #6f67ac;
}
html.aspnet-demos .content .code .source-block .CodeMirror .read-only-line.cm-keyword {
  color: #975ba0;
}
html.aspnet-demos .content .code .source-block .CodeMirror .read-only-line.cm-tag {
  color: #6ca363;
}
html.aspnet-demos .content .code .source-block .CodeMirror .read-only-line.cm-tag.cm-error {
  color: red;
}
html.aspnet-demos .content .code .source-block .CodeMirror .read-only-line.cm-attribute {
  color: #6767d5;
}
html.aspnet-demos .content .code .move-demo-container .move-demo-button {
  border-color: #a7b8c6;
  background-color: #1b4461;
  color: white;
}
html.aspnet-demos .content .code .move-demo-container .move-demo-button:hover {
  border-color: #f05b41;
  background-color: #f05b41;
}
html.aspnet-demos .content .code .move-demo-container .move-demo-button .move-demo-icon path {
  stroke: white;
}
html.aspnet-demos .content .demo-nav-links {
  background-color: white;
  border-color: #e1e6ea;
}
html.aspnet-demos .content .demo-nav-links a:hover {
  background-color: rgba(28, 45, 54, 0.03);
}
html.aspnet-demos .content .demo-nav-links a:active {
  background-color: rgba(28, 45, 54, 0.07);
}
html.aspnet-demos .content .demo-nav-links a:focus-visible {
  outline-color: #512bd4;
}
html.aspnet-demos .content .demo-nav-links a svg {
  fill: #596c7d;
}
html.aspnet-demos .content .demo-nav-links a svg path {
  fill: #596c7d;
}
html.aspnet-demos .content .demo-nav-links a.adaptivity-switcher:hover {
  background-color: transparent;
}
html.aspnet-demos .content .demo-nav-links button .link-button path {
  fill: #596c7d;
}
html.aspnet-demos .content .demo-nav-links button#fullScreenLink {
  background-color: inherit;
}
html.aspnet-demos .content .demo-nav-links button#fullScreenLink:hover {
  background-color: rgba(28, 45, 54, 0.03);
}
html.aspnet-demos .content .demo-nav-links button#fullScreenLink:active {
  background-color: rgba(28, 45, 54, 0.07);
}
html.aspnet-demos .content .demo-nav-links button#fullScreenLink:focus-visible {
  outline: 2px solid #512bd4;
}
html.aspnet-demos .content .demo-nav-links span.nav-border {
  background-color: #ededed;
}
html.aspnet-demos .content .demo-nav-links span.separator {
  background-color: #e7ebee;
}
html.aspnet-demos .content .demo-nav-links .uitg-button {
  color: #596c7d !important;
}
html.aspnet-demos .content #copy-to-code-codepen,
html.aspnet-demos .content #copy-to-code-sandbox,
html.aspnet-demos .content #reset {
  background-color: white;
  border: none;
}
html.aspnet-demos .content #copy-to-code-codepen:active,
html.aspnet-demos .content #copy-to-code-sandbox:active,
html.aspnet-demos .content #reset:active {
  background-color: rgba(28, 45, 54, 0.07);
}
html.aspnet-demos .content #copy-to-code-codepen:focus,
html.aspnet-demos .content #copy-to-code-sandbox:focus,
html.aspnet-demos .content #reset:focus {
  outline: none;
}
html.aspnet-demos .content #copy-to-code-codepen:focus-visible,
html.aspnet-demos .content #copy-to-code-sandbox:focus-visible,
html.aspnet-demos .content #reset:focus-visible {
  outline: 2px solid #512bd4;
}
html.aspnet-demos .content #copy-to-code-codepen:hover,
html.aspnet-demos .content #copy-to-code-sandbox:hover,
html.aspnet-demos .content #reset:hover {
  background-color: rgba(28, 45, 54, 0.03);
  color: #596c7d !important;
}
html.aspnet-demos .content #copy-to-code-codepen.disabled,
html.aspnet-demos .content #copy-to-code-sandbox.disabled,
html.aspnet-demos .content #reset.disabled {
  opacity: 0.5;
}
html.aspnet-demos .content #copy-to-code-codepen.disabled:active,
html.aspnet-demos .content #copy-to-code-sandbox.disabled:active,
html.aspnet-demos .content #reset.disabled:active,
html.aspnet-demos .content #copy-to-code-codepen.disabled:focus,
html.aspnet-demos .content #copy-to-code-sandbox.disabled:focus,
html.aspnet-demos .content #reset.disabled:focus,
html.aspnet-demos .content #copy-to-code-codepen.disabled:focus-visible,
html.aspnet-demos .content #copy-to-code-sandbox.disabled:focus-visible,
html.aspnet-demos .content #reset.disabled:focus-visible {
  background-color: white;
  outline: none;
}
html.aspnet-demos .content #copy-to-code-codepen.disabled:hover,
html.aspnet-demos .content #copy-to-code-sandbox.disabled:hover,
html.aspnet-demos .content #reset.disabled:hover {
  background-image: repeating-linear-gradient(45deg, #cccccc, #cccccc 10px, #bbbbbb 10px, #bbbbbb 20px);
  cursor: not-allowed;
}
html.aspnet-demos .content #apply:focus,
html.aspnet-demos .content #apply:focus-visible {
  outline: none;
}
html.aspnet-demos .content:not(.document__body) .doc-content h5.see-also + ul li:before {
  border-color: #333333;
  color: yellow;
  background-color: #333333;
}
html.aspnet-demos .debug-invalid-model-popup {
  color: white;
  background-color: red;
}
html.aspnet-demos .highlight {
  background-color: rgba(81, 43, 212, 0.15);
}
html.aspnet-demos .highlight.current {
  background-color: rgba(81, 43, 212, 0.3);
}
html.aspnet-demos .diagram-shape {
  stroke: black;
}
html.aspnet-demos .doc-content .nav-tabs > .active > a,
html.aspnet-demos .doc-content .nav-tabs > .active > a:focus {
  color: #555555;
  background-color: white;
  border-color: #dddddd;
}
html.aspnet-demos .doc-content .codeTabs.nav.nav-tabs {
  border-bottom-color: #e5e5e5;
}
html.aspnet-demos .doc-content .codeTabs.nav.nav-tabs li a {
  color: #252525;
}
html.aspnet-demos .doc-content .codeTabs.nav.nav-tabs li a:visited {
  color: #6b58a1;
}
html.aspnet-demos .doc-content .codeTabs.nav.nav-tabs li.active {
  border-top-color: #e5e5e5;
  border-left-color: #e5e5e5;
  border-right-color: #e5e5e5;
}
html.aspnet-demos .doc-content .codeTabs.nav.nav-tabs li.active a {
  background: white;
}
html.aspnet-demos .doc-content .codeTabs.nav.nav-tabs li.active a:visited {
  color: #6b58a1;
}
html.aspnet-demos .doc-content .demo-nav-links .standalone {
  border-color: #e7ebee;
  color: #596c7d;
}
html.aspnet-demos .doc-content .demo-nav-links .standalone:hover {
  background-color: #f3f5f6;
}
html.aspnet-demos .doc-content .demo-nav-links .standalone:active {
  background-color: #edf0f2;
}
html.aspnet-demos .button:not(.feedback__button) {
  color: #4525b4;
  border-color: #512bd4;
}
html.aspnet-demos .button:not(.feedback__button):hover,
html.aspnet-demos .button:not(.feedback__button).hover {
  color: white;
  border-color: #4525b4;
  background-color: #4525b4;
}
html.aspnet-demos .button:not(.feedback__button):active,
html.aspnet-demos .button:not(.feedback__button).active {
  border-color: #391e94;
  background-color: #391e94;
}
html.aspnet-demos .button:not(.feedback__button).fiddle:hover svg path,
html.aspnet-demos .button:not(.feedback__button).fiddle.hover svg path {
  stroke: white;
}
html.aspnet-demos .button:not(.feedback__button).fiddle:hover svg g path,
html.aspnet-demos .button:not(.feedback__button).fiddle.hover svg g path {
  fill: white;
  stroke: none;
}
html.aspnet-demos .dx-list-group-header {
  background-color: rgba(30, 112, 185, 0.1);
  color: #8b949c;
}
html.aspnet-demos .dx-dropdownlist-popup-wrapper.dx-popup-wrapper .dx-overlay-content {
  background-color: white;
}
html.aspnet-demos .dx-dropdownlist-popup-wrapper .dx-list:not(.dx-list-select-decorator-enabled) .dx-list-item {
  color: #333333;
  background-color: #eef0f2;
}
html.aspnet-demos .dx-dropdownlist-popup-wrapper .dx-list:not(.dx-list-select-decorator-enabled) .dx-list-item.dx-state-hover {
  background-color: rgba(30, 112, 185, 0.5);
  color: #627789;
}
html.aspnet-demos .dx-dropdownlist-popup-wrapper .dx-list:not(.dx-list-select-decorator-enabled) .dx-list-item.dx-list-item-selected {
  background-color: rgba(30, 112, 185, 0.5);
  color: #512bd4;
}
html.aspnet-demos .dx-dropdownlist-popup-wrapper .dx-list:not(.dx-list-select-decorator-enabled) .dx-list-item.dx-list-item-selected.dx-state-hover:not(.dx-state-focused) {
  color: #627789;
}
html.aspnet-demos .page-wrapper {
  background-color: white;
}
html.aspnet-demos .adaptivity-switcher .switcher-item-wrapper.landscape .switcher-item .inner {
  background-color: white;
}
html.aspnet-demos .adaptivity-switcher .switcher-item-wrapper.portrait .switcher-item .inner {
  background-color: white;
}
html.aspnet-demos .adaptivity-switcher .switcher-item-wrapper .switcher-item {
  background-color: #22587e;
}
html.aspnet-demos .adaptivity-switcher .switcher-item-wrapper .switcher-item.active {
  background-color: #512bd4;
}
html.aspnet-demos .adaptivity-switcher .switcher-item-wrapper:hover {
  background-color: rgba(237, 237, 237, 0.7);
}
html.aspnet-demos .dx-popup-wrapper > .dx-overlay-content {
  border-color: #e7ebee;
  background-color: white;
}
html.aspnet-demos .dx-texteditor.dx-editor-outlined {
  background-color: white;
}
html.aspnet-demos #themeChooserPopup.dx-overlay-content {
  box-shadow: 0px 2px 8px 0px #0000001f, 0px 1px 2px 0px #0000000f;
}
html.aspnet-demos .dx-loadpanel-content {
  color: #1e70b9;
}
html.aspnet-demos .dx-loadindicator-icon .dx-loadindicator-segment {
  background-color: #512bd4 !important;
}
html.aspnet-demos .background-block p {
  font-family: 'Roboto', sans-serif;
  color: #333333;
}
html.aspnet-demos a {
  color: #512bd4;
}
html.aspnet-demos a:hover,
html.aspnet-demos a:visited:hover {
  color: #512bd4;
}
html.aspnet-demos a:active {
  color: #512bd4;
}
html.aspnet-demos a:visited {
  color: #512bd4;
}
html.aspnet-demos a:focus-visible {
  color: #512bd4;
  outline: 2px solid #512bd4;
  border-radius: 4px;
}
html.aspnet-demos textarea {
  color: #333333;
}
html.aspnet-demos .full-description-offset p a code {
  color: #dd1144;
  text-decoration: underline #dd1144;
}
html.aspnet-demos .content {
  background: white;
}
html.aspnet-demos .content h1,
html.aspnet-demos .content h2,
html.aspnet-demos .content h3,
html.aspnet-demos .content li,
html.aspnet-demos .content p {
  color: #222930;
}
html.aspnet-demos .content .doc-content .components-list-container .category-title {
  color: #222930;
}
html.aspnet-demos .content .doc-content .axe-report {
  border-color: #e1e6ea;
}
html.aspnet-demos .content .doc-content .axe-report .axe-header {
  color: #222930;
}
html.aspnet-demos .content .doc-content .axe-report .axe-button {
  background-color: #512bd4;
  color: white;
}
html.aspnet-demos .content .doc-content .axe-report .axe-button:focus,
html.aspnet-demos .content .doc-content .axe-report .axe-button:focus-visible {
  background-color: #391e94;
}
html.aspnet-demos .content .doc-content .axe-report .axe-button:hover {
  background-color: #4525b4;
}
html.aspnet-demos .content .doc-content .axe-report .axe-text {
  color: #3f4d5a;
}
html.aspnet-demos .content .doc-content .axe-report .axe-trademark {
  color: #667c8f;
}
html.aspnet-demos .content .doc-content .axe-note {
  background-color: #f3f5f6;
  color: #667c8f;
}
html.aspnet-demos .content .doc-content .roadmap-survey-block {
  background-color: #ff900014;
  border-color: #ffaf47;
}
html.aspnet-demos .content .doc-content .roadmap-survey-header {
  color: #222930;
}
html.aspnet-demos .content .doc-content .roadmap-survey-text {
  color: #3f4d5a;
}
html.aspnet-demos .content .doc-content .roadmap-image-block {
  background-color: #f3f5f6;
  border-color: #e1e6ea;
}
html.aspnet-demos .content .doc-content .roadmap-image-block.bg-gif {
  background-color: white;
}
html.aspnet-demos .content .doc-content .roadmap-survey-button {
  color: white;
}
html.aspnet-demos .content .doc-content .note {
  background: rgba(221, 17, 68, 0.1);
}
html.aspnet-demos .content .doc-content .note .note-header {
  color: #dd1144;
}
html.aspnet-demos .content .doc-content .libs {
  color: #7f7f7f;
}
html.aspnet-demos .content .doc-content .accordion-content {
  border: none;
  background-color: white;
}
html.aspnet-demos .content .doc-content .accordion-content .dx-accordion-item.dx-accordion-item-closed {
  background-color: white;
  border-color: white;
}
html.aspnet-demos .content .doc-content .accordion-content .dx-accordion-item-selected,
html.aspnet-demos .content .doc-content .accordion-content .dx-accordion-item-opened {
  border-color: #627789;
  background-color: white;
}
html.aspnet-demos .content .doc-content .accordion-content .dx-accordion-item-selected .dx-accordion-item-title,
html.aspnet-demos .content .doc-content .accordion-content .dx-accordion-item-opened .dx-accordion-item-title {
  background-color: white;
}
html.aspnet-demos .content .doc-content .accordion-content .dx-accordion-item-selected .dx-accordion-item-title:hover,
html.aspnet-demos .content .doc-content .accordion-content .dx-accordion-item-opened .dx-accordion-item-title:hover {
  background-color: white;
}
html.aspnet-demos .content .doc-content .accordion-content .dx-accordion-item-title {
  background-color: #f8f8f8;
  color: #22587e;
}
html.aspnet-demos .content .doc-content .accordion-content .dx-accordion-item-title:hover {
  background-color: #eef0f2;
}
html.aspnet-demos .content .doc-content .accordion-content .dx-accordion-item-title:before {
  color: #22587e;
}
html.aspnet-demos .content .doc-content .dx-accordion-item.dx-state-focused {
  border-color: #627789;
  border-radius: 8px;
}
html.aspnet-demos .content .doc-content h5.see-also {
  border-top-color: #ededed;
  color: #333333;
}
html.aspnet-demos .content .doc-content .code-wrapper.code-tabs .code-type {
  background-color: #f8f8f8;
  border-color: #ededed;
  color: #22587e;
}
html.aspnet-demos .content .doc-content .code-wrapper.code-tabs .code-type.active {
  background-color: #1e70b9;
  border-color: #1e70b9;
  color: white;
}
html.aspnet-demos .content .doc-content .code-wrapper .code-type {
  background-color: #f8f8f8;
  border-color: #ededed;
  color: #22587e;
}
html.aspnet-demos .content .doc-content .code-wrapper .code-type.active {
  background-color: #1e70b9;
  border-color: #1e70b9;
  color: white;
}
html.aspnet-demos .content .doc-content .code-wrapper pre {
  border-color: #e1e1e8;
}
html.aspnet-demos .content .doc-content .api-header a {
  color: #22587e;
}
html.aspnet-demos .content .doc-content .api-property-block .api-property {
  border-left-color: #22587e;
  color: #333333;
}
html.aspnet-demos .content .doc-content .api-property-block .api-property span.api-property-name {
  color: #8b949c;
}
html.aspnet-demos .content .doc-content .api-property-block .api-property.no-margin {
  color: #8b949c;
}
html.aspnet-demos .content .doc-content .api-property-block .api-property.no-margin p {
  color: #8b949c;
}
html.aspnet-demos .content .doc-content .api-property-block .api-property .parameter-name {
  color: #8b949c;
}
html.aspnet-demos .content .doc-content .api-property-block p a {
  color: #22587e;
}
html.aspnet-demos .content .doc-content .api-property-block p a:hover {
  color: #1e70b9;
}
html.aspnet-demos .content .doc-content .api-property-block p a:visited {
  color: #6b58a1;
}
html.aspnet-demos .content .doc-content .api-property-block p a:visited:hover {
  color: #1e70b9;
}
html.aspnet-demos .content .doc-content .featured-components-container .component-container .component-icon svg path,
html.aspnet-demos .content .doc-content .featured-components-container .component-container .component-icon svg rect,
html.aspnet-demos .content .doc-content .featured-components-container .component-container .component-icon svg polygon,
html.aspnet-demos .content .doc-content .featured-components-container .component-container .component-icon svg circle {
  fill: #667c8f;
}
html.aspnet-demos .content .doc-content .featured-components-container .component-container .component-link {
  color: #596c7d;
}
html.aspnet-demos .content .doc-content .featured-components-container .component-container:hover {
  background-color: #512bd4;
}
html.aspnet-demos .content .doc-content .featured-components-container .component-container:hover svg path,
html.aspnet-demos .content .doc-content .featured-components-container .component-container:hover svg rect,
html.aspnet-demos .content .doc-content .featured-components-container .component-container:hover svg polygon,
html.aspnet-demos .content .doc-content .featured-components-container .component-container:hover svg circle {
  fill: white;
}
html.aspnet-demos .content .doc-content .featured-components-container .component-container:hover .component-link {
  color: white;
}
html.aspnet-demos .content .doc-content .deprecated-block .deprecated {
  color: red;
}
html.aspnet-demos .content .doc-content .simple-table table td:first-child {
  color: black;
}
html.aspnet-demos .content .doc-content .simple-table td,
html.aspnet-demos .content .doc-content .simple-table th {
  border-color: #ededed;
}
html.aspnet-demos .content .doc-content .simple-table th {
  background: #ededed;
}
html.aspnet-demos .content .doc-content .simple-table tr:nth-child(even) {
  background: #f8f8f8;
}
html.aspnet-demos .content .doc-content .simple-table tr:nth-child(odd) {
  background: white;
}
html.aspnet-demos .content .doc-content .dx-table tr {
  border-bottom-color: #e7ebee;
}
html.aspnet-demos .content .doc-content .dx-table tr th {
  background: white;
  color: #667c8f;
  border-color: #e7ebee;
}
html.aspnet-demos .content .doc-content .dx-table tr td {
  border-color: white;
  color: #3f4d5a;
}
html.aspnet-demos .content .doc-content .dx-table tr .parameter-type {
  color: #3f4d5a;
}
html.aspnet-demos .content .doc-content .dx-table tr:nth-child(even) {
  background: white;
}
html.aspnet-demos .content .doc-content .dx-table tr:nth-child(even) td {
  border-right-color: white;
}
html.aspnet-demos .content .doc-content .dx-table tr:nth-child(odd) {
  background: #edf0f2;
}
html.aspnet-demos .content .doc-content .dx-table tr:nth-child(odd) td {
  border-right-color: #edf0f2;
}
html.aspnet-demos .content .doc-content .dx-table tr a {
  color: #22587e;
}
html.aspnet-demos .content .doc-content .dx-table tr a:hover {
  color: #1e70b9;
}
html.aspnet-demos .content .doc-content .dx-table tr a:visited {
  color: #6b58a1;
}
html.aspnet-demos .content .doc-content .dx-table tr a:visited:hover {
  color: #1e70b9;
}
html.aspnet-demos .content .doc-content .footnotes {
  border-top-color: #ededed;
}
html.aspnet-demos .content .doc-content .documentation-gallery .gallery-border {
  border-color: #ededed;
}
html.aspnet-demos .content .doc-content .documentation-gallery .gallery-border .arrow {
  border-color: #ededed;
  background-color: white;
}
html.aspnet-demos .content .doc-content .documentation-gallery .gallery-item .image {
  border-left-color: transparent;
  border-right-color: transparent;
}
html.aspnet-demos .content .doc-content .api-example .show-text {
  color: #7f7f7f;
}
html.aspnet-demos .content .doc-content .api-example .approach-tab-container .button.approach-switcher {
  background-color: #eef0f2;
  color: #22587e;
}
html.aspnet-demos .content .doc-content .api-example .approach-tab-container .button.approach-switcher:after {
  border-top-color: #ededed;
}
html.aspnet-demos .content .doc-content .api-example .approach-tab-container .button.approach-switcher:hover {
  background-color: #f8f8f8;
  border-color: #ededed;
}
html.aspnet-demos .content .doc-content .api-example .approach-tab-container .button.approach-switcher.current {
  background-color: white;
  color: #1b4461;
}
html.aspnet-demos .content .doc-content .api-example .approach-tab-container .button.approach-switcher.current:after {
  border-bottom-color: #ededed;
}
html.aspnet-demos .content .doc-content.search-page .header h1 .keyword {
  color: #1e70b9;
}
html.aspnet-demos .content .doc-content.search-page .header ul.search-counts {
  border-bottom-color: #ededed;
}
html.aspnet-demos .content .doc-content.search-page .header ul.search-counts li .count {
  color: #22587e;
}
html.aspnet-demos .content .doc-content.search-page .header ul.search-counts li.active {
  background-color: white;
  border-bottom-color: #512bd4;
}
html.aspnet-demos .content .doc-content.search-page .header ul.search-counts li.active a {
  color: #512bd4;
}
html.aspnet-demos .content .doc-content.search-page .header ul.search-counts li.active a:visited {
  color: #6b58a1;
}
html.aspnet-demos .content .doc-content.search-page .header ul.search-counts li.active .count {
  color: #512bd4;
}
html.aspnet-demos .content .doc-content.search-page .article-type {
  color: rgba(51, 51, 51, 0.7);
}
html.aspnet-demos .content .doc-content.search-page .article-type p {
  color: #333333;
}
html.aspnet-demos .content .doc-content.search-page p {
  color: #333333;
}
html.aspnet-demos .content .doc-content.search-page .pagination a:hover,
html.aspnet-demos .content .doc-content.search-page .pagination a:visited,
html.aspnet-demos .content .doc-content.search-page .pagination a:visited:hover {
  color: #22587e;
}
html.aspnet-demos .content .doc-content.search-page .pagination .activeItem-item.ellipsis,
html.aspnet-demos .content .doc-content.search-page .pagination a.ellipsis {
  color: #22587e;
}
html.aspnet-demos .content .doc-content.search-page .pagination .activeItem-item {
  background-color: #22587e;
}
html.aspnet-demos .content .doc-content .api-header,
html.aspnet-demos .content .doc-content .article-section-header {
  color: #333333;
}
html.aspnet-demos .content .doc-content .article-header .badge,
html.aspnet-demos .content .doc-content .api-header .badge {
  color: #333333;
  background-color: #627789;
}
html.aspnet-demos .content .doc-content .description code,
html.aspnet-demos .content .doc-content .second-description code {
  background-color: #f8f8f8;
  border-color: #ededed;
}
html.aspnet-demos .content .doc-content .simulators {
  border-color: #e1e6ea;
}
html.aspnet-demos .content .doc-content .simulators .demo-device {
  background-color: white;
}
html.aspnet-demos .content .doc-content .simulators.Mobile .demo-device,
html.aspnet-demos .content .doc-content .simulators.TabletLandscape .demo-device,
html.aspnet-demos .content .doc-content .simulators.TabletPortrait .demo-device {
  border-color: #ededed;
  background-color: #f8f8f8;
}
html.aspnet-demos .content .doc-content .simulators.Mobile .demo-device .demo-display,
html.aspnet-demos .content .doc-content .simulators.TabletLandscape .demo-device .demo-display,
html.aspnet-demos .content .doc-content .simulators.TabletPortrait .demo-device .demo-display {
  border-color: #ededed;
}
html.aspnet-demos .content .marketing-demos {
  background-color: white;
}
html.aspnet-demos .content .marketing-demos .demos-container {
  background-color: #f3f5f6;
}
html.aspnet-demos .content .marketing-demos .demo-link-content {
  background-color: white;
  border-color: #e7ebee;
}
html.aspnet-demos .content .marketing-demos .demo-link-content h5 {
  color: #3f4d5a;
}
html.aspnet-demos .content .marketing-demos .demo-link-content p {
  color: #596c7d;
}
html.aspnet-demos .content .marketing-demos .demo-link:hover .demo-link-content {
  background-color: #512bd4;
}
html.aspnet-demos .content .marketing-demos .demo-link:hover .demo-link-content h5,
html.aspnet-demos .content .marketing-demos .demo-link:hover .demo-link-content p {
  color: white;
}
html.aspnet-demos .content .marketing-demos .demo-link-stub {
  display: none;
}
@media only screen and (max-width: 1600px) {
  html.aspnet-demos .content .marketing-demos .demo-link-stub {
    display: block;
  }
}
html.aspnet-demos .content .top-content__expand {
  color: #596c7d;
  border-color: #e7ebee;
  outline-color: #e7ebee;
  background-color: #f3f5f6;
}
html.aspnet-demos .content .top-content__expand svg {
  fill: #596c7d;
}
html.aspnet-demos .content .top-content__expand svg path,
html.aspnet-demos .content .top-content__expand svg circle {
  fill: #596c7d;
}
html.aspnet-demos .content .top-content__expand:hover,
html.aspnet-demos .content .top-content__expand:focus {
  color: #596c7d;
  border-color: #e7ebee;
  outline-color: #e7ebee;
  background-color: #edf0f2;
}
html.aspnet-demos .content .top-content__expand:hover svg,
html.aspnet-demos .content .top-content__expand:focus svg {
  fill: #596c7d;
}
html.aspnet-demos .content .top-content__expand:hover svg path,
html.aspnet-demos .content .top-content__expand:focus svg path,
html.aspnet-demos .content .top-content__expand:hover svg circle,
html.aspnet-demos .content .top-content__expand:focus svg circle {
  fill: #596c7d;
}
html.aspnet-demos .content .top-content__expand:active {
  color: #596c7d;
  border-color: #e7ebee;
  outline-color: #e7ebee;
  background-color: #e7ebee;
}
html.aspnet-demos .content .top-content__expand:active svg {
  fill: #596c7d;
}
html.aspnet-demos .content .top-content__expand:active svg path,
html.aspnet-demos .content .top-content__expand:active svg circle {
  fill: #596c7d;
}
html.aspnet-demos .content .top-content h1.Updated::after {
  background-color: #512bd4;
}
html.aspnet-demos .content .code {
  border-color: #e7ebee;
}
html.aspnet-demos .content .code .not-yet {
  color: #91a4b2;
}
html.aspnet-demos .content .code .tabs-container {
  border-color: #e7ebee;
  background-color: white;
}
html.aspnet-demos .content .code .tabs-container #code-tabs .switch::before {
  background-color: #e7ebee;
}
html.aspnet-demos .content .code .buttons-container {
  border-color: #e7ebee;
  background-color: white;
}
html.aspnet-demos .content .code .buttons-container .buttons.fixed {
  background-color: white;
  border-color: #e7ebee;
}
html.aspnet-demos .content .code .source-block {
  scrollbar-color: #bfbfbf #f8f8f8;
}
html.aspnet-demos .content .code .source-block::-webkit-scrollbar-track {
  background-color: #f8f8f8;
}
html.aspnet-demos .content .code .source-block::-webkit-scrollbar-thumb {
  background-color: #bfbfbf;
}
html.aspnet-demos .content .code .source-block .CodeMirror {
  background-color: white;
}
html.aspnet-demos .content .code .source-block .CodeMirror pre {
  color: #333333;
}
html.aspnet-demos .content .code .source-block .CodeMirror .read-only-line {
  color: #4f4f4f;
}
html.aspnet-demos .content .code .source-block .CodeMirror .read-only-line.cm-comment {
  color: #b48a5f;
}
html.aspnet-demos .content .code .source-block .CodeMirror .read-only-line.cm-string {
  color: #b66969;
}
html.aspnet-demos .content .code .source-block .CodeMirror .read-only-line.cm-atom {
  color: #6f67ac;
}
html.aspnet-demos .content .code .source-block .CodeMirror .read-only-line.cm-keyword {
  color: #975ba0;
}
html.aspnet-demos .content .code .source-block .CodeMirror .read-only-line.cm-tag {
  color: #6ca363;
}
html.aspnet-demos .content .code .source-block .CodeMirror .read-only-line.cm-tag.cm-error {
  color: red;
}
html.aspnet-demos .content .code .source-block .CodeMirror .read-only-line.cm-attribute {
  color: #6767d5;
}
html.aspnet-demos .content .code .move-demo-container .move-demo-button {
  border-color: #a7b8c6;
  background-color: #1b4461;
  color: white;
}
html.aspnet-demos .content .code .move-demo-container .move-demo-button:hover {
  border-color: #f05b41;
  background-color: #f05b41;
}
html.aspnet-demos .content .code .move-demo-container .move-demo-button .move-demo-icon path {
  stroke: white;
}
html.aspnet-demos .content .demo-nav-links {
  background-color: white;
  border-color: #e1e6ea;
}
html.aspnet-demos .content .demo-nav-links a:hover {
  background-color: rgba(28, 45, 54, 0.03);
}
html.aspnet-demos .content .demo-nav-links a:active {
  background-color: rgba(28, 45, 54, 0.07);
}
html.aspnet-demos .content .demo-nav-links a:focus-visible {
  outline-color: #512bd4;
}
html.aspnet-demos .content .demo-nav-links a svg {
  fill: #596c7d;
}
html.aspnet-demos .content .demo-nav-links a svg path {
  fill: #596c7d;
}
html.aspnet-demos .content .demo-nav-links a.adaptivity-switcher:hover {
  background-color: transparent;
}
html.aspnet-demos .content .demo-nav-links button .link-button path {
  fill: #596c7d;
}
html.aspnet-demos .content .demo-nav-links button#fullScreenLink {
  background-color: inherit;
}
html.aspnet-demos .content .demo-nav-links button#fullScreenLink:hover {
  background-color: rgba(28, 45, 54, 0.03);
}
html.aspnet-demos .content .demo-nav-links button#fullScreenLink:active {
  background-color: rgba(28, 45, 54, 0.07);
}
html.aspnet-demos .content .demo-nav-links button#fullScreenLink:focus-visible {
  outline: 2px solid #512bd4;
}
html.aspnet-demos .content .demo-nav-links span.nav-border {
  background-color: #ededed;
}
html.aspnet-demos .content .demo-nav-links span.separator {
  background-color: #e7ebee;
}
html.aspnet-demos .content .demo-nav-links .uitg-button {
  color: #596c7d !important;
}
html.aspnet-demos .content #copy-to-code-codepen,
html.aspnet-demos .content #copy-to-code-sandbox,
html.aspnet-demos .content #reset {
  background-color: white;
  border: none;
}
html.aspnet-demos .content #copy-to-code-codepen:active,
html.aspnet-demos .content #copy-to-code-sandbox:active,
html.aspnet-demos .content #reset:active {
  background-color: rgba(28, 45, 54, 0.07);
}
html.aspnet-demos .content #copy-to-code-codepen:focus,
html.aspnet-demos .content #copy-to-code-sandbox:focus,
html.aspnet-demos .content #reset:focus {
  outline: none;
}
html.aspnet-demos .content #copy-to-code-codepen:focus-visible,
html.aspnet-demos .content #copy-to-code-sandbox:focus-visible,
html.aspnet-demos .content #reset:focus-visible {
  outline: 2px solid #512bd4;
}
html.aspnet-demos .content #copy-to-code-codepen:hover,
html.aspnet-demos .content #copy-to-code-sandbox:hover,
html.aspnet-demos .content #reset:hover {
  background-color: rgba(28, 45, 54, 0.03);
  color: #596c7d !important;
}
html.aspnet-demos .content #copy-to-code-codepen.disabled,
html.aspnet-demos .content #copy-to-code-sandbox.disabled,
html.aspnet-demos .content #reset.disabled {
  opacity: 0.5;
}
html.aspnet-demos .content #copy-to-code-codepen.disabled:active,
html.aspnet-demos .content #copy-to-code-sandbox.disabled:active,
html.aspnet-demos .content #reset.disabled:active,
html.aspnet-demos .content #copy-to-code-codepen.disabled:focus,
html.aspnet-demos .content #copy-to-code-sandbox.disabled:focus,
html.aspnet-demos .content #reset.disabled:focus,
html.aspnet-demos .content #copy-to-code-codepen.disabled:focus-visible,
html.aspnet-demos .content #copy-to-code-sandbox.disabled:focus-visible,
html.aspnet-demos .content #reset.disabled:focus-visible {
  background-color: white;
  outline: none;
}
html.aspnet-demos .content #copy-to-code-codepen.disabled:hover,
html.aspnet-demos .content #copy-to-code-sandbox.disabled:hover,
html.aspnet-demos .content #reset.disabled:hover {
  background-image: repeating-linear-gradient(45deg, #cccccc, #cccccc 10px, #bbbbbb 10px, #bbbbbb 20px);
  cursor: not-allowed;
}
html.aspnet-demos .content #apply:focus,
html.aspnet-demos .content #apply:focus-visible {
  outline: none;
}
html.aspnet-demos .content:not(.document__body) .doc-content h5.see-also + ul li:before {
  border-color: #333333;
  color: yellow;
  background-color: #333333;
}
html.aspnet-demos .debug-invalid-model-popup {
  color: white;
  background-color: red;
}
html.aspnet-demos .highlight {
  background-color: rgba(81, 43, 212, 0.15);
}
html.aspnet-demos .highlight.current {
  background-color: rgba(81, 43, 212, 0.3);
}
html.aspnet-demos .diagram-shape {
  stroke: black;
}
html.aspnet-demos .doc-content .nav-tabs > .active > a,
html.aspnet-demos .doc-content .nav-tabs > .active > a:focus {
  color: #555555;
  background-color: white;
  border-color: #dddddd;
}
html.aspnet-demos .doc-content .codeTabs.nav.nav-tabs {
  border-bottom-color: #e5e5e5;
}
html.aspnet-demos .doc-content .codeTabs.nav.nav-tabs li a {
  color: #252525;
}
html.aspnet-demos .doc-content .codeTabs.nav.nav-tabs li a:visited {
  color: #6b58a1;
}
html.aspnet-demos .doc-content .codeTabs.nav.nav-tabs li.active {
  border-top-color: #e5e5e5;
  border-left-color: #e5e5e5;
  border-right-color: #e5e5e5;
}
html.aspnet-demos .doc-content .codeTabs.nav.nav-tabs li.active a {
  background: white;
}
html.aspnet-demos .doc-content .codeTabs.nav.nav-tabs li.active a:visited {
  color: #6b58a1;
}
html.aspnet-demos .doc-content .demo-nav-links .standalone {
  border-color: #e7ebee;
  color: #596c7d;
}
html.aspnet-demos .doc-content .demo-nav-links .standalone:hover {
  background-color: #f3f5f6;
}
html.aspnet-demos .doc-content .demo-nav-links .standalone:active {
  background-color: #edf0f2;
}
html.aspnet-demos .button:not(.feedback__button) {
  color: #4525b4;
  border-color: #512bd4;
}
html.aspnet-demos .button:not(.feedback__button):hover,
html.aspnet-demos .button:not(.feedback__button).hover {
  color: white;
  border-color: #4525b4;
  background-color: #4525b4;
}
html.aspnet-demos .button:not(.feedback__button):active,
html.aspnet-demos .button:not(.feedback__button).active {
  border-color: #391e94;
  background-color: #391e94;
}
html.aspnet-demos .button:not(.feedback__button).fiddle:hover svg path,
html.aspnet-demos .button:not(.feedback__button).fiddle.hover svg path {
  stroke: white;
}
html.aspnet-demos .button:not(.feedback__button).fiddle:hover svg g path,
html.aspnet-demos .button:not(.feedback__button).fiddle.hover svg g path {
  fill: white;
  stroke: none;
}
html.aspnet-demos .dx-list-group-header {
  background-color: rgba(30, 112, 185, 0.1);
  color: #8b949c;
}
html.aspnet-demos .dx-dropdownlist-popup-wrapper.dx-popup-wrapper .dx-overlay-content {
  background-color: white;
}
html.aspnet-demos .dx-dropdownlist-popup-wrapper .dx-list:not(.dx-list-select-decorator-enabled) .dx-list-item {
  color: #333333;
  background-color: #eef0f2;
}
html.aspnet-demos .dx-dropdownlist-popup-wrapper .dx-list:not(.dx-list-select-decorator-enabled) .dx-list-item.dx-state-hover {
  background-color: rgba(30, 112, 185, 0.5);
  color: #627789;
}
html.aspnet-demos .dx-dropdownlist-popup-wrapper .dx-list:not(.dx-list-select-decorator-enabled) .dx-list-item.dx-list-item-selected {
  background-color: rgba(30, 112, 185, 0.5);
  color: #512bd4;
}
html.aspnet-demos .dx-dropdownlist-popup-wrapper .dx-list:not(.dx-list-select-decorator-enabled) .dx-list-item.dx-list-item-selected.dx-state-hover:not(.dx-state-focused) {
  color: #627789;
}
html.aspnet-demos .page-wrapper {
  background-color: white;
}
html.aspnet-demos .adaptivity-switcher .switcher-item-wrapper.landscape .switcher-item .inner {
  background-color: white;
}
html.aspnet-demos .adaptivity-switcher .switcher-item-wrapper.portrait .switcher-item .inner {
  background-color: white;
}
html.aspnet-demos .adaptivity-switcher .switcher-item-wrapper .switcher-item {
  background-color: #22587e;
}
html.aspnet-demos .adaptivity-switcher .switcher-item-wrapper .switcher-item.active {
  background-color: #512bd4;
}
html.aspnet-demos .adaptivity-switcher .switcher-item-wrapper:hover {
  background-color: rgba(237, 237, 237, 0.7);
}
html.aspnet-demos .dx-popup-wrapper > .dx-overlay-content {
  border-color: #e7ebee;
  background-color: white;
}
html.aspnet-demos .dx-texteditor.dx-editor-outlined {
  background-color: white;
}
html.aspnet-demos #themeChooserPopup.dx-overlay-content {
  box-shadow: 0px 2px 8px 0px #0000001f, 0px 1px 2px 0px #0000000f;
}
html.aspnet-demos .theme-popup-header {
  background-color: white;
  box-shadow: 0px 1px 2px 0px #0000000f, 0px 2px 8px 0px #0000000a;
}
html.aspnet-demos .theme-popup-window {
  background-color: white;
  color: #3f4d5a;
}
html.aspnet-demos .theme-popup-window:focus-visible {
  outline: none;
}
html.aspnet-demos .theme-popup-window .theme-item {
  color: #596c7d;
}
html.aspnet-demos .theme-popup-window .theme-item:hover {
  background-color: rgba(28, 45, 54, 0.03);
}
html.aspnet-demos .theme-popup-window .theme-item.selected {
  background-color: rgba(28, 45, 54, 0.07);
}
html.aspnet-demos .theme-popup-window .theme-item:focus {
  outline-color: #512bd4;
}
html.aspnet-demos .theme-popup-window .theme-trademark-warning-icon {
  fill: #596c7d;
}
html.aspnet-demos .theme-popup-window .theme-selector-group-container:hover,
html.aspnet-demos .theme-popup-window .theme-selector-group-container:focus-visible {
  background-color: rgba(28, 45, 54, 0.03);
}
html.aspnet-demos .theme-popup-window .theme-selector-group-container:focus {
  outline: none;
}
html.aspnet-demos .theme-popup-window .theme-selector-group.active span {
  color: #512bd4;
}
html.aspnet-demos .theme-popup-window .theme-selector-group.active span::after {
  background-color: #512bd4;
}
html.aspnet-demos .theme-popup-window .themebuilder-group {
  border-color: #e7ebee;
  background-color: white;
}
html.aspnet-demos .theme-popup-window .themebuilder-group .theme-popup-button {
  background-color: inherit;
}
html.aspnet-demos .theme-popup-window .themebuilder-group .theme-popup-button:hover {
  background-color: rgba(28, 45, 54, 0.03);
}
html.aspnet-demos .theme-popup-window .themebuilder-group .theme-popup-button:focus,
html.aspnet-demos .theme-popup-window .themebuilder-group .theme-popup-button:active {
  background-color: rgba(28, 45, 54, 0.07);
}
html.aspnet-demos .theme-popup-window .themebuilder-group .theme-popup-button:focus {
  outline: none;
}
html.aspnet-demos .theme-popup-window .themebuilder-group .theme-popup-button span {
  color: #512bd4;
}
html.aspnet-demos .theme-popup-window .themebuilder-group .theme-popup-button svg,
html.aspnet-demos .theme-popup-window .themebuilder-group .theme-popup-button path {
  fill: #512bd4 !important;
}
html.aspnet-demos .theme-popup-group-title {
  border-color: #e7ebee;
}
html.aspnet-demos #theme-selector-button.btn {
  background-color: white;
}
html.aspnet-demos #theme-selector-button.btn:focus,
html.aspnet-demos #theme-selector-button.btn:focus-visible {
  outline-color: #512bd4;
}
html.aspnet-demos #theme-selector-button.btn:hover {
  background-color: rgba(28, 45, 54, 0.03);
}
html.aspnet-demos #theme-selector-button.btn:active {
  background-color: rgba(28, 45, 54, 0.07);
}
html.aspnet-demos .theme-warning-tooltip .dx-overlay-content .dx-popover-arrow {
  bottom: -9px !important;
}
html.aspnet-demos .theme-warning-tooltip .dx-overlay-content .dx-popup-content {
  font-family: 'Roboto', sans-serif;
  font-size: 14px;
  padding: 8px 12px;
  text-align: left;
  white-space: normal;
  background-color: white !important;
  border-radius: 4px;
}
html.aspnet-demos .theme-popup-header {
  background-color: white;
  box-shadow: 0px 1px 2px 0px #0000000f, 0px 2px 8px 0px #0000000a;
}
html.aspnet-demos .theme-popup-window {
  background-color: white;
  color: #3f4d5a;
}
html.aspnet-demos .theme-popup-window:focus-visible {
  outline: none;
}
html.aspnet-demos .theme-popup-window .theme-item {
  color: #596c7d;
}
html.aspnet-demos .theme-popup-window .theme-item:hover {
  background-color: rgba(28, 45, 54, 0.03);
}
html.aspnet-demos .theme-popup-window .theme-item.selected {
  background-color: rgba(28, 45, 54, 0.07);
}
html.aspnet-demos .theme-popup-window .theme-item:focus {
  outline-color: #512bd4;
}
html.aspnet-demos .theme-popup-window .theme-trademark-warning-icon {
  fill: #596c7d;
}
html.aspnet-demos .theme-popup-window .theme-selector-group-container:hover,
html.aspnet-demos .theme-popup-window .theme-selector-group-container:focus-visible {
  background-color: rgba(28, 45, 54, 0.03);
}
html.aspnet-demos .theme-popup-window .theme-selector-group-container:focus {
  outline: none;
}
html.aspnet-demos .theme-popup-window .theme-selector-group.active span {
  color: #512bd4;
}
html.aspnet-demos .theme-popup-window .theme-selector-group.active span::after {
  background-color: #512bd4;
}
html.aspnet-demos .theme-popup-window .themebuilder-group {
  border-color: #e7ebee;
  background-color: white;
}
html.aspnet-demos .theme-popup-window .themebuilder-group .theme-popup-button {
  background-color: inherit;
}
html.aspnet-demos .theme-popup-window .themebuilder-group .theme-popup-button:hover {
  background-color: rgba(28, 45, 54, 0.03);
}
html.aspnet-demos .theme-popup-window .themebuilder-group .theme-popup-button:focus,
html.aspnet-demos .theme-popup-window .themebuilder-group .theme-popup-button:active {
  background-color: rgba(28, 45, 54, 0.07);
}
html.aspnet-demos .theme-popup-window .themebuilder-group .theme-popup-button:focus {
  outline: none;
}
html.aspnet-demos .theme-popup-window .themebuilder-group .theme-popup-button span {
  color: #512bd4;
}
html.aspnet-demos .theme-popup-window .themebuilder-group .theme-popup-button svg,
html.aspnet-demos .theme-popup-window .themebuilder-group .theme-popup-button path {
  fill: #512bd4 !important;
}
html.aspnet-demos .theme-popup-group-title {
  border-color: #e7ebee;
}
html.aspnet-demos #theme-selector-button.btn {
  background-color: white;
}
html.aspnet-demos #theme-selector-button.btn:focus,
html.aspnet-demos #theme-selector-button.btn:focus-visible {
  outline-color: #512bd4;
}
html.aspnet-demos #theme-selector-button.btn:hover {
  background-color: rgba(28, 45, 54, 0.03);
}
html.aspnet-demos #theme-selector-button.btn:active {
  background-color: rgba(28, 45, 54, 0.07);
}
html.aspnet-demos .theme-warning-tooltip .dx-overlay-content .dx-popover-arrow {
  bottom: -9px !important;
}
html.aspnet-demos .theme-warning-tooltip .dx-overlay-content .dx-popup-content {
  font-family: 'Roboto', sans-serif;
  font-size: 14px;
  padding: 8px 12px;
  text-align: left;
  white-space: normal;
  background-color: white !important;
  border-radius: 4px;
}
html.aspnet-demos .footer {
  background-color: #4c5d6b;
}
html.aspnet-demos .footer a {
  color: white;
}
html.aspnet-demos .footer a:visited {
  color: white;
}
html.aspnet-demos .footer a:hover,
html.aspnet-demos .footer a:visited:hover {
  color: #d9d9d9;
}
html.aspnet-demos .footer a:active {
  color: #b3b3b3;
}
html.aspnet-demos .footer {
  background-color: #4c5d6b;
}
html.aspnet-demos .footer a {
  color: white;
}
html.aspnet-demos .footer a:visited {
  color: white;
}
html.aspnet-demos .footer a:hover,
html.aspnet-demos .footer a:visited:hover {
  color: #d9d9d9;
}
html.aspnet-demos .footer a:active {
  color: #b3b3b3;
}
html.aspnet-demos .theme-switch {
  background-color: white;
  border-color: #e7ebee;
}
html.aspnet-demos .theme-input {
  background-color: #512bd4;
}
html.aspnet-demos .theme-switch {
  background-color: white;
  border-color: #e7ebee;
}
html.aspnet-demos .theme-input {
  background-color: #512bd4;
}
html.aspnet-demos .front-toggle {
  background-color: whitesmoke;
  border: 1px solid #e1e6ea;
  color: #3f4d5a;
  font-size: 14px;
  line-height: 16px;
  font-weight: 400;
}
html.aspnet-demos .front-toggle .selected {
  color: #222930;
  font-weight: 600;
}
html.aspnet-demos .front-toggle .front-toggle-track {
  background-color: white;
  box-shadow: 0px 2px 2px 0px #00000014, 0px 0px 4px 0px #00000014;
}
html.aspnet-demos .front-toggle {
  background-color: whitesmoke;
  border: 1px solid #e1e6ea;
  color: #3f4d5a;
  font-size: 14px;
  line-height: 16px;
  font-weight: 400;
}
html.aspnet-demos .front-toggle .selected {
  color: #222930;
  font-weight: 600;
}
html.aspnet-demos .front-toggle .front-toggle-track {
  background-color: white;
  box-shadow: 0px 2px 2px 0px #00000014, 0px 0px 4px 0px #00000014;
}
html.aspnet-demos .survey--part {
  color: white;
}
html.aspnet-demos .survey--part a,
html.aspnet-demos .survey--part a:hover,
html.aspnet-demos .survey--part a:visited,
html.aspnet-demos .survey--part a:focus,
html.aspnet-demos .survey--part a:active {
  color: white;
}
html.aspnet-demos .survey--container {
  background-color: #512bd4;
}
html.aspnet-demos .survey--svg-fill-accent {
  fill: #512bd4;
}
html.aspnet-demos .survey--svg-linear-stop-accent {
  stop-color: #512bd4;
}
html.aspnet-demos .survey--button:hover {
  background-color: #856be1;
}
html.aspnet-demos .survey--button:active {
  background-color: #b9aaee;
}
html.aspnet-demos .survey--button:focus-visible {
  outline: white solid 2px;
}
html.aspnet-demos .survey--part {
  color: white;
}
html.aspnet-demos .survey--part a,
html.aspnet-demos .survey--part a:hover,
html.aspnet-demos .survey--part a:visited,
html.aspnet-demos .survey--part a:focus,
html.aspnet-demos .survey--part a:active {
  color: white;
}
html.aspnet-demos .survey--container {
  background-color: #512bd4;
}
html.aspnet-demos .survey--svg-fill-accent {
  fill: #512bd4;
}
html.aspnet-demos .survey--svg-linear-stop-accent {
  stop-color: #512bd4;
}
html.aspnet-demos .survey--button:hover {
  background-color: #856be1;
}
html.aspnet-demos .survey--button:active {
  background-color: #b9aaee;
}
html.aspnet-demos .survey--button:focus-visible {
  outline: white solid 2px;
}
html.aspnet-demos #onetrust-consent-sdk #onetrust-banner-sdk {
  background-color: white;
}
html.aspnet-demos #onetrust-consent-sdk #onetrust-banner-sdk #onetrust-button-group-parent .banner-actions-container button {
  background-color: #512bd4;
  border-color: #512bd4;
}
html.aspnet-demos #onetrust-consent-sdk #onetrust-banner-sdk #onetrust-button-group-parent button#onetrust-pc-btn-handler {
  background-color: white;
  border: 2px solid #3f4d5a;
  color: #3f4d5a;
}
html.aspnet-demos #onetrust-consent-sdk #onetrust-banner-sdk #onetrust-button-group-parent button#onetrust-pc-btn-handler:hover {
  background-color: #3f4d5a;
  color: white;
}
html.aspnet-demos #onetrust-consent-sdk #onetrust-pc-sdk {
  background-color: white;
}
html.aspnet-demos #onetrust-consent-sdk #onetrust-pc-sdk h3,
html.aspnet-demos #onetrust-consent-sdk #onetrust-pc-sdk h4,
html.aspnet-demos #onetrust-consent-sdk #onetrust-pc-sdk p,
html.aspnet-demos #onetrust-consent-sdk #onetrust-pc-sdk #ot-pc-title,
html.aspnet-demos #onetrust-consent-sdk #onetrust-pc-sdk #ot-pc-desc {
  color: #3f4d5a;
}
html.aspnet-demos #onetrust-consent-sdk #onetrust-pc-sdk .ot-pc-header,
html.aspnet-demos #onetrust-consent-sdk #onetrust-pc-sdk .ot-pc-footer,
html.aspnet-demos #onetrust-consent-sdk #onetrust-pc-sdk .ot-pc-footer-logo,
html.aspnet-demos #onetrust-consent-sdk #onetrust-pc-sdk .ot-accordion-layout.ot-cat-item {
  border-color: #edf0f2;
}
html.aspnet-demos #onetrust-consent-sdk #onetrust-pc-sdk .ot-plus-minus span {
  background-color: #3f4d5a;
}
html.aspnet-demos #onetrust-consent-sdk #onetrust-pc-sdk .ot-pc-footer-logo,
html.aspnet-demos #onetrust-consent-sdk #onetrust-pc-sdk .ot-acc-grpcntr.ot-acc-txt,
html.aspnet-demos #onetrust-consent-sdk #onetrust-pc-sdk .ot-acc-txt .ot-subgrp-tgl .ot-switch.ot-toggle {
  background-color: white;
}
html.aspnet-demos #onetrust-consent-sdk #onetrust-pc-sdk .ot-vs-list .ot-always-active,
html.aspnet-demos #onetrust-consent-sdk #onetrust-pc-sdk .ot-cat-grp .ot-always-active {
  color: #512bd4;
}
html.aspnet-demos #onetrust-consent-sdk #onetrust-pc-sdk .category-host-list-handler {
  color: #512bd4 !important;
}
html.aspnet-demos #onetrust-consent-sdk #onetrust-pc-sdk button:not(#clear-filters-handler):not(.ot-close-icon):not(#filter-btn-handler):not(.ot-remove-objection-handler):not(.ot-obj-leg-btn-handler):not([aria-expanded]):not(.ot-link-btn) {
  background-color: #512bd4 !important;
  border-color: #512bd4 !important;
}
html.aspnet-demos #onetrust-consent-sdk #onetrust-pc-sdk button:not(#clear-filters-handler):not(.ot-close-icon):not(#filter-btn-handler):not(.ot-remove-objection-handler):not(.ot-obj-leg-btn-handler):not([aria-expanded]):not(.ot-link-btn):hover {
  background-color: #4525b4 !important;
  border-color: #4525b4 !important;
}
html.aspnet-demos #onetrust-consent-sdk #onetrust-pc-sdk button:not(#clear-filters-handler):not(.ot-close-icon):not(#filter-btn-handler):not(.ot-remove-objection-handler):not(.ot-obj-leg-btn-handler):not([aria-expanded]):not(.ot-link-btn):active,
html.aspnet-demos #onetrust-consent-sdk #onetrust-pc-sdk button:not(#clear-filters-handler):not(.ot-close-icon):not(#filter-btn-handler):not(.ot-remove-objection-handler):not(.ot-obj-leg-btn-handler):not([aria-expanded]):not(.ot-link-btn):focus {
  background-color: #391e94 !important;
  border-color: #391e94 !important;
}
html.aspnet-demos #onetrust-consent-sdk #onetrust-pc-sdk button:not(#clear-filters-handler):not(.ot-close-icon):not(#filter-btn-handler):not(.ot-remove-objection-handler):not(.ot-obj-leg-btn-handler):not([aria-expanded]):not(.ot-link-btn):focus {
  outline-width: 0;
}
html.aspnet-demos #onetrust-consent-sdk #onetrust-pc-sdk .ot-tgl input:checked + .ot-switch .ot-switch-nob {
  border-color: #512bd4;
  background-color: rgba(81, 43, 212, 0.1);
}
html.aspnet-demos #onetrust-consent-sdk #onetrust-pc-sdk .ot-tgl input:checked + .ot-switch .ot-switch-nob:before {
  background-color: #512bd4;
}
html.aspnet-demos #onetrust-consent-sdk #onetrust-pc-sdk.otPcCenter {
  box-shadow: 0px 4px 12px rgba(0, 0, 0, 0.16);
}
html.aspnet-demos #onetrust-consent-sdk #onetrust-policy-text {
  color: #3f4d5a;
}
html.aspnet-demos #onetrust-consent-sdk #onetrust-banner-sdk {
  background-color: white;
}
html.aspnet-demos #onetrust-consent-sdk #onetrust-banner-sdk #onetrust-button-group-parent .banner-actions-container button {
  background-color: #512bd4;
  border-color: #512bd4;
}
html.aspnet-demos #onetrust-consent-sdk #onetrust-banner-sdk #onetrust-button-group-parent button#onetrust-pc-btn-handler {
  background-color: white;
  border: 2px solid #3f4d5a;
  color: #3f4d5a;
}
html.aspnet-demos #onetrust-consent-sdk #onetrust-banner-sdk #onetrust-button-group-parent button#onetrust-pc-btn-handler:hover {
  background-color: #3f4d5a;
  color: white;
}
html.aspnet-demos #onetrust-consent-sdk #onetrust-pc-sdk {
  background-color: white;
}
html.aspnet-demos #onetrust-consent-sdk #onetrust-pc-sdk h3,
html.aspnet-demos #onetrust-consent-sdk #onetrust-pc-sdk h4,
html.aspnet-demos #onetrust-consent-sdk #onetrust-pc-sdk p,
html.aspnet-demos #onetrust-consent-sdk #onetrust-pc-sdk #ot-pc-title,
html.aspnet-demos #onetrust-consent-sdk #onetrust-pc-sdk #ot-pc-desc {
  color: #3f4d5a;
}
html.aspnet-demos #onetrust-consent-sdk #onetrust-pc-sdk .ot-pc-header,
html.aspnet-demos #onetrust-consent-sdk #onetrust-pc-sdk .ot-pc-footer,
html.aspnet-demos #onetrust-consent-sdk #onetrust-pc-sdk .ot-pc-footer-logo,
html.aspnet-demos #onetrust-consent-sdk #onetrust-pc-sdk .ot-accordion-layout.ot-cat-item {
  border-color: #edf0f2;
}
html.aspnet-demos #onetrust-consent-sdk #onetrust-pc-sdk .ot-plus-minus span {
  background-color: #3f4d5a;
}
html.aspnet-demos #onetrust-consent-sdk #onetrust-pc-sdk .ot-pc-footer-logo,
html.aspnet-demos #onetrust-consent-sdk #onetrust-pc-sdk .ot-acc-grpcntr.ot-acc-txt,
html.aspnet-demos #onetrust-consent-sdk #onetrust-pc-sdk .ot-acc-txt .ot-subgrp-tgl .ot-switch.ot-toggle {
  background-color: white;
}
html.aspnet-demos #onetrust-consent-sdk #onetrust-pc-sdk .ot-vs-list .ot-always-active,
html.aspnet-demos #onetrust-consent-sdk #onetrust-pc-sdk .ot-cat-grp .ot-always-active {
  color: #512bd4;
}
html.aspnet-demos #onetrust-consent-sdk #onetrust-pc-sdk .category-host-list-handler {
  color: #512bd4 !important;
}
html.aspnet-demos #onetrust-consent-sdk #onetrust-pc-sdk button:not(#clear-filters-handler):not(.ot-close-icon):not(#filter-btn-handler):not(.ot-remove-objection-handler):not(.ot-obj-leg-btn-handler):not([aria-expanded]):not(.ot-link-btn) {
  background-color: #512bd4 !important;
  border-color: #512bd4 !important;
}
html.aspnet-demos #onetrust-consent-sdk #onetrust-pc-sdk button:not(#clear-filters-handler):not(.ot-close-icon):not(#filter-btn-handler):not(.ot-remove-objection-handler):not(.ot-obj-leg-btn-handler):not([aria-expanded]):not(.ot-link-btn):hover {
  background-color: #4525b4 !important;
  border-color: #4525b4 !important;
}
html.aspnet-demos #onetrust-consent-sdk #onetrust-pc-sdk button:not(#clear-filters-handler):not(.ot-close-icon):not(#filter-btn-handler):not(.ot-remove-objection-handler):not(.ot-obj-leg-btn-handler):not([aria-expanded]):not(.ot-link-btn):active,
html.aspnet-demos #onetrust-consent-sdk #onetrust-pc-sdk button:not(#clear-filters-handler):not(.ot-close-icon):not(#filter-btn-handler):not(.ot-remove-objection-handler):not(.ot-obj-leg-btn-handler):not([aria-expanded]):not(.ot-link-btn):focus {
  background-color: #391e94 !important;
  border-color: #391e94 !important;
}
html.aspnet-demos #onetrust-consent-sdk #onetrust-pc-sdk button:not(#clear-filters-handler):not(.ot-close-icon):not(#filter-btn-handler):not(.ot-remove-objection-handler):not(.ot-obj-leg-btn-handler):not([aria-expanded]):not(.ot-link-btn):focus {
  outline-width: 0;
}
html.aspnet-demos #onetrust-consent-sdk #onetrust-pc-sdk .ot-tgl input:checked + .ot-switch .ot-switch-nob {
  border-color: #512bd4;
  background-color: rgba(81, 43, 212, 0.1);
}
html.aspnet-demos #onetrust-consent-sdk #onetrust-pc-sdk .ot-tgl input:checked + .ot-switch .ot-switch-nob:before {
  background-color: #512bd4;
}
html.aspnet-demos #onetrust-consent-sdk #onetrust-pc-sdk.otPcCenter {
  box-shadow: 0px 4px 12px rgba(0, 0, 0, 0.16);
}
html.aspnet-demos #onetrust-consent-sdk #onetrust-policy-text {
  color: #3f4d5a;
}
html.aspnet-demos header .header a.logo {
  font-size: 20px;
  font-weight: 600;
}
html.aspnet-demos header .header a.logo span {
  color: #3f4d5a;
}
html.aspnet-demos .code .CodeMirror .cm-variable {
  color: #333333;
}