
  .loading2 {
    font-size: 30px;
    /* background-color: #fff; */
    width: 2.8em;
    /* height: 50vh; */
    position: absolute;
    left: 50%;
    top: 50%;
    /* display:block; */
    transform: translate(-50%, -50%);
    perspective: 1000px;
  }
  .cube-loading {
    font-size: 30px;
    /* background-color: #fff; */
    /* width: 2.8em; */
    /* height: 50vh; */
    /* position: absolute; */
    /* left: 50%; */
    /* top: 50%; */
    display: flex;
    /* transform: translate(-50%, -50%); */
    perspective: 1000px;
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
    height: 50vh;
    flex-direction: column-reverse;
    align-items: center;
  }
  .cube2 {
    position: absolute;
    animation: rotate 5s infinite linear;
    transform-origin: 0.5em 0.5em;
    transform-style: preserve-3d;
    width: 2em;
    height: 1em;
    left: 0;
    margin: -0.5em auto 0;
    top: 38%;
    right: 0;
  }

  .cube {
    scale: 2;
    position: absolute;
    animation: rotate 5s infinite linear;
    /* transform-origin: 0.5em 0.5em; */
    transform-style: preserve-3d;
    width: 2em;
    height: 1em;
    /* left: 0; */
    /* margin: -0.5em auto 0; */
    top: 50%;
    /* right: 0; */
}
  .cube__side {
    position: absolute;
    width: 1em;
    height: 1em;
    opacity: 1;
    background-color: #2580ef;
    border: solid 2px #fff;
    border-radius: 2px;
  }
  .cube__side:nth-child(1) {
    transform: translateZ(0.5em);
  }
  .cube__side:nth-child(2) {
    transform: translateY(0.5em) rotateX(-90deg);
  }
  .cube__side:nth-child(3) {
    transform: translateY(-0.5em) rotateX(90deg);
  }
  .cube__side:nth-child(4) {
    transform: translateX(-0.5em) rotateY(90deg);
  }
  .cube__side:nth-child(5) {
    transform: translateX(0.5em) rotateY(90deg);
  }
  .cube__side:nth-child(6) {
    transform: translateZ(-0.5em) rotateY(180deg);
  }
  .loading-text2 {
    /* font-size: 12px; */
    position: absolute;
    bottom: -1em;
    left: 50%;
    transform: translateX(-50%);
  }
  .loading-text {
    /* font-size: 12px; */
    /* position: absolute;
    bottom: -1em;
    left: 50%;
    transform: translateX(-50%); */
  }
  
  
  @keyframes rotate {
    100% {
      transform:
        /* rotateX(360deg) */
        rotateY(360deg)
        /* rotateZ(360deg); */
    }
  }
  