﻿@charset "UTF-8";
html {
  -ms-text-size-adjust: 100%;
  -webkit-text-size-adjust: 100%;
  box-sizing: border-box;
}

*, *:before, *:after {
  box-sizing: inherit;
}

body {
  margin: 0;
  font-size: 16px;
  line-height: 1.5;
  -moz-osx-font-smoothing: grayscale;
  -webkit-font-smoothing: antialiased;
  -webkit-overflow-scrolling: touch;
  /*font-weight:300;*/
}

h1,
h2,
h3,
h4,
p,
blockquote,
figure,
ol,
ul {
  margin: 0;
  padding: 0;
}

main,
li {
  display: block;
}

h1,
h2,
h3,
h4 {
  font-size: inherit;
}

strong {
  font-weight: bold;
}

a,
button {
  color: inherit;
}

a {
  text-decoration: none;
}

button {
  overflow: visible;
  border: 0;
  font: inherit;
  -webkit-font-smoothing: inherit;
  letter-spacing: inherit;
  background: none;
  cursor: pointer;
}

::-moz-focus-inner {
  padding: 0;
  border: 0;
}

:focus {
  outline: 0;
}

img {
  max-width: 100%;
  height: auto;
  border: 0;
}

input, textarea, select, button {
  font-size: 1rem;
}

.nowrap {
  word-break: normal;
}

.no-display {
  display: none;
}

@font-face {
  font-family: GothamPro;
  src: url("/font/GothamPro-Light.eot");
  src: url("/font/GothamPro-Light.woff2") format("woff2"), url("/font/GothamPro-Light.woff") format("woff"), url("/font/GothamPro-Light.ttf") format("truetype"), url("/font/GothamPro-Light.svg#GothamPro-Light") format("svg"), url("/font/GothamPro-Light.eot?#iefix") format("embedded-opentype");
  font-weight: 100;
  font-style: normal;
}
@font-face {
  font-family: GothamPro;
  src: url("/font/GothamPro-LightItalic.eot");
  src: url("/font/GothamPro-LightItalic.woff2") format("woff2"), url("/font/GothamPro-LightItalic.woff") format("woff"), url("/font/GothamPro-LightItalic.ttf") format("truetype"), url("/font/GothamPro-LightItalic.svg#GothamPro-LightItalic") format("svg"), url("/font/GothamPro-LightItalic.eot?#iefix") format("embedded-opentype");
  font-weight: 100;
  font-style: italic;
}
@font-face {
  font-family: GothamPro;
  src: url("/font/GothamPro.eot");
  src: url("/font/GothamPro.woff2") format("woff2"), url("/font/GothamPro.woff") format("woff"), url("/font/GothamPro.ttf") format("truetype"), url("/font/GothamPro.svg#GothamPro") format("svg"), url("/font/GothamPro.eot?#iefix") format("embedded-opentype");
  font-weight: 200;
  font-style: normal;
}
@font-face {
  font-family: GothamPro;
  src: url("/font/GothamPro-Italic.eot");
  src: url("/font/GothamPro-Italic.woff2") format("woff2"), url("/font/GothamPro-Italic.woff") format("woff"), url("/font/GothamPro-Italic.ttf") format("truetype"), url("/font/GothamPro-Italic.svg#GothamPro-Italic") format("svg"), url("/font/GothamPro-Italic.eot?#iefix") format("embedded-opentype");
  font-weight: 200;
  font-style: italic;
}
@font-face {
  font-family: GothamPro;
  src: url("/font/GothamPro-Medium.eot");
  src: url("/font/GothamPro-Medium.woff2") format("woff2"), url("/font/GothamPro-Medium.woff") format("woff"), url("/font/GothamPro-Medium.ttf") format("truetype"), url("/font/GothamPro-Medium.svg#GothamPro-Medium") format("svg"), url("/font/GothamPro-Medium.eot?#iefix") format("embedded-opentype");
  font-weight: 400;
  font-style: normal;
}
@font-face {
  font-family: GothamPro;
  src: url("/font/GothamPro-MediumItalic.eot");
  src: url("/font/GothamPro-MediumItalic.woff2") format("woff2"), url("/font/GothamPro-MediumItalic.woff") format("woff"), url("/font/GothamPro-MediumItalic.ttf") format("truetype"), url("/font/GothamPro-MediumItalic.svg#GothamPro-MediumItalic") format("svg"), url("/font/GothamPro-MediumItalic.eot?#iefix") format("embedded-opentype");
  font-weight: 400;
  font-style: italic;
}
@font-face {
  font-family: GothamPro;
  src: url("/font/GothamPro-Bold.eot");
  src: url("/font/GothamPro-Bold.woff2") format("woff2"), url("/font/GothamPro-Bold.woff") format("woff"), url("/font/GothamPro-Bold.ttf") format("truetype"), url("/font/GothamPro-Bold.svg#GothamPro-Bold") format("svg"), url("/font/GothamPro-Bold.eot?#iefix") format("embedded-opentype");
  font-weight: bold;
  font-style: normal;
}
@font-face {
  font-family: GothamPro;
  src: url("/font/GothamPro-BoldItalic.eot");
  src: url("/font/GothamPro-BoldItalic.woff2") format("woff2"), url("/font/GothamPro-BoldItalic.woff") format("woff"), url("/font/GothamPro-BoldItalic.ttf") format("truetype"), url("/font/GothamPro-BoldItalic.svg#GothamPro-BoldItalic") format("svg"), url("/font/GothamPro-BoldItalic.eot?#iefix") format("embedded-opentype");
  font-weight: bold;
  font-style: italic;
}
@font-face {
  font-family: GothamPro;
  src: url("/font/GothamPro-Black.eot");
  src: url("/font/GothamPro-Black.woff2") format("woff2"), url("/font/GothamPro-Black.woff") format("woff"), url("/font/GothamPro-Black.ttf") format("truetype"), url("/font/GothamPro-Black.svg#GothamPro-Black") format("svg"), url("/font/GothamPro-Black.eot?#iefix") format("embedded-opentype");
  font-weight: 800;
  font-style: normal;
}
@font-face {
  font-family: GothamPro;
  src: url("/font/GothamPro-BlackItalic.eot");
  src: url("/font/GothamPro-BlackItalic.woff2") format("woff2"), url("/font/GothamPro-BlackItalic.woff") format("woff"), url("/font/GothamPro-BlackItalic.ttf") format("truetype"), url("/font/GothamPro-BlackItalic.svg#GothamPro-BlackItalic") format("svg"), url("/font/GothamPro-BlackItalic.eot?#iefix") format("embedded-opentype");
  font-weight: 800;
  font-style: italic;
}
@font-face {
  font-family: "Gotham";
  src: url("/include/fonts/Gotham-Light.eot");
  src: url("/include/fonts/Gotham-Light.eot?#iefix") format("embedded-opentype"), url("/include/fonts/Gotham-Light.woff") format("woff"), url("/include/fonts/Gotham-Light.ttf") format("truetype");
  font-weight: 300;
  font-style: normal;
}
@font-face {
  font-family: "DBUBoldWide";
  src: url("/font/DBU-BoldWide.woff2") format("woff2");
  font-weight: bold;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "DBUCondensed";
  src: url("/font/DBU-RegularCondensed.woff2") format("woff2");
  font-weight: normal;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "DBU";
  src: url("/font/DBU-Regular.woff2") format("woff2");
  font-weight: normal;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "DBUBoldCondensed";
  src: url("/font/DBU-BoldCondensed.woff2") format("woff2");
  font-weight: bold;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "DBU";
  src: url("/font/DBU-Bold.woff2") format("woff2");
  font-weight: bold;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "DBUWide";
  src: url("/font/DBU-RegularWide.woff2") format("woff2");
  font-weight: normal;
  font-style: normal;
  font-display: swap;
}
body {
  width: 100%;
  overflow: hidden;
  overflow-x: hidden;
  overflow-y: auto;
  background-color: #F0F0F0;
  font-family: "GothamPro";
  font-weight: 300;
  color: #202020;
}
body[data-main-nav=open] {
  max-height: 100%;
  overflow: hidden;
  position: fixed;
  -webkit-overflow-scrolling: touch;
  overscroll-behavior: none;
}
body .sitewrap {
  display: flex;
  gap: 2rem;
  width: 100%;
  padding-right: 2rem;
  flex-basis: 0;
}
body .sitewrap main {
  padding-top: 80px;
  padding-bottom: 2rem;
  width: 100%;
  max-width: calc(100% - 165px - 2rem);
  padding-bottom: calc(2rem + 66px + 160px);
  order: 2;
}
@media only screen and (max-width: 1024px) {
  body .sitewrap main {
    max-width: calc(100% - 1rem) !important;
    padding-top: 50px;
  }
}
body .sitewrap .nav-wrap {
  padding-right: 165px;
  order: 1;
}
@media only screen and (max-width: 1024px) {
  body .sitewrap .nav-wrap {
    display: none;
  }
}
body .sitewrap .nav-wrap.mobile-nav-is-open {
  display: flex;
  position: fixed;
  top: 30px;
  left: 0;
}
@media only screen and (max-width: 1024px) {
  body .sitewrap {
    padding-right: 0rem;
    justify-content: center;
  }
}

body.is-mini-nav .sitewrap main {
  max-width: calc(100% - 44px - 2rem);
}
body.is-mini-nav .sitewrap .nav-wrap {
  padding-right: 44px;
}

.drag-handle {
  cursor: move;
}

body.is-mini-nav .logo-wrap {
  width: 140px;
  margin-right: 0rem;
}
body.is-mini-nav .logo-wrap.scrolled {
  width: 80px;
}
@media only screen and (max-width: 1024px) {
  body.is-mini-nav .logo-wrap {
    display: none;
  }
}
body.is-mini-nav .header-title-wrap {
  margin-left: 140px;
}
@media only screen and (max-width: 1024px) {
  body.is-mini-nav .header-title-wrap {
    margin-left: 0;
  }
}

.logo-wrap {
  display: inline-flex;
  align-items: flex-start;
  width: 140px;
  margin-right: 1rem;
  position: fixed;
  top: 0;
  left: 0;
  z-index: 11;
  transition: all 400ms ease-in-out;
}
@media only screen and (max-width: 1024px) {
  .logo-wrap {
    display: none;
  }
}
.logo-wrap a {
  z-index: 10;
}
.logo-wrap .dbu-logo {
  margin-top: 6px;
  margin-left: 10px;
  margin-right: 10px;
  z-index: 9;
  transition: all 400ms ease-in-out;
}
.logo-wrap.scrolled {
  margin-left: -10px;
}
.logo-wrap.scrolled .dbu-logo {
  margin-left: -40px;
}

.header {
  position: absolute;
  z-index: 10;
  display: flex;
  width: 100%;
}
@media only screen and (max-width: 1024px) {
  .header {
    background-color: #202020;
    flex-direction: column;
    position: fixed;
    /*border-radius:0 0 10px 10px;*/
    box-shadow: rgba(0, 0, 0, 0.24) 0px 0px 4px;
  }
}
.header .header-title-wrap {
  width: calc(100% - 125px);
  display: inline-flex;
  justify-content: space-between;
  background-color: #F0F0F0;
  transition: 200ms all ease;
  margin-left: 200px;
}
@media only screen and (max-width: 1024px) {
  .header .header-title-wrap {
    display: grid;
    grid-template-columns: 60px 1fr 28px;
    flex-direction: column;
    background-color: #202020;
    width: 100%;
    margin-left: 0;
    /*border-radius:0 0 10px 10px;*/
  }
  .header .header-title-wrap .breadcrumb-title-wrap {
    display: flex;
    flex-direction: column;
    align-content: flex-start;
    gap: 0rem;
    padding-top: 4px;
  }
}
.header .header-title-wrap .breadcrumb {
  font-weight: bold;
  text-transform: uppercase;
}
@media only screen and (max-width: 1024px) {
  .header .header-title-wrap .breadcrumb h1 {
    font-size: 10px;
    line-height: 10px;
    color: #F6F6F6;
  }
}
.header .header-title-wrap .breadcrumb .blue {
  color: #4CA2C7;
}
@media only screen and (max-width: 1024px) {
  .header .header-title-wrap .breadcrumb .blue {
    color: #6FC5EA;
  }
}
@media only screen and (max-width: 1024px) {
  .header .header-title-wrap .breadcrumb {
    /*color:$color--almostwhite;*/
    font-size: 12px;
  }
}
.header .header-title-wrap .logo-mobile {
  display: none;
}
.header .header-title-wrap .logo-mobile img {
  width: 52px;
  margin-bottom: -9px;
}
@media only screen and (max-width: 1024px) {
  .header .header-title-wrap .logo-mobile {
    display: inline-flex;
  }
}
.header .header-title-wrap .mobile-nav-toggle {
  display: none;
  cursor: pointer;
}
.header .header-title-wrap .mobile-nav-toggle img {
  width: 20px;
}
@media only screen and (max-width: 1024px) {
  .header .header-title-wrap .mobile-nav-toggle {
    display: inline-flex;
  }
}
.header .header-title-wrap .header-title {
  font-size: 2rem;
  margin: 0;
  text-transform: uppercase;
  line-height: 2rem;
}
@media only screen and (max-width: 1024px) {
  .header .header-title-wrap .header-title {
    color: #F6F6F6;
    font-size: 12px;
    line-height: 12px;
  }
}

.foda2._body.login {
  background-image: url("/img/bg_login.png");
  background-size: cover;
  background-position: right bottom;
  height: 100vh !important;
  overflow: hidden !important;
}
.foda2._body.login .login-wrap {
  width: 500px;
  padding: 25px;
  margin: 100px auto;
  background: #fff;
  border-radius: 12px;
  box-shadow: 0 4px 15px rgba(0, 0, 0, 0.15);
  position: relative;
  min-height: 300px;
}
.foda2._body.login .login-wrap .login-header {
  position: absolute;
  top: 0;
  left: 0;
  display: flex;
  align-items: center;
}
.foda2._body.login .login-wrap .login-header img {
  height: 60px;
}
.foda2._body.login .login-wrap .login-header img.system-logo {
  border-top-left-radius: 12px;
  height: 70px;
}
.foda2._body.login .login-wrap .login-header img.dbu-logo {
  margin-left: 10px;
  height: 55px;
}
.foda2._body.login .login-wrap .tile {
  border: 0;
  padding-top: 50px;
  display: flex;
  justify-content: center;
  align-items: center;
}
.foda2._body.login .login-wrap .tile .tile-content {
  gap: 1rem;
}
.foda2._body.login .login-wrap .tile .tile-content .field > label {
  font-size: 14px;
  margin-bottom: 0.5rem;
}
.foda2._body.login .login-wrap .tile .tile-content .field .k-textbox {
  font-size: 14px;
  height: 40px;
  width: 340px;
}
.foda2._body.login .login-wrap .tile .tile-content .field .k-maskedtextbox {
  width: 100%;
  font-size: 14px;
  height: 40px;
}
.foda2._body.login .login-wrap .tile .tile-content .field .k-maskedtextbox input {
  text-align: center;
}
.foda2._body.login .login-wrap .tile .tile-content .field input[type=checkbox] {
  height: 24px;
  width: 24px;
}
.foda2._body.login .login-wrap .tile .tile-content .field input[type=checkbox]:focus {
  box-shadow: none;
  color: #6FC5EA;
  border: 2px solid rgba(187, 187, 187, 0.75);
}
.foda2._body.login .login-wrap .tile .tile-content .field input[type=checkbox]:checked {
  content: "✔";
  color: #CE161C;
  background-color: #ffffff;
  border-color: rgba(187, 187, 187, 0.75);
  font-size: 18px;
}
.foda2._body.login .login-wrap .tile .tile-content .forgot-pwd {
  text-decoration: underline;
  font-size: 14px;
  color: #CE161C;
  margin-top: 10px;
}
.foda2._body.login .login-wrap .tile .tile-content .remember {
  flex-direction: row;
}
.foda2._body.login .login-wrap .tile .tile-content .remember > label {
  width: 80px;
  margin: 0;
}
.foda2._body.login .login-wrap .tile .tile-content .qr-code {
  height: 150px !important;
  width: fit-content !important;
  margin: 20px auto;
}
.foda2._body.login .login-wrap .tile .tile-content .btn-wrap {
  display: flex;
  align-items: center;
  flex-direction: column;
}
.foda2._body.login .login-wrap .tile .tile-content .btn-wrap > .btn {
  height: 36px;
  font-size: 14px;
  line-height: 32px;
}
.foda2._body.login .login-wrap .tile .tile-content .btn-wrap > .btn:focus {
  transform: translateY(2px);
  border: 2px solid #6FC5EA;
}
.foda2._body.login .bottom-bar {
  width: 100%;
}

.page-grid {
  display: grid;
  grid-row-gap: 1rem;
}
.page-grid .row {
  display: grid;
  grid-column-gap: 1rem;
  grid-row-gap: 1rem;
  grid-template-columns: repeat(12, 1fr);
}
@media only screen and (max-width: 1024px) {
  .page-grid .row {
    grid-template-columns: 1fr;
  }
}
.page-grid .row [class^=col-] {
  display: flex;
  flex-direction: column;
  gap: 1rem;
}
@media only screen and (max-width: 1024px) {
  .page-grid .row [class^=col-] {
    grid-column: auto !important;
  }
}
.page-grid .row .col-12 {
  grid-column: span 12;
}
.page-grid .row .col-9 {
  grid-column: span 9;
}
.page-grid .row .col-8 {
  grid-column: span 8;
}
.page-grid .row .col-6 {
  grid-column: span 6;
}
.page-grid .row .col-4 {
  grid-column: span 4;
}
.page-grid .row .col-3 {
  grid-column: span 3;
}

.edit-page-content.edit-open .tile-content .field-content.static {
  display: none !important;
}
.edit-page-content.edit-open .tile-content .field-content.edit {
  display: flex;
}
.edit-page-content:not(.edit-open) .tile-content .field-content.static {
  display: flex;
}
.edit-page-content:not(.edit-open) .tile-content .field-content.edit {
  display: none;
}

