/***** Login Page Styles *****/
#container {
  width: 100%;
  padding: 0 1% 3% 1%;
}

#imageContainer {
  width: 100%;
  padding: 0 1% 3% 1%;
  margin-top: 6%;
  background-image: url("../../images/city_fit_login_bckgrnd.jpg");
  background-repeat: no-repeat;
}

.formContainer {
  float: right;
  height: auto;
  margin: 3% 2% 0 0;
  border-radius: 4%;
  background-color: #fff;
  width: 450px;
  padding: 1%;
  border: solid 1.5px #007c9d;
}

.loginContainer {
    width: 420px;
}

.companyLogo {
    overflow: hidden;
    width: 60% !important;
    height: auto !important;
    margin: 0 auto 3% !important;
}

.ih21MidwestFieldLabel {
  margin-left: 10px;
  float: left;
  width: 90px;
  font-family: arial, sans-serif; 
  font-size: 16px;
  color: #000;
}

.fieldContainer {
    float: left !important;
    width: 100% !important; 
}

.fieldContainer > input[type="text"] {
    background-color: #73808b;
    height: 45px;
    font-size: 1.8em !important;
}

.fieldContainer > input[type="password"] {
    background-color: #73808b;
    height: 45px;
    font-size: 1.8em !important;
}

.ih21MidwestSubmitBtnLogin {
  float: right;
  width: 100px;
  height: 35px;
  margin-right: 20px;
  background-color: #000 !important;
  border-radius: 6px;
  font-size: 16px;
  color: #fff;
  text-transform: uppercase;
  cursor: pointer;
  border: none;
}

.loginAlertBox {
  margin-left: 15%;
  padding: 2%;
  width: 550px;
  border: 1px solid #474747;
  background-color: #fff;
  text-align: center;
  color: #000;
  -webkit-box-shadow: 2px 2px 5px 0px rgba(50, 50, 50, 0.75);
  -moz-box-shadow:    2px 2px 5px 0px rgba(50, 50, 50, 0.75);
  box-shadow:         2px 2px 5px 0px rgba(50, 50, 50, 0.75);
}

.loginAlertBox p {
  font-family: arial, helvetica, sans-serif;
  font-size: 16px;
  color: #5d5d5d;
  line-height: 1.5;
}

.loginAlertBox a {
  font-family: arial, helvetica, sans-serif;
}

.errorMsgBox {
  float: left;
  width: 42%;
  margin-top: 7%;
  margin-left: 2%;
}
  
.errorMsg {
  width: 100%;
  margin-top: 4%;
  margin-left: 3%;
}


/***** Forgot Styles *****/
#mainContent {
  width: 900px;
  overflow: hidden;
  margin-top: 3%;
  margin-left:auto;
  margin-right:auto;
}

.ih21MidwestBckgrnd {
  width: 800px;
  height: 650px;
  margin: 0 auto;
  padding-top: 25px;
  background: rgba(237,173,5,1);
  background: -moz-linear-gradient(top, rgba(237,173,5,1) 0%, rgba(255,255,255,1) 100%);
  background: -webkit-gradient(left top, left bottom, color-stop(0%, rgba(237,173,5,1)), color-stop(100%, rgba(255,255,255,1)));
  background: -webkit-linear-gradient(top, rgba(237,173,5,1) 0%, rgba(255,255,255,1) 100%);
  background: -o-linear-gradient(top, rgba(237,173,5,1) 0%, rgba(255,255,255,1) 100%);
  background: -ms-linear-gradient(top, rgba(237,173,5,1) 0%, rgba(255,255,255,1) 100%);
  background: linear-gradient(to bottom, rgba(237,173,5,1) 0%, rgba(255,255,255,1) 100%);
  -webkit-box-shadow: 2px 2px 5px 0px rgba(50, 50, 50, 0.75);
  -moz-box-shadow:    2px 2px 5px 0px rgba(50, 50, 50, 0.75);
  box-shadow:         2px 2px 5px 0px rgba(50, 50, 50, 0.75);
}

