.titaui-base-loading {
  position: relative;
  width: 100%;
  height: 0px;
  transition: height .3s;
}

.titaui-base-loading--show {
  height: 60px;
}

.titaui-base-loading::before {
  content: '';
  position: absolute;
  background-image: url(./assets/loading.gif);
  background-size: contain;
  width: 40px;
  height: 40px;
  margin-left: 50%;
  transform: translateX(-50%) translateY(50px) scale(0);
  transition: height .3s, transform .5s, opacity .1s;
  opacity: 0;
}

.titaui-base-loading.titaui-base-loading--show::before {
  transform: translateX(-50%) translateY(10px) scale(1);
  opacity: 1;
}