.tile {
  background-color: #fff;
  border-radius: 8px;
  border: 1px solid rgba(187, 187, 187, 0.75);
  /*overflow: hidden;*/
}
.tile .tile-header {
  border-bottom: 1px solid rgba(187, 187, 187, 0.75);
  font-weight: bold;
  color: #403F3F;
  font-size: 14px;
  padding: 0.3rem 0.8rem;
  display: flex;
  flex-direction: row;
  align-items: center;
  gap: 0.4rem;
  justify-content: space-between;
  position: sticky;
  top: 0;
  z-index: 2;
  background-color: #fff;
  border-radius: 8px 8px 0 0;
}
@media only screen and (max-width: 1024px) {
  .tile .tile-header {
    top: 30px;
  }
}
.tile .tile-header.set-relative:not(.dont-set-relative) {
  position: relative;
  z-index: unset;
}
.tile .tile-header h3 {
  display: inline-flex;
  line-height: 24px;
}
.tile .tile-header .tile-header-left, .tile .tile-header .tile-header-right {
  display: flex;
  flex-direction: row;
  gap: 0.75rem;
  align-items: center;
  height: 20px;
  padding-right: 0.2rem;
}
.tile .tile-header .tile-header-left .grid-to-excel, .tile .tile-header .tile-header-left .grid-clear, .tile .tile-header .tile-header-right .grid-to-excel, .tile .tile-header .tile-header-right .grid-clear {
  display: flex;
}
.tile .tile-header .tile-header-left .grid-to-excel img, .tile .tile-header .tile-header-left .grid-clear img, .tile .tile-header .tile-header-right .grid-to-excel img, .tile .tile-header .tile-header-right .grid-clear img {
  height: 16px;
}
.tile .tile-header .tile-header-left .tab-bar-menu-toggle, .tile .tile-header .tile-header-right .tab-bar-menu-toggle {
  margin: 0;
}
.tile.row-view .tile-content {
  padding: 2rem;
  display: flex;
  flex-direction: row;
  gap: 6rem;
  justify-content: flex-start;
  flex-wrap: wrap;
}
.tile .tile-content {
  padding: 2rem;
  /*display: grid;*/
  /*grid-template-columns: repeat(12, 1fr);*/
  display: flex;
  flex-direction: column;
  gap: 2rem;
  /*position:relative;*/
}
.tile .tile-content .tile-content-col-wrap {
  display: flex;
  flex-direction: row;
  gap: 2rem;
}
@media only screen and (max-width: 1024px) {
  .tile .tile-content .tile-content-col-wrap {
    flex-direction: column;
  }
}
.tile .tile-content .tile-content-col-wrap .tile-content-col {
  display: flex;
  flex-direction: column;
  gap: 2rem;
}
.tile .tile-content .tile-content-col-wrap[class*=colcount_] {
  gap: 0;
}
@media only screen and (max-width: 1024px) {
  .tile .tile-content .tile-content-col-wrap[class*=colcount_] {
    gap: 2rem;
  }
}
.tile .tile-content .tile-content-col-wrap.colcount_2 .tile-content-col {
  width: 50%;
}
.tile .tile-content .tile-content-col-wrap.colcount_3 .tile-content-col {
  width: 33.3%;
}
.tile .tile-content .tile-content-col-wrap.colcount_4 .tile-content-col {
  width: 25%;
}
.tile .tile-content .tile-col {
  display: flex;
  flex-direction: column;
  gap: 2rem;
  padding-right: 1rem;
}
.tile .tile-content .tile-col:last-child {
  border-right: 0;
}
.tile .tile-content hr {
  border: 0;
  border-bottom: 1px solid #DEDEDE;
  border-radius: 4px;
  width: 100%;
}
.tile .tile-content .field-wrap {
  display: inline-flex;
  gap: 2rem;
}
.tile .tile-content .field {
  display: flex;
  flex-direction: column;
}
.tile .tile-content .field .field-link-icon {
  display: none;
  cursor: pointer;
}
.tile .tile-content .field .field-link-icon.show {
  display: flex;
}
.tile .tile-content .field.wrap {
  display: inline-flex;
}
.tile .tile-content .field > label {
  font-size: 12px;
  color: #808080;
  font-weight: bold;
  display: flex;
  margin-bottom: 0.4rem;
  gap: 0.5rem;
  flex-direction: row;
  align-content: center;
  align-items: center;
}
.tile .tile-content .field .field-content {
  font-size: 14px;
  display: flex;
  flex-direction: column;
}
.tile .tile-content .field .field-content.static {
  display: inline-block;
}
.tile .tile-content .field .field-content.static .field-link-a.has-link:hover {
  text-decoration: underline;
}
.tile .tile-bottom-bar {
  border-top: 1px solid rgba(187, 187, 187, 0.75);
  display: flex;
  background-color: #F6F6F6;
  height: 66px;
  align-items: center;
  justify-content: center;
  align-content: center;
  border-radius: 0 0 8px 8px;
}
.tile .tile-bottom-bar img {
  transition: 180ms all ease;
  opacity: 1;
  cursor: pointer;
}
.tile .tile-bottom-bar img:hover {
  opacity: 0.8;
}
.tile.attached {
  margin-top: 1px;
  position: relative;
}
.tile.attached::before {
  content: "";
  height: 20px;
  width: 20px;
  background-image: url(/img/icons/attached.svg);
  background-size: contain;
  background-repeat: no-repeat;
  position: absolute;
  top: -19px;
  left: 50%;
  transform: translate(-50%);
}

.tile-button-wrap {
  width: 100%;
  background-color: #F6F6F6;
  padding: 1rem;
  display: flex;
  justify-content: center;
  border-radius: 0 0 8px 8px;
}

.drawer-content .tile {
  border: 0;
}
.drawer-content .tile-content {
  padding: 0;
  transition: 180ms all ease;
}

.mobile-nav-open .tile-header {
  z-index: 0 !important;
}

body .ui-dialog .ui-dialog-titlebar {
  padding: 8px;
  padding-bottom: 6px;
  border-bottom: 1px solid #6FC5EA;
  padding-left: 1rem;
  color: #F6F6F6;
  background-color: #4CA2C7;
  font-weight: bold;
  font-size: 16px;
  border-bottom-left-radius: 0;
  border-bottom-right-radius: 0;
}

body .ui-dialog .ui-dialog-content h6 {
  font-weight: bold;
  font-size: 16px;
  text-align: center;
  padding: 0 30px;
  margin: 30px 0 0 0;
}

body .ui-widget.ui-widget-content {
  border: 0;
  border-radius: 10px;
  overflow: hidden;
}

body .ui-widget-content {
  border: 0;
}

body .ui-dialog {
  padding: 0;
  border: 0;
  border-radius: 8px;
}

body .ui-dialog {
  width: 374px !important;
  background-color: #ffffff;
  z-index: 101;
  box-shadow: rgba(17, 17, 26, 0.1) 0px 1px 0px, rgba(17, 17, 26, 0.1) 0px 8px 24px, rgba(17, 17, 26, 0.1) 0px 16px 48px;
}
body .ui-dialog .ui-dialog-buttonpane {
  display: flex;
  justify-content: center;
}
body .ui-dialog .ui-dialog-buttonpane button {
  border: 2px solid #4CA2C7;
  height: 34px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 8px;
  color: #4CA2C7;
  font-size: 12px;
  padding: 0 1rem;
  font-weight: 900;
  position: relative;
  text-transform: uppercase;
  line-height: 16px;
  letter-spacing: 1px;
  background-color: #ffffff;
  cursor: pointer;
  transition: ease-in-out 100ms all;
  margin: 0.5rem;
}
body .ui-dialog .ui-dialog-buttonpane button:hover:not(.disabled) {
  color: #6FC5EA;
  border-color: #6FC5EA;
  transform: translateY(2px);
}

body .ui-dialog .ui-dialog-buttonpane button:nth-child(2) {
  border-color: #4CA2C7;
  background-color: #4CA2C7;
  color: #ffffff;
}
body .ui-dialog .ui-dialog-buttonpane button:nth-child(2):hover:not(.disabled) {
  background: #6FC5EA;
  border-color: #6FC5EA;
  color: #ffffff;
}

body .ui-dialog .ui-dialog-buttonpane {
  padding: 1rem;
  display: flex;
}

body .ui-dialog .ui-dialog-buttonset {
  display: flex;
  justify-content: center;
  width: 100%;
}

.content-html, .field-html {
  font-size: 14px;
  display: flex;
  flex-direction: column;
  gap: 1rem;
  /*white-space: pre-wrap;*/
}
.content-html a, .field-html a {
  text-decoration: underline;
  color: #4CA2C7;
}
.content-html p, .field-html p {
  font-size: 14px;
}
.content-html ul, .field-html ul {
  display: block;
  /*margin-left: -10px;*/
}
.content-html ul li, .field-html ul li {
  display: block;
  position: relative;
  margin-left: 32px;
}
.content-html ul li:not(:last-child), .field-html ul li:not(:last-child) {
  margin-bottom: 16px;
}
.content-html ul li:before, .field-html ul li:before {
  content: "";
  position: absolute;
  top: 1.2em;
  left: -30px;
  margin-top: -0.9em;
  background: #FF1C35;
  height: 12px;
  width: 12px;
  border-radius: 50%;
}
.content-html ol li, .field-html ol li {
  list-style-type: none;
  counter-increment: item;
}
.content-html ol li:before, .field-html ol li:before {
  content: counter(item);
  margin-right: 10px;
  font-size: 80%;
  background-color: #FF1C35;
  color: #F6F6F6;
  font-weight: bold;
  border-radius: 3px;
  width: 24px;
  display: inline-block;
  text-align: center;
}
.content-html ol li:not(:last-child), .field-html ol li:not(:last-child) {
  margin-bottom: 16px;
}
.content-html + .plain-view, .field-html + .plain-view {
  border-radius: 8px;
  padding: 0.5rem;
  background-color: #F6F6F6;
  display: none;
  max-height: 300px;
  overflow-y: auto;
}

.field-html.content-html {
  border-radius: 8px;
  padding: 0.5rem;
  background-color: #F6F6F6;
}

.plain-view-switch {
  font-size: 8px;
  background-color: #fff;
  padding: 2px;
  position: absolute;
  top: 0;
  right: 0;
  border-radius: 0 8px 0 0;
  cursor: pointer;
}

.field-content.static .field-html.content-html {
  max-height: 300px;
  overflow-y: auto;
}

.main-navigation-accesskey {
  position: absolute;
  top: -1rem;
  left: -1rem;
  height: 0px;
  width: 0px;
}

