.centered {
  margin: auto;
}

#page-background {
  margin: auto;
  width: 420px;
  padding: 100px 0 40px 0;
}

#page-background img {
  display: block;
}

#link-outofhome {
  font-size: 1.4em;
  display: flex;
  justify-content: center;
  height: 60px;
  width: 100%;
  position: absolute;
  left: 0;
  bottom: 0;
}

#login-form-container {
  margin-bottom: 40px;
  border: 1px solid lightgray;
  width: 400px;
}

.rg_header .x-column-header-inner .x-column-header-text {
  white-space: normal;
  margin: 0;
}

.rg_header .x-column-header-inner {
  line-height: normal;
  text-align: center;
}

.pl_header .x-column-header-inner .x-column-header-text {
  white-space: normal;
}

.pl_header .x-column-header-inner {
  line-height: normal;
  text-align: center;
}

.zg_panel1 {
  color: #000000;
  background-color: #dfe8f6;
  -moz-border-radius: 9px;
  -webkit-border-radius: 9px;
  border-radius: 9px;
  cursor: default;
}

.zg_panel2 {
  color: #000000;
  background-color: #e8f0f6;
  -moz-border-radius: 9px;
  -webkit-border-radius: 9px;
  border-radius: 9px;
  cursor: default;
}

.zg_panel3 {
  color: #000000;
  background-color: #eff8f6;
  -moz-border-radius: 9px;
  -webkit-border-radius: 9px;
  border-radius: 9px;
  cursor: default;
}

.zg_panel4 {
  color: #000000;
  background-color: #f8f8f6;
  -moz-border-radius: 9px;
  -webkit-border-radius: 9px;
  border-radius: 9px;
  cursor: default;
}

.zg_antwort:hover {
  color: #ff197c;
  font-style: italic;
  cursor: default;
}

.zg_verknuepfung:hover {
  color: #ff913d;
  cursor: default;
}

.zg_answerSelected {
  color: #0000ff;
  cursor: default;
}

.child-row .x-grid-cell {
  background-color: #fff2c4;
}

.adult-row .x-grid-cell {
  background-color: #e2ffe2;
  color: #090;
}

.st_header span {
  padding: 1px !important;
  margin: 1px !important;
}

.st_header div {
  padding: 1px !important;
  margin: 1px !important;
}

.st_answerSelected {
  color: #0000ff;
  cursor: default;
}

.schriftfett1 > * {
  font-size: 1.2em;
  font-weight: bold;
}

.pwdpaneltext {
  font-size: 1.1em;
}

.markierterKopfText {
  color: #05b;
}

.strukturtabelleSpalteMarkieren {
  background-color: #fff2c4 !important;
  background-image: none !important;
}

#strukturdefi .x-grid-cell-inner,
#breakdefi .x-grid-cell-inner {
  height: auto !important;
  white-space: normal !important;
}

#rangdefi .x-grid-cell-inner,
#evaldefi .x-grid-cell-inner,
#evalergebnisdefi .x-grid-cell-inner {
  height: auto !important;
  white-space: normal !important;
}

#TTstatistiktree .x-grid-cell-inner {
  height: auto !important;
  white-space: normal !important;
  text-indent: -3.3em !important;
  padding-left: 3.3em !important;
  padding-right: 1em !important;
}

#wasIstNeu {
  margin-left: 10px;
  margin-top: 7px;
}

.grayBackground,
.grayBackground > * {
  background-color: #ebebeb;
}

.treeActiveElement,
.treeActiveElement > * {
  color: #008800;
}

.treeNotActiveElement,
.treeNotActiveElement > * {
  color: #c0272b;
}

.clickable {
  cursor: pointer;
}

.sprite-Zielgruppe {
  width: 16px;
  height: 16px;
  background-position: -5px -5px !important;
}

.sprite-add {
  width: 16px;
  height: 16px;
  background-position: -32px -4px !important;
}

.sprite-affinity {
  width: 16px;
  height: 16px;
  background-position: -57px -5px !important;
}

.sprite-break {
  width: 16px;
  height: 16px;
  background-position: -83px -5px !important;
}

.sprite-cross {
  width: 16px;
  height: 16px;
  background-position: -109px -4px !important;
}

.sprite-cross2 {
  width: 16px;
  height: 16px;
  background-position: -135px -4px !important;
}

.sprite-cross3 {
  width: 16px;
  height: 16px;
  background-position: -162px -4px !important;
}

.sprite-cross4 {
  width: 16px;
  height: 16px;
  background-position: -187px -4px !important;
}

