﻿.CustomerSite *
{
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
}

.CustomerSite fieldset
{
    padding: 0px;
    margin: 0px;
    display:
    inline-block;
    border: 0px;
}

.CustomerSite fieldset select
{
    margin-right: 2px;
}

.CustomerSite div.line
{
    padding: 1px;
    clear: both;
}

.CustomerSite div.line > label
{
    width: 30%;
    float: left;
    text-align: right;
    padding: 6px;
    padding-right: 5px;
}

.CustomerSite div.line > div
{
    width: 70%;
    float: left;
    padding: 2px;
}

.Payment div.line > div
{
    width: 50%;
    float: left;
    padding: 2px;
}

.CustomerSite .LastNameAndExtensionTable
{
    border-spacing: 0px;
}

.CustomerSite .RedAsterisk
{
    font-weight: normal;
    font-size: xx-small;
    color: red;
}

.CustomerSite .ErroneousFieldTitle
{
    color: red;
}


/* Application form */

.ApplicationForm
{
  font-family: Verdana, "Trebuchet MS", Trebuchet;
  padding: 15px;
  font-size: 12px;
}

.ApplicationForm input[type=text]
{
  border: 1px solid black;
  font-size: 10px;
}

.ApplicationForm input[type=password]
{
  border: 1px solid black;
  font-size: 10px;
}

.ApplicationForm input[type=radio]
{
  font-size: 10px;
  vertical-align: -18%;
  border: none;
}

.ApplicationForm select
{
  font-size: 10px;
}

.ApplicationForm .Errors
{
  color: Red;
  border: none;
  background: inherit;
}

.ApplicationForm .ErrorsHeader
{
  font-weight: bold;
}

.ApplicationForm .SectionButton
{
  text-align: left;
  padding-top: 10px;
}

.ApplicationForm .SectionCheckbox,
.ApplicationForm .SectionTable .SectionCheckbox
{
  text-align: left;
  padding-top: 10px;
}

.ApplicationForm .SectionHeader
{
  text-align: left;
  color: Chocolate;
  font-size: 24px;
  font-weight: bold;
  margin-top: 20px;
}

.ApplicationForm .SectionMessage
{
  border: 1px solid black;
  border-bottom: none;
  padding: 8px;
}

.ApplicationForm .RoutingInfo
{
  border: 1px solid black;
  border-bottom: none;
  padding: 8px;
  padding-left: 22%;
}

.ApplicationForm .SectionTable
{
  width: 100%;
  border: 1px solid black;
}

.ApplicationForm .SectionTable .TableHeader
{
  width: 22%;
  text-align: right;
  padding-right: 5px;
}
.ApplicationForm .SectionTable .TableValue
{
  width: 28%;
  text-align: left;
}
.ApplicationForm .SectionTable .TableHeaderForYesNo
{
  width: 22%;
  text-align: center;
}
.ApplicationForm .SectionTable .TableValueForYesNo
{
  width: 78%;
  text-align: left;
}
.ApplicationForm .SectionTable .TableHeaderForCheckbox
{
  width: 100%;
  text-align: left;
}
  
/* Member area pages */

.MemberAreaPage
{
  font-family: "Trebuchet MS", Trebuchet, Verdana;
  padding: 15px;
}
.MemberAreaPage input, select, button
{
    border: solid 1px #000000;
}
.MemberAreaPage input[type=radio]
{
  border: none;
}
.MemberAreaPage > div
{
  width: 530px;
  margin: auto;
  padding: 5px;
  border-left: 1px solid black;
  border-right: 1px solid black;
  border-bottom: 1px solid black;
  background-color: #f2f2f2;
}
.MemberAreaPage .Button
{
  background-color: inherit;
}
.MemberAreaPage .ErrorMessage
{
  color: Red;
  text-align: center;
  border: none;
  background: inherit;
}
.MemberAreaPage .Header
{
  border: 1px solid black;
  background-color: #707ece;
  text-align: center;
  color: White;
  font-size: 16px;
  font-weight: bold;
}

.ChangePassword { }

.Login { }
.Login > div { width: 400px; }
.Login div.line > label { width: 35%; }
.Login div.line > div { width: 65%; }
.Login .WelcomeMessage { border: none; background: inherit; text-align: center; }
.Login .ForgotPasswordLink { border: none; background: inherit; text-align: right; margin-top: 15px;}