.main-navigation {
  background-color: #202020;
  height: 100vh;
  width: 162px;
  padding-top: 80px;
  /*position: relative;*/
  transition: 200ms ease-in-out all;
  z-index: 9;
  position: fixed;
}
@media only screen and (max-width: 1024px) {
  .main-navigation {
    width: 100%;
    right: 0;
    z-index: 10000;
    padding-top: 4px;
  }
  .main-navigation .navigation-items {
    height: calc(100% - 76px);
    max-height: calc(100% - 76px) !important;
  }
}
.main-navigation .expand-nav {
  display: none;
}
.main-navigation.mini .expand-nav {
  display: block;
  margin-left: 6px;
}
.main-navigation .nav-controls {
  position: absolute;
  bottom: 1rem;
  width: 100%;
  text-align: center;
  cursor: pointer;
}
@media only screen and (max-width: 1024px) {
  .main-navigation .nav-controls {
    display: none;
  }
}
.main-navigation .navigation-items {
  /*padding-top: 4rem;*/
  /*gap: 0rem;*/
  display: inline-flex;
  flex-direction: column;
  width: 100%;
}
@media only screen and (max-height: 768px) {
  .main-navigation .navigation-items {
    /*gap: 0.4rem;*/
  }
}
@media only screen and (max-width: 1024px) {
  .main-navigation .navigation-items {
    background-color: #303030;
  }
}
.main-navigation .navigation-item {
  height: 42px;
  cursor: pointer;
}
@media only screen and (max-width: 1024px) {
  .main-navigation .navigation-item {
    /*height:32px;*/
  }
}
.main-navigation .navigation-item .navigation-item-inner {
  display: flex;
  align-items: center;
  justify-content: center;
  height: 100%;
}
@media only screen and (max-width: 1024px) {
  .main-navigation .navigation-item .navigation-item-inner {
    height: auto;
  }
}
.main-navigation .navigation-item .icon-wrap {
  height: 26px;
}
.main-navigation .navigation-item .icon-wrap img {
  max-height: 26px;
  min-height: 26px;
  max-width: 26px;
  min-width: 26px;
}
.main-navigation .navigation-item .title {
  line-height: 42px;
}
.main-navigation .navigation-item .sub-nav-item {
  position: relative;
}
.main-navigation .navigation-item .sub-nav-item.open > .sub-nav-item-inner > .sub-nav-expand {
  transform: rotate(180deg);
}
.main-navigation .navigation-item .sub-nav-item.current:after, .main-navigation .navigation-item .sub-nav-item:hover:after, .main-navigation .navigation-item .sub-nav-item:focus:after {
  content: "";
  position: absolute;
  left: 6px;
  top: 8px;
  width: 3px;
  height: 16px;
  border-radius: 2px;
  background-color: #6FC5EA;
}
.main-navigation:not(.mini) .navigation-items {
  overflow-y: auto;
  max-height: calc(100vh - 160px);
  overflow-x: hidden;
}
.main-navigation:not(.mini) .navigation-items::-webkit-scrollbar {
  width: 4px;
}
.main-navigation:not(.mini) .navigation-items::-webkit-scrollbar-track {
  background-color: #e4e4e4;
  border-radius: 100px;
}
.main-navigation:not(.mini) .navigation-items::-webkit-scrollbar-thumb {
  background-color: #d4aa70;
  border-radius: 100px;
}
.main-navigation:not(.mini) .navigation-item {
  text-align: center;
  position: relative;
}
.main-navigation:not(.mini) .navigation-item.open {
  height: unset;
  background-color: #403F3F;
}
.main-navigation:not(.mini) .navigation-item.open .sub-nav.first-level {
  padding-bottom: 0;
}
.main-navigation:not(.mini) .navigation-item.open .navigation-item-inner {
  border-bottom: 1px solid rgba(255, 255, 255, 0.2);
}
.main-navigation:not(.mini) .navigation-item:hover, .main-navigation:not(.mini) .navigation-item:focus {
  background-color: #403F3F;
}
.main-navigation:not(.mini) .navigation-item:focus::after {
  content: "";
  background-color: #6FC5EA;
  height: 32px;
  width: 3px;
  position: absolute;
  left: 0px;
  top: 0px;
}
.main-navigation:not(.mini) .navigation-item .navigation-item-inner {
  display: flex;
  align-items: center;
  text-align: left;
  justify-content: flex-start;
}
.main-navigation:not(.mini) .navigation-item .navigation-item-inner .title {
  color: #fff;
  font-size: 12px;
  font-weight: 300;
  text-transform: uppercase;
  white-space: nowrap;
}
.main-navigation:not(.mini) .navigation-item .navigation-item-inner .icon-wrap {
  /*height: 24px;
  width: 50px;
  text-align: center;*/
  display: flex;
  height: 42px;
  width: 42px;
  flex-direction: row;
  justify-content: center;
  align-items: center;
}
.main-navigation:not(.mini) .navigation-item .navigation-item-inner .icon-wrap img {
  max-height: 24px;
  min-height: 24px;
  max-width: 24px;
  min-width: 24px;
}
.main-navigation:not(.mini) .navigation-item .sub-nav-item-wrap {
  display: flex;
  flex-direction: column;
  /*gap: 0.5rem;*/
  /*padding: 1rem 0;*/
  padding-bottom: 0.5rem;
}
.main-navigation:not(.mini) .navigation-item .sub-nav {
  display: none;
  color: #fff;
  font-size: 10px;
  text-align: left;
  /*margin-left:-1rem;*/
  flex-direction: column;
  /*gap: 0.5rem;*/
  /*padding:1rem 0;*/
  padding-bottom: 0.5rem;
}
.main-navigation:not(.mini) .navigation-item .sub-nav.first-level {
  /*margin-left:0;*/
}
.main-navigation:not(.mini) .navigation-item .sub-nav.first-level > .sub-nav-title {
  display: none;
}
.main-navigation:not(.mini) .navigation-item .sub-nav .sub-nav {
  margin-left: -1rem;
}
.main-navigation:not(.mini) .navigation-item .sub-nav .sub-nav-item {
  /*min-height: 2rem;*/
  padding-left: 1rem;
}
.main-navigation:not(.mini) .navigation-item .sub-nav .sub-nav-item .sub-title {
  line-height: 1rem;
  white-space: wrap;
  word-break: break-word;
  font-size: 12px;
}
.main-navigation:not(.mini) .navigation-item .sub-nav .sub-nav-item.open {
  background-color: rgba(255, 255, 255, 0.1);
}
.main-navigation:not(.mini) .navigation-item .sub-nav .sub-nav-item.open .sub-nav-item-inner {
  border-bottom: rgba(255, 255, 255, 0.2);
}
.main-navigation:not(.mini) .navigation-item .sub-nav .sub-nav-item.open .sub-nav {
  /*background-color: rgba(255,255,255,0.1);*/
}
.main-navigation:not(.mini) .navigation-item .sub-nav .sub-nav-item-inner {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding-right: 4px;
  padding-top: 0.5rem;
  padding-bottom: 0.5rem;
}
.main-navigation.mini {
  width: 44px;
}
.main-navigation.mini .mini-nav {
  display: none;
}
.main-navigation.mini .navigation-item {
  text-align: center;
  position: relative;
}
.main-navigation.mini .navigation-item .title {
  display: none;
}
.main-navigation.mini .navigation-item .sub-nav {
  display: none;
  color: #fff;
  /*padding: 1rem;*/
  z-index: 11;
  text-align: left;
  position: relative;
}
.main-navigation.mini .navigation-item .sub-nav.first-level {
  border-radius: 0 15px 15px 0;
  background-color: #403F3F;
  min-width: 160px;
  position: absolute;
  top: 0;
  /*transform: translateY(-50%);*/
  left: 100%;
  padding-bottom: 1rem;
}
.main-navigation.mini .navigation-item .sub-nav .sub-nav-item-wrap {
  padding: 0 1rem;
  padding-bottom: 0.5rem;
  max-height: 460px;
  overflow-y: auto;
}
@media only screen and (max-height: 768px) {
  .main-navigation.mini .navigation-item .sub-nav .sub-nav-item-wrap {
    max-height: 360px;
  }
}
.main-navigation.mini .navigation-item .sub-nav .sub-nav-item-wrap::-webkit-scrollbar {
  width: 4px;
}
.main-navigation.mini .navigation-item .sub-nav .sub-nav-item-wrap::-webkit-scrollbar-track {
  background-color: #6b6b6b;
  border-radius: 100px;
}
.main-navigation.mini .navigation-item .sub-nav .sub-nav-item-wrap::-webkit-scrollbar-thumb {
  background-color: #d4aa70;
  border-radius: 100px;
}
.main-navigation.mini .navigation-item .sub-nav .sub-nav-title {
  padding: 1rem 0 0.2rem 0;
  border-bottom: 2px solid rgba(255, 255, 255, 0.2196078431);
  margin: 0 1rem 0 1rem;
  font-size: 12px;
  font-weight: bold;
  text-transform: uppercase;
}
.main-navigation.mini .navigation-item .sub-nav .sub-nav-item {
  min-height: 2rem;
  border-bottom: 2px solid transparent;
  transition: 100ms all ease;
  min-width: 180px;
}
.main-navigation.mini .navigation-item .sub-nav .sub-nav-item.has-current:after, .main-navigation.mini .navigation-item .sub-nav .sub-nav-item.current:after, .main-navigation.mini .navigation-item .sub-nav .sub-nav-item:hover:after, .main-navigation.mini .navigation-item .sub-nav .sub-nav-item:focus:after {
  content: "";
  position: absolute;
  left: 0px;
  top: 24px;
  width: 18px;
  height: 4px;
  border-radius: 2px;
  background-color: #6FC5EA;
}
.main-navigation.mini .navigation-item .sub-nav .sub-nav-item.open > .sub-nav {
  border-left: 1px solid rgba(187, 187, 187, 0.75);
}
.main-navigation.mini .navigation-item .sub-nav .sub-nav-item .sub-nav-item-inner {
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.main-navigation.mini .navigation-item .sub-nav .sub-nav-item .sub-title {
  font-size: 12px;
  line-height: 2rem;
  white-space: nowrap;
}
.main-navigation.mini .navigation-item .sub-nav .sub-nav-item > .sub-nav {
  display: none;
  padding-left: 0.5rem;
  color: #dedede;
  /* &.show {
      display: block;
      > .sub-nav{
          display:none;
      }
  }*/
}
.main-navigation.mini .navigation-item .sub-nav .sub-nav-item > .sub-nav .sub-nav {
  color: #b5b5b5;
}
.main-navigation.mini .navigation-item .sub-nav .sub-nav-item > .sub-nav .sub-nav .sub-nav {
  color: #939393;
}
.main-navigation.mini .navigation-item:hover, .main-navigation.mini .navigation-item:focus, .main-navigation.mini .navigation-item.keep-open {
  background-color: #403F3F;
  border-radius: 8px 0 0 8px;
}
.main-navigation.mini .navigation-item:hover:focus:after, .main-navigation.mini .navigation-item:focus:focus:after, .main-navigation.mini .navigation-item.keep-open:focus:after {
  content: "";
  background-color: #6FC5EA;
  height: 8px;
  width: 3px;
  position: absolute;
  left: 0px;
  top: 16px;
}
.main-navigation.mini .navigation-item:hover .sub-nav, .main-navigation.mini .navigation-item:focus .sub-nav, .main-navigation.mini .navigation-item.keep-open .sub-nav {
  display: block;
}
.main-navigation.mini .navigation-item.has-current {
  background-color: #403F3F;
  border-radius: 8px 0 0 8px;
}

@media only screen and (max-width: 1024px) {
  .top-controls-wrap {
    grid-column: span 2;
    display: none;
  }
}

.mobile-nav-open .top-controls {
  background-color: #DEDEDE;
}

.top-controls {
  display: inline-flex;
  padding-top: 5px;
  padding-right: 30px;
}
@media only screen and (max-width: 1024px) {
  .top-controls {
    display: flex;
    justify-content: flex-end;
    padding-right: 5px;
  }
}
.top-controls .controls-shortcuts {
  padding-top: 5px;
}
.top-controls .controls-shortcuts img {
  padding: 0px 3px;
  vertical-align: middle;
  cursor: pointer;
}
.top-controls .profile-img-wrap {
  margin-left: 1rem;
}
.top-controls .profile-img-wrap .profile-img {
  border: 3px solid #202020;
  border-radius: 50%;
  display: inline-flex;
  overflow: hidden;
}
@media only screen and (max-width: 1024px) {
  .top-controls .profile-img-wrap .profile-img {
    border-color: #F6F6F6;
  }
}
.top-controls .profile-img-wrap .profile-img img {
  height: 32px;
  width: 32px;
  border-radius: 50%;
}
.top-controls .user-menu {
  display: inline-flex;
  padding: 6px 0px 0px 5px;
  font-weight: bold;
  font-size: 14px;
  /*img {
      padding-left: 3px;
      vertical-align: middle;
  }*/
}
@media only screen and (max-width: 1024px) {
  .top-controls .user-menu {
    /*color:$color--almostwhite;*/
  }
}
.top-controls .user-menu .user-menu-inner {
  position: relative;
  padding: 2px 10px;
  display: inline-block;
  height: 30px;
  cursor: pointer;
}
.top-controls .user-menu .user-menu-inner > img {
  vertical-align: middle;
}
.top-controls .user-menu .user-menu-inner.open {
  background-color: #fff;
  border-radius: 10px 10px 0 0;
  box-shadow: 2px 3px 2px rgba(0, 0, 0, 0.25);
}
.top-controls .user-menu .user-menu-inner.open > img {
  transform: rotate(180deg);
}
.top-controls .user-menu .user-menu-inner:hover {
  background-color: #fff;
  border-radius: 10px 10px 0 0;
}
.top-controls .user-menu .user-menu-inner .user-menu-nav {
  cursor: default;
  position: absolute;
  top: 100%;
  right: 0;
  display: none;
  min-width: 190px;
  box-shadow: 2px 3px 2px rgba(0, 0, 0, 0.25);
  background-color: #fff;
  border-radius: 8px 0 8px 8px;
  padding: 1rem;
  padding-bottom: 0;
  text-align: center;
}
@media only screen and (max-width: 1024px) {
  .top-controls .user-menu .user-menu-inner .user-menu-nav {
    top: auto;
    bottom: 100%;
    right: 0;
  }
}
.top-controls .user-menu .user-menu-inner .user-menu-nav .user-menu-profile-pic .profile-img {
  border: 3px solid #4CA2C7;
  border-radius: 50%;
  display: inline-flex;
  overflow: hidden;
}
.top-controls .user-menu .user-menu-inner .user-menu-nav .user-menu-profile-pic .profile-img img {
  height: 74px;
  width: 74px;
  border-radius: 50%;
}
.top-controls .user-menu .user-menu-inner .user-menu-nav .user-menu-item-wrap {
  font-weight: 400;
  border-bottom: 2px solid #ddd;
  padding-bottom: 1rem;
  padding-top: 1rem;
}
.top-controls .user-menu .user-menu-inner .user-menu-nav .user-menu-item-wrap:last-child {
  border-bottom: 0;
}
.top-controls .user-menu .user-menu-inner .user-menu-nav .user-menu-item-wrap .name {
  /*  font-weight: bold;  */
}
.top-controls .user-menu .user-menu-inner .user-menu-nav .user-menu-item-wrap .union img {
  vertical-align: middle;
}
.top-controls .user-menu .user-menu-inner .user-menu-nav .user-menu-item-wrap .servername {
  padding-top: 5px;
  font-style: italic;
  font-size: 12px;
}
.top-controls .user-menu .user-menu-inner .user-menu-nav .user-menu-item-wrap .user-menu-item {
  display: grid;
  grid-template-columns: 20px auto;
  grid-gap: 10px;
  padding-left: 1rem;
  cursor: pointer;
}
.top-controls .user-menu .user-menu-inner .user-menu-nav .user-menu-item-wrap .user-menu-item .text {
  text-align: left;
  line-height: 24px;
}
.top-controls .user-menu .user-menu-inner .user-menu-nav .user-menu-item-wrap .user-menu-item .icon {
  height: 20px;
  width: 20px;
  justify-self: center;
  align-self: center;
}
.top-controls .user-menu .user-menu-inner .user-menu-nav .user-menu-item-wrap .user-menu-item .icon img {
  max-width: 100%;
  max-height: 100%;
}
.top-controls .user-menu .user-menu-inner .user-menu-nav .user-menu-item-wrap .user-menu-item + .user-menu-item {
  margin-top: 8px;
}

.uploadmessage {
  position: absolute;
  left: 0;
  right: 0;
  margin-left: auto;
  margin-right: auto;
  width: 400px;
  background-color: #CE161C;
  color: #fff;
  box-shadow: 2px 3px 4px rgba(0, 0, 0, 0.25);
  border-radius: 0px 0px 10px 10px;
  padding: 5px 0px;
  display: inline-flex;
}
.uploadmessage .container {
  padding-left: 10px;
  align-self: center;
}
.uploadmessage .container .mes01 {
  font-weight: bold;
  font-size: 14px;
  display: flex;
}
.uploadmessage .container .mes02 {
  font-size: 13px;
  display: flex;
}
.uploadmessage img {
  /*width: 24px;
  height: 24px;*/
  width: 40px;
}

.info-box {
  display: grid;
  grid-template-columns: 114px auto;
  border-radius: 8px;
  overflow: hidden;
  /*height: 186px;*/
  border: 1px solid rgba(187, 187, 187, 0.75);
  position: relative;
}
@media only screen and (max-width: 1024px) {
  .info-box {
    grid-template-columns: 48px auto;
    height: auto;
    background-color: #F9F9F9;
  }
}
.info-box.info-box-site {
  margin-bottom: 1rem;
}
.info-box .info-box-icon-wrap {
  display: flex;
  width: 114px;
  background-color: #4CA2C7;
  align-items: center;
  justify-content: center;
}
.info-box .info-box-icon-wrap .icon {
  width: 60px;
}
.info-box .info-box-icon-wrap .icon img {
  width: 100%;
}
@media only screen and (max-width: 1024px) {
  .info-box .info-box-icon-wrap {
    height: 100%;
    width: 40px;
    padding: 8px;
    align-self: center;
    background-color: rgb(76, 162, 199);
  }
}
.info-box .info-box-close {
  height: 18px;
  width: 18px;
  position: absolute;
  right: 0.5rem;
  top: 0.5rem;
  cursor: pointer;
}
.info-box .info-box-content {
  background-color: #F9F9F9;
  display: flex;
  justify-content: space-between;
}
@media only screen and (max-width: 1024px) {
  .info-box .info-box-content {
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
  }
  .info-box .info-box-content::-webkit-scrollbar {
    width: 8px;
    height: 8px;
  }
  .info-box .info-box-content::-webkit-scrollbar-track {
    background-color: #e4e4e4;
    border-radius: 100px;
  }
  .info-box .info-box-content::-webkit-scrollbar-thumb {
    background-color: #d4aa70;
    border-radius: 100px;
  }
}
.info-box .info-box-content .info-box-content-grid {
  /*display: inline-grid;
  grid-template-rows: 1fr 1fr;
  grid-auto-flow: column;
  justify-content: flex-start;
  align-items: center;
  align-self: center;*/
  display: inline-grid;
  grid-template-rows: 1fr 1fr;
  grid-auto-flow: column;
  justify-content: flex-start;
  align-items: flex-start;
  align-self: center;
  grid-column-gap: 4rem;
  grid-row-gap: 1.6rem;
  padding: 2rem 2rem 2rem 2rem;
}
@media only screen and (max-width: 1024px) {
  .info-box .info-box-content .info-box-content-grid {
    grid-template-rows: auto;
    grid-template-columns: 1fr;
    /*grid-auto-flow: row;*/
  }
}
.info-box .info-box-content .info-box-content-image-wrap {
  display: flex;
  height: 100%;
  align-items: center;
  grid-row: 1/3;
}
.info-box .info-box-content .info-box-content-image-wrap .info-box-content-image {
  height: 104px;
  width: 104px;
  border-radius: 50%;
  overflow: hidden;
  background-color: #DEDEDE;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  margin-right: -1rem;
}
.info-box .info-box-content .info-box-content-image-wrap .info-box-content-image.transparent {
  overflow: visible;
  background-color: transparent;
  border-radius: 0;
}
.info-box .info-box-content .info-box-content-item {
  /*padding: 1rem 2rem;*/
  /* width: 200px; */
  display: flex;
  flex-direction: column;
}
.info-box .info-box-content .info-box-content-item.multi-line {
  margin-bottom: -1rem;
}
.info-box .info-box-content .info-box-content-item label {
  font-size: 12px;
  font-weight: bold;
  color: #808080;
  margin-bottom: 0.5rem;
  display: flex;
  margin-bottom: 0.4rem;
  gap: 0.5rem;
  flex-direction: row;
  align-content: center;
  align-items: center;
}
.info-box .info-box-content .info-box-content-item .link-icon {
  cursor: pointer;
  display: flex;
}
.info-box .info-box-content .info-box-content-item .text {
  font-size: 13px;
  font-weight: 300;
}
.info-box .info-box-content .info-box-content-item.list-item {
  grid-row: 1/3;
}
.info-box .info-box-content .info-box-content-item.list-item .info-box-list-item {
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: flex-start;
  gap: 8px;
  margin-bottom: 5px;
}
.info-box .info-box-content .info-box-content-item.list-item .info-box-list-item img {
  height: 26px;
  width: auto;
}
.info-box .info-box-content .info-box-content-item.list-item .missing-image {
  height: 26px;
  width: 26px;
  background-color: #808080;
  border-radius: 50%;
}
.info-box .info-box-content .info-box-content-text {
  font-size: 13px;
  font-weight: 300;
  padding: 2rem;
}
.info-box .info-box-content .info-box-content-text h2 {
  padding-bottom: 5px;
}
.info-box .info-box-content .info-box-icon-links {
  justify-self: flex-end;
  font-size: 12px;
  color: #808080;
  font-weight: bold;
  align-self: flex-end;
  display: flex;
  padding: 0.5rem 1rem;
  gap: 1rem;
}
.info-box .info-box-content .info-box-icon-links .info-box-icon-link {
  display: flex;
  flex-direction: column;
  /*justify-content:center;*/
  text-align: center;
  align-items: center;
}
.info-box .info-box-content .info-box-icon-links .info-box-icon-link .info-box-icon-link-img-wrap {
  border-radius: 50%;
  background-color: #4CA2C7;
  height: 40px;
  width: 40px;
  display: flex;
  align-items: center;
  justify-content: center;
}
.info-box .info-box-content .info-box-icon-links .info-box-icon-link .info-box-icon-link-img-wrap img {
  width: 100%;
  height: 100%;
  max-width: 24px;
  max-height: 24px;
}

.tab-bar {
  display: flex;
  justify-content: space-between;
  border-radius: 8px;
  /*overflow: hidden;*/
  /*min-height: 34px;*/
  border: 1px solid rgba(187, 187, 187, 0.75);
  background-color: #fff;
  min-height: 38px;
}
.tab-bar .tab-bar-items {
  padding: 0 1rem;
  display: inline-flex;
  gap: 0 1.6rem;
  flex-wrap: wrap;
}
@media only screen and (max-width: 1023px) {
  .tab-bar .tab-bar-items {
    gap: 0.8rem;
    padding: 0.5rem;
  }
}
.tab-bar .tab-bar-items .tab-bar-item {
  text-transform: uppercase;
  font-size: 11px;
  position: relative;
  text-align: center;
  font-weight: bold;
  color: #808080;
  align-self: flex-end;
  /*padding-top: 10px;*/
  transition: 200ms ease all;
  cursor: pointer;
  /*min-width: 60px;*/
  display: flex;
  flex-direction: column;
  align-items: center;
  height: 34px;
}
@media only screen and (max-width: 1023px) {
  .tab-bar .tab-bar-items .tab-bar-item {
    height: auto;
  }
}
.tab-bar .tab-bar-items .tab-bar-item a {
  height: 100%;
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
}
.tab-bar .tab-bar-items .tab-bar-item:after {
  transition: 200ms ease all;
  margin: 0 auto;
  content: "";
  height: 3px;
  display: block;
  width: 60px;
  border-radius: 3px 3px 0 0;
  background-color: transparent;
  position: absolute;
  bottom: 0;
}
@media only screen and (max-width: 1023px) {
  .tab-bar .tab-bar-items .tab-bar-item:after {
    width: 100%;
  }
}
.tab-bar .tab-bar-items .tab-bar-item.selected {
  color: #4CA2C7;
}
.tab-bar .tab-bar-items .tab-bar-item.selected:after {
  background-color: #4CA2C7;
}
.tab-bar .tab-bar-items .tab-bar-item:hover {
  color: #4CA2C7;
}
.tab-bar .tab-bar-items .tab-bar-item:hover:after {
  background-color: #4CA2C7;
}

.tab-bar-controls .tab-bar-menu-toggle {
  position: relative;
  margin-right: 1rem;
  z-index: 0;
  height: 100%;
  display: flex;
  flex-direction: column;
  justify-content: center;
  cursor: pointer;
  width: 18px;
}

body.editmode .tab-bar-controls.show-on-view {
  display: none;
}
body.editmode .tab-bar-menu-item._view {
  display: none;
}

body:not(.editmode) .tab-bar-controls.show-on-edit {
  display: none;
}
body:not(.editmode) .tab-bar-menu-item._edit {
  display: none;
}

.tab-bar-menu {
  position: absolute;
  right: 100%;
  top: 0px;
  background-color: #202020;
  color: #fff;
  border-radius: 8px;
  z-index: 1;
  display: flex;
  display: none;
  flex-direction: column;
  margin-right: 10px;
  transform: translateY(4px);
}
.tab-bar-menu::after {
  content: "";
  width: 0;
  height: 0;
  border-left: 6px solid #202020;
  border-bottom: 6px solid transparent;
  border-top: 6px solid transparent;
  position: absolute;
  top: 8px;
  right: 0;
  transform: translateX(100%);
}
.tab-bar-menu .tab-bar-menu-item {
  /*padding: 0.5rem;*/
  font-size: 10px;
  font-weight: 500;
  min-width: 180px;
  border-bottom: 1px solid #403F3F;
  cursor: pointer;
}
.tab-bar-menu .tab-bar-menu-item > a, .tab-bar-menu .tab-bar-menu-item > div:first-child {
  display: flex;
  padding: 0.5rem;
  width: 100%;
  height: 100%;
  white-space: nowrap;
}
.tab-bar-menu .tab-bar-menu-item:hover {
  background-color: rgba(255, 255, 255, 0.2);
}
.tab-bar-menu .tab-bar-menu-item:last-child {
  border-bottom: 0;
}

.tabbar-controls-holder .tab-bar-menu {
  display: flex;
}

.tabbar-controls-holder {
  position: absolute;
  z-index: 100;
}

.list-page-grid .tab-bar {
  border-radius: 8px 8px 0 0;
  border-left: 0;
  border-right: 0;
  border-top: 0;
  background-color: unset;
}

.img-btn {
  transition: 200ms ease all;
  cursor: pointer;
}
.img-btn:hover {
  transform: scale(1.1);
}
.img-btn.img-btn--large {
  width: 64px;
}
.img-btn.img-btn--medium {
  width: 44px;
}
.img-btn.img-btn--small {
  width: 32px;
}

.action-btn-wrap {
  transition: all ease-in-out 200ms;
}
.action-btn-wrap .img-btn {
  width: 32px;
}
.action-btn-wrap .img-btn.make-big {
  width: 64px;
}
@media only screen and (max-width: 1024px) {
  .action-btn-wrap .img-btn.make-big {
    width: 44px;
  }
}
.action-btn-wrap .img-btn.big {
  width: 64px;
}
@media only screen and (max-width: 1024px) {
  .action-btn-wrap .img-btn.big {
    width: 44px;
  }
}

.mobile-nav-open .action-btn-wrap {
  z-index: 0;
}

.btn {
  height: 32px;
  box-shadow: 0px 2px 2px rgba(0, 0, 0, 0.25);
  border-radius: 8px;
  font-weight: bold;
  text-transform: uppercase;
  display: inline-flex;
  line-height: 30px;
  padding: 0 1rem;
  color: #fff;
  font-size: 12px;
  border: 2px solid transparent;
  transition: 100ms ease all;
  cursor: pointer;
}
.btn:hover {
  transform: translateY(2px);
}
.btn.positive {
  background: #81B459;
}
.btn.positive:hover {
  background: #98D16B;
}
.btn.negative {
  background: #CE161C;
}
.btn.negative:hover {
  background: #FF1C35;
}
.btn.negative.outline {
  background: #ffffff;
  color: #CE161C;
  border: 2px solid #CE161C;
}
.btn.negative.outline:hover {
  color: #FF1C35;
  border: 2px solid #FF1C35;
}
.btn.neutral {
  background: #4CA2C7;
  color: #fff;
}
.btn.neutral:hover {
  background: #6FC5EA;
}
.btn.neutral.outline {
  background: #ffffff;
  color: #4CA2C7;
  border: 2px solid #4CA2C7;
}
.btn.neutral.outline:hover {
  color: #6FC5EA;
  border: 2px solid #6FC5EA;
}
.btn.neutral.select-all-grid {
  margin-right: auto;
}
.btn + .btn {
  margin-left: 0.8rem;
}
.btn.small {
  height: 27px;
  line-height: 24px;
  padding: 0 0.5rem;
  font-size: 10px;
}

.btn-wrap-center {
  display: flex;
  justify-content: center;
}

.tile-button {
  border-radius: 50%;
  background-color: #4CA2C7;
  height: 40px;
  width: 40px;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer !important;
  position: relative;
}
.tile-button:hover:after {
  content: attr(data-tooltip);
  color: #ffffff;
  padding: 0 10px;
  background: #202020;
  /*width:200px;*/
  bottom: 100%;
  position: absolute;
  border-radius: 6px;
  padding: 6px;
  text-align: center;
  min-width: 180px;
  font-size: 12px;
}
.tile-button:hover:before {
  content: "";
  position: absolute;
  top: 0;
  left: 50%;
  transform: translateX(-50%);
  height: 0;
  width: 0;
  border-left: 10px solid transparent;
  border-right: 10px solid transparent;
  border-top: 10px solid #202020;
}

.foda2._body {
  /* .range-wrap {
      display: flex;
      flex-direction: row;
      flex-wrap: wrap;
      align-items: flex-start;
      gap: 6px;
      gap: 2rem;

      .k-widget.k-dropdown {
          height: 32px;
          width: 122px;

          .k-dropdown-wrap {
              background-color: $color--input-bg;
              font-size: 13px;

              .k-input {
                  height: 30px;
                  font-size: 12px;
              }
          }
      }

      .k-widget.k-textbox {
          height: 32px;
          width: 122px;
      }
  }*/
}
.foda2._body .k-animation-container .k-picker-solid, .foda2._body .k-animation-container .k-input-solid {
  width: auto;
}
.foda2._body .k-animation-container .k-list-item-text {
  font-size: 13px;
}
.foda2._body .k-animation-container .k-list-optionlabel {
  font-size: 13px;
}
.foda2._body .k-animation-container .k-popup {
  min-width: 230px !important;
}
.foda2._body .k-animation-container .k-tooltip.k-popup {
  padding: 8px;
}
.foda2._body .k-animation-container .k-list {
  font-family: "GothamPro" !important;
}
.foda2._body .range-wrap {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  align-items: flex-start;
  gap: 6px;
  gap: 2rem;
  position: relative;
}
.foda2._body .range-wrap label {
  max-width: 122px;
}
.foda2._body .range-wrap .k-picker-solid, .foda2._body .range-wrap .k-input-solid {
  width: 122px;
}
.foda2._body .range-wrap .field-text:first-child .field {
  min-width: 120px;
}
.foda2._body .k-input-button {
  background-color: #f9f9f9;
}
.foda2._body .k-picker-solid, .foda2._body .k-input-solid {
  background-color: #f9f9f9;
  font-size: 13px;
  height: 32px;
  width: 230px;
  font-family: "GothamPro";
  font-weight: 300;
  border-color: rgba(187, 187, 187, 0.75);
  box-shadow: none;
}
.foda2._body .k-picker-solid .k-input-inner, .foda2._body .k-input-solid .k-input-inner {
  padding: 0.375rem 0.5rem;
}
.foda2._body .k-picker-solid.k-textarea, .foda2._body .k-input-solid.k-textarea {
  min-height: 108px;
  width: 100%;
  height: auto;
}
.foda2._body .k-picker-solid.k-textarea textarea, .foda2._body .k-input-solid.k-textarea textarea {
  resize: vertical;
  min-height: 108px;
  resize: vertical !important;
}
.foda2._body .k-picker-solid.k-colorpicker, .foda2._body .k-input-solid.k-colorpicker {
  width: 80px;
}
.foda2._body .k-picker-solid.k-datepicker, .foda2._body .k-picker-solid.k-timepicker, .foda2._body .k-input-solid.k-datepicker, .foda2._body .k-input-solid.k-timepicker {
  width: 122px;
  font-size: 12px;
}
.foda2._body .k-picker-solid.k-multiselect, .foda2._body .k-input-solid.k-multiselect {
  height: auto;
}
.foda2._body .field-large .k-picker-solid, .foda2._body .field-large .k-input-solid {
  width: 100%;
}
.foda2._body .field-small .k-picker-solid, .foda2._body .field-small .k-input-solid {
  width: 122px;
}
.foda2._body .k-switch {
  height: 30px;
  width: 56px;
}
.foda2._body .k-switch .k-switch-track {
  height: 30px;
  width: 56px;
}
.foda2._body .k-switch.k-switch-on:focus .k-switch-track {
  border-color: none;
  outline: 0;
}
.foda2._body .k-switch.k-switch-on .k-switch-track {
  background-color: #4CA2C7;
  border-color: #4CA2C7;
}
.foda2._body .k-switch.k-switch-on .k-switch-thumb-wrap {
  inset-inline-start: calc(100% - 15px);
}
.foda2._body .k-switch.k-switch-off:focus .k-switch-track {
  border-color: rgba(187, 187, 187, 0.75);
  outline: 0;
}
.foda2._body .k-switch.k-switch-off .k-switch-track {
  background-color: #f9f9f9;
  border-color: rgba(187, 187, 187, 0.75);
}
.foda2._body .k-switch.k-switch-off .k-switch-thumb-wrap {
  inset-inline-start: 15px;
}
.foda2._body .k-switch .k-switch-label-off {
  right: 10px;
  font-weight: bold;
  padding-top: 3px;
  font-size: 9px;
  display: flex;
  top: 13px;
}
.foda2._body .k-switch .k-switch-label-on {
  left: 10px;
  font-weight: bold;
  padding-top: 3px;
  font-size: 9px;
  display: flex;
  top: 13px;
}
.foda2._body .k-switch .k-switch-thumb {
  height: 24px;
  width: 24px;
}
.foda2._body .k-input-solid.k-focus,
.foda2._body .k-input-solid:focus {
  border-color: rgba(0, 0, 0, 0.16);
  box-shadow: 0 0 0 2px rgba(0, 0, 0, 0.08);
}
.foda2._body .k-input-solid:focus-within {
  border-color: rgba(0, 0, 0, 0.16);
  box-shadow: 0 0 0 2px rgba(0, 0, 0, 0.08);
}
.foda2._body .k-invalid {
  border-color: rgba(213, 25, 35, 0.5);
}
.foda2._body .k-invalid.k-focus, .foda2._body .k-invalid:focus {
  border-color: rgba(213, 25, 35, 0.5);
  box-shadow: 0 0 0 0.2rem rgba(220, 53, 69, 0.25);
}
.foda2._body .required-marker {
  display: none;
}
.foda2._body .edit-open .required-marker, .foda2._body .drawer-content .required-marker {
  color: #FF1C35;
  font-size: 16px;
  display: flex;
}
.foda2._body .field-content {
  position: relative;
}
.foda2._body .field-content.static .no-value {
  color: #DEDEDE;
  /*font-style:italic;*/
}
.foda2._body .field-content.readonly {
  min-height: 32px;
}
.foda2._body .field-content .k-content.k-iframe {
  padding: 5px;
}
.foda2._body .field-file {
  /* Preview in drawer */
}
.foda2._body .field-file .dropzone-element {
  border: 4px dashed #DEDEDE; /* For Default; Different for each theme */
  padding: 1rem;
  border-radius: 16px;
  /*height: 200px;*/
  display: flex;
  flex-direction: column;
  align-content: center;
  align-items: center;
  background-color: #f9f9f9;
}
.foda2._body .field-file .dropzone-element .dropzone-text {
  font-size: 16px;
  padding: 1rem;
  padding-bottom: 2rem;
  padding-top: 0;
  text-align: center;
}
.foda2._body .field-file .dropzone-element .dropzone-text .blue {
  color: #4CA2C7;
}
.foda2._body .field-file .k-upload {
  margin-top: 1rem;
  border-radius: 8px;
}
.foda2._body .field-file .k-upload .k-dropzone {
  border-radius: 8px;
}
.foda2._body .field-file .k-upload .k-dropzone-active {
  border: 8px solid yellow;
}
.foda2._body .field-file .k-upload .k-dropzone-active.k-dropzone-hovered {
  border: 8px solid green;
}
.foda2._body .field-file .k-upload .k-dropzone em {
  visibility: visible;
}
.foda2._body .field-file .image-preview {
  height: auto;
  max-width: 120px;
}
.foda2._body .field-file .file-allowtype {
  font-size: 11px;
  color: #ABABAB;
  margin-top: 4px;
}
.foda2._body .field-imagefile .image-preview {
  height: auto;
  max-width: 120px;
}
.foda2._body .field-imagefile .image-preview.hidden {
  display: none;
}
.foda2._body .field-link-a {
  white-space: pre-wrap;
  word-break: break-all;
}
.foda2._body .field.color-wrap .field-content.static .color-wrap-static {
  overflow: hidden;
  background-color: #F4F4F4;
  border-radius: 4px;
  border: 1px solid #BBBBBB;
  display: inline-flex;
  align-items: center;
  gap: 5px;
  padding-right: 5px;
  font-size: 13px;
}
.foda2._body .field.color-wrap .field-content.static .color-wrap-static > div:first-child {
  width: 24px;
  height: 24px;
}
.foda2._body .field-text.htmltext-wrap .field-html.box {
  border: 1px solid rgba(187, 187, 187, 0.75);
  padding: 1rem;
  border-radius: 8px;
  background-color: #F6F6F6;
}
.foda2._body .field-text.htmltext-wrap .edit {
  border: 1px solid rgba(187, 187, 187, 0.75);
  padding: 1rem;
  border-radius: 8px;
  background-color: #F6F6F6;
  flex-direction: column;
  gap: 1rem;
}
.foda2._body .search-form .k-picker-solid input, .foda2._body .search-form .k-input-solid input {
  background-color: #fff;
}
.foda2._body .search-form .k-picker-solid .k-input-inner, .foda2._body .search-form .k-input-solid .k-input-inner {
  background-color: #fff;
}
.foda2._body .search-form .k-picker-solid .k-input-button, .foda2._body .search-form .k-input-solid .k-input-button {
  /*background-color: #fff;*/
}
.foda2._body .search-form .k-switch.k-switch-off .k-switch-track {
  background-color: #fff;
}
.foda2._body .search-input {
  border: 1px solid #DEDEDE;
  border-radius: 10px;
  padding: 0.5rem;
  display: flex;
  align-content: center;
  flex-direction: row;
  align-items: center;
  gap: 1rem;
  width: 230px;
  justify-content: space-between;
  background-color: #f9f9f9;
}
.foda2._body .search-input.invalid {
  border-color: #FF1C35;
}
.foda2._body .search-input .search-input-current {
  font-size: 12px;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: flex-start;
  align-content: center;
}
.foda2._body .search-input .search-input-current .file-name {
  word-break: break-word;
}
.foda2._body .search-input .search-input-controls {
  display: flex;
  gap: 0.5rem;
}
.foda2._body .search-input .search-input-controls .search-input-btn {
  border-radius: 8px;
  border: 2px solid #4CA2C7;
  height: 32px;
  width: 32px;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  box-shadow: rgba(60, 64, 67, 0.3) 0px 1px 2px 0px, rgba(60, 64, 67, 0.15) 0px 1px 3px 1px;
  transition: all 100ms ease-in-out;
  background-color: #ffffff;
}
.foda2._body .search-input .search-input-controls .search-input-btn:hover {
  background-color: #eeeeee;
}
.foda2._body .search-input .search-input-controls .search-input-btn img {
  width: 18px;
  height: 18px;
}
.foda2._body .search-input .search-input-controls .search-input-btn.clear {
  border: 2px solid #FF1C35;
  display: none;
}
.foda2._body .search-input .search-input-controls .search-input-btn.clear.has-value {
  display: flex;
}
.foda2._body .search-input .search-input-controls .search-input-btn.clear img {
  width: 14px;
  height: 14px;
}
.foda2._body .search-input.has-value .search-input-controls.clear {
  display: flex;
}
.foda2._body .field-validation-error {
  /*padding: 0rem;
  color: $color--red-light;
  border-radius: 8px;
  font-size: 12px;
  font-weight: 300;
  margin-top: 0.5rem;*/
}
.foda2._body .field-validation-error.k-form-error {
  /*  margin-top: 0.5rem;
  padding: 0rem;
  color: $color--red-light;
  border-radius: 8px;
  font-size: 12px;
  font-weight: 300;
  font-style: normal;*/
  display: none;
}
.foda2._body .k-animation-container .k-list-container {
  width: 230px !important;
}
.foda2._body .textarea-wrap .field-content.static {
  /*  border: 1px solid #e1e1e1;
  background-color: #f4f4f4;
  padding: 0.5rem;
  border-radius: 10px;*/
}
.foda2._body .flettefelter-template-tool {
  font-size: 14px;
  margin-right: 10px;
  background-color: #f6f6f6;
  height: 32px;
  border-radius: 5px;
  border-color: #DEDEDE;
  font-size: 14px;
  margin-right: 10px;
  color: #403F3F;
}
.foda2._body .k-editor {
  height: 400px;
}
.foda2._body .k-editor.large {
  height: 600px;
}
.foda2._body .k-editor.small {
  height: 250px;
}
.foda2._body .tile-header-right .k-input, .foda2._body .tile-header-left .k-input {
  font-size: 10px;
  height: 22px;
  width: 178px;
  border-radius: 3px;
}
.foda2._body .tile-header-right .k-input:focus, .foda2._body .tile-header-left .k-input:focus {
  box-shadow: none;
}
.foda2._body .tile-header-right .k-input .k-input-inner, .foda2._body .tile-header-left .k-input .k-input-inner {
  padding-left: 4px;
  padding-top: 7px;
}
.foda2._body .tile-header-right .k-picker-solid, .foda2._body .tile-header-left .k-picker-solid {
  width: 100px;
  height: 24px;
}
.foda2._body .tile-header-right .k-animation-container, .foda2._body .tile-header-left .k-animation-container {
  width: 100px !important;
}
.foda2._body .tile-header-submit {
  border: 0;
  background-color: transparent;
  width: 18px;
  height: 18px;
  border-radius: 50%;
  padding: 0;
  margin-left: -22px;
  margin-top: 2px;
  z-index: 2;
  background-image: url("/img/icons/search_24px.png");
  background-size: 90%;
  background-position: center center;
}

/**********************************************/
/*DATE RANGE - BURGER MENU*/
/**********************************************/
.rangedate-burger-toggle {
  position: absolute;
  right: 5px;
  top: 5px;
  cursor: pointer;
  transition: all 200ms ease-in;
  display: none;
}
.rangedate-burger-toggle:not(.show-on-edit) {
  display: flex;
}
.rangedate-burger-toggle img {
  margin: 0 5px;
}
.rangedate-burger-toggle img.open {
  transform: rotate(180deg);
}
.rangedate-burger-toggle .rangedate-burger {
  position: absolute;
  right: -20px;
  top: 4px;
  background-color: #403F3F;
  color: #fff;
  border-radius: 8px;
  z-index: 200;
  display: flex;
  display: none;
  flex-direction: column;
  margin-right: 10px;
  transform: translateY(4px);
  /* &::after {
      content: "";
      width: 0;
      height: 0;
      border-left: 6px solid $color--black;
      border-bottom: 6px solid transparent;
      border-top: 6px solid transparent;
      position: absolute;
      top: 8px;
      right: 0;
      transform: translateX(100%);
  }*/
}
.rangedate-burger-toggle .rangedate-burger.open {
  display: flex;
}
.rangedate-burger-toggle .rangedate-burger .rangedate-burger-item {
  /*padding: 0.5rem;*/
  font-size: 10px;
  font-weight: 500;
  min-width: 180px;
  border-bottom: 1px solid #403F3F;
  cursor: pointer;
}
.rangedate-burger-toggle .rangedate-burger .rangedate-burger-item.only-on-edit {
  display: none;
}
.rangedate-burger-toggle .rangedate-burger .rangedate-burger-item > a, .rangedate-burger-toggle .rangedate-burger .rangedate-burger-item > div:first-child {
  display: flex;
  padding: 0.5rem;
  width: 100%;
  height: 100%;
}
.rangedate-burger-toggle .rangedate-burger .rangedate-burger-item:hover {
  background-color: rgba(255, 255, 255, 0.2);
}
.rangedate-burger-toggle .rangedate-burger .rangedate-burger-item:last-child {
  border-bottom: 0;
}

/**********************************************/
/*ADD BUTTON ON PAGE*/
/**********************************************/
.add-grid-button {
  justify-content: center;
  padding: 1rem;
  display: flex;
  height: 70px;
}
.add-grid-button .img-btn {
  width: 48px;
}

.bottom-bar {
  position: fixed;
  bottom: 0;
  right: 0;
  min-height: 66px;
  color: #fff;
  z-index: 100;
  width: calc(100% - 162px);
  transition: 250ms ease all;
  display: flex;
  display: none;
  align-content: center;
  flex-wrap: wrap;
  flex-direction: row;
  /*justify-content: flex-end;*/
  justify-content: space-between;
  align-items: center;
  padding: 8px 1rem;
  background-color: #4CA2C7;
  /*box-shadow: rgba(14, 30, 37, 0.12) 0px 2px 4px 0px, rgba(14, 30, 37, 0.32) 0px 2px 16px 0px;*/
  box-shadow: rgba(0, 0, 0, 0.24) 0px 0px 4px;
}
@media only screen and (max-width: 1024px) {
  .bottom-bar {
    width: 100% !important;
  }
}
.bottom-bar .bottom-bar-text {
  font-size: 14px;
  margin-right: 1rem;
  display: flex;
  align-items: center;
}
.bottom-bar .bottom-bar-text img {
  width: 24px;
  margin-right: 0.5rem;
}
.bottom-bar[data-type=success] {
  background-color: #81B459;
}
.bottom-bar[data-type=neutral] {
  background-color: #F6F6F6;
  color: #202020;
}
.bottom-bar[data-type=error] {
  background-color: #FFC6CC;
  color: #403F3F;
}
.bottom-bar[data-type=attention] {
  background-color: #f2c94c;
  color: #202020;
}
.bottom-bar .bottom-bar-close {
  display: none;
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  right: 0.3rem;
  cursor: pointer;
}
.bottom-bar .bottom-bar-close.show {
  display: block;
}

.is-mini-nav .bottom-bar {
  width: calc(100% - 44px);
}

.mobile-nav-open .bottom-bar {
  /*z-index:0;*/
  bottom: -66px;
}

.drawer-overlay {
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  position: fixed;
  background-color: rgba(0, 0, 0, 0.3);
  z-index: 101;
  display: none;
}

.drawer-holder {
  position: fixed;
  right: 0;
  top: 0;
  height: 100%;
  z-index: 101;
  display: none;
  /*margin-right:-360px;*/
  width: 360px;
  transition: 300ms all ease;
}
.drawer-holder .required-marker {
  display: flex;
  color: #FF1C35;
  font-size: 16px;
}
.drawer-holder.small {
  width: 360px;
}
.drawer-holder.medium {
  width: 720px;
}
.drawer-holder.large {
  width: 1080px;
}
.drawer-holder .drawer {
  width: 100%;
  height: 100%;
  background-color: #fff;
  border-radius: 10px 0 0 10px;
  position: absolute;
  top: 0;
  left: 100%;
  box-shadow: rgba(17, 17, 26, 0.1) 0px 1px 0px, rgba(17, 17, 26, 0.1) 0px 8px 24px, rgba(17, 17, 26, 0.1) 0px 16px 48px;
  overflow-y: hidden;
}
.drawer-holder .drawer .drawer-header {
  border-bottom: 1px solid rgba(187, 187, 187, 0.75);
  font-weight: bold;
  color: #403F3F;
  font-size: 14px;
  padding: 0.3rem 0.8rem;
}
.drawer-holder .drawer .drawer-controls {
  position: absolute;
  bottom: 0;
  left: 0;
  background-color: #F6F6F6;
  display: flex;
  height: 66px;
  width: 100%;
  align-content: center;
  flex-wrap: nowrap;
  flex-direction: row;
  align-items: center;
  justify-content: flex-end;
  padding: 0 1rem;
  z-index: 3;
}
.drawer-holder .drawer .drawer-message-bar {
  position: absolute;
  bottom: 66px;
  left: 0;
  background-color: rgba(111, 197, 234, 0.25);
  display: none;
  min-height: 54px;
  width: 100%;
  align-content: center;
  flex-wrap: nowrap;
  flex-direction: row;
  align-items: center;
  justify-content: flex-start;
  padding: 1rem;
  color: #403F3F;
  font-size: 13px;
  z-index: 3;
}
.drawer-holder .drawer .drawer-message-bar.show {
  display: flex;
}
.drawer-holder .drawer .drawer-message-bar._error {
  background-color: #FFC6CC;
}
.drawer-holder .drawer .drawer-message-bar._error .drawer-message-bar-icon ._info {
  display: none;
}
.drawer-holder .drawer .drawer-message-bar._error .drawer-message-bar-icon ._check {
  display: none;
}
.drawer-holder .drawer .drawer-message-bar._error .drawer-message-bar-icon ._warning {
  display: inline;
}
.drawer-holder .drawer .drawer-message-bar._success {
  background-color: #81B459;
  color: #ffffff;
}
.drawer-holder .drawer .drawer-message-bar._success .drawer-message-bar-icon ._info {
  display: none;
}
.drawer-holder .drawer .drawer-message-bar._success .drawer-message-bar-icon ._check {
  display: inline;
}
.drawer-holder .drawer .drawer-message-bar._success .drawer-message-bar-icon ._warning {
  display: none;
}
.drawer-holder .drawer .drawer-message-bar._neutral {
  background-color: #DBF0FA;
}
.drawer-holder .drawer .drawer-message-bar._neutral .drawer-message-bar-icon ._info {
  display: inline;
}
.drawer-holder .drawer .drawer-message-bar._neutral .drawer-message-bar-icon ._check {
  display: none;
}
.drawer-holder .drawer .drawer-message-bar._neutral .drawer-message-bar-icon ._warning {
  display: none;
}
.drawer-holder .drawer .drawer-message-bar .drawer-message-bar-icon {
  margin-right: 0.6rem;
  margin-top: 3px;
  height: 24px;
  width: 24px;
}
.drawer-holder .drawer .drawer-message-bar .drawer-message-bar-icon img {
  height: 24px;
  width: 24px;
  max-width: 24px;
}
.drawer-holder .drawer.on-top {
  z-index: 3;
}
.drawer-holder .drawer .drawer-content {
  /*padding: 2rem;*/
  padding-bottom: 66px;
  overflow-y: auto;
  overflow-x: hidden;
  max-height: calc(100vh - 32px);
}
.drawer-holder .drawer .drawer-content .drawer-content-tile {
  padding-top: 2rem;
  padding-left: 2rem;
  padding-right: 2rem;
}
.drawer-holder .drawer .drawer-content .drawer-content-tile.full-width {
  padding-top: 2rem;
  padding-left: 0rem;
  padding-right: 0rem;
}
.drawer-holder .drawer .drawer-content .drawer-content-tile .searchfilter {
  padding-bottom: 25px;
  border-bottom: solid 1px rgba(187, 187, 187, 0.75);
}
.drawer-holder .drawer .drawer-content .drawer-content-tile .searchfilter .field-name {
  display: none;
}
.drawer-holder .drawer .drawer-content .drawer-content-tile .searchfilter .buttons {
  margin-top: auto;
  margin-left: auto;
  flex-direction: row !important;
  gap: 0;
}
.drawer-holder .drawer .drawer-content .drawer-content-tile .searchfilter .buttons .filter-button {
  display: none;
}
.drawer-holder .drawer .drawer-content::-webkit-scrollbar {
  width: 4px;
}
.drawer-holder .drawer .drawer-content::-webkit-scrollbar-track {
  background-color: #e4e4e4;
  border-radius: 100px;
}
.drawer-holder .drawer .drawer-content::-webkit-scrollbar-thumb {
  background-color: #d4aa70;
  border-radius: 100px;
}

.drawer-searchresult-message {
  font-size: 14px;
  color: #CE161C;
  display: inline-block;
  margin-left: 2rem;
  border-radius: 8px;
}

.drawer-search-result-wrap {
  background-color: #ffffff;
  position: relative;
  z-index: 1;
}

.topdropshadow {
  box-shadow: 0px -6px 5px 0px rgba(0, 0, 0, 0.2509803922);
}
.topdropshadow .drawer-search-placeholder {
  min-height: 700px;
}
.calcsizeauto {
  height: calc-size(auto);
}

.show-search-filters {
  font-size: 12px;
  color: #403F3F;
  padding: 6px 0;
  text-align: center;
  font-weight: bold;
  opacity: 0.4;
  cursor: pointer;
}
.show-search-filters svg {
  margin-right: 4px;
}

.modal-overlay {
  position: fixed !important;
  display: none;
  top: 50%;
  left: 50%;
  transform: translateX(-50%) translateY(-50%);
  z-index: 12;
  background-color: #fff;
  padding: 1rem;
  border-radius: 10px;
  border: 2px solid #6FC5EA;
  box-shadow: 2px 3px 4px rgba(0, 0, 0, 0.25);
  cursor: pointer;
  /*width: 675px;*/
  max-width: 90%;
  cursor: default !important;
  overflow: hidden;
  height: 70%;
  max-height: 90vh;
}
.modal-overlay.show {
  display: block;
}
.modal-overlay.resizable {
  resize: both;
}
.modal-overlay.resizable::-webkit-resizer {
  appearance: none;
}
.modal-overlay .modal-controls {
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  align-items: center;
  gap: 0.3rem;
  justify-content: flex-end;
  transition: 100ms ease-in-out all;
}
.modal-overlay .modal-controls > div {
  text-align: center;
}
.modal-overlay .modal-controls > div img {
  width: 20px;
}
.modal-overlay .modal-controls .close {
  cursor: pointer;
}
.modal-overlay .modal-header {
  font-size: 24px;
  font-weight: bold;
  text-align: center;
  margin-bottom: 3rem;
  color: #403F3F;
}
.modal-overlay .modal-items {
  padding: 0 1rem;
  display: flex;
  flex-direction: column;
  flex-wrap: nowrap;
  gap: 2rem;
  height: 70%;
  overflow-y: auto;
  margin-bottom: 3rem;
  /*max-height:90%;*/
}
.modal-overlay .modal-items::-webkit-scrollbar {
  width: 4px;
}
.modal-overlay .modal-items::-webkit-scrollbar-track {
  background-color: #e4e4e4;
  border-radius: 100px;
}
.modal-overlay .modal-items::-webkit-scrollbar-thumb {
  background-color: #d4aa70;
  border-radius: 100px;
}
.modal-overlay .modal-items .modal-item {
  border-bottom: 1px solid #DEDEDE;
  padding-bottom: 1rem;
}
.modal-overlay .modal-items .modal-item:last-child {
  border-bottom: 0px;
}
.modal-overlay .modal-items .modal-item .modal-item-content {
  display: none;
  /*transition: 100ms ease-in-out all;*/
  padding-top: 1rem;
  font-weight: 300;
  font-size: 13px;
  padding-right: 2rem;
  flex-direction: column;
  flex-wrap: nowrap;
  align-items: center;
  gap: 1.5rem;
  align-items: flex-start;
}
.modal-overlay .modal-items .modal-item .modal-item-content a {
  text-decoration: underline;
}
.modal-overlay .modal-items .modal-item .modal-item-content .modal-video, .modal-overlay .modal-items .modal-item .modal-item-content .modal-img {
  width: 100%;
}
.modal-overlay .modal-items .modal-item .modal-item-content .modal-video .video, .modal-overlay .modal-items .modal-item .modal-item-content .modal-video .img, .modal-overlay .modal-items .modal-item .modal-item-content .modal-img .video, .modal-overlay .modal-items .modal-item .modal-item-content .modal-img .img {
  width: 100%;
}
.modal-overlay .modal-items .modal-item .modal-item-content .modal-video .video img, .modal-overlay .modal-items .modal-item .modal-item-content .modal-video .img img, .modal-overlay .modal-items .modal-item .modal-item-content .modal-img .video img, .modal-overlay .modal-items .modal-item .modal-item-content .modal-img .img img {
  width: 100%;
}
.modal-overlay .modal-items .modal-item .modal-item-content .modal-video .video iframe, .modal-overlay .modal-items .modal-item .modal-item-content .modal-video .img iframe, .modal-overlay .modal-items .modal-item .modal-item-content .modal-img .video iframe, .modal-overlay .modal-items .modal-item .modal-item-content .modal-img .img iframe {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}
.modal-overlay .modal-items .modal-item .modal-item-content .modal-video .video, .modal-overlay .modal-items .modal-item .modal-item-content .modal-img .video {
  position: relative;
  padding-top: 56.25%;
}
.modal-overlay .modal-items .modal-item .modal-item-content .modal-video .video-text, .modal-overlay .modal-items .modal-item .modal-item-content .modal-video .img-text, .modal-overlay .modal-items .modal-item .modal-item-content .modal-img .video-text, .modal-overlay .modal-items .modal-item .modal-item-content .modal-img .img-text {
  font-weight: bold;
  font-size: 12px;
}
.modal-overlay .modal-items .modal-item.open .modal-item-content {
  /*display: flex;*/
}
.modal-overlay .modal-items .modal-item.open .toggle-btn {
  cursor: pointer;
}
.modal-overlay .modal-items .modal-item.open .toggle-btn svg {
  transform: rotate(0deg);
}
.modal-overlay .modal-items .modal-item .modal-item-title {
  font-weight: bold;
  font-size: 14px;
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.modal-overlay .modal-items .modal-item .modal-item-title .title {
  display: flex;
  gap: 6px;
  text-transform: uppercase;
}
.modal-overlay .modal-items .modal-item .toggle-btn {
  position: relative;
  width: 20px;
  height: 20px;
  cursor: pointer;
  /*&:before,
  &:after {
      content: "";
      position: absolute;
      background-color: $color--blue-light;
      transition: transform 0.25s ease-out;
  }*/
  /* Vertical line */
  /*&:before {
      top: 0;
      left: 50%;
      width: 2px;
      height: 100%;
      margin-left: -1px;
  }*/
  /* horizontal line */
  /*&:after {
      top: 50%;
      left: 0;
      width: 100%;
      height: 2px;
      margin-top: -1px;
  }*/
}
.modal-overlay .modal-items .modal-item .toggle-btn svg {
  height: 20px;
  transform: rotate(180deg);
}
.modal-overlay .resize-handle {
  height: 20px;
  width: 20px;
  position: absolute;
  bottom: 0;
  right: 0;
}
.modal-overlay .shortcut-info {
  font-size: 14px;
  position: absolute;
  bottom: 0px;
  padding: 0.5rem 1.5rem 0.5rem 0.5rem;
  /*padding-right:1.5rem;*/
  border-radius: 0 50px 0 0;
  background-color: #fff;
  display: flex;
  flex-direction: row;
  align-items: center;
  gap: 0.8rem;
}
.modal-overlay .shortcut-info .shortcut-btn {
  border: 2px solid #202020;
  box-shadow: 2px 2px #202020;
  font-size: 0.85em;
  line-height: 0.85em;
  display: inline-block;
  font-weight: 600;
  letter-spacing: 0.05em;
  padding: 3px 5px;
  white-space: nowrap;
  height: 20px;
  min-width: 24px;
  text-align: center;
}

.modal-noitems {
  display: flex;
  justify-content: center;
}

.error-section {
  display: flex;
  margin-top: 50px;
  flex-direction: column;
}
.error-section .error-item {
  margin: auto;
  padding-bottom: 25px;
  text-align: center;
}
.error-section img {
  width: 240px;
}
.error-section h1 {
  font-size: 32px;
  margin-top: 20px;
  margin: auto;
}

.grid-to-excel, .grid-clear {
  cursor: pointer;
}

.dbu-table.k-grid .update-col > *, .dbu-table.k-grid .delete-col > *, .dbu-table.k-grid .add-col-action > * {
  display: none;
}
.dbu-table.k-grid .delete-col-action ._delete {
  cursor: pointer !important;
}
.dbu-table.k-grid .add-col-action img {
  width: 16px;
}

.foda2._body.editmode .dbu-table.k-grid .update-col > *, .foda2._body.editmode .dbu-table.k-grid .delete-col > *, .foda2._body.editmode .dbu-table.k-grid .add-col-action > * {
  display: flex;
  cursor: pointer;
}
.foda2._body.editmode .dbu-table.k-grid ._cleardelete {
  display: none;
  margin-left: -2px;
  width: 16px;
}
.foda2._body.editmode .dbu-table.k-grid .drag-handle-col .GridDragPlaceHolder {
  opacity: 1;
  cursor: move;
}

.dbu-table.k-grid td.k-selected, .dbu-table.k-grid th.k-selected, .dbu-table.k-grid tr.k-selected > td.k-table-td {
  background-color: #6FC5EA;
}
.dbu-table .k-master-row.k-alt .k-grid-content-sticky, .dbu-table .k-master-row.k-alt .k-grid-row-sticky {
  background-color: #fff;
}
.dbu-table .k-grid-header .k-grid-header-sticky, .dbu-table .k-grid-header .k-grid-header-sticky.k-sorted {
  background-color: #fff;
}
.dbu-table.k-grid.grid-pageable .k-grid-content {
  border-radius: 0;
}
.dbu-table.k-grid.grid-selectable tbody tr:hover, .dbu-table .k-grid.grid-multi-select tbody tr:hover {
  background-color: #e2f3fb !important;
}
.dbu-table.k-grid.grid-selectable tbody tr.k-master-row, .dbu-table .k-grid.grid-multi-select tbody tr.k-master-row {
  cursor: pointer;
}
.dbu-table.k-grid {
  border-width: 0 !important;
  background-color: transparent !important;
  /*z-index: 1;*/
}
.dbu-table.k-grid .k-grid-container {
  overflow: visible;
}
.dbu-table.k-grid table {
  width: 100%;
}
.dbu-table.k-grid .nowrap {
  white-space: nowrap;
}
.dbu-table.k-grid .align-top {
  vertical-align: top;
}
.dbu-table.k-grid .k-grid-content {
  border-radius: 0 0 8px 8px;
}
.dbu-table.k-grid .k-grid-content.k-auto-scrollable {
  overflow: visible;
  overflow-y: visible;
}
.dbu-table.k-grid .k-table-thead {
  border-color: inherit !important;
  background-color: #ffffff;
  color: #c2c2c2;
  font-size: 14px;
  padding-right: 0 !important;
}
.dbu-table.k-grid .k-grid-header {
  background-color: #ffffff;
  color: #c2c2c2;
  font-size: 14px;
  padding-right: 0 !important;
  border-color: rgba(187, 187, 187, 0.75);
  position: sticky;
  top: 30.59px;
  background-color: #fff;
  z-index: 1;
}
@media only screen and (max-width: 1024px) {
  .dbu-table.k-grid .k-grid-header {
    top: 60.59px;
  }
}
.dbu-table.k-grid .k-grid-header .k-link > .k-icon.k-i-sort-asc-sm::before {
  content: "❮";
  color: #202020;
  transform: rotate(90deg);
}
.dbu-table.k-grid .k-grid-header .k-link > .k-icon.k-i-sort-desc-sm::before {
  content: "❮";
  color: #202020;
  transform: rotate(-90deg);
}
.dbu-table.k-grid .k-header-column-menu {
  bottom: 0 !important;
  display: block;
  padding: 6px !important;
  right: 0 !important;
  text-align: center;
}
.dbu-table.k-grid .drag-handle-col .GridDragPlaceHolder {
  opacity: 0.3;
  cursor: default;
}
.dbu-table.k-grid thead tr th {
  padding: 0.4rem 0.5rem;
  /*padding-left: 1rem;*/
  border-color: rgba(187, 187, 187, 0.75) !important;
  border-left: 1px solid transparent !important;
}
.dbu-table.k-grid thead .k-grid-filter {
  height: auto;
  padding: 0;
}
.dbu-table.k-grid tbody tr {
  /*&:hover {
      background-color: $color--table-row-hover !important;
  }

  &.k-master-row {
      cursor: pointer;
  }*/
}
.dbu-table.k-grid tbody tr td {
  padding: 0.4rem 0.5rem;
  padding-left: 1rem;
  border-top: 1px solid #DEDEDE;
  font-size: 14px;
  color: #202020;
  border-left: 1px solid transparent !important;
}
@media only screen and (max-width: 1024px) {
  .dbu-table.k-grid tbody tr td {
    font-size: 11px;
    padding: 0.2rem;
  }
}
.dbu-table.k-grid tbody tr td:not(.k-hierarchy-cell) {
  padding: 0.4rem 0.5rem;
}
.dbu-table.k-grid tbody tr td.k-focus {
  box-shadow: none !important;
}
.dbu-table.k-grid tbody tr:first-child td {
  border-top: none;
}
.dbu-table.k-grid tbody tr.k-detail-row:hover {
  background-color: transparent !important;
}
.dbu-table.k-grid .k-table-alt-row {
  /*background-color: $color--white;*/
  background-color: transparent;
}
.dbu-table .gridcell-img-container {
  height: 120px;
  width: 120px;
  border-radius: 50%;
  overflow: hidden;
  background-color: #DEDEDE;
  display: inline-flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
}
.dbu-table .gridcell-img-container.small {
  width: 50px;
  height: 50px;
}
.dbu-table .gridcell-img-container .gridcell-img {
  width: 120px;
  height: auto;
}
.dbu-table .gridcell-img-container .gridcell-img.small {
  width: 50px;
  height: auto;
}
.dbu-table .gridcell-iconimg {
  width: auto;
  height: 48px;
}
.dbu-table .gridcell-iconimg.small {
  width: auto;
  height: 30px;
}
.dbu-table .gridcell-iconimg.tiny {
  width: auto;
  height: 20px;
}
.dbu-table .grid-pdf-btn {
  display: flex;
  justify-content: center;
  align-items: center;
  cursor: pointer;
}
.dbu-table .grid-pdf-btn a {
  display: flex;
  justify-content: center;
  align-items: center;
}
.dbu-table .k-grid-footer {
  border-radius: 0 0 8px 8px;
  padding-right: 0 !important;
  border-color: rgba(187, 187, 187, 0.75);
}
.dbu-table .k-grid-footer .k-grid-footer-wrap {
  /*     border-radius: 0 0 8px 8px;*/
}
.dbu-table .k-grid-footer .k-grid-footer-wrap .k-table .k-table-tfoot {
  background-color: #F0F0F0;
}
.dbu-table .k-grid-footer .k-grid-footer-wrap .k-table .k-table-tfoot .k-table-row .k-table-td {
  border: 0;
  text-overflow: unset;
  font-size: 14px;
}

.dbu-table.hierarchy.k-grid .k-grid-header {
  position: static !important;
}
.dbu-table.hierarchy.k-grid thead tr th {
  border-color: rgba(187, 187, 187, 0.75) !important;
  border-left: 1px solid transparent !important;
}
.dbu-table.hierarchy.k-grid thead tr th .k-link {
  color: rgb(194, 194, 194);
}
.dbu-table.hierarchy.k-grid thead tr:hover {
  background-color: transparent !important;
}

/******Pager*******/
.dbu-table .k-pager-nav, .dbu-table .k-pager-numbers .k-link, .dbu-table .k-pager-refresh {
  height: 26px;
  width: 20px;
  min-width: 20px;
}
@media only screen and (max-width: 1024px) {
  .dbu-table .k-pager-numbers .k-link {
    display: none;
  }
}
.dbu-table .k-pager {
  /*z-index:-1;*/
  background-color: transparent;
}
.dbu-table .k-pager .k-pager-numbers .k-button {
  color: #202020 !important;
  border: 0 !important;
  font-size: 12px;
}
.dbu-table .k-pager .k-pager-numbers .k-button.k-selected {
  color: #202020 !important;
  font-weight: bold;
  background-color: transparent;
  border-color: transparent;
}
.dbu-table .k-pager .k-pager-nav.k-link {
  color: #202020 !important;
  padding: 16px;
  border: 0 !important;
}
.dbu-table .k-pager .k-pager-info {
  font-size: 10px;
  color: #808080;
}
.dbu-table .k-pager .k-pager-sizes {
  font-size: 12px;
}
.dbu-table .k-pager .k-pager-sizes .k-picker-solid {
  width: 80px;
}
.dbu-table .k-pager .k-i-arrow-end-left::before {
  content: "❮";
  font-size: 14px;
}
.dbu-table .k-pager .k-i-arrow-end-left::after {
  content: "❮";
  font-size: 14px;
}
.dbu-table .k-pager .k-i-arrow-60-left::before {
  content: "❮";
  font-size: 14px;
}
.dbu-table .k-pager .k-i-arrow-60-right::before {
  content: "❯";
  font-size: 14px;
}
.dbu-table .k-pager .k-i-arrow-end-right::before {
  content: "❯";
  font-size: 14px;
}
.dbu-table .k-pager .k-i-arrow-end-right::after {
  content: "❯";
  font-size: 14px;
}

.mobile-nav-open .dbu-table.k-grid .k-grid-header {
  z-index: 0 !important;
}

/******Column picker*******/
.grid-column-picker-wrap {
  justify-self: flex-end;
  position: relative;
  font-size: 12px;
  /*  .k-menu:not(.k-context-menu) {
      border-color: transparent;
      background-color: transparent;
      outline: 0 !important;
  }

  .k-menu-link {
      font-size: 12px;
      padding: 0;

      .k-icon {
          margin-left: 0;
      }

      label {
          font-weight: 400;
      }
  }

  .k-menu.k-menu-horizontal:not(.k-context-menu) {
      padding: 0;
  }

  .k-menu:not(.k-context-menu) > .k-item {
      box-shadow: none !important;
  }

  .k-menu-group .k-menu-link {
      padding: 5px;
      padding-right: 10px;
      font-size: 12px;

      label {
          display: flex;
          align-content: center;

          input {
              margin-right: 5px;
          }
      }
  }

  .k-link k-menu-link {
      outline: 0 !important;
  }*/
}
.grid-column-picker-wrap span {
  color: #808080;
}
.grid-column-picker-wrap label {
  display: flex;
}
.grid-column-picker-wrap ul {
  display: none;
  position: absolute;
  top: 0;
  right: 0;
  flex-direction: column;
  background-color: #F6F6F6;
  box-shadow: 2px 3px 4px rgba(0, 0, 0, 0.25);
  min-width: 200px;
  padding: 5px;
  border-radius: 3px;
  border: 1px solid #6FC5EA;
  z-index: 3;
}
.grid-column-picker-wrap:hover ul {
  display: flex;
}

/**********************************************/
/*NO RECORDS*/
/**********************************************/
.dbu-table.k-grid .k-grid-norecords-template {
  border: 0;
  width: calc(100% - 1rem);
  line-height: 4rem;
  margin-left: 1rem;
  color: #808080;
  border-radius: 0 0 8px 8px;
}

.dbu-table.k-grid .k-grid-norecords {
  overflow: hidden;
  border-radius: 0 0 8px 8px;
}

/**********************************************/
/*GRID ADD BUTTON*/
/**********************************************/
.dbu-table-grid-add {
  background-color: #F6F6F6;
  border-radius: 0 0 8px 8px;
  display: none;
  justify-content: center;
  padding: 1rem;
  border-top: 1px solid rgba(187, 187, 187, 0.75);
}
.dbu-table-grid-add .img-btn {
  width: 32px;
}

.foda2._body.editmode .dbu-table-grid-add {
  display: flex;
  height: 70px;
}

/**********************************************/
/*GRID IN DRAWER*/
/**********************************************/
.dbu-table.k-grid.dbu-table-drawer .k-grid-header {
  position: relative;
  top: 0;
  z-index: 0;
}
.dbu-table.k-grid.dbu-table-drawer .k-grid-header .k-grid-header-wrap {
  border: 0;
}

.drawer-content-tile .dbu-table-grid-add {
  background-color: transparent;
  border-top: 0;
  display: flex;
}

/**********************************************/
/*GRID BURGER MENU*/
/**********************************************/
.grid-burger-toggle {
  position: relative;
  margin-right: 1rem;
  z-index: 1;
  /*height: 100%;*/
  display: flex;
  justify-content: flex-end;
  cursor: pointer;
  transition: all 200ms ease-in;
  display: none;
}
.grid-burger-toggle:not(.show-on-edit) {
  display: flex;
}
.grid-burger-toggle > img {
  /*          transition: all 200ms linear;
    &:hover{
        opacity:0.6;
        transform:translateX(-2px);
    }*/
}
.grid-burger-toggle .grid-burger {
  position: absolute;
  right: 12px;
  top: -12px;
  background-color: #202020;
  color: #fff;
  border-radius: 8px;
  z-index: 1;
  display: flex;
  display: none;
  flex-direction: column;
  margin-right: 10px;
  transform: translateY(4px);
}
.grid-burger-toggle .grid-burger.open {
  display: flex;
}
.grid-burger-toggle .grid-burger::after {
  content: "";
  width: 0;
  height: 0;
  border-left: 6px solid #202020;
  border-bottom: 6px solid transparent;
  border-top: 6px solid transparent;
  position: absolute;
  top: 8px;
  right: 0;
  transform: translateX(100%);
}
.grid-burger-toggle .grid-burger .grid-burger-item {
  /*padding: 0.5rem;*/
  font-size: 10px;
  font-weight: 500;
  min-width: 180px;
  border-bottom: 1px solid #403F3F;
  cursor: pointer;
}
.grid-burger-toggle .grid-burger .grid-burger-item.only-on-edit {
  display: none;
}
.grid-burger-toggle .grid-burger .grid-burger-item > a, .grid-burger-toggle .grid-burger .grid-burger-item > div:first-child {
  display: flex;
  padding: 0.5rem;
  width: 100%;
  height: 100%;
}
.grid-burger-toggle .grid-burger .grid-burger-item:hover {
  background-color: rgba(255, 255, 255, 0.2);
}
.grid-burger-toggle .grid-burger .grid-burger-item:last-child {
  border-bottom: 0;
}

.dbu-table .select-column {
  width: 0;
}
.dbu-table .select-column input {
  display: none;
}

.foda2._body.editmode .grid-burger-toggle .grid-burger .grid-burger-item.only-on-edit {
  display: flex;
}
.foda2._body.editmode .grid-burger-toggle.show-on-edit {
  display: flex;
}
.foda2._body.editmode .dbu-table .select-column {
  width: 40px;
}
.foda2._body.editmode .dbu-table .select-column input {
  display: flex;
}

/**********************************************/
/*GRID OPERATION TYPES*/
/**********************************************/
.dbu-table.k-grid tbody tr.op-type-delete {
  background-color: rgba(255, 28, 53, 0.05);
  text-decoration: line-through;
}
.dbu-table.k-grid tbody tr.op-type-delete:hover {
  background-color: rgba(255, 28, 53, 0.25) !important;
}
.dbu-table.k-grid tbody tr.op-type-delete .delete-col ._delete {
  display: none;
}
.dbu-table.k-grid tbody tr.op-type-delete .delete-col ._cleardelete {
  display: block;
}
.dbu-table.k-grid tbody tr.op-type-delete .update-col .k-text-center {
  display: none;
}
.dbu-table.k-grid tbody tr.op-type-delete .dataoperation-col {
  background-color: rgba(255, 28, 53, 0.25);
}

.dbu-table.k-grid tbody tr.op-type-insert {
  background-color: rgba(152, 209, 107, 0.05);
}
.dbu-table.k-grid tbody tr.op-type-insert:hover {
  background-color: rgba(152, 209, 107, 0.25) !important;
}
.dbu-table.k-grid tbody tr.op-type-insert .dataoperation-col {
  background-color: rgba(152, 209, 107, 0.25);
}

.dbu-table.k-grid tbody tr.op-type-update {
  background-color: rgba(111, 197, 234, 0.05);
}
.dbu-table.k-grid tbody tr.op-type-update:hover {
  background-color: rgba(111, 197, 234, 0.25) !important;
}
.dbu-table.k-grid tbody tr.op-type-update .dataoperation-col {
  background-color: rgba(111, 197, 234, 0.25);
}

.dbu-table.k-grid .dataoperation-col {
  padding: 0;
  text-align: center;
  position: relative !important;
}
.dbu-table.k-grid .dataoperation-col img {
  position: absolute;
  top: 50%;
  left: calc(50% - 1px);
  transform: translateX(-50%) translateY(-50%);
}

/**********************************************/
/*INLINE EDIT*/
/**********************************************/
.edit-page-content:not(.edit-open) .k-grid.grid-inline-edit tr.k-master-row td {
  cursor: default !important;
}

.foda2._body.editmode .k-grid.grid-inline-edit tr.k-master-row td:not(.edit-cell) {
  cursor: default !important;
}

.foda2._body.editmode .k-grid .k-dirty-cell:has(.k-dirty), .drawer .k-grid .k-dirty-cell:has(.k-dirty) {
  background-color: #4CA2C7;
  color: #F6F6F6 !important;
  position: relative;
}
.foda2._body.editmode .k-grid .k-dirty-cell, .drawer .k-grid .k-dirty-cell {
  /* background-color: $color--blue;
  color: $color--almostwhite !important;
  position: relative;*/
}
.foda2._body.editmode .k-grid .k-dirty-cell .k-dirty, .drawer .k-grid .k-dirty-cell .k-dirty {
  border-width: 0;
  position: absolute;
  top: -1px;
  right: 0;
  left: auto;
  width: 100%;
  display: flex;
}
.foda2._body.editmode .k-grid .k-dirty-cell .k-dirty::after, .drawer .k-grid .k-dirty-cell .k-dirty::after {
  content: "REDIGERET";
  color: #F6F6F6;
  font-size: 8px;
  font-weight: bold;
  position: absolute;
  right: 4px;
}
.foda2._body.editmode .k-grid .edit-cell, .drawer .k-grid .edit-cell {
  /*position:absolute;*/
  padding-left: 0;
  position: relative;
  height: 36px;
  overflow: visible;
  /*.edit-cell-inner {
  position: relative;
  */
  /*}*/
}
.foda2._body.editmode .k-grid .edit-cell#Grid_active_cell, .drawer .k-grid .edit-cell#Grid_active_cell {
  position: unset;
}
.foda2._body.editmode .k-grid .edit-cell#Grid_active_cell::after, .drawer .k-grid .edit-cell#Grid_active_cell::after {
  display: none;
}
.foda2._body.editmode .k-grid .edit-cell::after, .drawer .k-grid .edit-cell::after {
  content: "";
  background-image: url("/img/icons/grid-edit.svg");
  height: 8px;
  width: 8px;
  background-size: contain;
  position: absolute;
  top: 54%;
  transform: translateY(-50%);
  left: 5px;
  overflow: visible;
}
.foda2._body.editmode .k-grid .edit-cell.k-edit-cell, .drawer .k-grid .edit-cell.k-edit-cell {
  position: relative;
  padding: 0.4rem 0.2rem !important;
}
.foda2._body.editmode .k-grid .edit-cell.k-edit-cell .edit-cell-inner:after, .drawer .k-grid .edit-cell.k-edit-cell .edit-cell-inner:after {
  display: none;
}
.foda2._body.editmode .k-grid .edit-cell.k-edit-cell::after, .drawer .k-grid .edit-cell.k-edit-cell::after {
  content: none;
}
.foda2._body.editmode .k-grid .edit-cell .k-tooltip, .drawer .k-grid .edit-cell .k-tooltip {
  /*position: relative;*/
}
.foda2._body.editmode .k-grid .nav-cell a:hover, .drawer .k-grid .nav-cell a:hover {
  text-decoration: underline;
}