.sprite-cross5-red {
  width: 16px;
  height: 16px;
  background-position: -214px -4px !important;
}

.sprite-cross5 {
  width: 16px;
  height: 16px;
  background-position: -239px -5px !important;
}

.sprite-delete {
  width: 16px;
  height: 16px;
  background-position: -266px -4px !important;
}

.sprite-edit {
  width: 16px;
  height: 16px;
  background-position: -292px -4px !important;
}

.sprite-excel_16 {
  width: 16px;
  height: 16px;
  background-position: -318px -4px !important;
}

.sprite-format {
  width: 16px;
  height: 16px;
  background-position: -343px -5px !important;
}

.sprite-format2 {
  width: 48px;
  height: 16px;
  background-position: -369px -5px !important;
}

.sprite-info {
  width: 16px;
  height: 16px;
  background-position: -5px -30px !important;
}

.sprite-layout {
  width: 16px;
  height: 16px;
  background-position: -31px -31px !important;
}

.sprite-mds {
  width: 166px;
  height: 60px;
  background-position: -57px -31px !important;
}

.sprite-mds_420,
#mdslogo-innerCt {
  width: 420px;
  height: 152px;
  background-position: -5px -101px !important;
}

.sprite-minus {
  width: 16px;
  height: 16px;
  background-position: -234px -29px !important;
}

.sprite-open {
  width: 16px;
  height: 16px;
  background-position: -260px -31px !important;
}

.sprite-page-next {
  width: 16px;
  height: 16px;
  background-position: -285px -31px !important;
}

.sprite-page-next-disabled {
  width: 16px;
  height: 16px;
  background-position: -311px -31px !important;
}

.sprite-page-prev {
  width: 16px;
  height: 16px;
  background-position: -337px -31px !important;
}

.sprite-page-prev-disabled {
  width: 16px;
  height: 16px;
  background-position: -363px -31px !important;
}

.sprite-plus {
  width: 16px;
  height: 16px;
  background-position: -390px -29px !important;
}

.sprite-printer {
  width: 16px;
  height: 16px;
  background-position: -5px -57px !important;
}

.sprite-range {
  width: 16px;
  height: 16px;
  background-position: -31px -57px !important;
}

.sprite-row_open {
  width: 16px;
  height: 16px;
  background-position: -234px -57px !important;
}

.sprite-s1 {
  width: 24px;
  height: 24px;
  background-position: -259px -57px !important;
}

.sprite-s2 {
  width: 16px;
  height: 16px;
  background-position: -293px -57px !important;
}

.sprite-s3 {
  width: 16px;
  height: 16px;
  background-position: -320px -56px !important;
}

.sprite-save {
  width: 16px;
  height: 16px;
  background-position: -346px -56px !important;
}

.sprite-standardsort {
  width: 16px;
  height: 16px;
  background-position: -371px -57px !important;
}

.sprite-stern_gelb {
  width: 16px;
  height: 16px;
  background-position: -397px -55px !important;
}

.sprite-stern_weiss {
  width: 16px;
  height: 16px;
  background-position: -5px -261px !important;
}

.sprite-tabelle_flipheaders {
  width: 16px;
  height: 16px;
  background-position: -32px -262px !important;
}

.sprite-user_suit {
  width: 16px;
  height: 16px;
  background-position: -57px -263px !important;
}

.sprite-zurueck {
  width: 16px;
  height: 16px;
  background-position: -84px -263px !important;
}

.sprite-color-table {
  width: 16px;
  height: 16px;
  background-position: -111px -263px !important;
}

.sprite-curve {
  width: 16px;
  height: 16px;
  background-position: -140px -264px !important;
}

.sprite-combination {
  width: 16px;
  height: 16px;
  background-position: -165px -263px !important;
}

.sprite-autodistribution {
  width: 16px;
  height: 16px;
  background-position: -194px -265px !important;
}

.sprite-duplicate {
  width: 16px;
  height: 16px;
  background-position: -224px -265px !important;
}

.sprite-barchart {
  width: 16px;
  height: 16px;
  background-position: -251px -265px !important;
}

.sprite-filter {
  width: 16px;
  height: 16px;
  background-position: -281px -266px !important;
}

.sprite-cleanup {
  width: 16px;
  height: 16px;
  background-position: -302px -263px !important;
}

.sprite-map {
  width: 16px;
  height: 16px;
  background-position: -322px -265px !important;
}

.btn-left {
  float: left;
}

.btn-right {
  float: right;
}

.whiteWindow {
  background-color: #f9f9f9;
}

