body {
	background-color:#f1f1f1;
	font-family: verdana;
	font-size: small;
	color:#333;
	margin:0;
	padding:0;
  }
  
  
  /* for new homepage design */
.homepageWrapOne {
  height:100%;
  background-image:url(images/pat.png);
}
.wrapLogin {
  margin: auto;
  position: absolute;
  top: 0; left: 0; bottom: 0; right: 0;
  width:820;
  height:400px;
  background-color:rgba(255, 255, 255, .7);
border-radius: 10px;
box-shadow: 5px 5px 5px #c7c6c6;
}

.logoWrap {
	width:100%;
	height:130px;
	border-radius: 10px 10px 0 0; 
	background-image:url(images/login-banner.jpg);
	background-repeat:none;
}

.formHWrap {
  float:left;
  margin-top:10px;
  width:313px;
  margin-left:20px;
}

.textHWrap {
  float:right;
  margin-right:20px;
  margin-top:15px;
  width:417px;
}

.textHWrap p {
    margin-top:15px;
}

.newLogin input[type="text"], input[type="password"] {
  display:block;
  width:100%;
  border:0;
  margin-bottom:15px;
  padding:12px;
  font-size:16px;
border-radius: 5px; 
border:1px solid #dedfdf;
}
.newLogin input[type="text"]:focus, input[type="password"]:focus {
  border:1px solid #6264dd;
  color:#6264dd;
}
.newLogin input[type="submit"]{
  background-color:#2e3093;
  color:#fff;
  font-weight:bold;
  padding:12px 0;
  width:100%;
  border:1px solid #181a6f;
border-radius: 5px;

}

.newLogin input[type="submit"]:hover {background-color:#2424ff}

@media handheld, screen and (max-width: 800px) {
.logoWrap, .textHWrap {display:none}
.wrapLogin {
  width:60%;
  height:250px;
}
.formHWrap {
  width:90%;
  margin-left:5%;
}

 }

@media handheld, screen and (max-width: 400px) { 
  .wrapLogin {
  width:90%;
  }
}