.k-grid .k-grid-content .k-state-focused {
  box-shadow: none;
  position: unset;
  position: relative;
}

.dbu-table.k-grid tbody tr td.edit-cell {
  padding: 0.4rem 0.5rem !important;
  padding-left: 1rem !important;
}

/**********************************************/
/*DRAG'n'DROP*/
/**********************************************/
.GridDragPlaceHolder {
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: move;
}

.drag-hint {
  background-color: #F6F6F6;
  border: 1px solid #6FC5EA;
  font-size: 12px;
  padding: 0.3rem;
  /*.grid-burger-toggle{display:none;}
  .delete-col-action{
      display:none;
  }
  .dataoperation-col{display:none;}*/
}
.drag-hint td {
  display: none;
}
.drag-hint .drag-title-col, .drag-hint .drag-handle-col {
  display: table-cell;
}

/**********************************************/
/*Grid Multi select tooltip*/
/**********************************************/
.grid-multi-select-message {
  width: 220px;
  background-color: #4CA2C7;
  color: #F6F6F6;
  position: fixed;
  /* top:0px;
  left:0px;*/
  z-index: 1000;
  font-size: 12px;
  padding: 0.5rem 1rem;
  /*border-radius:8px;*/
  display: none;
  justify-content: flex-end;
  /*color:$color--medgray;*/
  opacity: 0;
}
.grid-multi-select-message.show {
  display: inline-flex;
  opacity: 1;
}
.grid-multi-select-message > div > div {
  display: inline-flex;
}
.grid-multi-select-message .shortcut-btn {
  border: 2px solid #202020;
  box-shadow: 2px 2px #202020;
  font-size: 0.85em;
  line-height: 0.85em;
  display: inline-block;
  font-weight: 600;
  letter-spacing: 0.05em;
  padding: 3px 5px;
  white-space: nowrap;
  height: 16px;
  min-width: 24px;
  text-align: center;
  background-color: #F6F6F6;
  color: #202020;
  padding: 1px 3px;
  margin-right: 2px;
}