.newspaperPanelwest {
  padding-left: 15px;
  padding-top: 25px;
  background-color: #f9f9f9;
  font-size: 1.1em;
}

.pidHierarchyTree {
  font-size: 1em;
  font-style: italic;
  color: #0000ff;
}

.area_panel1 {
  font-weight: bold;
  font-style: italic;
  color: #000000;
  background-color: #dfe8f6;
}

.area_panel2 {
  color: #000000;
  background-color: #e8f0f6;
  -moz-border-radius: 9px;
  -webkit-border-radius: 9px;
  border-radius: 9px;
  cursor: default;
}

.area_panel3 {
  color: #000000;
  background-color: #eff8f6;
  -moz-border-radius: 9px;
  -webkit-border-radius: 9px;
  border-radius: 9px;
  cursor: default;
}

.area_panel4 {
  color: #000000;
  background-color: #f8f8f6;
  -moz-border-radius: 9px;
  -webkit-border-radius: 9px;
  border-radius: 9px;
  cursor: default;
}

.areaPanelsBody {
  padding: 10px 0 5px 0;
}

.area_D {
  background-color: #e8f0f6;
}

.area_R {
  background-color: #eff8f6;
}

.area_E {
  background-color: #f8f8f6;
}

.area_panel2 .x-header,
.area_panel3 .x-header,
.area_panel4 .x-header {
  background-image: none;
  background-color: #cbddf3;
}

.area_item:hover {
  color: #ff197c;
  font-style: italic;
  cursor: default;
}

#areadefiItems-body {
  background-color: #dfe8f6;
  cursor: default;
}

.infopzwindow {
  font-size: 13px;
  font-family: monospace !important;
  font-style: normal !important;
}

.infopzwindowKombi {
  font-size: 0.9em;
}

.windowFrameColorBlueGray {
  background-color: #d8e3f4;
}

.isFlight {
  background-color: #e2ffb2 !important;
}

.Azone-cell-locked {
  background-color: #8c8c8c !important;
}

.Azone-cell-default > .zone-cell-locked div {
  background-color: #8c8c8c !important;
}

.Azone-cell-default {
  background-color: #ffffff !important;
}

.Azone-cell-default div {
  background-color: #ffffff !important;
}

.Azone-cell-low-n {
  background-color: #ffffa8 !important;
}

.Azone-cell-normal-m {
  background-color: #ffe26f !important;
}

.Azone-cell-low-h {
  background-color: #ffbd59 !important;
}

.x-tbar-page-next,
.x-tbar-page-last,
.x-tbar-page-first,
.x-tbar-page-prev,
.x-tbar-loading {
  width: 18px;
  height: 18px;
  vertical-align: middle;
  display: table-cell;
  white-space: nowrap;
  overflow: hidden;
  line-height: 0;
}

div > a[name="zoomInArea"] {
  background-image: url("/activemap/images/spritesheet-2x.png");
  background-image: linear-gradient(transparent, transparent),
    url("/activemap/images/spritesheet.svg");
  font: 12px/1.5 "Helvetica Neue", Arial, Helvetica, sans-serif;
  background-position: -120px -1px;
  width: 30px;
  height: 30px;
  line-height: 30px;
  background-size: 300px 30px;
}

#tabpanelwest_header,
#areadefiItems_header {
  border-top: 0;
}

.window-background-default {
  background-color: #dfe9f6;
}

.leaflet-top {
  top: 25px !important;
}

.group-proxy {
  max-width: 500px;
}

.boldStyleBlue {
  color: #0000ff !important;
  font-weight: bold !important;
}

.boldStyleGreen {
  color: #008800 !important;
  font-weight: bold !important;
}

#regioOptimizationLocationsGrid .x-column-header-inner .x-column-header-text,
#regioOptimizationGrid .x-column-header-inner .x-column-header-text {
  white-space: normal;
}

#regioOptimizationLocationsGrid .x-column-header-inner,
#regioOptimizationGrid .x-column-header-inner {
  line-height: normal;
  padding-top: 3px !important;
  padding-bottom: 3px !important;
  text-align: center;
  top: 20%;
}

#login-footer {
  display: flex;
  margin-top: 50px;
  width: 100%;
  height: 50px;
  max-height: 50px;
  align-items: center;
  justify-content: center;
  background-color: transparent;
}

#login-footer a {
  font-family: "Roboto", sans-serif;
  font-size: 18px;
  text-decoration: none;
  font-weight: 400;
  margin: 0px 8px;
  color: rgb(18, 110, 231);
}

#login-footer a:hover {
  font-weight: 500;
  text-decoration: underline;
}

