#application_loading {
  position: fixed;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  background-color: #F3F5F7;
  display: flex;
  justify-content: center;
  align-items: center;
  padding-bottom: 15vh;
  opacity: 1;
  visibility: visible;
  transition: all 1s;
}
#application_loading.hidden {
  opacity: 0;
  visibility: hidden;
}

#app_loading_img {
  max-height: 250px;
  position: absolute;
  top: calc(50% - 125px);
  left: calc(50% - 125px);
}

.wr_spinner img{
  position: absolute;
  width: 50px;
  height: 50px;
  left: 50%;
  top: 50%;
  object-fit: contain;
  margin-left: -25px;
  margin-top: -25px;
  -webkit-animation: wr_spinner_img 3s ease-in-out infinite;
  -moz-animation: wr_spinner_img 3s ease-in-out infinite;
  animation: wr_spinner_img 3s ease-in-out infinite;
}
.wr_spinner{
  width: 100px;
  height: 100px;
  border-radius: 10px;
  border: 1px #01AB9D solid;
  position: relative;
  -webkit-animation: wr_spinner_fill_color 6s ease-in-out infinite;
  -moz-animation: wr_spinner_fill_color 6s ease-in-out infinite;
  animation: wr_spinner_fill_color 6s ease-in-out infinite;
}
.wr_spinner:after{
  width: 10px;
  height: 10px;
  border-radius: 5px;
  position: absolute;
  content: "";
  background-color: #01AB9D;
  top: -30px;
  left: -30px;
  -webkit-animation: wr_spinner_check 3s ease-in-out infinite;
     -moz-animation: wr_spinner_check 3s ease-in-out infinite;
          animation: wr_spinner_check 3s ease-in-out infinite;
}
@-webkit-keyframes wr_spinner_check {
  25%{ left: 120px; top: -30px;}
  50%{ left: 120px; top: 120px;}
  75%{ left: -30px; top: 120px;}
  100%{ left: -30px; top: -30px;}
}
@-moz-keyframes wr_spinner_check {
  25%{ left: 120px; top: -30px;}
  50%{ left: 120px; top: 120px;}
  75%{ left: -30px; top: 120px;}
  100%{ left: -30px; top: -30px;}
}
@keyframes wr_spinner_check {
  25%{ left: 120px; top: -30px;}
  50%{ left: 120px; top: 120px;}
  75%{ left: -30px; top: 120px;}
  100%{ left: -30px; top: -30px;}
}
@-webkit-keyframes wr_spinner_img {
  100% { -webkit-transform: rotate(360deg); transform:rotate(360deg); }
}
@-moz-keyframes wr_spinner_img {
  100% { -webkit-transform: rotate(360deg); transform:rotate(360deg); }
}
@keyframes wr_spinner_img {
  100% { -webkit-transform: rotate(360deg); transform:rotate(360deg); }
}
@-webkit-keyframes wr_spinner_fill_color{
  0%{ box-shadow: inset 0px 0px 0px 0px rgba(70,147,247,0.1);}
  50%{ box-shadow: inset 0px -100px 0px 0px rgba(70,147,247,0.3);}
  100%{ box-shadow: inset 0px 0px 0px 0px rgba(70,147,247,0.1);}
}
@-moz-keyframes wr_spinner_fill_color{
  0%{ box-shadow: inset 0px 0px 0px 0px rgba(70,147,247,0.1);}
  50%{ box-shadow: inset 0px -100px 0px 0px rgba(70,147,247,0.3);}
  100%{ box-shadow: inset 0px 0px 0px 0px rgba(70,147,247,0.1);}
}
@keyframes wr_spinner_fill_color{
  0%{ box-shadow: inset 0px 0px 0px 0px rgba(70,147,247,0.1);}
  50%{ box-shadow: inset 0px -100px 0px 0px rgba(70,147,247,0.3);}
  100%{ box-shadow: inset 0px 0px 0px 0px rgba(70,147,247,0.1);}
}