@import url('https://fonts.googleapis.com/css2?family=Open+Sans:wght@400;700&family=Oswald:wght@300&display=swap');
html, body {font-family: 'Open Sans', sans-serif; font-size: 15px; line-height: 1.5rem; background-color: #ffffff; }
h1, h2, h3, h4 { 
	font-family:Oswald, sans-serif;
	margin-bottom: 1rem;
	font-weight: bold;
}
h1, .h1 {
	font-size: 2rem ;
}
h2, .h2 {
	font-size: 1.75rem;
}
h3, .h3 {
	font-size: 1.5rem;
	margin-bottom: .75rem;
	
}
h4, .h4 {
	font-size: 1.125rem ;
	margin-bottom: .75rem;
	color: #a10000;
}
p { 
	margin:10px 0 20px 0;
}

ul	{	list-style-type:disc;	margin: 0 0 20px 20px; }
ol	{	margin: 0 0 20px 20px; }
a {
  position: relative;
  color: #003399;
  text-decoration: none;
  font-weight:bold;
}

a:hover {
  color: #026BB5;
  text-decoration: none;
}
a::before{
  content: "";
  position: absolute;
  width: 100%;
  height: 1px;
  bottom: 0;
  left: 0;
  background-color: #00A2DA;
  visibility: hidden;
  -webkit-transform: scaleX(0);
  transform: scaleX(0);
  -webkit-transition: all 0.3s ease-in-out 0s;
  transition: all 0.3s ease-in-out 0s;
}
a:hover:not(.btn)::before {
  /*visibility: visible;*/
  -webkit-transform: scaleX(1);
  transform: scaleX(1);
}
.bg-green {
	background-color:#679A01;
}
/*Forms Related*/
label {
    font-size: .85rem;
    font-weight: bold;
}

/*Forms Related End*/
#header	{
	padding:6px 0;
}
.logo { max-width: 280px; margin: 20px 0;   }
#header .fone	{ 
	color:#333333;
	font: bold 24px Oswald, sans-serif; 
	line-height:1.25em;
}
#header .fone-text	{ 
	font: bold 16px Oswald, sans-serif; 
}
.social-media {
	margin-bottom:6px;
}
.social-media img {
	width: 32px;
	height: auto;
}
.whatsappicon	{
	display: none;
}
.whatsapptext	{
	color:#666; font-size:18px;
}
ul.left-links	{
	padding:0;
	margin:0;
	list-style-type: none;
}
ul.left-links li	{
	background: url(../images/arrow-circle-blue.jpg) 0 2px no-repeat transparent;
	margin:0;
	padding:0 0 10px 20px;
}
/*Interest rates relate styles*/
.rates-table .rates-table-header{
	background-color: #ff9800;
	color: #ffffff;
}
.rates-table {
	margin-bottom: 3rem;
}
.rates-table .cola, .rates-table .colb, .rates-table .colc, .rates-table .cold{
	text-align: center;
	padding: .5rem 0;
	border-bottom: 1px solid #cccccc;
	margin-bottom: .25rem;
}
.rates-table .cola{
	text-align: left;
	padding-left: .5rem;
}
.rates_summary	{
	margin:10px 0;
	overflow:auto;
	text-align:left;
	padding:0;
}
.rates_header	{
	color: #990000;
	margin:0;
	text-align:center;
	margin-bottom:5px;
}

.rates_headings	{
	font-size:12px;
	font-weight: bold;
	border:1px solid #cccccc;
	background-color: #ffffff;
	width:100%;
}
.rates_headings	td {
	padding:4px 0;
}
.rate_details	{
	border:1px solid #cccccc;
	background-color: #ffffff;
	width:100%;
	margin-top:5px;
	font-size:12px;
}
td.rate_name { 
	color: #000000; 
	padding:4px 0 4px 5px; 
	width:60%;
}
td.rate_percent { 
	color: #000000; 
	padding:4px 0; 
	width: 20%;
	
}

