.myform{
	background-color: #E5E8E8; 
	padding: 20px; 
	border-radius: 10px;"
}

.strdngr{
	color: #f00;
	font-weight: bold;
}

#controlPanel button{
	background-color: #1A5276;
	color: #fff;
	border: none;
	border-radius: 5px;
	padding: 4px;
	font-weight: bold;
	font-size: 20px;
	width: 130px;
}

/*Pre loader*/

/* Center the loader */
#loader {
  position: absolute;
  left: 50%;
  top: 50%;
  z-index: 1;
  width: 120px;
  height: 120px;
  margin: -60px 0 0 -60px;
  border-radius: 50%;
  border-top: 16px solid transparent;
  border-right: 16px solid transparent;
  border-bottom: 16px solid transparent;
  border-left: 16px solid #3498db;
  animation: spin 1.5s cubic-bezier(0.68, -0.55, 0.27, 1.55) infinite;
  box-shadow: 0 0 15px rgba(0, 0, 0, 0.1);
  background: linear-gradient(135deg, #002147, #448aff);
}

@keyframes spin {
  0% {
    transform: rotate(0deg);
  }
  100% {
    transform: rotate(360deg);
  }
}

/* Optional: Additional animation for the loader's fade-in effect */
#loader {
  animation: spin 1.5s cubic-bezier(0.68, -0.55, 0.27, 1.55) infinite,
             fadeIn 0.6s ease-in-out;
}

@keyframes fadeIn {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}

/* Add animation to "page content" */
.animate-bottom {
  position: relative;
  animation-name: animatebottom;
  animation-duration: 1s;
}

@keyframes animatebottom {
  from {
    bottom: -100px;
    opacity: 0;
  }
  to {
    bottom: 0px;
    opacity: 1;
  }
}

#wrapper {
  display: none;
}