#login-header {
  font-family: "Roboto", sans-serif;
  height: 70px;
  display: flex;
  position: fixed;
  top: 0px;
  width: 100%;
  z-index: 20;
  background: rgb(255, 255, 255);
  box-shadow: rgba(0, 0, 0, 0.25) 0px 0px 10px;
  align-items: center;
}

#login-header-content {
  display: flex;
  align-items: center;
  flex: 1 1 0;
  padding: 0 30px;
}

.navigation {
  display: flex;
  gap: 30px;
  align-items: center;
  margin-left: auto;
}

.navigation a {
  font-family: "Roboto", sans-serif;
  font-size: 18px;
  cursor: pointer;
  text-decoration: none;
  font-weight: 700;
  padding-bottom: 2px;
  color: rgb(18, 110, 231);
}

.navigation a:hover {
  text-decoration: underline;
}

#login-primary-button {
  border-radius: 6px;
  padding: 0;
  margin: 0;
}

#login-primary-button div {
  justify-content: center;
  position: relative;
  box-sizing: border-box;
  outline: 0px;
  border: 0px;
  margin: 0px;
  cursor: pointer;
  user-select: none;
  vertical-align: middle;
  appearance: none;
  text-decoration: none;
  font-family: Roboto, sans-serif;
  font-weight: 500;
  line-height: 16px;
  letter-spacing: 0.75px;
  color: rgb(255, 255, 255);
  font-style: normal;
  min-width: 64px;
  background-color: rgb(18, 110, 231);
  box-shadow: none;
  display: flex;
  gap: 8px;
  align-items: center;
  border-radius: 6px;
  padding: 12px 18px;
  z-index: 10;
  text-transform: none;
  font-size: 16px;
}

.mini-arrow {
  fill: white;
  width: 24px;
  height: 24px;
  margin: 0;
  padding: 0;
}

#context-menu {
  display: none;
  position: absolute;
  background-color: white;
  padding: 10px;
  z-index: 1000;
  color: rgb(32, 33, 36);
  transition: box-shadow 300ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
  box-shadow: rgba(0, 0, 0, 0.2) 0px 5px 5px -3px,
    rgba(0, 0, 0, 0.14) 0px 8px 10px 1px, rgba(0, 0, 0, 0.12) 0px 3px 14px 2px;
  border: 1px solid rgb(219, 220, 222);
  box-sizing: border-box;
  border-radius: 15px;
  overflow: hidden auto;
  min-width: 16px;
  min-height: 16px;
  max-width: calc(100% - 32px);
  outline: 0px;
  max-height: calc(100% - 96px);
}

#context-menu ul {
  list-style: none;
  margin: 0px;
  padding: 8px 0px;
  position: relative;
  outline: 0px;
  width: 260px;
}

#context-menu ul li a {
  cursor: pointer;
  background-color: transparent;
  outline: 0;
  border: 0;
  margin: 0;
  border-radius: 0;
  user-select: none;
  vertical-align: middle;
  appearance: none;
  font-family: "Roboto", sans-serif;
  font-weight: normal;
  font-size: 18px;
  line-height: 28px;
  letter-spacing: 0.5px;
  color: rgb(95, 99, 104);
  font-style: normal;
  mix-blend-mode: normal;
  display: flex;
  -webkit-box-pack: start;
  justify-content: flex-start;
  -webkit-box-align: center;
  align-items: center;
  position: relative;
  text-decoration: none;
  min-height: 48px;
  padding: 6px 16px;
  box-sizing: border-box;
  white-space: pre;
  width: 100%;
}

#context-menu ul li:hover {
  background-color: #f0f0f0;
}

#banner-container {
  margin: auto;
  padding: 16px 24px;
  width: 680px;
  border-radius: 8px;
  box-shadow: rgba(0, 0, 0, 0.1) 0px 16px 20px 10px;
  overflow: hidden;
  position: relative;
  gap: 8px;
}

#banner-content {
  background: white;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  height: 100%;
  gap: 8px;
}

#banner-content h3 {
  margin: 0px;
  letter-spacing: 0.15px;
  color: #126ee7;
  font-family: "Roboto", sans-serif;
  font-size: 21px;
  font-style: normal;
  font-weight: 700;
  line-height: 1.2;
}

#banner-content h3 span {
  color: #ff8ed0;
}

#banner-content p {
  margin: 0px;
  letter-spacing: 0.5px;
  mix-blend-mode: normal;
  color: rgb(95, 99, 104);
  font-family: "Roboto", sans-serif;
  font-size: 16px;
  font-style: normal;
  font-weight: 400;
  line-height: 1.5;
}