.tool-tip, .tooltip-holder {
  display: inline-flex;
  position: relative;
  z-index: 12;
  cursor: help;
}
.tool-tip.in-drawer, .tooltip-holder.in-drawer {
  z-index: 102;
}
.tool-tip img, .tooltip-holder img {
  height: 14px;
  width: 14px;
}
.tool-tip .tool-tip-popup, .tooltip-holder .tool-tip-popup {
  display: none;
  position: absolute;
  background-color: #202020;
  color: #ffffff;
  padding: 1rem;
  border-radius: 8px;
  left: 50%;
  bottom: 25px;
  transform: translateX(-50%);
  flex-direction: column;
}
.tool-tip .tool-tip-popup .tool-tip-inner, .tooltip-holder .tool-tip-popup .tool-tip-inner {
  /*white-space:nowrap;*/
  /*max-width:300px;*/
  width: max-content;
}
.tool-tip .tool-tip-popup::after, .tooltip-holder .tool-tip-popup::after {
  content: "";
  position: absolute;
  top: 100%;
  left: 50%;
  transform: translateX(-50%);
  height: 0;
  width: 0;
  border-left: 10px solid transparent;
  border-right: 10px solid transparent;
  border-top: 10px solid #202020;
}
.tool-tip .tool-tip-popup.righted, .tooltip-holder .tool-tip-popup.righted {
  left: 0px;
  transform: translateX(-13px);
}
.tool-tip .tool-tip-popup.righted::after, .tooltip-holder .tool-tip-popup.righted::after {
  left: 10px;
  transform: translateX(0%);
}
.tool-tip .tool-tip-popup.lefted, .tooltip-holder .tool-tip-popup.lefted {
  left: auto;
  right: -1px;
  transform: translateX(12px);
}
.tool-tip .tool-tip-popup.lefted::after, .tooltip-holder .tool-tip-popup.lefted::after {
  left: auto;
  right: 10px;
  transform: translateX(0%);
}
.tool-tip .tool-tip-popup h4, .tooltip-holder .tool-tip-popup h4 {
  font-weight: bold;
  font-size: 14px;
}
.tool-tip .tool-tip-popup p, .tool-tip .tool-tip-popup ul, .tool-tip .tool-tip-popup div, .tooltip-holder .tool-tip-popup p, .tooltip-holder .tool-tip-popup ul, .tooltip-holder .tool-tip-popup div {
  font-size: 12px;
  font-weight: 300;
  max-width: 300px;
}
.tool-tip .tool-tip-popup ul li, .tooltip-holder .tool-tip-popup ul li {
  list-style-type: disc;
  display: list-item;
  margin-left: 10px;
}
.tool-tip.tooltip-holder:hover .tool-tip-popup, .tooltip-holder.tooltip-holder:hover .tool-tip-popup {
  display: flex;
}
.tool-tip.show-under .tool-tip-popup, .tooltip-holder.show-under .tool-tip-popup {
  top: 25px;
  bottom: auto;
}
.tool-tip.show-under .tool-tip-popup::after, .tooltip-holder.show-under .tool-tip-popup::after {
  content: "";
  position: absolute;
  bottom: 100%;
  top: auto;
  left: 50%;
  transform: translateX(-50%);
  height: 0;
  width: 0;
  border-left: 10px solid transparent;
  border-right: 10px solid transparent;
  border-bottom: 10px solid #202020;
  border-top: 0;
}