td.rate_details span { font: 11px Verdana, Tahoma; color: #424544; }
.rate_change_notice { font: normal 8px Verdana, Tahoma; color: #3F4547; padding: 10px; line-height: 22px; text-transform: uppercase; }
.rate_change_notice a { background: url('../images/bullet_white.png') no-repeat scroll 0 50% transparent; color: #000; font: bold 12px Verdana,Tahoma; padding-bottom: 5px; padding-left: 24px; padding-top: 5px; text-transform: none; }

.rate_change_notice a:hover { color: #FFFF66; }
/* Mortgage Monthly Payment Calculator Roles*/
ul.calc_links	{
	padding:0;
	margin:0;
	list-style-type: none;
}
ul.calc_links li	{
	background:url(../images/gradient_bg.gif) left bottom repeat-x;
	border: 1px solid #cccccc;
	width: 40%;
    font-weight:bold;
    font-size : 16px;
    padding:10px;
    margin-bottom:10px;
}
#apr-calc table{
	width:50%; margin-bottom:20px;
}
#apr-calc .form_field{
	width:80%; margin-bottom:5px;
}
#calculator_box {
	background:url(gradient_bg.gif) left bottom repeat-x;
	border: 1px solid #cccccc;
	width: 60%;
    font-family: Arial, Helvetica, sans-serif;
    font-weight:bold;
    font-size : 12px;
    padding:10px;
    margin-bottom:10px;
}
.caption{
    font-family: Arial, Helvetica, sans-serif;
    font-weight:bold;
    margin:10px;
    font-size : 14px;
    color:#C64934;
}
#result {
	border: 1px solid #666666;
	width: 100%;
	background: #F3F3F3;
    font-family: Arial, Helvetica, sans-serif;
    font-weight:bold;
    font-size : 12px;
    margin-bottom:10px;
	padding:5px;
}
.resulttext	{
color:#000000; font-weight:bold;
}
.mtglink	{
	font: normal 10px verdana,sans-serif; color: #666666;
}
.mtglink a,.mtglink a:active,.mtglink a:visited{
	font: normal 10px verdana,sans-serif; color: #666666;
	text-decoration: none;
	display:inline;
	padding:0 4px;
}
.mtglink a:hover{
	font: normal 10px verdana,sans-serif; color: #464646;
	text-decoration:underline;
	display:inline;
	padding:0 4px;
	}*/
/* Amortization Calculator Roles*/

#amortization_calculator div.error  { margin: 2em 0; color: red; font-weight: bold; }
	
#amortization_calculator table  { width: 90%; margin: .1em 0 2em 0; border:1px solid #cccccc;}
#amortization_calculator th, 
#amortization_calculator td     { padding: .5em; vertical-align: top; }
#amortization_calculator th     {  text-align: right; font-weight: normal; width: 35%; }

#amortization_calculator table tr.even { background-color: #FFFFFF; }
#amortization_calculator table tr.odd  { background-color: #EFEFEF; }

/* TOTAL PAYMENT BOX */
#amortization_calculator div.total            {  width: 88%; padding: .5em;font-weight: normal; background-color: #ff9; border:1px solid #cccccc;}
#amortization_calculator div.total b     {  font-size: 1.4em; }
#amortization_calculator div.total a:link, 
#amortization_calculator div.total a:visited  { font-size: .84em; }


/* INPUT */
#amortization_calculator table.amortization_form p.calculation_result  { padding-top: 0; margin-top: .5em; font-size: .84em; line-height: 1.4em; color: #666; }

/* Calculation_Result */
#amortization_calculator table.calculation_result td      { font-weight: bold; }
#amortization_calculator table.calculation_result p.calculation_result  { padding-top: 0; margin-top: 0; color: #333; font-weight: normal; border-top:1px solid #cccccc;}
#amortization_calculator table.calculation_result tr.pmi  { background-color: #ffe; }
#amortization_calculator table.calculation_result tr.tax  { background:url(gradient_bg.gif) left bottom repeat-x; }

/* SUM */
#amortization_calculator table.sum              { margin: 0 auto; width: auto; border-collapse: collapse; }
#amortization_calculator table.sum td           { font-weight: normal; white-space: nowrap; border: 1px solid #999; border-collapse: collapse; text-align: right; }
#amortization_calculator table.sum tr.total td  { font-weight: bold; background-color: #ff9; }