.RecoverPassword { }
.RecoverPassword > div { width: 400px; }
.RecoverPassword .WelcomeMessage { border: none; background: inherit; text-align: center; }

.ResetPasswordInitiate { }
.ResetPasswordInitiate > div { width: 400px; }

.ResetPassword { }

.SelectLoan { }
.SelectLoan > div { width: 600px; }
.SelectLoan .LoansTable { margin: 0.5em auto; }

.MemberArea { min-height: 330px; }
.MemberArea > div { width: 600px; }
.MemberArea .Preface { border: none; background: inherit; text-align: center; }
.MemberArea .MessageFromLender { border-bottom: none; text-align: center; color: Red; }
.MemberArea .InfoTable table { width: 100%; }
.MemberArea .TableHeader { text-align: left; vertical-align: top; width: 40%; }
.MemberArea .TableValue { text-align: left; vertical-align: top; width: 60%; }
.MemberArea .Notice { font-size: 75%; }
.MemberArea .Links { background: inherit; }
.MemberArea .Link { width: 30%; display: block; float: left; font-weight: bold; padding: 5px; }
.MemberArea .LinkClear { clear: both; }

.AgreementsPane
{
    position: absolute; width: 280px; min-height: 75px; max-height: 120px;
    border: solid 1px #999999; background-color: #f4f4f4; padding: 4px;
    font-size: 14px;
    overflow: scroll; overflow-x: hidden; overflow-y: scroll;
}
.AgreementsPane .agreementLink { font-weight: bold; }
.AgreementsPane .closeLink { display: block; float: right; font-family: Arial; font-size: 12px; color: #666666; text-decoration: none; }

.LeadAccepted { }

.LoanApplicationCompleted { }

.LoanAutoDenial { }

.LoanSellLead { }

.LoanSelectAmount { }
.LoanSelectAmount > div { width: 600px; }
.LoanSelectAmount .RatesTable table { width: 80%; border: 1px solid black; border-collapse: collapse; margin: auto; }
.LoanSelectAmount .RatesTable table thead tr td { font-weight: bold; }
.LoanSelectAmount .RatesTable table thead td { background-color: #ccddee; }
.LoanSelectAmount .RatesTable td { border: 1px solid #122312; border-collapse: collapse; }

.LoanSelectDueDate { }

.LoanConfirm { }

.Payment { }

.ScheduledPaymentSelectDate { }

.ScheduledPayment { }
.ScheduledPayment .PaymentDetails table { width: 80%; margin: auto; }
.ScheduledPayment .PaymentDetails td.TableHeader { text-align: right; }
.ScheduledPayment .PaymentDetails td.TableValue { text-align: left; }

@media (max-width: 579px) {
  .CustomerSite > div { width: 100%; }
  .CustomerSite div.line > label, .CustomerSite div.line > div { width: 100%; text-align: left; padding: 1px; }
  .CustomerSite div.line > div.field { width: 100%; padding: 0px; text-align: left; }
}

/* OVERLAYS */
.modal          { font-size:90%; background-color:#fff; display:none; padding:15px; text-align:left; border:2px solid #333; -moz-border-radius:6px; -webkit-border-radius:6px; -moz-box-shadow: 0 0 50px #ccc; -webkit-box-shadow: 0 0 50px #ccc; }
.modal h2       { margin:0px; padding:10px 0 10px 10px; border-bottom:1px solid #333; font-size:20px; }
.ajax-loader
{
    /* background-image is explicitely set in showLoading() to prevent problems in IE */
    background-repeat: no-repeat; background-position: center;
}
.modal-body { overflow-y: auto; max-height: 400px; word-break: break-all; word-wrap: break-word; }
.modal.alert { max-width:600px; min-width:300px; }
.modal.alert a { text-decoration:none; }
.modal.alert a.closeBtn { color:#000;float:right;font-size:20px;font-weight:bold;line-height:18px;opacity:0.2;filter: alpha(opacity=20);text-shadow:0 1px 0 #000; }
.alert ul li { list-style-type:none; padding:4px; margin-bottom:1px; }
.alert-error { background-color:#f2dede !important;color:#b94a48 !important; }
.alert-error .modal-footer { background-color:#f2dede !important; }
.modal-footer { padding: 14px 15px 15px;margin-bottom: 0;text-align: right;background-color: whitesmoke;border-top: 1px solid #dddddd;-webkit-border-radius: 0 0 6px 6px;-moz-border-radius: 0 0 6px 6px;border-radius: 0 0 6px 6px;-webkit-box-shadow: inset 0 1px 0 white;-moz-box-shadow: inset 0 1px 0 white;box-shadow: inset 0 1px 0 white;*zoom: 1; }
.modal-footer a.AButton { float:right; margin-left:10px; }
.modal-footer a.AButton.left { float:left; margin-left:0; margin-right:10px; }
.modal-footer:before,
.modal-footer:after { display: table;content: ""; }
.modal-footer:after { clear: both;}
.delete-row-jstable{ background:url(Images/icon_delete.png) no-repeat; width: 19px; height: 17px; position: relative;float: right; cursor:pointer; }
.move-row-jstable{ background:url(Images/icon_up.png) no-repeat; width: 19px; height: 17px; position: relative;float: right; cursor:pointer; }

.ApplicationForm .RedAsterisk {
  font-weight: normal; font-size: xx-small; color: red;
}

.ApplicationForm div.SectionTable {
  border: 1px solid black;
}
.ApplicationForm div.line {
  padding: 1px;
  clear: both;
}
.ApplicationForm div.line > div {
  width: 50%;
  float: left;
  padding: 0px;
}

.ApplicationForm div.line > div.single {
  width: 100%;
  float: left;
}

.ApplicationForm div.line > div > label,
.ApplicationForm div.line > div > div.label {
  cursor: auto;
  width: 44%;
  float: left;
  text-align: right;
  padding: 2px;
  padding-right: 5px;
}
.ApplicationForm div.line > div.single > label,
.ApplicationForm div.line > div.single > div {
  cursor: auto;
  width: 22%;
  float: left;
  text-align: left;
  padding: 6px;
  padding-right: 5px;
}
.ApplicationForm div.line > div > div,
.ApplicationForm div.line > div > fieldset > div {
  width: 56%;
  float: right;
  padding: 2px;
}
.ApplicationForm div.line > div.single > div.field {
  width: 78%;
  float: right;
  padding: 2px;
  text-align: left;
}
.ApplicationForm div.line > div.single.aligned > label,
.ApplicationForm div.line > div.single.aligned > div.label {
  text-align: right;
  padding: 2px;
  padding-right: 5px;
}
.ApplicationForm div.line > div.single.aligned > div,
.ApplicationForm div.line > div.single.aligned > fieldset > div {
  width: 78%;
  float: right;
  padding: 2px;
}

@media (max-width: 992px) {
  .ApplicationForm div.SectionTable {
    border: none;
  }
  .ApplicationForm div.line > div {
    width: 100%;
  }
  .ApplicationForm div.line > div > label,
  .ApplicationForm div.line > div > div.label {
    width: 35%;
    padding-top: 10px;
  }
  .ApplicationForm div.line > div.single > label,
  .ApplicationForm div.line > div.single > div {
    width: 22%;
  }
  .ApplicationForm div.line > div > div,
  .ApplicationForm div.line > div > fieldset > div {
    width: 65%;
  }
  .ApplicationForm div.line > div.single > div.field {
    width: 78%;
  }
  .ApplicationForm div.line > div.single.aligned > label,
  .ApplicationForm div.line > div.single.aligned > div.label {
    width: 35%;
  }
  .ApplicationForm div.line > div.single.aligned > div {
    width: 65%;
  }
}

@media (max-width: 579px) {
  .ApplicationForm div.line > div > label,
  .ApplicationForm div.line > div > div.label {
    width: 100%;
    text-align: left;
    padding: 1px;
  }
  .ApplicationForm div.line > div.single > label,
  .ApplicationForm div.line > div.single > div {
    width: 100%;
    text-align: center;
    padding: 1px;
  }
  .ApplicationForm div.line > div > div,
  .ApplicationForm div.line > div > fieldset > div,
  .ApplicationForm div.line > div.single > div.field {
    width: 100%;
    padding: 0px;
    text-align: left;
  }
}