.drawer .tool-tip {
  z-index: 1;
}
.drawer .tool-tip-popup {
  /*max-width:200px;*/
}
.drawer .tool-tip-popup .tool-tip-inner {
  max-width: 200px;
  /*min-width:100px;*/
}
.drawer .tool-tip-popup .tool-tip-inner p {
  /*max-width:200px;*/
}
.drawer:not(.on-top) .tool-tip {
  z-index: 0;
}

.mobile-nav-open .tool-tip {
  z-index: 0;
}

.tooltip-holder {
  position: absolute;
  top: 0;
  left: 0;
}

.main-spinner-overlay {
  height: 100%;
  width: 100%;
  position: fixed;
  top: 0;
  left: 0;
  background-color: rgba(240, 240, 240, 0.5);
  z-index: 1000;
}
.main-spinner-overlay .spinner {
  position: absolute;
  top: 50%;
  left: 46%;
  transform: translateX(-50%) translateY(-50%);
  margin: 0;
  margin-top: -4rem;
}
.main-spinner-overlay .spinner:after {
  /*background-color:#f0f0f0;*/
}

.search-spinner-wrap {
  height: 100%;
  width: 100%;
  position: absolute;
  top: 0;
  left: 0;
  background-color: rgba(240, 240, 240, 0.5);
  z-index: 1000;
}
.search-spinner-wrap .spinner {
  position: absolute;
  top: 50%;
  left: 45%;
  transform: translateX(-50%) translateY(-50%);
  margin: 0;
  margin-top: -4rem;
}
.search-spinner-wrap .spinner:after {
  /*background-color:#f0f0f0;*/
}

/*.spinner {
  font-size: 10px;
  margin: 50px auto;
  text-indent: -9999em;
  width: 11em;
  height: 11em;
  border-radius: 50%;*/
/*background: #4ca2c7;
  background: linear-gradient(to right, #4ca2c7 10%, rgba(76,162,199, 0) 42%);*/
/*position: relative;
  animation: load3 1.4s infinite linear;
  transform: translateZ(0);
  background-image:url(/img/dbulogo.png);
  background-size:contain;
  opacity:0.8;
}
.spinner:before {
  width: 50%;
  height: 50%;*/
/*background: #4ca2c7;*/
/*border-radius: 100% 0 0 0;
  position: absolute;
  top: 0;
  left: 0;
  content: '';
}
.spinner:after {*/
/*background: #fff;*/
/*width: 75%;
  height: 75%;
  border-radius: 50%;
  content: '';
  margin: auto;
  position: absolute;
  top: 0;
  left: 0;
  bottom: 0;
  right: 0;
}

@keyframes load3 {
  0% {
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg);
  }
  100% {
    -webkit-transform: rotate(360deg);
    transform: rotate(360deg);
  }
}*/
.spinner {
  width: 100px;
  height: 100px;
  border-radius: 50%;
  position: relative;
  border: 2px solid;
  border-color: #CE161C transparent #CE161C transparent;
  box-sizing: border-box;
  animation: rotation 1.2s linear infinite;
}
.spinner:not(.no-display) {
  display: inline-block;
}

.spinner::after {
  content: "";
  box-sizing: border-box;
  position: absolute;
  left: 0;
  right: 0;
  top: 0;
  bottom: 0;
  margin: auto;
  /*border: 3px solid;
  border-color: transparent #FD0000 #FD0000;*/
  width: 80px;
  height: 80px;
  background-image: url(/img/dbulogo.png);
  background-size: contain;
  border-radius: 50%;
  animation: rotationBack 0.8s linear infinite;
  transform-origin: center center;
}

