#calculator-wrapper {
   font-family: proxima-nova, sans-serif;  
 }
 
 :root {
    --headline-text:  #0054A3;
 	
    --button-background-color: #3c3c3c;
    --button-hover-background-color: #FFFFFF;
    --button-text-color: #FFFFFF;
	--button-hover-text-color: #3c3c3c;
 	--button-border-color: #3c3c3c;
 	--button-hover-border-color: #3c3c3c;
 	
 	--cta-button-background-color: #156d16;
    --cta-button-hover-background-color: #FFFFFF;
    --cta-button-text-color: #FFFFFF;
 	--cta-button-hover-text-color: #156d16;
 	--cta-button-border-color: #156d16;
 	--cta-button-hover-border-color: #156d16;
 	
    --button-radius: 10px;
    --cta-button-radius: 10px;
 	--button-font-size: 16px;
 	--button-weight: 800;
 	--button-collapse-radius: 7.68px 7.68px 0 0;
    --disabled-button: #636363;
    --form-border: #156d16;
 }
 
 #calculator-wrapper div, #calculator-wrapper span, #calculator-wrapper input {
   border-radius:  0 !important;
 }
 
 #calculator-report-header {
   color: var(--headline-text);
 }
 
 #calculator-report-header-bar {
   border: 1px solid var(--headline-text);
 }
 
 .btn-primary {
   background-color: var(--button-background-color) !important;
   color: var(--button-text-color) !important;
   border-color: var(--button-border-color) !important; 
   border-radius:  var(--button-radius) !important;
   font-size: var(--button-font-size) !important;
   font-style: italic;
 }
 
 .btn-primary:hover {
   background-color: var(--button-hover-background-color) !important;
   color: var(--button-hover-text-color) !important;
   border-color: var(--button-hover-border-color) !important;
 }
 
 .btn-primary.focus, .btn-primary:focus {
   background-color: var(--button-hover-background-color);
   color: var(--button-hover-text-color);
   border-color: var(--button-hover-border-color);
   box-shadow: none;
 }
 
 .btn-primary.active, .btn-primary:active,
 .btn-primary:not(:disabled):not(.disabled):active {
   background-color: var(--button-hover-background-color);
   color: var(--button-hover-text-color);
   border-color: var(--button-hover-border-color);
   box-shadow: none;
 }
 
 .btn-primary:not(:disabled):not(.disabled).active:focus, .btn-primary:not(:disabled):not(.disabled):active:focus, .show>.btn-primary.dropdown-toggle:focus {   
   box-shadow: none; 
 }
 
 .btn-collapse {
   border-radius:  var(--button-radius) !important;
 }
 
 .card {
   border-radius: 0 0 0.25rem 0.25rem;
 }
 
 .row {
   max-width: 100%; 
   margin: 0;
 }
 
 .cta-wrapper .btn-primary {
   background-color: var(--cta-button-background-color) !important;
   color: var(--cta-button-text-color) !important;
   border-color: var(--cta-button-border-color) !important; 
   border-radius:  var(--cta-button-radius) !important;
 }
 
 .cta-wrapper .btn-primary:hover {
   background-color: var(--cta-button-hover-background-color) !important;
   color: var(--cta-button-hover-text-color) !important;
   border-color: var(--cta-button-hover-border-color) !important;
 }
 
 .cta-wrapper .btn-primary.focus, .cta-wrapper .btn-primary:focus {
   background-color: var(--cta-button-hover-background-color);
   color: var(--cta-button-hover-text-color);
   border-color: var(--cta-button-hover-border-color);
 }
 
 .cta-wrapper .btn-primary.active, .btn-primary:active {
   background-color: var(--cta-button-hover-background-color);
   color: var(--cta-button-hover-text-color);
   border-color: var(--cta-button-hover-border-color);
 }
 
 .btn-primary.disabled, .btn-primary:disabled {
   background-color: var(--disabled-button) !important;
   border-color: var(--disabled-button) !important;
   opacity: 1 !important;
 }
 
 #amortization_schedule_chart th {
   background-color: var(--button-background-color) !important;
 }
 
 .form-control, .input-group-text {
   border: 1px solid var(--form-border);
 }
 
 .form-control.error {
   border-color: crimson;
 }
 
 label.error {
   color: crimson; 
 }
 
 @media screen and (max-width: 500px) {
   #calculator-wrapper > div {
     margin: 0; padding: 0;
   }
 }
 
 .btn-collapse {
   border-radius: var(--button-collapse-radius) !important; 
 }
 
 #emailform .form-group {
   margin-bottom: 10px;
 }
 @media screen and (min-width: 765px) and (max-width: 1024px) {
 #calculator-fields-panel + .row {
 display: grid;
 grid-template-columns: 1fr 35px 1fr;
         gap: 0.5rem;
 }
 #calculator-fields-panel + .row .col-3 { max-width: 100%;}
 #calculator-fields-panel + .row .text-center { padding: 0 !important; margin: 0 !important;}
 }