body {
	padding: 0;
	margin: 0;
	text-align: center;
	color: #ffffff;
	font-family: 'arial', sans-serif;
	}
@font-face {
    font-family: 'arial';
    src: url('arial.ttf') format('truetype'); 
}
input, select, textarea {
	font-family: 'arial', sans-serif;
	font: 18px/22px ;
	}
input[type="text"]{
  background: #f4ecd8;
  border: 3px solid #5e3e1c;
  border-radius: 8px;
  color: #3b2a14;
  font: 16px "arial", serif;
  padding: 8px 12px;
  width: 250px;
  box-shadow: inset 0 2px 4px #cbb58b;
  outline: none;
  transition: border 0.2s ease, box-shadow 0.2s ease;
  }
input:focus[type="text"] {
  border-color: #a47e3c;
  box-shadow: 0 0 8px #a47e3c;
  }

input[type="password"]{
  background: #f4ecd8;
  border: 3px solid #5e3e1c;
  border-radius: 8px;
  color: #3b2a14;
  font: 16px "arial", serif;
  padding: 8px 12px;
  width: 250px;
  box-shadow: inset 0 2px 4px #cbb58b;
  outline: none;
  transition: border 0.2s ease, box-shadow 0.2s ease;
  }
input:focus[type="password"] {
  border-color: #a47e3c;
  box-shadow: 0 0 8px #a47e3c;
  }

input.submit {
  background: linear-gradient(#c2a671, #a47e3c); /* gold-bronze gradient */
  border: 3px solid #5e3e1c; /* dark rustic brown */
  border-radius: 8px;
  color: #fff8d6;
  font: bold 22px "arial", serif; /* fantasy style font */
  width: 185px;
  height: 45px;
  cursor: pointer;
  box-shadow: 0 4px 0 #4c2f10;
  text-shadow: 1px 1px 0 #3e2b11;
  transition: transform 0.1s ease, box-shadow 0.1s ease;
}

input.submit:hover {
  transform: translateY(-2px);
  box-shadow: 0 6px 4px #2a1a08;
}

input.submit:active {
  transform: translateY(2px);
  box-shadow: 0 1px 0 #2a1a08;
}
input.submit2 {
	background: #78d6ff;
	border: 3px solid #1652b5;
	border-radius: 40px 0px 40px 0px;
	color: #0e4aaa;
	font: bold 18px Lucida Grande, Lucida, Verdana, sans-serif;
	width: 185px;
	height: 40px;
	cursor: pointer;
	transition: 0.2s all ease;
	}
input.submit2:hover {
	background: #b6e9ff;
	border: 3px solid #1652b5;
	border-radius: 0px 40px 0px 40px;
	color: #0e4aaa;
	}
input.submit2:disabled{
	background: #ccc;
	color: #ffffff;
	border: 2px solid #aaa;
	cursor:  progress;
	}
a:hover {
	color: #ff0000;
	}
a1{
	color: #000;
	}
a1:hover {
	color: #ff0000;
	}


button {
  /* Wooden plank style */
  background: linear-gradient(#d8b37a, #b4864d); /* sunlit wood tones */
  border: 4px solid #6a4a28;                     /* deep wood border */
  border-radius: 10px;
  color: #fffde8;
  font: bold 22px "Trebuchet MS", "Verdana", sans-serif;
  width: 185px;
  height: 50px;
  cursor: pointer;
  box-shadow:
    0 4px 0 #4d341a,       /* bottom wood edge */
    inset 0 2px 3px rgba(255, 255, 255, 0.3),  /* sun highlight */
    inset 0 -2px 3px rgba(0, 0, 0, 0.25);       /* inner shading */
  text-shadow: 1px 1px 0 #4a3419;
  transition: transform 0.1s ease, box-shadow 0.1s ease, background 0.1s ease;
}

button:hover {
  background: linear-gradient(#e3c18d, #c09253); /* brighter sunlit wood */
  transform: translateY(-1px);
  box-shadow:
    0 6px 4px rgba(0,0,0,0.35),
    inset 0 2px 3px rgba(255, 255, 255, 0.35),
    inset 0 -2px 3px rgba(0, 0, 0, 0.3);
}

button:active {
  transform: translateY(1px);
  box-shadow:
    0 1px 0 #2a1a08,
    inset 0 1px 3px rgba(0, 0, 0, 0.45);
  background: linear-gradient(#c7a36e, #9e7641); /* darker pressed wood */
}

button:active {
  transform: translateY(1px);
  box-shadow:
    0 1px 0 #2a1a08,
    inset 0 1px 3px rgba(0, 0, 0, 0.45);
  background: linear-gradient(#c7a36e, #9e7641); /* darker pressed wood */
}

button:disabled {
  background: linear-gradient(#b8a17a, #8e7350); /* muted, dull wood */
  box-shadow:
    0 2px 0 #3e2b17,        /* weaker bottom edge */
    inset 0 1px 2px rgba(255, 255, 255, 0.15),
    inset 0 -1px 2px rgba(0, 0, 0, 0.2);
  color: #aaaaaa;
  /* Remove press/hover effects */
  transform: none !important;
  transition: none;
}