html, body {
  height: 100%; }

.ld_tb {
  position:absolute;
  left:50%;top:30%;
  transform:translate(-50%,-50%);
  display: -webkit-box;
  display: -ms-flexbox;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  
  }

.ld_loader {
  display: -webkit-inline-box;
  display: -ms-inline-flexbox;
  display: inline-flex;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  width: 90px;
  height: 90px;
  -webkit-transform-style: preserve-3d;
          transform-style: preserve-3d;
  -webkit-transform: rotateX(45deg) rotate(45deg);
          transform: rotateX(45deg) rotate(45deg); }

.ld_box {
  position: absolute;
  top: 0;
  left: 0;
  width: 30px;
  height: 30px;
  background: #fff;
  -webkit-box-shadow: 112.5px 112.5px 20px #000;
          box-shadow: 112.5px 112.5px 20px #000;
  -webkit-animation: move 2s ease-in-out infinite both;
          animation: move 2s ease-in-out infinite both;
  -webkit-transform-style: preserve-3d;
          transform-style: preserve-3d; }
  .ld_box:nth-child(1) {
    -webkit-animation-delay: -1s;
            animation-delay: -1s; }
  .ld_box:nth-child(2) {
    -webkit-animation-delay: -2s;
            animation-delay: -2s; }
  .ld_box:nth-child(3) {
    -webkit-animation-delay: -3s;
            animation-delay: -3s; }
  .ld_box:before, .ld_box:after {
    display: block;
    content: "";
    position: absolute;
    width: 30px;
    height: 30px; }
  .ld_box:before {
    top: 100%;
    left: 0;
    background: #fff;
    -webkit-transform-origin: center top;
            transform-origin: center top;
    -webkit-transform: rotateX(-90deg);
            transform: rotateX(-90deg); }
  .ld_box:after {
    top: 0;
    left: 100%;
    background: #fff;
    -webkit-transform-origin: center left;
            transform-origin: center left;
    -webkit-transform: rotateY(90deg);
            transform: rotateY(90deg); }

@-webkit-keyframes move {
  0%, 100% {
    -webkit-transform: none;
            transform: none; }
  12.5% {
    -webkit-transform: translate(30px, 0);
            transform: translate(30px, 0); }
  25% {
    -webkit-transform: translate(60px, 0);
            transform: translate(60px, 0); }
  37.5% {
    -webkit-transform: translate(60px, 30px);
            transform: translate(60px, 30px); }
  50% {
    -webkit-transform: translate(60px, 60px);
            transform: translate(60px, 60px); }
  62.5% {
    -webkit-transform: translate(30px, 60px);
            transform: translate(30px, 60px); }
  75% {
    -webkit-transform: translate(0, 60px);
            transform: translate(0, 60px); }
  87.5% {
    -webkit-transform: translate(0, 30px);
            transform: translate(0, 30px); } }

@keyframes move {
  0%, 100% {
    -webkit-transform: none;
            transform: none; }
  12.5% {
    -webkit-transform: translate(30px, 0);
            transform: translate(30px, 0); }
  25% {
    -webkit-transform: translate(60px, 0);
            transform: translate(60px, 0); }
  37.5% {
    -webkit-transform: translate(60px, 30px);
            transform: translate(60px, 30px); }
  50% {
    -webkit-transform: translate(60px, 60px);
            transform: translate(60px, 60px); }
  62.5% {
    -webkit-transform: translate(30px, 60px);
            transform: translate(30px, 60px); }
  75% {
    -webkit-transform: translate(0, 60px);
            transform: translate(0, 60px); }
  87.5% {
    -webkit-transform: translate(0, 30px);
            transform: translate(0, 30px); } }

/*# sourceMappingURL=loading.css.map */