.body {  font-family: Verdana, Arial, Helvetica, sans-serif; font-size: 12px; color: #666666; line-height: 19px}
.subhead {  font-family: Verdana, Arial, Helvetica, sans-serif; font-size: 14px; color: #000000; font-weight: bold}
.footer {  font-family: Verdana, Arial, Helvetica, sans-serif; font-size: 10px; color: #666666}
.head {  font-family: Verdana, Arial, Helvetica, sans-serif; font-size: 16px; font-weight: bold; color: #000000}
.HPbody { font-family: Verdana, Arial, Helvetica, sans-serif; font-size: 10px; color: #666666; line-height: 15px}

a:link, a:visited, a:hover, a:active { color: #336699; }

.desktop-wrapper { padding-top: 20px; background-color: #CCCCCC; width: 100%;}


.mobile-wrapper { display: none; }
@media screen and (max-width: 900px) {
  .desktop-wrapper { display: none; }
  .mobile-wrapper  { display: table; }
}

.mobile-wrapper { background-color: #000000; width: 100%; height: 100%; color: #CCC; background-image: url('../images/hp_mobile.jpg'); background-repeat: no-repeat; background-position: center; }
.mobile-wrapper > div { display: table-row; text-align: center; }


.mobile-input::-webkit-input-placeholder { /* WebKit, Blink, Edge */  color: #CCC; }
.mobile-input:-moz-placeholder { /* Mozilla Firefox 4 to 18 */ color: #CCC; opacity: 1; }
.mobile-input::-moz-placeholder { /* Mozilla Firefox 19+ */ color: #CCC; opacity: 1; }
.mobile-input:-ms-input-placeholder { /* Internet Explorer 10-11 */ color: #CCC; }

input:invalid {background: #202020;}

.mobile-header {background-image: url('../images/hp_mobile_logo.gif'); background-repeat: no-repeat; background-position: center; height: 35%;}

.mobile-main { text-align: center; padding: 20px 20px 20px 20px; max-width: 400px; margin: auto;}

.mobile-input { font-size: 20px; padding: 10px; font-family: Helvetica; }
.mobile-input::focus{
    -webkit-tap-highlight-color: rgba(255, 255, 255, 0);
    -webkit-user-modify: read-write-plaintext-only;
}
.mobile-input-username, .mobile-input-password {
  width: 90%;
  background: #ffffff;
  border: solid 1px #CCC;
  border-radius: 10px 10px 0px 0px;
}
.mobile-input-password {width: 90%;
  border-radius: 0px 0px 10px 10px;
  border-top: 0px;
  margin-bottom: 15px;
}
.mobile-input-login {width: 90%;
  border-radius: 10px;
  font-weight: bold;
  color: #666;
  border: 0px solid #888;
  background: #F6F6F6;
  background: -webkit-gradient(linear, left top, left bottom, from(#F6F6F6), to(#A6A6A6));
  background: -moz-linear-gradient(top,  #F6F6F6,  #A6A6A6);
  filter:  progid:DXImageTransform.Microsoft.gradient(startColorstr='#F6F6F6', endColorstr='#A6A6A6');
}

.mobile-footer {font-size: 14px; font-family: Helvetica; position: fixed; bottom: 0px; width: 100%; text-align: center;}
.mobile-footer-menu {padding-bottom: 10px;}
.mobile-footer-copyright { float: left; padding-left: 5px; }
.mobile-footer-phone { float: right; padding-right: 5px; }