@keyframes rotation {
  0% {
    transform: rotate(0deg);
  }
  100% {
    transform: rotate(360deg);
  }
}
@keyframes rotationBack {
  0% {
    transform: rotate(0deg);
  }
  100% {
    transform: rotate(-360deg);
  }
}
.add-favorite {
  position: relative;
  display: inline-block;
}
.add-favorite .modal-add-favorite {
  display: none;
  position: absolute;
  top: 120%;
  left: 50%;
  transform: translateX(-50%);
  background-color: #403F3F;
  color: #fff;
  padding: 0.8rem;
  border-radius: 16px;
}
.add-favorite .modal-add-favorite.show {
  display: flex;
}
.add-favorite .modal-add-favorite label {
  color: #DEDEDE;
  margin-top: 0.5rem;
  display: flex;
  font-size: 10px;
  font-weight: bold;
  margin-bottom: 0.1rem;
}
.add-favorite .modal-add-favorite input {
  margin-bottom: 0.8rem;
  background-color: #f9f9f9;
  color: #202020;
  font-weight: 400;
  font-family: "GothamPro";
  border-color: #DEDEDE;
  font-size: 10px;
  border-radius: 4px;
  height: 32px;
  border-style: solid;
  width: 154px;
}
.add-favorite .modal-add-favorite h4 {
  font-size: 12px;
}
.add-favorite .modal-add-favorite::after {
  content: "";
  position: absolute;
  bottom: 100%;
  left: 50%;
  transform: translateX(-50%);
  height: 0;
  width: 0;
  border-left: 10px solid transparent;
  border-right: 10px solid transparent;
  border-bottom: 10px solid #403F3F;
}

.confirm-overlay {
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  position: fixed;
  background-color: rgba(0, 0, 0, 0.3);
  z-index: 101;
  display: none;
}
.confirm-overlay .confirm-box-wrap {
  display: flex;
  flex-direction: column;
  gap: 1rem;
}

.confirm-box-wrap {
  display: none;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  background-color: #ffffff;
  border-radius: 10px;
  box-shadow: 2px 3px 2px rgba(0, 0, 0, 0.25);
  overflow: hidden;
}
.confirm-box-wrap .confirm-box-header {
  display: flex;
  width: 100%;
  background-color: #ffffff;
  color: #202020;
  padding: 0.4rem 0.4rem;
  flex-direction: row;
  gap: 0.4rem;
  font-weight: bold;
  font-size: 14px;
  border-bottom: 1px solid rgba(187, 187, 187, 0.75);
}
.confirm-box-wrap .confirm-box-header img {
  width: 18px;
}
.confirm-box-wrap .confirm-box-inner {
  /* padding:1rem;*/
}
.confirm-box-wrap .confirm-box-text {
  font-size: 14px;
  padding: 1rem 2rem;
}
.confirm-box-wrap .confirm-box-btn-wrap {
  text-align: center;
  margin-top: 1rem;
  background-color: #F6F6F6;
  padding: 0.8rem;
}

.shortcut-overlay {
  position: fixed;
  display: none;
  bottom: 140px;
  right: 10px;
  z-index: 10;
  background-color: #fff;
  padding: 1rem;
  border-radius: 10px;
  border: 2px solid #6FC5EA;
  box-shadow: 2px 3px 4px rgba(0, 0, 0, 0.25);
  cursor: pointer;
}
.shortcut-overlay.show {
  display: block;
}
.shortcut-overlay .shortcut-wrap {
  display: flex;
  flex-direction: column;
  gap: 1rem;
}
.shortcut-overlay .shortcut-wrap .shortcut-item {
  display: flex;
  flex-direction: row;
  gap: 1rem;
}
.shortcut-overlay .shortcut-wrap .shortcut-item .shortcut-buttons {
  display: flex;
  flex-direction: row;
  gap: 0.5rem;
  width: 100px;
}
.shortcut-overlay .shortcut-wrap .shortcut-item .shortcut-buttons.isMacOS {
  width: 230px;
}
.shortcut-overlay .shortcut-wrap .shortcut-item .shortcut-buttons .shortcut-btn {
  border: 2px solid #202020;
  box-shadow: 2px 2px #202020;
  font-size: 0.85em;
  line-height: 0.85em;
  display: inline-block;
  font-weight: 600;
  letter-spacing: 0.05em;
  padding: 3px 5px;
  white-space: nowrap;
  height: 24px;
  min-width: 26px;
  text-align: center;
}
.shortcut-overlay .shortcut-wrap .shortcut-item .shortcut-text {
  margin-top: 4px;
  font-size: 12px;
  max-width: 100px;
}
.shortcut-overlay .shortcut-wrap .shortcut-item .shortcut-text span {
  display: block;
  font-size: 10px;
  color: #403F3F;
}

.help-section-overlay {
  position: fixed !important;
  display: none;
  top: 50%;
  left: 50%;
  transform: translateX(-50%) translateY(-50%);
  z-index: 12;
  background-color: #fff;
  padding: 1rem;
  border-radius: 10px;
  border: 2px solid #6FC5EA;
  box-shadow: 2px 3px 4px rgba(0, 0, 0, 0.25);
  cursor: pointer;
  width: 675px;
  cursor: default !important;
  overflow: hidden;
  height: 70%;
  max-height: 90vh;
}
.help-section-overlay.show {
  display: block;
}
.help-section-overlay.resizable {
  resize: both;
}
.help-section-overlay.resizable::-webkit-resizer {
  appearance: none;
}
.help-section-overlay .help-section-controls {
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  align-items: center;
  gap: 0.3rem;
  justify-content: flex-end;
  transition: 100ms ease-in-out all;
}
.help-section-overlay .help-section-controls > div {
  text-align: center;
}
.help-section-overlay .help-section-controls > div img {
  width: 20px;
}
.help-section-overlay .help-section-controls .close {
  cursor: pointer;
}
.help-section-overlay .help-section-header {
  font-size: 24px;
  font-weight: bold;
  text-align: center;
  margin-bottom: 3rem;
  color: #403F3F;
}
.help-section-overlay .help-section-items {
  padding: 0 3rem;
  display: flex;
  flex-direction: column;
  flex-wrap: nowrap;
  gap: 2rem;
  height: 70%;
  overflow-y: auto;
  margin-bottom: 3rem;
  /*max-height:90%;*/
}
.help-section-overlay .help-section-items::-webkit-scrollbar {
  width: 4px;
}
.help-section-overlay .help-section-items::-webkit-scrollbar-track {
  background-color: #e4e4e4;
  border-radius: 100px;
}
.help-section-overlay .help-section-items::-webkit-scrollbar-thumb {
  background-color: #d4aa70;
  border-radius: 100px;
}
.help-section-overlay .help-section-items .help-section-item {
  border-bottom: 1px solid #DEDEDE;
  padding-bottom: 1rem;
}
.help-section-overlay .help-section-items .help-section-item:last-child {
  border-bottom: 0px;
}
.help-section-overlay .help-section-items .help-section-item .help-section-item-content {
  display: none;
  /*transition: 100ms ease-in-out all;*/
  padding-top: 1rem;
  font-weight: 300;
  font-size: 13px;
  padding-right: 2rem;
  flex-direction: column;
  flex-wrap: nowrap;
  align-items: center;
  gap: 1.5rem;
  align-items: flex-start;
}
.help-section-overlay .help-section-items .help-section-item .help-section-item-content a {
  text-decoration: underline;
}
.help-section-overlay .help-section-items .help-section-item .help-section-item-content .help-section-video, .help-section-overlay .help-section-items .help-section-item .help-section-item-content .help-section-img {
  width: 100%;
}
.help-section-overlay .help-section-items .help-section-item .help-section-item-content .help-section-video .video, .help-section-overlay .help-section-items .help-section-item .help-section-item-content .help-section-video .img, .help-section-overlay .help-section-items .help-section-item .help-section-item-content .help-section-img .video, .help-section-overlay .help-section-items .help-section-item .help-section-item-content .help-section-img .img {
  width: 100%;
}
.help-section-overlay .help-section-items .help-section-item .help-section-item-content .help-section-video .video img, .help-section-overlay .help-section-items .help-section-item .help-section-item-content .help-section-video .img img, .help-section-overlay .help-section-items .help-section-item .help-section-item-content .help-section-img .video img, .help-section-overlay .help-section-items .help-section-item .help-section-item-content .help-section-img .img img {
  width: 100%;
}
.help-section-overlay .help-section-items .help-section-item .help-section-item-content .help-section-video .video iframe, .help-section-overlay .help-section-items .help-section-item .help-section-item-content .help-section-video .img iframe, .help-section-overlay .help-section-items .help-section-item .help-section-item-content .help-section-img .video iframe, .help-section-overlay .help-section-items .help-section-item .help-section-item-content .help-section-img .img iframe {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}
.help-section-overlay .help-section-items .help-section-item .help-section-item-content .help-section-video .video, .help-section-overlay .help-section-items .help-section-item .help-section-item-content .help-section-img .video {
  position: relative;
  padding-top: 56.25%;
}
.help-section-overlay .help-section-items .help-section-item .help-section-item-content .help-section-video .video-text, .help-section-overlay .help-section-items .help-section-item .help-section-item-content .help-section-video .img-text, .help-section-overlay .help-section-items .help-section-item .help-section-item-content .help-section-img .video-text, .help-section-overlay .help-section-items .help-section-item .help-section-item-content .help-section-img .img-text {
  font-weight: bold;
  font-size: 12px;
}
.help-section-overlay .help-section-items .help-section-item.open .help-section-item-content {
  /*display: flex;*/
}
.help-section-overlay .help-section-items .help-section-item.open .toggle-btn {
  cursor: pointer;
}
.help-section-overlay .help-section-items .help-section-item.open .toggle-btn svg {
  transform: rotate(0deg);
}
.help-section-overlay .help-section-items .help-section-item .help-section-item-title {
  font-weight: bold;
  font-size: 14px;
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.help-section-overlay .help-section-items .help-section-item .help-section-item-title .title {
  display: flex;
  gap: 6px;
  text-transform: uppercase;
}
.help-section-overlay .help-section-items .help-section-item .toggle-btn {
  position: relative;
  width: 20px;
  height: 20px;
  cursor: pointer;
  /*&:before,
  &:after {
      content: "";
      position: absolute;
      background-color: $color--blue-light;
      transition: transform 0.25s ease-out;
  }*/
  /* Vertical line */
  /*&:before {
      top: 0;
      left: 50%;
      width: 2px;
      height: 100%;
      margin-left: -1px;
  }*/
  /* horizontal line */
  /*&:after {
      top: 50%;
      left: 0;
      width: 100%;
      height: 2px;
      margin-top: -1px;
  }*/
}
.help-section-overlay .help-section-items .help-section-item .toggle-btn svg {
  height: 20px;
  transform: rotate(180deg);
}
.help-section-overlay .resize-handle {
  height: 20px;
  width: 20px;
  position: absolute;
  bottom: 0;
  right: 0;
}
.help-section-overlay .shortcut-info {
  font-size: 14px;
  position: absolute;
  bottom: 0px;
  padding: 0.5rem 1.5rem 0.5rem 0.5rem;
  /*padding-right:1.5rem;*/
  border-radius: 0 50px 0 0;
  background-color: #fff;
  display: flex;
  flex-direction: row;
  align-items: center;
  gap: 0.8rem;
}
.help-section-overlay .shortcut-info .shortcut-btn {
  border: 2px solid #202020;
  box-shadow: 2px 2px #202020;
  font-size: 0.85em;
  line-height: 0.85em;
  display: inline-block;
  font-weight: 600;
  letter-spacing: 0.05em;
  padding: 3px 5px;
  white-space: nowrap;
  height: 20px;
  min-width: 24px;
  text-align: center;
}

.help-section-noitems {
  display: flex;
  justify-content: center;
}

.notify {
  position: relative;
  display: none;
}
.notify .modal-notify {
  display: none;
  position: absolute;
  top: 150%;
  left: -280%;
  transform: translateX(-50%);
  background-color: #ffffff;
  color: #000;
  padding: 0.8rem;
  border-radius: 5px;
  box-shadow: 2px 3px 2px rgba(0, 0, 0, 0.25);
}
.notify .modal-notify.show {
  display: flex;
}
.notify .modal-notify .div-notify-container {
  display: flex;
  width: 200px;
  justify-content: center;
  flex-direction: column;
  gap: 10px;
}
.notify .modal-notify .div-notify-container .div-notify-item {
  width: 100%;
}
.notify .modal-notify .div-notify-container .div-notify-item a {
  cursor: pointer;
  display: flex;
  flex-direction: row;
  align-items: flex-start;
  gap: 10px;
}
.notify .modal-notify .div-notify-container .div-notify-item span {
  font-size: 12px;
  font-weight: bold;
}
.notify .modal-notify .div-notify-container .div-notify-item img {
  width: 24px;
}
.notify .modal-notify .div-notify-container .div-notify-item + .div-notify-item {
  border-top: 1px solid #e7e7e7;
  padding-top: 10px;
}
.notify .modal-notify .div-notify-container::after {
  content: "";
  position: absolute;
  bottom: 100%;
  left: 85%;
  transform: translateX(-50%);
  height: 0;
  width: 0;
  border-left: 10px solid transparent;
  border-right: 10px solid transparent;
  border-bottom: 10px solid #ffffff;
}

.tile-new-message {
  border-radius: 0px 0px 8px 8px;
  border-top: 1px solid rgba(187, 187, 187, 0.75);
  background-color: #f9f9f9;
  font-family: "GothamPro";
  font-weight: 600;
  font-size: 13px;
}
.tile-new-message .content {
  display: flex;
  width: 100%;
  padding: 1rem;
  align-items: center;
}
.tile-new-message .textarea {
  display: block;
  margin-left: 10px;
  margin-right: 20px;
  border-radius: 4px;
  width: 100%;
  border: 1px solid #BBBBBB;
  padding: 10px;
  overflow-x: hidden;
  overflow-y: auto;
  resize: none;
  min-height: 40px;
  line-height: 20px;
  background-color: #ffffff;
}
.tile-new-message .textarea::-webkit-scrollbar {
  width: 5px;
  background: #D9D9D9;
  height: 20px;
}
.tile-new-message .textarea::-webkit-scrollbar-thumb {
  background: #6FC5EA;
  -webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.5);
}
.tile-new-message .preview-attachment {
  background-color: #eeeeee;
  border-radius: 8px;
  display: none;
  justify-content: center;
  margin-top: 10px;
  align-items: flex-start;
}
.tile-new-message .preview-attachment .icon {
  width: 20px;
  margin: 10px;
  padding-top: 14px;
  margin-left: 12px;
}
.tile-new-message .preview-attachment .image-preview-wrap {
  display: block;
  margin-top: 14px;
  margin-bottom: 14px;
  border-radius: 5px;
  overflow: hidden;
  border: 1px solid #DEDEDE;
}
.tile-new-message .preview-attachment .image-preview {
  max-height: 300px;
  max-width: 300px;
  display: none;
}
.tile-new-message .preview-attachment .filename {
  display: none;
}
.tile-new-message .preview-attachment .filetype {
  font-size: 10px;
  color: #aaa;
  text-transform: uppercase;
  font-weight: normal;
  margin-top: 8px;
  margin-bottom: -5px;
  display: none;
}
.tile-new-message .preview-attachment .img-button {
  padding-top: 9px;
}
.tile-new-message .preview-attachment .img-button .delete {
  width: 24px;
  margin-left: 10px;
}
.tile-new-message .img-button {
  padding-right: 12px;
  cursor: pointer;
}
.tile-new-message .img-button img {
  height: 48px;
  aspect-ratio: 1;
  margin: auto;
  display: block;
}
.tile-new-message .img-button img:hover {
  transform: scale(1.1);
}
.tile-new-message .img-button:first-child {
  padding-left: 10px;
}

.chat-container {
  display: flex;
  flex-direction: column;
  overflow-y: auto;
  max-height: 400px;
  min-height: 50px;
}
.chat-container::-webkit-scrollbar {
  width: 5px;
  background: #D9D9D9;
  height: 20px;
}
.chat-container::-webkit-scrollbar-thumb {
  background: #6FC5EA;
  -webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.5);
}
.chat-container .chat-msg {
  display: flex;
  padding: 15px 0;
}
.chat-container .chat-msg .profile {
  flex-shrink: 0;
  margin-top: auto;
  margin-bottom: -5px;
  position: relative;
}
.chat-container .chat-msg .profile img {
  height: 40px;
  width: 40px;
  border-radius: 50%;
  object-fit: cover;
}
.chat-container .chat-msg .profile .isread {
  position: absolute;
  right: calc(100% + 15px);
  bottom: -20px;
  font-size: 12px;
  white-space: nowrap;
  padding: 5px;
}
.chat-container .chat-msg .content {
  margin-left: 12px;
  max-width: 70%;
  width: 100%;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  font-size: 13px;
}
.chat-container .chat-msg .content .date {
  padding: 5px;
}
.chat-container .chat-msg .content .date .name {
  font-weight: 600;
}
.chat-container .chat-msg .content .message {
  border-radius: 10px;
  background-color: #F1F1F1;
  padding: 15px;
  color: #202020;
  font-weight: 600;
}
.chat-container .chat-msg .content .message .attachment {
  display: flex;
  justify-content: center;
}
.chat-container .chat-msg .content .message .attachment.hastext {
  padding-top: 10px;
}
.chat-container .chat-msg .content .message .attachment img {
  max-width: 200px;
  width: 100%;
}
.chat-container .chat-msg .content .message .attachment .img-attach {
  margin-right: 10px;
  margin-top: 5px;
  width: 32px;
}
.chat-container .chat-msg .content .message .attachment .filename {
  display: block;
}
.chat-container .chat-msg .content .message .attachment .filetype {
  font-size: 10px;
  color: #fff;
  opacity: 0.5;
  text-transform: uppercase;
  font-weight: normal;
  margin-top: 8px;
  margin-bottom: -5px;
}
.chat-container .owner {
  flex-direction: row-reverse;
  padding-right: 20px;
}
.chat-container .owner .content {
  margin-left: 0;
  margin-right: 12px;
  align-items: flex-end;
}
.chat-container .owner .content .message {
  background-color: #4CA2C7;
  color: #ffffff;
}
.chat-container .owner .isread {
  left: auto;
  right: calc(100% + 12px);
}

.action-btn-wrap {
  position: fixed;
  bottom: 1rem;
  right: 1rem;
  z-index: 10;
  display: flex;
  gap: 1rem;
  align-items: flex-end;
}
.action-btn-wrap img {
  width: 64px;
}
.action-btn-wrap img.small {
  width: 44px;
}

.foda2._body.editmode .action-btn-wrap .img-btn.edit-mode {
  display: flex;
}
.foda2._body.editmode .action-btn-wrap .img-btn.list-mode {
  display: none;
}
.foda2._body.editmode .add-grid-button {
  display: flex;
}

.foda2._body:not(.editmode) .action-btn-wrap .img-btn.edit-mode {
  display: none;
}
.foda2._body:not(.editmode) .action-btn-wrap .img-btn.list-mode {
  display: flex;
}
.foda2._body:not(.editmode) .add-grid-button {
  display: none;
}

.foda2._body:not(.editmode) .edit-page-grid:not(.is-edit-only) .tile-header .k-picker, .foda2._body:not(.editmode) .edit-page-grid:not(.is-edit-only) .tile-header .k-input {
  pointer-events: none;
  opacity: 0.65;
  filter: grayscale(0.1);
}

form.search-form .tile {
  background-color: #F9F9F9;
}
form.search-form .search-form-btn-wrap {
  justify-content: flex-end;
  display: flex;
}

