/*---vvv---Custom properties---vvv---*/
:root {
  /*--wappenPfad: url("../includes/ressource?mid=1&name=Wappen.jpg");*/
 /* --wappenGrossPfad: url("../includes/ressource?mid=1&name=Wappen_gross.png");*/
  --LogoPfad: url("../includes/ressource?mid=1&name=Logo_Wappen.jpg");
    }

/*---vvv---Wappen beim Formularaufruf laden----vvv--*/
/*DE: Ladesymbol - Position und Hintergrundfarbe*/
.loading {
  display: none;
  position: fixed;
  z-index: 1000;
  top: 0;
  left: 0;
  height: 100%;
  width: 100%;
  background-color: rgb(255, 255, 255);
  background-position: 50% 50%;
  background-repeat: no-repeat;
}

/*DE: Inhalt des Symbols - abgeschnitten, kein Scrollbalken*/
form.xm-loading {
  overflow: hidden;
}

form.xm-loading .loading {
  display: block;
}

/*DE: Einbindung des individuellen Ladesymbols*/
/*.loading .animation{
  background-image: var(--wappenGrossPfad);
  background-size: 13%; /*bestimmt die größe beim laden*/
  /*height: 100%;
  background-repeat: no-repeat;
  background-position: center;
  -webkit-animation: scale-up-center 1000ms infinite alternate-reverse both;
          animation: scale-up-center 1000ms infinite alternate-reverse both;
}

/*DE: Skalierung beim Laden*/
@-webkit-keyframes scale-up-center {
  0%{
    -webkit-transform: scale(0.5);
            transform: scale(0.5);
    }
  100% {
    -webkit-transform: scale(1);
            transform: scale(1);
  }
}
@keyframes scale-up-center {
  0%{
    -webkit-transform: scale(0.5);
            transform: scale(0.5);
    }
  100% {
    -webkit-transform: scale(1);
            transform: scale(1);
    }
}

/*---vvv---Logo im Formular platzieren----vvv--*/
.divHeader {
  background-image: var(--LogoPfad);
  background-size: 95% auto; /*bestimmt die Höhe des Logos*/
  background-repeat: no-repeat;
  background-position-x: calc(120% - 30px) ;
  background-position-y: 15px;
  }

/*---vvv---Wappen im Formular platzieren----vvv--*/
/*.divHeader {
  background-image: var(--wappenPfad);
  background-size: 40% auto; /*bestimmt die Höhe des Logos*/
  /*background-repeat: no-repeat;
  background-position-x: calc(100% - 20px) ;
  background-position-y: 15px;
}*/