preloader div {
    transition: 0.25s linear all;
  }
  
  preloader div.ng-hide {
    opacity: 0;
  }
  
  .loader {
    top:50%;
    left:50%;
    z-index:10000;
    position:absolute;
    width: 40px;
    height: 40px;
    margin-top:-20px;
    margin-left:-20px;
    -webkit-animation: tp-rotateplane 2s infinite ease-in-out;
    animation: tp-rotateplane 2s infinite ease-in-out;
    border-radius: 3px;
    -moz-border-radius: 3px;
    -webkit-border-radius: 3px;
  }
  
  @-webkit-keyframes tp-rotateplane {
    0% { -webkit-transform: perspective(120px); background-color: #4285F4; }
    25% { background-color: #DE3E35; }
    50% { -webkit-transform: perspective(120px) rotateY(180deg); background-color: #F7C223; }
    75% { background-color: #1B9A59; }
    100% { -webkit-transform: perspective(120px) rotateY(180deg)  rotateX(180deg); background-color: #4285F4; }
  }
  
  @keyframes tp-rotateplane {
    0% { -webkit-transform: perspective(120px); background-color: #4285F4; }
    25% { background-color: #DE3E35; }
    50% { -webkit-transform: perspective(120px) rotateY(180deg); background-color: #F7C223; }
    75% { background-color: #1B9A59; }
    100% { -webkit-transform: perspective(120px) rotateY(180deg)  rotateX(180deg); background-color: #4285F4; }
  }