/* ----------------------------------------------------------------------------
CSS for the create account page

NOTE: This page also uses the login.css for the logos and general page layout
------------------------------------------------------------------------------*/
.createAccountTitle {
  font-weight: bold;
  font-size: 18px;
}

.recaptchaContainer {
  transform: scale(0.93);
  -webkit-transform: scale(0.93);
}

input[type=password] {
  width: 100%;
  height: 29px;
  margin-bottom: 5px;
  margin-top: 2px;
  box-sizing: border-box;
}

.signUpButtonDiv {
  max-width: 600px;
  margin: 5px auto;
}

.info {
  float: none;
}

.smallText {
  font-size: 14px;
  margin-top: 10px;
  margin-bottom: 10px;
}

#errorMessage {
  text-align: center;
  color: #eb6961;
}

#googleRecapthaError {
  color: #eb6961;
  text-align: center;
}

.recaptchaContainer {
  width: 302px;
}

.recaptchaFlexParent {
  display: flex;
  justify-content: center;
  flex-direction: row;
  margin-top: 7px;
}

/*For google recaptcha red border*/
.warningBorder {
  border: solid 2px #eb6961;
}

/*Desktop view*/
@media screen and (min-width: 660px) {
  .inputFieldsDiv, .instructionDiv {
    max-width: 302px;
    min-width: 280px;
    padding: 0px;
  }

  .inputFieldsDiv {
    margin-right: 10px;
  }

  .instructionDiv {
    margin-left: 0px;
    padding-top: 10px;
  }

  .middleSection {
    flex-direction: row-reverse;
  }
}
@media screen and (max-width: 660px) {
  .btnMobileLeft {
    position: fixed !important;
    width: 50vw !important;
    max-width: 50vw !important;
    min-width: 50px;
    margin-top: 50px;
    margin-bottom: 0px !important;
    top: auto !important;
    bottom: 0px !important;
    left: 0px !important;
    height: 64px !important;
    z-index: 998;
  }

  .btnMobileRight {
    position: fixed !important;
    width: 50vw !important;
    max-width: 50vw !important;
    min-width: 50px !important;
    margin-left: -50px;
    margin-top: 50px;
    margin-bottom: 0px !important;
    top: auto !important;
    bottom: 0px !important;
    right: 0% !important;
    height: 64px !important;
    z-index: 998;
  }

  .signUpButtonDiv {
    padding-bottom: 90px;
  }

  #middleText {
    margin: 0 auto;
    display: table;
    width: 378px;
  }

  .title {
    padding-top: 20px;
  }
}
/*If the height gets too low, make it scrollable*/
@media screen and (max-width: 659px) and (max-height: 700px) {
  .loginPageContainer {
    display: block;
  }
}
@media screen and (max-width: 659px) {
  .createAccountTitle {
    text-align: center;
  }

  .inputFieldsDiv {
    text-align: center;
  }

  .inputFieldsDiv label {
    float: left;
  }

  .inputFieldsDiv input {
    max-width: 100%;
  }
}
/*@media screen and (max-width:335px){
    .recaptchaFlexParent {
        transform:scale(0.93);
        -webkit-transform:scale(0.93);
        transform-origin:0 0;
        -webkit-transform-origin:0 0;
    }
}*/
/*If desktop view and screen not tall enough, make it scrollable*/
@media screen and (min-width: 660px) and (max-height: 450px) {
  .loginPageContainer {
    display: block;
  }

  /*If height is low on desktop it moves to the right, this stops it*/
  #tooltip:after {
    margin-left: -10px;
  }

  .companyLogo {
    display: block;
    max-width: 220px;
    margin-left: auto;
    margin-right: auto;
    padding-top: 20px;
    margin-top: 20px;
    margin-bottom: 20px;
  }
}
/* ----------- iPhone 5, 5S, 5C and 5SE ----------- */
@media only screen and (min-device-width: 320px) and (max-device-width: 568px) and (-webkit-min-device-pixel-ratio: 2) {
  /*      .companyLogo{
        //    margin-top: 60px;
        }*/
  #middleText {
    width: 90%;
  }
}
/* ----------- iPhone 6, 6S, 7 and 8 ----------- */
/* Portrait and Landscape */
@media only screen and (min-device-width: 375px) and (max-device-width: 667px) and (-webkit-min-device-pixel-ratio: 2) {
  /*    .companyLogo{
         //   margin-top: 60px;

        }*/
  #middleText {
    width: 90%;
  }
}
/* ----------- iPhone 6+, 7+ and 8+ ----------- */
/* Portrait and Landscape */
@media only screen and (min-device-width: 414px) and (max-device-width: 736px) and (-webkit-min-device-pixel-ratio: 3) {
  /*      .companyLogo{
          //  margin-top: 60px;
        }*/
  #middleText {
    width: 90%;
  }
}
/* ----------- iPhone X ----------- */
/* Portrait and Landscape */
@media only screen and (min-device-width: 375px) and (max-device-width: 812px) and (-webkit-min-device-pixel-ratio: 3) {
  /*    .companyLogo{
            margin-top: 60px;
        }*/
  #middleText {
    width: 90%;
  }
}

/*# sourceMappingURL=createaccount.css.map */