#loginContainer {
  width: 690px;
  margin: 0 auto;
  overflow: hidden;
}

.ih21MidwestLogo {
  width: 50%;
  float: left;
  margin-left: 8%;
}

.ih21MidwestHeaderText {
  width: 35%;
  float: right;
  margin-top: 6%;
  margin-right: 6%;
  font-size: 32px;
  color: #f2a126;
  text-align: right;
  font-family: arial, helvetica, sans-serif;
  text-transform: uppercase;
  font-weight: bold;
  line-height: 1.6;
}

.ih21MidwestForgotTxt {
  font-size: 18px;
  font-family: arial, helvetica, sans-serif;
  color: #edad05;
  margin-bottom: 5px;
  margin-top: 0px;
  font-weight: bold;
}

.ih21MidwestFieldLabel {
  margin-left: 10px;
  float: left;
  width: 90px;
  font-family: arial, sans-serif; 
  font-size: 2em;
  color: #000;
}

.ih21MidwestSubmitBtnLogin {
  float: right;
  width: 100px;
  height: 35px;
  margin-right: 20px;
  background-color: #000 !important;
  border-radius: 6px;
  font-size: 16px;
  color: #fff;
  text-transform: uppercase;
  cursor: pointer;
  border: none;
}

h2 {
  font-size: 18px;
  font-family: arial, helvetica, sans-serif;
  color: #007c9d;
  margin-bottom: 5px;
  margin-top: 0px;
  font-weight: bold;
}

p {
  font-family: arial, helvetica, sans-serif;
  font-size: 14px;
  color: #5d5d5d;
}

.text {
  font-size: 20px;
  font-family: arial, helvetica, sans-serif;
  color: #fff;
  margin: 0 0 20px 20px;
  line-height: 1.4;
}

.copyrightTxt {
  width: 93%;
  margin-top: 1%;
  font-family: arial, helvetica, sans-serif;
  font-size: 12px;
  text-align: right;
  color: #5d5d5d;
}

.usernameBox {
  width: 300px;
  float: left;
  margin-top: 10px;
  padding: 10px;
  border: 1px solid #474747;
  background-color: #fff;
  -webkit-box-shadow: 2px 2px 5px 0px rgba(50, 50, 50, 0.75);
  -moz-box-shadow:    2px 2px 5px 0px rgba(50, 50, 50, 0.75);
  box-shadow:         2px 2px 5px 0px rgba(50, 50, 50, 0.75);
  }
  
.passwordBox {
  width: 300px;
  float: right;
  margin-top: 10px;
  padding: 10px;
  border: 1px solid #474747;
  background-color: #fff;
  -webkit-box-shadow: 2px 2px 5px 0px rgba(50, 50, 50, 0.75);
  -moz-box-shadow:    2px 2px 5px 0px rgba(50, 50, 50, 0.75);
  box-shadow:         2px 2px 5px 0px rgba(50, 50, 50, 0.75);
}
  
.loginLink {
  display: inline-block;
  width: 100%;
  margin-top: 3%;
  font-size: 16px;
  font-family: arial, helvetica, sans-serif;
  text-align: center;
  color: #484848;
  }
  
.errorMsgBox {
  float: left;
  width: 42%;
  margin-top: 7%;
  margin-left: 2%;
  }
  
.errorMsg {
  width: 100%;
  margin-top: 4%;
  margin-left: 3%;
}
  
.alertBox {
  margin-left: 15%;
  width: 600px;
  border: 1px solid #474747;
  background-color: #fff;
  text-align: center;
  color: #000;
  -webkit-box-shadow: 2px 2px 5px 0px rgba(50, 50, 50, 0.75);
  -moz-box-shadow:    2px 2px 5px 0px rgba(50, 50, 50, 0.75);
  box-shadow:         2px 2px 5px 0px rgba(50, 50, 50, 0.75);
}

.alertBox p {
  font-family: arial, helvetica, sans-serif;
  font-size: 16px;
  color: #5d5d5d;
  line-height: 1.5;
}

.alertBox a {
  font-family: arial, helvetica, sans-serif;
}