.lang-select {
	position: absolute;
	top: 8px;
	right: 16px;
	z-index: 999;
	font-size: 12px
}

.alert {
	font-size: 12px;
	padding: 8px !important;
}

.z-in {
	z-index: 9999;
}

.toast-sample {
	z-index: 999999999;
}

.toast-sample-one {
	position: fixed;
	top: 10px;
	z-index: 999999999;
}

.copiedcaptcha {
	user-select: none; /* Prevent text selection */
	-webkit-user-select: none; /* For Safari */
	-moz-user-select: none; /* For Firefox */
	-ms-user-select: none; /* For IE10+ */
}

.modal-body {
	max-height: 80vh;
	overflow-y: auto;
	text-align: center;
}
   .main-content::after,
   body::after {
       width: 0;
   }

   .form-control::placeholder {
       color: #E5E4E2;
       /* Change this color to your desired placeholder color */
       opacity: 1;
       /* Optional: Ensures the color is not affected by the opacity */
   }

   .input-group {
       border: 1.8px solid #ffffff26;
       border-radius: 0.375rem
   }

   .form-control:focus {
       border-color: white;
       -webkit-box-shadow: 0 0 0 0.25rem rgb(68 84 116 / 15%);
       box-shadow: 0 0 0 0.25rem rgb(68 84 116 / 15%);
   }

   .right-sidebar-btn button {
       background: #fff;
   }

   ::-webkit-scrollbar {
       width: 0px;
   }
   .main-content .login-body .bottom .form-control {
    color: #fff }
    
    
    
    
    
    /* animation for hwforces loader.... */

.loader-wrapper {
  position: relative;
  width: 100px;
  height: 100px;
  transform-style: preserve-3d;
  animation: float 6s ease-in-out infinite;
}
.data-stream {
  position: absolute;
  width: 2px;
  height: 100px;
  background: linear-gradient(to bottom, transparent, #445474, transparent);
  animation: data-flow 2s linear infinite;
}

.circle {
  fill: none;
  stroke-width: 2;
  transform-origin: center;
}

.outer {
  stroke: #90A4AE;
  stroke-dasharray: 628;
  stroke-dashoffset: 628;
  animation: dash 3s ease-in-out infinite;
  filter: drop-shadow(0 0 8px #90A4AE);
}

.middle {
  stroke: #A5D6A7;
  stroke-dasharray: 471;
  stroke-dashoffset: 471;
  animation: dashReverse 3s ease-in-out infinite;
  opacity: 0.8;
}

.inner {
  stroke: #BCAAA4;
  stroke-dasharray: 314;
  stroke-dashoffset: 314;
  animation: dash 3s ease-in-out infinite;
  opacity: 0.6;
}

.progress-text {
  position: absolute;
  bottom: -30px;
  width: 100%;
  text-align: center;
  font-family: monospace;
  font-size: 18px;
  letter-spacing: 2px;
  text-shadow: 0 0 10px #445474;
  animation: flicker 4s infinite;
}

.scanner {
  position: absolute;
  width: 100%;
  height: 2px;
  background: linear-gradient(to right, transparent, #445474, transparent);
  animation: scan 3s ease-in-out infinite;
  filter: drop-shadow(0 0 5px #445474);
}

@keyframes data-flow {
  0% {
    transform: translateY(-100%) translateX(-50%);
    opacity: 0;
  }

  50% {
    opacity: 1;
  }

  100% {
    transform: translateY(100%) translateX(50%);
    opacity: 0;
  }
}

@keyframes float {

  0%,
  100% {
    transform: translateY(0) rotateX(0deg);
  }

  50% {
    transform: translateY(-20px) rotateX(10deg);
  }
}

@keyframes dash {
  0% {
    stroke-dashoffset: 628;
  }

  50% {
    stroke-dashoffset: 0;
  }

  100% {
    stroke-dashoffset: -628;
  }
}

@keyframes dashReverse {
  0% {
    stroke-dashoffset: -471;
  }

  50% {
    stroke-dashoffset: 0;
  }

  100% {
    stroke-dashoffset: 471;
  }
}

@keyframes scan {

  0%,
  100% {
    top: 0%;
    opacity: 0;
  }

  25%,
  75% {
    opacity: 1;
  }

  50% {
    top: 100%;
  }
}

@keyframes flicker {

  0%,
  19.999%,
  22%,
  62.999%,
  64%,
  64.999%,
  70%,
  100% {
    opacity: 0.99;
  }

  20%,
  21.999%,
  63%,
  63.999%,
  65%,
  69.999% {
    opacity: 0.4;
  }
}
    
    
@media screen and ( max-width: 768px){
	.main-content.login-panel {
	    margin-top: 30px;
	}
}