/*
// CSS Classes  below can be populated and changed to modify your calculator deployment.
// IMPORTANT: Do Not Modify the KJE.css file!  The KJE.css file is replaced during the update process
// All CSS customization must be done in this file (you can override KJE.css classes)
//
// For information on customizing this file please see:
// https://www.dinkytown.net/money/V3customize.html
*/

body.KJEBody {
  background-color: #002e5b;
}

body.KJEBody #KJEAllContent,
.KJEWidthConstraint,
.KJEWrapper {
  background-color: transparent /*PAGE_BACKGROUND_COLOR*/;
}

.KJEWidthConstraint {
  padding: 0;
  background-color: #002e5b;
}

#KJEMain {
  transition: height 0.5s ease 0s;
  background: #fff;
}

#KJECalculatorDescID,
h1.KJEFontTitle {
  margin-top: 0;
  height: 0;
  overflow: hidden;
}

.KJEFontHeading {
  color: #002e5b;
}

.KJECalculator p {
  color: #222;
}

.KJECenterText {
  margin: 0 auto;
  background: #f6f6f6;
  padding: 1.5%;
  box-sizing: border-box;
  border-radius: 5px;
  margin-top: 15px;
}

.custom-content {
  margin: 0 auto;
  width: 100%;
  background: #f6f6f6;
  box-sizing: border-box;
  border-radius: 5px;
  text-align: center;
  padding: 1.5%;
}
.custom-content h3,
.custom-content p {
  margin-top: 0;
  margin-bottom: 0;
  color: #002e5b;
}

.custom-content p.back a {
  font-size: 14px;
  color: #002e5b;
  text-decoration: none;
}

/**CUSTOMCSS**/

/** Calculators Index **/

.calculators .col-half span {
  border-bottom: 3px solid #fbba42;
  padding-bottom: 5px;
  text-transform: uppercase;
  font-size: 12px;
  letter-spacing: 1px;
  font-weight: 500;
  font-family: "Open Sans", sans-serif;
}

.calculators .col-half a.KJELabel {
  background: #f6f6f6;
  border: 1px solid;
  padding: 10px;
  color: #002e5b !important;
  text-decoration: none;
}

@media only screen and (min-width: 767px) {
  body.KJEBody table,
  body.KJEBody td,
  body.KJEBody ul,
  body.KJEBody ol,
  body.KJEBody dd,
  body.KJEBody dl,
  body.KJEBody p,
  body.KJEBody br,
  body.KJEBody dt,
  body.KJEBody,
  #KJEAllContent table,
  #KJEAllContent td,
  #KJEAllContent ul,
  #KJEAllContent ol,
  #KJEAllContent dd,
  #KJEAllContent dl,
  #KJEAllContent p,
  #KJEAllContent br,
  #KJEAllContent dt,
  #KJEAllContent th,
  body.KJEBody th,
  .KJEInputContainer input.KJEInputModern,
  .KJEInputContainer select.KJEDropBoxModern {
    font-size: 16px;
    font-weight: 400;
    line-height: 27px;
  }
  h3 {
    font-size: 22px;
    font-weight: 600;
  }
  .calculators {
    display: flex;
    flex-wrap: wrap;
    margin-left: 0;
    margin-right: 0;
    padding-bottom: 30px;
  }
  .calculators .col-half {
    flex: 29%;
    margin-left: 2%;
    margin-right: 2%;
    padding: 3%;
    background: #fff;
    box-sizing: border-box !important;
    box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.5);
    margin-bottom: 4%;
    position: relative;
  }
  .calculators .col-half a.KJELabel {
    position: absolute;
    bottom: 30px;
  }
  .calculators .col-half p {
    padding-bottom: 35px;
  }

  div#KJEReport {
    max-width: 900px;
    margin: 0 auto;
    background: #f6f6f6;
    box-sizing: border-box;
    border-radius: 5px;
  }

  #KJEDefinitions {
    max-width: 900px;
    margin: 0 auto;
    background: #f6f6f6;
    padding: 2.5%;
    box-sizing: border-box;
    border-radius: 5px;
    margin-top: 15px;
  }

  .KJECenterText {
    max-width: 900px;
    padding: 1.5%;
  }

  .custom-content {
    max-width: 900px;
  }
  .custom-content h3,
  .custom-content p {
    margin-top: 0;
    margin-bottom: 0;
  }
}

@media only screen and (max-width: 767px) {
  body.KJEBody table,
  body.KJEBody td,
  body.KJEBody ul,
  body.KJEBody ol,
  body.KJEBody dd,
  body.KJEBody dl,
  body.KJEBody p,
  body.KJEBody br,
  body.KJEBody dt,
  body.KJEBody,
  #KJEAllContent table,
  #KJEAllContent td,
  #KJEAllContent ul,
  #KJEAllContent ol,
  #KJEAllContent dd,
  #KJEAllContent dl,
  #KJEAllContent p,
  #KJEAllContent br,
  #KJEAllContent dt,
  #KJEAllContent th,
  body.KJEBody th,
  .KJEInputContainer input.KJEInputModern,
  .KJEInputContainer select.KJEDropBoxModern {
    font-size: 14px;
    line-height: 24px;
  }
  .col-half {
    margin-bottom: 30px;
  }
  .col-half span,
  .col-half h3,
  .col-half p {
    color: #fff;
  }
  #KJEDefinitions {
    background: #fff;
  }

  div#KJEReport {
    background: #f6f6f6;
    box-sizing: border-box;
    border-radius: 5px;
  }
}