/* CALCULATIONS */
#amortization_calculator div.calculation         { padding: .5em; }
#amortization_calculator div.calculation h3      { font-family: Helvetica,arial,sans-serif; font-weight: normal; font-size: 1.6em; padding-bottom: 10px; margin-bottom: 0; }
#amortization_calculator div.calculation p       { margin-left: 3.5em; }
#amortization_calculator div.calculation .result { padding: .2em; background-color: #ff9; border: 1px solid #cccccc;}

/* AMORTIZATION */
#amortization_calculator table.amortization              { border-collapse: collapse; }
#amortization_calculator table.amortization td           { text-align: right; background-color: #eee; border: 1px solid #999; border-collapse: collapse; }
#amortization_calculator table.amortization tr.legend td { font-weight: bold; background-color: #666; color: #fff; text-align: right; }

#amortization_calculator table.amortization tr.year_summary td { text-align: left; background-color: #ffc; margin-bottom: 2em; }
#amortization_calculator table.amortization tr.year_summary td p { margin: .2em 0 0 4em; }
#amortization_calculator table.amortization tr.year_summary td .coaching { font-size: .84em; color: #666; }

#amortization_calculator table.amortization tr.total_summary td { font-family: Helvetica,arial,sans-serif; text-align: left; background-color: #ffffff; font-size: 1.84em; line-height: 1.2em; }
#amortization_calculator table.amortization tr.total_summary .total_spent_over_term { font-size: 1.8em; display: block; line-height: 1.2em; text-align: center; }
/*Footer Styles TOP*/
#footer-top {
	text-align: left; 
	margin: 30px 0 0 0;
	padding:40px 0;
	color: #ffffff;
	background-color: #000000;
}
#footer-top .row {
	padding:20px;
}
#footer-top .col-md-4{
	padding:10px 30px;
}
#footer-top p{
	font-size: 14px;
}
#footer-top h2,#footer-top table h2 {
	font: bold 18px Oswald, sans-serif;
	margin:0;
	padding:0;
	text-align: left; 
}

#footer-top ul	{	list-style-type:none;	margin: 10px 0 20px 0; padding:0;  }
#footer-top	li { border-bottom: 1px dashed #444; margin-bottom:13px; padding-bottom:4px; }
#footer-top	li a	{ color:#ffffff; font-weight:normal; text-decoration:none; }

/*Footer Styles Bottom*/
#footer	{ background-color: #679A01; padding: 20px 0; }
#footer .container	{ color: #ffffff; }
#footer .container h3	{ padding-bottom: 5px; }
.footer-menu{
	list-style-type:none;
	margin:0;
	margin-bottom:10px;
	padding:0;
}
.footer-menu li{
	font: bold 12px ; color: #ffffff;
	text-decoration: none;
	display:inline;
	border-right:1px solid #cccccc;
	padding:0 10px;
}

.footer-menu li a,.footer-menu li a:active,.footer-menu li a:visited{
	font: normal 12px arial, helvetica, sans-serif; color: #ffffff;
	text-decoration: none;
	display:inline;
	
}
.footer-menu li a:hover{
	text-decoration:underline;
}
.footer-menu li.first {display:inline;padding:0 10px 0 0;}
.footer-menu li.last {display:inline;border-right:0px;}

.footer-copyright {color: #efefef; font-size: 11px ; margin-bottom:5px;  }

.footer-copyright a,.footer-copyright a:active,.footer-copyright a:visited{
	color: #ffffff;
	text-decoration: none;
	font-size: 12px;
	
}

/* iReadySites Link Styles*/
#footerlink {
	text-align: right; 
	margin:20px 0;
	padding:0;
	vertical-align:baseline;
}
#footerlink .container{
	text-align: right; 
}
#footerlink a,#footerlink a:active,#footerlink a:visited{
	font-weight: bold;
	font-size: 14px; 
	color: #0080C0;
	text-decoration: none;
	display:inline;
}
#footerlink a:hover{
	text-decoration:underline;
}

@media (max-width: 768px) {
	#footer {
		text-align:center;
	}
	.hc2 .hc2row1{
		text-align: center;
	}
	.hc2 .hc2row1 img{
		max-width: 50% !important;
		text-align: center;
	}
	
	
}