 body {
  min-height: 100vh;
  display: flex;
  flex-direction: column;
  height: 100%;
  font-family: 'Lato', arial, helvetica, sans-serif;
  padding: 0;
  margin: 0;
  text-align: center;
  font-size: 1rem;
  font-weight: 400;
  color: #fff;
  background: #048ccc;
  background: -moz-linear-gradient(top, #048ccc 0%, #04528d 100%);
  /* FF3.6-15 */
  background: -webkit-linear-gradient(top, #048ccc 0%, #04528d 100%);
  /* Chrome10-25,Safari5.1-6 */
  background: linear-gradient(to bottom, #048ccc 0%, #04528d 100%);
  /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */ }

header {
  padding-top: 1rem; }

main {
  display: block;
  position: relative;
  padding-bottom: 20px; }

.util main {
  padding-bottom: 0;
  border-top: 1px solid #adb5bc;
  padding-top: 1rem;
  text-align: left; }

h1 {
  font-size: 1.4rem;
  font-weight: 400;
  text-transform: uppercase;
  margin: .75rem;
  letter-spacing: 1px; }

h2.reset {
  text-transform: none;
  color: #ca7400;
  margin: .5rem 0;
  font-weight: 400; }

.act-reset {
  font-size: 1.125rem; }

.act-reset a {
  font-weight: 700; }

.bttn.continue {
  background-color: #157bbb; }

.box {
  flex: 1 0 auto;
  width: 100%;
  max-width: 400px;
  margin: 0 auto; }
  @media (min-width: 600px) {
    .box {
      padding-top: 7rem; } }

.logo {
  padding-bottom: 1rem;
  width: 280px;
  height: auto; }

.util .logo {
  padding-bottom: 0; }

.mainbox {
  background-color: #fff;
  color: #000;
  border: 1px solid #646262;
  border-radius: 3px;
  -webkit-box-shadow: 0px 20px 20px -15px rgba(0, 0, 0, 0.85);
  -moz-box-shadow: 0px 20px 20px -15px rgba(0, 0, 0, 0.85);
  box-shadow: 0px 20px 20px -15px rgba(0, 0, 0, 0.85);
  margin: 0 -30px;
  position: relative;
  z-index: 102;
  padding: 30px;
  margin-bottom: 20px; }

.content {
  margin: 0 30px;
  color: #fff;
  background: #006091;
  background: -moz-linear-gradient(top, #006091 0%, #004b71 100%);
  background: -webkit-linear-gradient(top, #006091 0%, #004b71 100%);
  background: linear-gradient(to bottom, #006091 0%, #004b71 100%); }

.util .content {
  margin: 0; }

.easform {
  text-align: left; }
  .easform label {
    display: block; }

.login-error {
  color: #E3111B;
  font-weight: 700;
  padding-bottom: .5rem; }

input[type=text], input[type=password] {
  width: 100%;
  font-size: 1rem;
  padding: 3px; }

input[type=submit] {
  width: 100%;
  border: none; }

input[type=submit]:focus {
  outline-offset: 2px;
  outline: 2px dotted #204A6D; }

.quest {
  padding-bottom: 1.25rem;
  position: relative; }

.bttn {
  font-size: 1.25rem;
  text-align: center;
  padding: 10px 16px;
  background-color: #006091;
  color: #fff;
  text-transform: uppercase;
  font-weight: 400;
  letter-spacing: 2px;
  transition: .3s ease; }

.bttn:hover, .bttn:focus {
  background-color: #0C99D5; }

.bttn:focus {
  outline: none; }

.screenid {
  position: absolute;
  bottom: 8px;
  color: #C9CCCE;
  font-size: .8rem;
  right: 20px; }

[type="text"], [type="password"], [type="date"], [type="datetime"], [type="datetime-local"], [type="month"], [type="week"], [type="email"], [type="number"], [type="search"], [type="tel"], [type="time"], [type="url"], [type="color"], textarea {
  -moz-appearance: none;
  background-color: #fefefe;
  border: 1px solid #cacaca;
  border-radius: 0;
  box-shadow: 0 1px 2px rgba(10, 10, 10, 0.1) inset;
  box-sizing: border-box;
  color: #3c4858;
  display: block;
  font-family: inherit;
  font-size: 1rem;
  height: 2.4375rem;
  padding: 0.5rem;
  transition: box-shadow 0.5s ease 0s, border-color 0.25s ease-in-out 0s;
  width: 100%; }

[type="text"]:focus, [type="password"]:focus, [type="date"]:focus, [type="datetime"]:focus, [type="datetime-local"]:focus, [type="month"]:focus, [type="week"]:focus, [type="email"]:focus, [type="number"]:focus, [type="search"]:focus, [type="tel"]:focus, [type="time"]:focus, [type="url"]:focus, [type="color"]:focus, textarea:focus {
  background: #fefefe none repeat scroll 0 0;
  border: 1px solid #0375ab;
  box-shadow: 0 0 5px #cacaca;
  outline: medium none;
  transition: box-shadow 0.5s ease 0s, border-color 0.25s ease-in-out 0s; }

button, html input[type="button"], input[type="reset"], input[type="submit"] {
  cursor: pointer; }

[type="submit"], [type="button"] {
  -moz-appearance: none;
  border-radius: 0; }

.button {
  background: #63981e none repeat scroll 0 0;
  border: 1px solid transparent;
  border-radius: 0;
  color: #ffffff;
  cursor: pointer;
  display: inline-block;
  font-size: 1.2rem;
  line-height: 1;
  margin: 0 1rem 1rem 0;
  padding: 0.6em 1.25em;
  text-align: center;
  transition: all 0.25s ease-out 0s;
  vertical-align: middle; }

/**
 * Remove the inner border and padding in Firefox.
 */
button::-moz-focus-inner,
[type="button"]::-moz-focus-inner,
[type="reset"]::-moz-focus-inner,
[type="submit"]::-moz-focus-inner {
  border-style: none;
  padding: 0; }

/**
 * Restore the focus styles unset by the previous rule.
 */
button:-moz-focusring,
[type="button"]:-moz-focusring,
[type="reset"]:-moz-focusring,
[type="submit"]:-moz-focusring {
  outline: 1px dotted ButtonText; }

.links {
  padding: .125rem 1rem; }

.acct {
  float: left;
  width: 40%;
  text-align: left; }

.helpme {
  text-align: right; }

a {
  text-decoration: none;
  transition: .4s ease; }

a:link {
  border-bottom: 1px solid transparent;
  color: #007ab8; }

a:visited {
  color: #8B0595; }

a:hover, a:visited:hover, a:focus {
  border-bottom-color: #547c02;
  color: #547c02; }

a:focus {
  outline-offset: 2px;
  outline: 1px dotted; }

.info {
  position: absolute;
  right: 10px;
  bottom: 26px; }

.links a:link {
  color: #fff; }

.links a:visited {
  color: #CAD7E1; }

.links a:hover, .links a:visited:hover, .links a:focus {
  color: #fff;
  border-bottom-color: #fff; }

footer {
  font-size: .85rem;
  padding: 1.125rem 4rem .5rem 4rem;
  position: relative;
  color: #d5d7d9; }

footer a:link, footer a:visited {
  color: #d5d7d9; }

footer a:hover, footer a:visited:hover, footer a:focus {
  color: #fff;
  border-bottom-color: #fff; }

.hidden {
  position: absolute !important;
  clip: rect(1px 1px 1px 1px);
  /* IE6, IE7 */
  clip: rect(1px, 1px, 1px, 1px); }

.forgot {
  padding-top: .5rem;
  margin-bottom: 0;
  padding-bottom: 0; }

.tooltip {
  outline: none;
  cursor: help;
  text-decoration: none !important; }

.tooltip:focus {
  border: 1px dotted #000000; }

.ttiptext {
  border-radius: 2px;
  border: 1px solid #8AAF40;
  position: absolute;
  right: -10px;
  top: 2em;
  z-index: 99;
  margin-left: -999;
  width: 250px;
  background-color: #CEF77A;
  padding: 4px;
  font-size: .9rem; }
  
.ttiptext a:link, .ttiptext a:visited { 
  color: #293e5b;
  font-weight: 700; 
                
}

.ttiptext a:hover { 
  color: #0b57db;
  border-bottom-color: #0b57db;
}
  

.back {
  background-color: #fff;
  text-align: left;
  padding: 1rem;
  margin-top: 1rem;
  font-size: .9rem; }

.util-options {
  margin: 0 0 0 1.5rem;
  padding: 1rem 0 1.5rem 0;
  list-style-type: none; }
  .util-options li {
    font-size: 1.125rem;
    padding: 1rem 0 1rem 42px; }
  .util-options a:link {
    color: #fff; }
  .util-options a:visited {
    color: #e0e7f0; }
  .util-options a:hover {
    color: #D4F4FA;
    border-bottom-color: #D4F4FA; }
  .util-options a:focus {
    color: #d0ffb5; }

.recovery {
  background: url(../images/recovery.png) left center no-repeat; }

.forgotpw {
  background: url(../images/forgot.png) left center no-repeat; }

.change {
  background: url(../images/change.png) left center no-repeat; }

.kb {
  background: url(../images/KB.png) 6px center no-repeat; }

.ticket {
  background: url(../images/ticket.png) left center no-repeat; }

.callcenter {
  background: url(../images/call.png) left center no-repeat; }
  
.logout_text {
  padding-left: 2em;
  padding-right: 2em;
}
