.active-text{display: block;}
.inactive-text{display: none;}
.loader-position{text-align: center;/*transform: translate(50%, 0);*/}
#loading-spinner {
  display: inline-block;
  width: 50px;
  height: 50px;
  border: 3px solid rgba(204 23 23 / 30%);
  border-radius: 50%;
  border-top-color: #fff;
  animation: spin 1s ease-in-out infinite;
  -webkit-animation: spin 1s ease-in-out infinite;
}

@keyframes spin {
  to { -webkit-transform: rotate(360deg); }
}
@-webkit-keyframes spin {
  to { -webkit-transform: rotate(360deg); }
}

.loading{position: relative; pointer-events: none; padding-top: 3%;}
.loading:before{position: absolute; content: ""; display: block; top: 0; left: 0; width: 100%; height: 100%; background: rgba(255,255,255,0.8); -webkit-border-radius: 0; border-radius: 0; opacity: 1; z-index: 1; }
.loading:after{position: absolute; content: ""; display: block; top: 40%; left: 50%; margin: -12px 0 0 -12px; width: 40px; height: 40px; /*border: 3px solid #4ba51f; border-right-color: transparent;*/ border: 3px solid #dc446c; border-color: #dc446c transparent #dc446c transparent; -webkit-border-radius: 50%; border-radius: 50%; z-index: 1; -webkit-animation-duration: 0.75s; -moz-animation-duration: 0.75s; animation-duration: 0.75s; -webkit-animation-iteration-count: infinite; -moz-animation-iteration-count: infinite; animation-iteration-count: infinite; -webkit-animation-name: rotate-forever; -moz-animation-name: rotate-forever; animation-name: rotate-forever; -webkit-animation-timing-function: linear; -moz-animation-timing-function: linear; animation-timing-function: linear; }
@-webkit-keyframes rotate-forever {0% {-webkit-transform: rotate(0deg); -moz-transform: rotate(0deg); -ms-transform: rotate(0deg); -o-transform: rotate(0deg); transform: rotate(0deg); } 100% {-webkit-transform: rotate(360deg); -moz-transform: rotate(360deg); -ms-transform: rotate(360deg); -o-transform: rotate(360deg); transform: rotate(360deg); } }
@-moz-keyframes rotate-forever {0% {-webkit-transform: rotate(0deg); -moz-transform: rotate(0deg); -ms-transform: rotate(0deg); -o-transform: rotate(0deg); transform: rotate(0deg); } 100% {-webkit-transform: rotate(360deg); -moz-transform: rotate(360deg); -ms-transform: rotate(360deg); -o-transform: rotate(360deg); transform: rotate(360deg); } }
@keyframes rotate-forever {0% {-webkit-transform: rotate(0deg); -moz-transform: rotate(0deg); -ms-transform: rotate(0deg); -o-transform: rotate(0deg); transform: rotate(0deg); } 100% {-webkit-transform: rotate(360deg); -moz-transform: rotate(360deg); -ms-transform: rotate(360deg); -o-transform: rotate(360deg); transform: rotate(360deg); } }