.ladeDaten {
  z-index: 9;
  width: 100%;
  height: 100%;
  text-align: center;
  vertical-align: middle;
  background-color: rgba(204, 204, 204, 0.5);
  overflow: hidden;
  position: absolute; }
  .ladeDaten > div {
    margin: 5px auto auto auto;
    width: 48px;
    height: 48px;
    top: calc(50% - 24px);
    display: inline-block;
    box-sizing: border-box;
    position: relative;
    overflow: hidden; }
    .ladeDaten > div:before {
      border-radius: 50%;
      content: " ";
      width: 48px;
      height: 48px;
      display: inline-block;
      box-sizing: border-box;
      border: solid 6px #1a171b;
      position: absolute;
      top: 0;
      left: 0; }
    .ladeDaten > div:after {
      border-radius: 50%;
      content: " ";
      width: 48px;
      height: 48px;
      display: inline-block;
      box-sizing: border-box;
      border-top: solid 6px #df172f;
      border-right: solid 6px transparent;
      border-bottom: solid 6px transparent;
      border-left: solid 6px transparent;
      position: absolute;
      top: 0;
      left: 0;
      animation: cp-round-animate 2s ease-in-out infinite; }

@keyframes cp-round-animate {
  0% {
    transform: rotate(0); }
  100% {
    transform: rotate(360deg); } }