.new-btn {
  position: fixed;
  bottom: 1rem;
  right: 1rem;
  z-index: 10;
}
.new-btn img {
  width: 64px;
}

.help-page .help-section-controls {
  display: none;
}
.help-page .tile .tile-content .help-section-header .field {
  flex-direction: row;
  justify-content: center;
}
.help-page .tile .tile-content .help-section-header .field .field-content {
  font-size: inherit;
}
.help-page .tile .tile-content .help-section-header .field .field-content.edit {
  margin-top: 6px;
}
.help-page .tile .tile-content .help-section-header .field .field-content.edit .k-textbox {
  border: none;
  background-color: transparent;
  border-bottom: 3px solid #202020;
  border-radius: 0;
  width: 340px;
}
.help-page .tile .tile-content .help-section-header .field .field-content.edit .k-textbox input {
  background-color: transparent;
  color: #202020;
  font-size: 24px;
  border-radius: 0;
  padding-bottom: 10px;
}
.help-page .tile .tile-content .help-section-header .field .field-content.edit .k-textbox.k-state-focused {
  box-shadow: none;
}
.help-page .help-section-header {
  font-size: 24px;
  font-weight: bold;
  text-align: center;
  margin-bottom: 3rem;
  color: #403F3F;
}
.help-page .help-section-items {
  padding: 0 3rem;
  display: flex;
  flex-direction: column;
  flex-wrap: nowrap;
  gap: 2rem;
  /*height: 70%;*/
  /*overflow-y: auto;*/
  margin-bottom: 3rem;
  /*max-height:90%;*/
}
.help-page .help-section-items .help-section-item {
  border-bottom: 1px solid #DEDEDE;
  padding-bottom: 2rem;
  position: relative;
}
.help-page .help-section-items .help-section-item:last-child {
  border-bottom: 0px;
}
.help-page .help-section-items .help-section-item .help-section-edit-item {
  width: 100%;
  flex-direction: column;
  flex-wrap: nowrap;
  align-items: center;
  gap: 1.5rem;
  align-items: flex-start;
  display: flex;
}
.help-page .help-section-items .help-section-item .help-section-item-content {
  display: none;
  /*transition: 100ms ease-in-out all;*/
  padding-top: 1rem;
  font-weight: 300;
  font-size: 13px;
  padding-right: 2rem;
  flex-direction: column;
  flex-wrap: nowrap;
  align-items: center;
  gap: 1.5rem;
  align-items: flex-start;
}
.help-page .help-section-items .help-section-item .help-section-item-content .help-section-video, .help-page .help-section-items .help-section-item .help-section-item-content .help-section-img {
  width: 100%;
}
.help-page .help-section-items .help-section-item .help-section-item-content .help-section-video .video, .help-page .help-section-items .help-section-item .help-section-item-content .help-section-video .img, .help-page .help-section-items .help-section-item .help-section-item-content .help-section-img .video, .help-page .help-section-items .help-section-item .help-section-item-content .help-section-img .img {
  width: 100%;
}
.help-page .help-section-items .help-section-item .help-section-item-content .help-section-video .video img, .help-page .help-section-items .help-section-item .help-section-item-content .help-section-video .img img, .help-page .help-section-items .help-section-item .help-section-item-content .help-section-img .video img, .help-page .help-section-items .help-section-item .help-section-item-content .help-section-img .img img {
  max-width: 100%;
}
.help-page .help-section-items .help-section-item .help-section-item-content .help-section-video .video iframe, .help-page .help-section-items .help-section-item .help-section-item-content .help-section-video .img iframe, .help-page .help-section-items .help-section-item .help-section-item-content .help-section-img .video iframe, .help-page .help-section-items .help-section-item .help-section-item-content .help-section-img .img iframe {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}
.help-page .help-section-items .help-section-item .help-section-item-content .help-section-video .video, .help-page .help-section-items .help-section-item .help-section-item-content .help-section-img .video {
  position: relative;
  padding-top: 56.25%;
}
.help-page .help-section-items .help-section-item .help-section-item-content .help-section-video .video-text, .help-page .help-section-items .help-section-item .help-section-item-content .help-section-video .img-text, .help-page .help-section-items .help-section-item .help-section-item-content .help-section-img .video-text, .help-page .help-section-items .help-section-item .help-section-item-content .help-section-img .img-text {
  font-weight: bold;
  font-size: 12px;
}
.help-page .help-section-items .help-section-item.open .help-section-item-content {
  /*display: flex;*/
  margin-bottom: 1rem;
}
.help-page .help-section-items .help-section-item.open .help-toggle-btn {
  cursor: pointer;
}
.help-page .help-section-items .help-section-item.open .help-toggle-btn svg {
  transform: rotate(0deg);
}
.help-page .help-section-items .help-section-item .help-section-item-title {
  font-weight: bold;
  font-size: 14px;
  display: flex;
  justify-content: space-between;
  align-items: center;
  text-transform: uppercase;
}
.help-page .help-section-items .help-section-item .help-toggle-btn {
  position: relative;
  /*width: 20px;*/
  height: 20px;
  cursor: pointer;
  display: flex;
  flex-direction: row;
  gap: 8px;
  color: #808080;
  /*&:before,
  &:after {
      content: "";
      position: absolute;
      background-color: $color--blue-light;
      transition: transform 0.25s ease-out;
  }*/
  /* Vertical line */
  /*&:before {
      top: 0;
      left: 50%;
      width: 2px;
      height: 100%;
      margin-left: -1px;
  }*/
  /* horizontal line */
  /*&:after {
      top: 50%;
      left: 0;
      width: 100%;
      height: 2px;
      margin-top: -1px;
  }*/
}
.help-page .help-section-items .help-section-item .help-toggle-btn svg {
  height: 20px;
  transform: rotate(180deg);
}
.help-page .resize-handle {
  display: none;
}
.help-page .shortcut-info {
  display: none;
}

.help-page .nav-wrap, .help-page .logo-wrap, .help-page .header {
  display: none;
}
.help-page .sitewrap {
  padding-right: 0;
}
.help-page .sitewrap main {
  margin: 0 auto;
  padding-top: 2rem;
  padding-bottom: 2rem;
}

.help-section-item:first-child .help-section-priority-up {
  opacity: 0.4;
  cursor: default;
}
.help-section-item:first-child .help-section-priority-up:hover {
  opacity: 0.4;
}

.help-section-item.last .help-section-priority-down {
  opacity: 0.4;
  cursor: default;
}
.help-section-item.last .help-section-priority-down:hover {
  opacity: 0.4;
}

.help-section-edit-item:first-child .help-section-edit-item-up-btn {
  opacity: 0.4;
  cursor: default;
}
.help-section-edit-item:first-child .help-section-edit-item-up-btn:hover {
  opacity: 0.4;
}

.help-section-edit-item.last .help-section-edit-item-down-btn {
  opacity: 0.4;
  cursor: default;
}
.help-section-edit-item.last .help-section-edit-item-down-btn:hover {
  opacity: 0.4;
}

.help-page .help-section-add-content-btn {
  display: none;
}
.help-page .section-item-edit-title {
  display: none;
}
.help-page .help-section-edit-item-edit-btn, .help-page .help-section-edit-item-delete-btn, .help-page .help-section-edit-item-up-btn, .help-page .help-section-edit-item-down-btn, .help-page .help-section-priority-up, .help-page .help-section-priority-down, .help-page .help-section-delete {
  display: none;
  position: absolute;
  right: 8px;
  bottom: 5px;
  cursor: pointer;
}
.help-page .help-section-edit-item-edit-btn:hover, .help-page .help-section-edit-item-delete-btn:hover, .help-page .help-section-edit-item-up-btn:hover, .help-page .help-section-edit-item-down-btn:hover, .help-page .help-section-priority-up:hover, .help-page .help-section-priority-down:hover, .help-page .help-section-delete:hover {
  opacity: 0.8;
}
.help-page .help-section-edit-item-edit-btn img, .help-page .help-section-edit-item-delete-btn img, .help-page .help-section-edit-item-up-btn img, .help-page .help-section-edit-item-down-btn img, .help-page .help-section-priority-up img, .help-page .help-section-priority-down img, .help-page .help-section-delete img {
  width: 30px;
}
.help-page .help-section-edit-item-delete-btn {
  right: 40px;
}
.help-page .help-section-edit-item-up-btn {
  right: -25px;
  top: 5px;
}
.help-page .help-section-edit-item-up-btn img {
  width: 20px;
}
.help-page .help-section-edit-item-down-btn {
  right: -25px;
  top: 30px;
}
.help-page .help-section-edit-item-down-btn img {
  width: 20px;
}
.help-page .help-section-priority-up {
  right: -25px;
  top: 5px;
}
.help-page .help-section-priority-up img {
  width: 20px;
}
.help-page .help-section-priority-down {
  right: -25px;
  top: 30px;
}
.help-page .help-section-priority-down img {
  width: 20px;
}
.help-page .help-section-delete {
  right: -25px;
  top: 55px;
}
.help-page .help-section-delete img {
  width: 20px;
}
.help-page .edit-open .title {
  display: none;
}
.help-page .edit-open .section-item-edit-title {
  display: flex;
}
.help-page .edit-open .section-item-edit-title.k-textbox {
  border: none;
  background-color: transparent;
  border-bottom: 3px solid #202020;
  border-radius: 0;
  width: 340px;
}
.help-page .edit-open .section-item-edit-title.k-textbox input {
  border: 0;
  background-color: transparent;
  color: #202020;
  font-size: 16px;
  border-radius: 0;
  padding-bottom: 10px;
  text-transform: uppercase;
}
.help-page .edit-open .section-item-edit-title.k-textbox.k-state-focused {
  box-shadow: none;
}
.help-page .edit-open .help-section-items .help-section-item {
  border: 1px solid #DEDEDE;
  padding: 1rem;
}
.help-page .edit-open .help-section-items .help-section-item .help-section-edit-item {
  padding: 1rem;
  border: 2px dashed #DEDEDE;
  display: flex;
  flex-direction: column;
  flex-wrap: nowrap;
  align-items: center;
  gap: 1.5rem;
  align-items: flex-start;
  width: 100%;
  position: relative;
}
.help-page .edit-open .help-section-items .help-section-item .help-section-edit-item .help-section-img, .help-page .edit-open .help-section-items .help-section-item .help-section-edit-item .help-section-video {
  max-width: 500px;
}
.help-page .edit-open .help-section-items .help-section-item .help-section-edit-item .help-section-edit-item-edit-btn, .help-page .edit-open .help-section-items .help-section-item .help-section-edit-item .help-section-edit-item-delete-btn, .help-page .edit-open .help-section-items .help-section-item .help-section-edit-item .help-section-edit-item-up-btn, .help-page .edit-open .help-section-items .help-section-item .help-section-edit-item .help-section-edit-item-down-btn {
  display: block;
}
.help-page .edit-open .help-section-items .help-section-item .help-section-priority-up, .help-page .edit-open .help-section-items .help-section-item .help-section-priority-down, .help-page .edit-open .help-section-items .help-section-item .help-section-delete {
  display: block;
}
.help-page .edit-open .help-section-add-content-btn {
  display: flex;
  justify-content: center;
  width: 100%;
  cursor: pointer;
}
.help-page .edit-open .help-section-add-content-btn img {
  width: 32px;
  margin-top: 1rem;
}
.help-page .edit-open .help-section-add-content-btn:hover {
  opacity: 0.8;
}

.help-section-add-section {
  display: none;
}
.help-section-add-section img {
  cursor: pointer;
}
.help-section-add-section img:hover {
  opacity: 0.9;
}

.edit-open .help-section-noitems {
  display: none;
}
.edit-open .help-section-add-section {
  display: flex;
  justify-content: flex-start;
  margin-left: 0rem;
}

.clubcard-card-preview {
  height: 300px;
  width: 500px;
  border-radius: 18px;
  overflow: hidden;
  position: relative;
  box-shadow: 2px 2px 4px 0 rgba(0, 0, 0, 0.4);
  font-family: "DBU";
}
.clubcard-card-preview.-front {
  display: flex;
  flex-direction: row;
}
.clubcard-card-preview.-front .card-preview-left {
  position: relative;
  /*color: #fff;
  text-shadow: 1px 1px 0px #000;*/
  text-transform: uppercase;
  height: 100%;
  width: 40px;
  display: flex;
  justify-content: center;
  align-items: center;
}
.clubcard-card-preview.-front .card-preview-left .card-preview-bg-color-left {
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  z-index: 1;
}
.clubcard-card-preview.-front .card-preview-left .text {
  writing-mode: vertical-lr;
  text-orientation: revert;
  transform: rotate(180deg);
  font-size: 20px;
  z-index: 2;
}
.clubcard-card-preview.-front .card-preview-content .card-preview-top {
  width: 460px;
  display: flex;
  justify-content: space-between;
  height: 200px;
  position: relative;
}
.clubcard-card-preview.-front .card-preview-content .card-preview-top .profile-img {
  width: 120px;
  height: 120px;
  border: solid 2px white;
  border-radius: 50%;
  margin-top: 1rem;
  margin-left: 2rem;
  z-index: 2;
}
.clubcard-card-preview.-front .card-preview-content .card-preview-top .profile-img img {
  width: 100%;
}
.clubcard-card-preview.-front .card-preview-content .card-preview-top .logo-qr {
  display: flex;
  flex-direction: column;
  justify-content: center;
  justify-content: space-between;
  width: 104px;
  padding: 16px;
  z-index: 2;
}
.clubcard-card-preview.-front .card-preview-content .card-preview-top .card-info {
  z-index: 2;
}
.clubcard-card-preview.-front .card-preview-content .card-preview-top .card-info .texts {
  padding-left: 16px;
  font-weight: bold;
  font-size: 22px;
  /*color: #fff;*/
  text-shadow: 1px 1px 0px #000;
  text-transform: uppercase;
  letter-spacing: 1px;
  line-height: 20px;
  margin-top: 12px;
}
.clubcard-card-preview.-front .card-preview-content .card-preview-top .card-info .texts .text2 {
  font-size: 14px;
}
.clubcard-card-preview.-front .card-preview-content .card-preview-bottom {
  position: relative;
  width: 460px;
  height: 100px;
}
.clubcard-card-preview.-front .card-preview-content .card-preview-bottom .card-preview-bottom-content {
  z-index: 2;
  position: relative;
  display: flex;
  height: 100%;
  justify-content: space-between;
  align-items: center;
  padding: 16px;
}
.clubcard-card-preview.-front .card-preview-content .card-preview-bottom .card-preview-bottom-content .card-preview-title {
  font-weight: bold;
  font-size: 20px;
  /*color: #fff;*/
  text-shadow: 1px 1px 0px #000;
  text-transform: uppercase;
  letter-spacing: 1px;
  max-width: 300px;
  word-break: break-word;
}
.clubcard-card-preview.-front .card-preview-content .card-preview-bottom .card-preview-bottom-content .card-preview-turn {
  position: relative;
}
.clubcard-card-preview.-front .card-preview-content .card-preview-bottom .card-preview-bottom-content .card-preview-turn .card-preview-turn-badge {
  position: absolute;
  background: #F5DE5C;
  border-radius: 15px;
  font-weight: bold;
  right: -9px;
  top: -9px;
  width: 18px;
  height: 18px;
  text-align: center;
  line-height: 18px;
  /*color: #000;*/
  font-size: 10px;
  z-index: 1;
}
.clubcard-card-preview.-front .card-preview-content .card-preview-bottom .card-preview-bottom-content .card-preview-turn .card-preview-turn-advantage-text {
  width: 90px;
  height: 56px;
  background: red;
  display: inline-block;
  background: rgba(16, 1, 1, 0.1607843137);
  opacity: 0.8;
  border-radius: 10px;
  font-size: 10px;
  text-transform: uppercase;
  text-align: center;
  line-height: 1.1;
  padding-top: 11px;
  position: relative;
}
.clubcard-card-preview.-front .card-preview-content .card-preview-bottom .card-preview-bottom-content .card-preview-turn .card-preview-turn-button-text {
  border-radius: 17px;
  padding: 3px 30px 3px 20px;
  background: white;
  text-transform: uppercase;
  font-size: 12px;
  margin-top: -19px;
  position: relative;
}
.clubcard-card-preview.-front .card-preview-content .card-preview-bottom .card-preview-bottom-content .card-preview-turn .card-preview-turn-button-text .card-preview-turn-button-img {
  position: absolute;
  right: 10px;
  top: 6px;
}
.clubcard-card-preview.-front .card-preview-content .card-preview-bg-color-bottom, .clubcard-card-preview.-front .card-preview-content .card-preview-bg-color-top {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  /*opacity: 0.8;*/
  z-index: 1;
}
.clubcard-card-preview.-back {
  display: flex;
  flex-direction: column;
}
.clubcard-card-preview.-back .card-preview-top {
  width: 100%;
  display: flex;
  justify-content: space-between;
  height: 200px;
  position: relative;
}
.clubcard-card-preview.-back .card-preview-top .profile-img {
  width: 120px;
  height: 120px;
  border-radius: 50%;
  margin-top: 1rem;
  margin-left: 2rem;
  z-index: 2;
}
.clubcard-card-preview.-back .card-preview-top .profile-img img {
  width: 100%;
}
.clubcard-card-preview.-back .card-preview-top .logo-qr {
  display: flex;
  flex-direction: column;
  justify-content: center;
  justify-content: space-between;
  width: 104px;
  padding: 16px;
  z-index: 2;
}
.clubcard-card-preview.-back .card-preview-top .card-info {
  z-index: 2;
  width: 100%;
  text-align: center;
}
.clubcard-card-preview.-back .card-preview-top .card-info .texts {
  text-align: center;
  font-size: 22px;
  /*color: #fff;*/
  letter-spacing: 1px;
  line-height: 20px;
  margin-top: 28px;
}
.clubcard-card-preview.-back .card-preview-top .card-info .texts .text1 {
  font-weight: bold;
  text-transform: uppercase;
}
.clubcard-card-preview.-back .card-preview-top .card-info .texts .text2 {
  font-size: 12px;
  margin-top: 1rem;
}
.clubcard-card-preview.-back .card-preview-top .card-info .card-preview-button {
  background-color: #fff;
  width: 200px;
  padding: 8px;
  border-radius: 20px;
  font-size: 15px;
  display: inline-flex;
  justify-content: center;
  align-items: center;
  position: absolute;
  bottom: 2rem;
  left: 50%;
  transform: translateX(-50%);
}
.clubcard-card-preview.-back .card-preview-bottom {
  position: relative;
  width: 100%;
  height: 100px;
}
.clubcard-card-preview.-back .card-preview-bottom .card-preview-bottom-content {
  z-index: 2;
  position: relative;
  display: flex;
  height: 100%;
  justify-content: space-between;
  align-items: flex-end;
  padding: 16px;
}
.clubcard-card-preview.-back .card-preview-bottom .card-preview-bottom-content .card-preview-bottom-fordele {
  margin-bottom: -14px;
}
.clubcard-card-preview.-back .card-preview-bottom .card-preview-bottom-turn-text {
  border-radius: 17px;
  padding: 3px 30px 3px 20px;
  background: white;
  text-transform: uppercase;
  font-size: 12px;
  margin-top: -19px;
  position: relative;
}
.clubcard-card-preview.-back .card-preview-bottom .card-preview-bottom-turn-text .card-preview-turn-button-img {
  position: absolute;
  right: 10px;
  top: 6px;
}
.clubcard-card-preview.-back .card-preview-bg-color-bottom, .clubcard-card-preview.-back .card-preview-bg-color-top {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  /*opacity: 0.8;*/
  z-index: 1;
}
.clubcard-card-preview .card-preview-bgimg {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-repeat: no-repeat;
  background-size: cover;
}
