.preloader-area {
    position: fixed;
    z-index: 999999;
    background-color: #1C345A;
    /* background-color: rgba(28, 52, 90, 0.9); */
    width: 100%;
    height: 100%;
    text-align: center;
    left: 0;
    right: 0;
    top: 0;
  }
  .preloader-area .spinner {
    width: 4em;
    height: 4em;
    transform: perspective(20em) rotateX(-24deg) rotateY(20deg) rotateZ(30deg);
    transform-style: preserve-3d;
    position: absolute;
    left: 0;
    right: 0;
    top: 45%;
    transform: translateY(-45%);
    margin-left: auto;
    margin-right: auto;
  }
  /* .preloader-area .spinner .disc {
    position: absolute;
    width: 100%;
    height: 100%;
    border-radius: 100%;
    border: 0.3em dotted #ffffff;
  } */
  .preloader-area .spinner .disc:nth-child(1) {
    animation: rotate 12s linear infinite;
  }
  .preloader-area .spinner .disc:nth-child(2) {
    animation: rotateDisc2 12s linear infinite;
  }
  .preloader-area .spinner .disc:nth-child(3) {
    animation: rotateDisc3 12s linear infinite;
  }
  .preloader-area .spinner .inner {
    width: 100%;
    height: 100%;
    transform-style: preserve-3d;
    animation: sphereSpin 6s linear infinite;
  }
  /* .preloader-area .spinner::before {
    content: "";
    position: absolute;
    left: 0;
    top: 0;
    border-radius: 50%;
    right: 0;
    bottom: 0;
    border: 2px dotted #ffffff;
    margin: -15px;
  } */