@charset 'UTF-8';
@font-face {
font-family: "DMSans-Regular";
src: url(//financehub.trustmat.com/wp-content/themes/financehub/fonts/DMSans-Regular.eot);
src: url(//financehub.trustmat.com/wp-content/themes/financehub/fonts/DMSans-Regular.eot?#iefix) format("embedded-opentype"),
url(//financehub.trustmat.com/wp-content/themes/financehub/fonts/DMSans-Regular.woff2) format("woff2"),
url(//financehub.trustmat.com/wp-content/themes/financehub/fonts/DMSans-Regular.woff) format("woff"),
url(//financehub.trustmat.com/wp-content/themes/financehub/fonts/DMSans-Regular.ttf) format("truetype"),
url(//financehub.trustmat.com/wp-content/themes/financehub/fonts/DMSans-Regular.svg#DMSans-Regular) format("svg");
font-weight: normal;
font-style: normal;
font-display: swap;
}
@font-face {
font-family: "DMSans-Medium";
src: url(//financehub.trustmat.com/wp-content/themes/financehub/fonts/DMSans-Medium.eot);
src: url(//financehub.trustmat.com/wp-content/themes/financehub/fonts/DMSans-Medium.eot?#iefix) format("embedded-opentype"),
url(//financehub.trustmat.com/wp-content/themes/financehub/fonts/DMSans-Medium.woff2) format("woff2"),
url(//financehub.trustmat.com/wp-content/themes/financehub/fonts/DMSans-Medium.woff) format("woff"),
url(//financehub.trustmat.com/wp-content/themes/financehub/fonts/DMSans-Medium.ttf) format("truetype"),
url(//financehub.trustmat.com/wp-content/themes/financehub/fonts/DMSans-Medium.svg#DMSans-Medium) format("svg");
font-weight: 500;
font-style: normal;
font-display: swap;
}
@font-face {
font-family: "DMSans-Bold";
src: url(//financehub.trustmat.com/wp-content/themes/financehub/fonts/DMSans-Bold.eot);
src: url(//financehub.trustmat.com/wp-content/themes/financehub/fonts/DMSans-Bold.eot?#iefix) format("embedded-opentype"),
url(//financehub.trustmat.com/wp-content/themes/financehub/fonts/DMSans-Bold.woff2) format("woff2"),
url(//financehub.trustmat.com/wp-content/themes/financehub/fonts/DMSans-Bold.woff) format("woff"),
url(//financehub.trustmat.com/wp-content/themes/financehub/fonts/DMSans-Bold.ttf) format("truetype"),
url(//financehub.trustmat.com/wp-content/themes/financehub/fonts/DMSans-Bold.svg#DMSans-Bold) format("svg");
font-weight: bold;
font-style: normal;
font-display: swap;
}
@font-face {
font-family: "DMSans-Light";
src: url(//financehub.trustmat.com/wp-content/themes/financehub/fonts/DMSans-Light.eot);
src: url(//financehub.trustmat.com/wp-content/themes/financehub/fonts/DMSans-Light.eot?#iefix) format("embedded-opentype"),
url(//financehub.trustmat.com/wp-content/themes/financehub/fonts/DMSans-Light.woff2) format("woff2"),
url(//financehub.trustmat.com/wp-content/themes/financehub/fonts/DMSans-Light.woff) format("woff"),
url(//financehub.trustmat.com/wp-content/themes/financehub/fonts/DMSans-Light.ttf) format("truetype"),
url(//financehub.trustmat.com/wp-content/themes/financehub/fonts/DMSans-Light.svg#DMSans-Light) format("svg");
font-weight: 300;
font-style: normal;
font-display: swap;
}
@font-face {
font-family: "DMSans-Italic";
src: url(//financehub.trustmat.com/wp-content/themes/financehub/fonts/DMSans-Italic.eot);
src: url(//financehub.trustmat.com/wp-content/themes/financehub/fonts/DMSans-Italic.eot?#iefix) format("embedded-opentype"),
url(//financehub.trustmat.com/wp-content/themes/financehub/fonts/DMSans-Italic.woff2) format("woff2"),
url(//financehub.trustmat.com/wp-content/themes/financehub/fonts/DMSans-Italic.woff) format("woff"),
url(//financehub.trustmat.com/wp-content/themes/financehub/fonts/DMSans-Italic.ttf) format("truetype"),
url(//financehub.trustmat.com/wp-content/themes/financehub/fonts/DMSans-Italic.svg#DMSans-Italic) format("svg");
font-weight: normal;
font-style: italic;
font-display: swap;
}
@font-face {
font-family: "DMSans-SemiBold";
src: url(//financehub.trustmat.com/wp-content/themes/financehub/fonts/DMSans-SemiBold.eot);
src: url(//financehub.trustmat.com/wp-content/themes/financehub/fonts/DMSans-SemiBold.eot?#iefix) format("embedded-opentype"),
url(//financehub.trustmat.com/wp-content/themes/financehub/fonts/DMSans-SemiBold.woff2) format("woff2"),
url(//financehub.trustmat.com/wp-content/themes/financehub/fonts/DMSans-SemiBold.woff) format("woff"),
url(//financehub.trustmat.com/wp-content/themes/financehub/fonts/DMSans-SemiBold.ttf) format("truetype"),
url(//financehub.trustmat.com/wp-content/themes/financehub/fonts/DMSans-SemiBold.svg#DMSans-SemiBold) format("svg");
font-weight: 600;
font-style: normal;
font-display: swap;
}
@font-face {
font-family: "Poppins-Regular";
src: url(//financehub.trustmat.com/wp-content/themes/financehub/fonts/Poppins-Regular.eot);
src: url(//financehub.trustmat.com/wp-content/themes/financehub/fonts/Poppins-Regular.eot?#iefix) format("embedded-opentype"),
url(//financehub.trustmat.com/wp-content/themes/financehub/fonts/Poppins-Regular.woff2) format("woff2"),
url(//financehub.trustmat.com/wp-content/themes/financehub/fonts/Poppins-Regular.woff) format("woff"),
url(//financehub.trustmat.com/wp-content/themes/financehub/fonts/Poppins-Regular.ttf) format("truetype"),
url(//financehub.trustmat.com/wp-content/themes/financehub/fonts/Poppins-Regular.svg#Poppins-Regular) format("svg");
font-weight: normal;
font-style: normal;
font-display: swap;
}
@font-face {
font-family: "Poppins-SemiBold";
src: url(//financehub.trustmat.com/wp-content/themes/financehub/fonts/Poppins-SemiBold.eot);
src: url(//financehub.trustmat.com/wp-content/themes/financehub/fonts/Poppins-SemiBold.eot?#iefix) format("embedded-opentype"),
url(//financehub.trustmat.com/wp-content/themes/financehub/fonts/Poppins-SemiBold.woff2) format("woff2"),
url(//financehub.trustmat.com/wp-content/themes/financehub/fonts/Poppins-SemiBold.woff) format("woff"),
url(//financehub.trustmat.com/wp-content/themes/financehub/fonts/Poppins-SemiBold.ttf) format("truetype"),
url(//financehub.trustmat.com/wp-content/themes/financehub/fonts/Poppins-SemiBold.svg#Poppins-SemiBold) format("svg");
font-weight: 600;
font-style: normal;
font-display: swap;
}  * {
margin: 0;
padding: 0;
box-sizing: border-box;
}
body {
font-family: "DMSans-Regular";
font-size: 16px;
overflow-x: hidden;
position: relative;
}
.container {
max-width: 1440px;
margin: 0 auto;
width: 100%;
}
ul {
list-style: none;
padding: 0;
margin: 0;
}
a {
text-decoration: none;
color: #1f2753;
}
.primary-btn,
.secondary-btn {
color: #fff;
text-align: center;
z-index: 1;
padding-inline: 15px;
font-family: "Poppins-SemiBold";
font-size: 16px;
font-style: normal;
line-height: 28px;
border-radius: 6px;
text-transform: uppercase;
background: #bb8922;
min-width: 154px;
height: 50px;
line-height: 50px;
display: inline-block;
transition: 0.5s all;
position: relative;
overflow: hidden;
cursor: pointer;
}
.primary-btn:hover {
color: #fff;
transition: 0.5s all;
}
.secondary-btn {
background-color: #1f2753;
position: relative;
overflow: hidden;
}
.secondary-btn::before {
position: absolute;
content: "";
background-color: #bb8922;
height: 50px;
left: 0;
z-index: -1;
width: 100%;
transform: translateX(-100%);
transition: 0.5s all;
}
.primary-btn::before {
position: absolute;
content: "";
background-color: #1f2753;
height: 50px;
left: 0;
z-index: -1;
width: 100%;
transform: translateX(-100%);
transition: 0.5s all;
}
.secondary-btn:hover:before,
.primary-btn:hover:before {
transform: translateX(0px);
}
.main-title {
color: #1f2753;
font-family: "DMSans-Bold";
font-size: 45px;
font-style: normal;
line-height: normal;
text-transform: capitalize;
}
.main-title span {
color: #bb8922;
}
.main-title b {
display: inline-block;
}
img {
max-width: 100%;
border-radius: 6px;
}  .top-bar {
background: #f2f3f5;
padding-block: 8px;
padding-inline: 15px;
display: none;
}
.top-bar .row,
.main-header .row {
display: flex;
align-items: center;
justify-content: space-between;
}
.top-bar .social-icon-area ul,
.top-bar .social-icon-area {
display: flex;
align-items: center;
gap: 12px;
}
.login-text p {
color: #1f2753;
font-size: 16px;
}
.top-bar .social-icon-area ul {
padding-right: 20px;
margin-right: 8px;
border-right: 1px solid #000;
gap: 18px;
}
body:has(.banner-section) .top-bar .social-icon-area ul {
border-right: 1px solid #fff;
}
.top-bar .social-icon-area ul li a {
color: #000000;
display: flex;
}
.top-bar .social-icon-area ul li:first-child a img {
width: 7px;
}
.email-area ul {
display: flex;
align-items: center;
gap: 50px;
}
.main-menu .menu-header-menu-container > ul {
display: flex;
align-items: center;
gap: 20px;
}
.email-area a:hover {
color: #d09a29;
}
p {
font-family: "DMSans-Regular";
color: #757575;
font-size: 20px;
font-style: normal;
line-height: 26px;
}
.white-icon {
display: none;
} .white-logo,
body:has(.banner-section) .back-logo,
body:has(.banner-section) .main-header.fixed .white-logo,
body:has(.banner-section) .black-icon {
display: none;
}
body:has(.banner-section) .white-logo,
body:has(.banner-section) .main-header.fixed .back-logo,
body:has(.banner-section) .white-icon {
display: block;
}  .main-header {
position: relative;
transition: all 0.3s;
padding: 0 15px;
background-color: #fff;
}
.main-header .row {
padding: 13px 40px;
}
.main-header .site-logo {
max-width: 210px;
}
.main-menu ul li a {
font-family: "Poppins-Regular";
font-size: 20px;
text-transform: capitalize;
}
.main-menu ul li a:hover,
.main-menu ul li a.active,
body:has(.banner-section) .main-menu ul li a:hover,
body:has(.banner-section) .main-menu ul li a.active,
body:has(.banner-section) .main-header.fixed ul li a:hover,
body:has(.banner-section) .main-header.fixed ul li a {
color: #d09a29;
transition: 0.5s all;
}
.main-header.fixed,
body:has(.banner-section) .main-header.fixed {
position: fixed;
background-color: #fff;
z-index: 999;
right: 0;
left: 0;
top: 0px;
}
.main-header.fixed {
margin-top: 0;
}
body:has(.banner-section) .main-header {
position: absolute;
top: 15px;
z-index: 6;
background: transparent;
left: 0;
right: 0;
}
body:has(.banner-section) .top-bar {
position: absolute;
left: 0;
right: 0;
background: transparent;
z-index: 1;
}
body:has(.banner-section) .main-menu ul li a,
body:has(.banner-section) .email-area a {
color: #fff;
}
.top-bar.fixed {
position: fixed;
left: 0;
right: 0;
z-index: 999;
background: #f2f3f5;
}
.top-bar.fixed .black-icon {
display: block;
}
.top-bar.fixed .white-icon {
display: none;
}
body:has(.banner-section) .top-bar.fixed .main-menu ul li a,
body:has(.banner-section) .top-bar.fixed .email-area a {
color: #1f2753;
}
body:has(.banner-section) .top-bar.fixed .main-menu ul li a:hover,
body:has(.banner-section) .top-bar.fixed .email-area a:hover {
color: #d09a29;
}
body:has(.banner-section) .top-bar.fixed .social-icon-area ul {
border-right: 1px solid #000;
}  .banner-section {
background-size: cover !important;
background-position: center center !important;
padding: 275px 0 55px 0;
position: relative;
padding-inline: 15px;
min-height: 70vh;
}
.banner-section.short-banner {
padding: 200px 180px 60px;
min-height: 74vh;
}
.home .banner-section,
.banner-section.large-banner {
min-height: 100vh;
padding: 275px 0 0 0;
}
.banner-section h1 {
font-family: "DMSans-Bold";
font-size: 90px;
line-height: 1.2;
color: #fff;
}
.banner-section p {
font-family: "DMSans-Regular";
font-size: 18px;
color: #fff;
padding-block: 15px 50px;
}
.banner-section::before {
position: absolute;
content: "";
left: 0;
top: 0;
bottom: 0;
background: linear-gradient(90deg, #000 -9.69%, rgba(196, 196, 196, 0) 100%);
width: 100%;
height: 100%;
}
.banner-section .banner-text {
position: relative;
max-width: 600px;
} .banner-section.banner-video video {
position: absolute;
left: 0;
top: 0;
right: 0;
bottom: 0;
height: 100%;
width: 100%;
-o-object-fit: cover;
object-fit: cover;
-o-object-position: center center;
object-position: center center;
z-index: -1;
}   .why-us-section {
position: relative;
padding-block: 80px 70px;
padding-inline: 15px;
}
.why-us-section .row {
display: flex;
align-items: center;
flex-wrap: wrap;
}
.why-us-section .why-us-text,
.why-us-section .why-us-img-box,
.check-rate-section .check-rate-text,
.check-rate-section .check-out-mob-box,
.mortgage-calculator-section .mortgage-img-section,
.mortgage-calculator-section .mortgage-text-section {
width: 50%;
position: relative;
}
.why-us-section .why-us-text h3 {
font-family: "DMSans-Medium";
padding-block: 30px 20px;
font-size: 30px;
color: #0b111d;
}
.why-us-section .why-us-text p {
padding: 0 30px 15px 0;
text-align: justify;
}
.why-us-section .why-us-img-box .small-img img {
border: 15px solid #fff;
margin-top: -150px;
position: relative;
height: 296px;
}
.why-us-section .why-us-img-box picture,
.help-photo-wrapper .gallery-box picture {
display: inline-block;
}
.why-us-section .why-us-img-box .big-img {
position: relative;
height: 469px;
}
.why-us-section .why-us-img-box:after {
position: absolute;
content: "";
border-bottom: 512px solid #ddc490 !important;
border-left: 312px solid transparent !important;
border-right: 0 solid transparent !important;
width: 250px;
right: 0;
top: 0;
z-index: -1;
}
.why-us-section .why-us-img-box::before {
position: absolute;
content: "";
left: -11px;
top: -13px;
background: url(//financehub.trustmat.com/wp-content/uploads/2023/12/dott-shape.png) no-repeat;
width: 176px;
height: 87px;
}
.why-us-section .multipal-arrow-img {
position: absolute;
right: 130px;
bottom: -50px;
}
.why-us-section .left-side-shape,
.mortgage-loan-info-section .left-side-shape {
top: auto;
transform: none;
}
.mortgage-loan-info-section .right-side-shape {
top: 0;
transform: none;
}
.why-us-section .row {
gap: 34px;
align-items: start;
}
.why-us-section .why-us-text {
width: calc(50% - 17px);
}
.why-us-section .why-us-img-box {
width: calc(50% - 17px);
padding: 20px;
}  .how-can-we-help-section {
position: relative;
text-align: center;
padding-bottom: 80px;
}
.how-can-we-help-section p {
padding-block: 16px 50px;
max-width: 940px;
margin: auto;
}
.help-photo-wrapper {
display: flex;
flex-wrap: wrap;
align-items: center;
justify-content: center;
}
.help-photo-wrapper .gallery-box {
width: 25%;
padding: 0 15px;
position: relative;
margin-bottom: 15px;
}
.help-photo-wrapper .gallery-box img {
width: 100%;
}
.help-photo-wrapper .gallery-box h3 {
font-family: "DMSans-Medium";
position: absolute;
left: 40px;
bottom: 40px;
color: #fff;
font-size: 20px;
font-weight: 500;
z-index: 1;
text-align: left;
}
.help-photo-wrapper .gallery-box picture {
position: relative;
overflow: hidden;
}
.help-photo-wrapper .gallery-box picture a {
display: inline-block;
position: relative;
}
.help-photo-wrapper .gallery-box a::after {
position: absolute;
content: "";
bottom: 5px;
left: 0;
right: 0;
background: linear-gradient(
177deg,
rgba(255, 255, 255, 0) 19.49%,
#1f2753 115.52%
);
width: 100%;
height: 139px;
}
.help-photo-wrapper .gallery-box picture a:before {
position: absolute;
content: "";
top: 0;
bottom: 5px;
left: 0;
right: 0;
background-color: rgba(0, 0, 0, 0.5);
width: 100%;
display: none;
}
.help-photo-wrapper .gallery-box picture a:hover:before {
display: block;
}
.how-can-we-help-section .right-side-shape {
transform: none;
}  .check-rate-section {
background-color: #fafafa;
position: relative;
width: 100%;
padding-block: 60px;
padding-inline: 15px;
}
.check-rate-section .row,
.mortgage-calculator-section .row,
.our-customers-section .row {
display: flex;
align-items: center;
}
.check-rate-section p {
padding-block: 16px 50px;
padding-right: 50px;
}
.check-rate-section .check-out-mob-box {
height: 788px;
display: flex;
align-items: center;
justify-content: center;
}
.check-rate-section .check-out-mob-box::before {
position: absolute;
content: "";
background: url(//financehub.trustmat.com/wp-content/uploads/2023/12/logo-back-img.png) no-repeat;
width: 100%;
height: 788px;
left: 0;
top: 0;
right: 0;
bottom: 0;
}  .mortgage-calculator-section {
position: relative;
width: 100%;
padding-block: 80px;
padding-inline: 15px;
}
.mortgage-calculator-section p {
padding-block: 20px 30px;
padding-right: 230px;
}
.mortgage-calculator-section ul {
padding-bottom: 35px;
}
.mortgage-calculator-section ul li {
font-family: "DMSans-Regular";
color: #757575;
font-size: 20px;
font-style: normal;
line-height: 26px;
padding-bottom: 15px;
position: relative;
padding-left: 32px;
}
.mortgage-calculator-section ul li::before {
position: absolute;
content: "";
left: 0;
background: url(//financehub.trustmat.com/wp-content/uploads/2023/12/right-icon.png) no-repeat;
background-size: 18px;
width: 18px;
height: 18px;
top: 4px;
}
.mortgage-calculator-section .mortgage-img-section picture {
width: 581px;
display: inline-block;
position: relative;
}
.mortgage-calculator-section .mortgage-img-section picture::before {
position: absolute;
content: "";
left: 0;
background: url(//financehub.trustmat.com/wp-content/uploads/2023/12/dash-img.png) no-repeat;
background-size: 136px;
width: 136px;
height: 241px;
top: 50%;
left: -50px;
z-index: -1;
transform: translateY(-50%);
}
.mortgage-calculator-section .right-side-shape,
.left-side-shape,
.right-side-shape {
position: absolute;
right: 0;
bottom: 0;
top: 50%;
transform: translateY(-50%);
height: 331px;
}
.mortgage-calculator-section .row {
position: relative;
}
.mortgage-calculator-section .row::before {
position: absolute;
content: "";
top: -70px;
left: 280px;
right: 0;
background: url(//financehub.trustmat.com/wp-content/uploads/2023/12/border-shape.png) no-repeat;
background-size: 1215px;
height: 785px;
}  .our-customers-section {
background-color: #f8f8f8f8;
padding-block: 95px 130px;
}
.our-customers-section h2 {
padding-bottom: 50px;
}
.our-customers-section .our-customer-title {
width: 100%;
margin-left: auto;
max-width: 400px;
position: relative;
}
.our-customers-section .our-customer-title picture {
position: absolute;
top: -100px;
right: 0;
}
.our-customers-section .customer-slider {
width: 70%;
}
.our-customers-section {
position: relative;
width: 100%;
display: none;
}
.our-customers-section .slick-track {
gap: 20px;
display: flex;
}
.our-customers-section .slick-slide {
background-color: #fff;
padding: 40px;
}
.our-customers-section .slick-slide h4 {
padding-block: 25px 5px;
}
.our-customers-section .slick-slide p {
color: #1e1e1e;
font-size: 18px;
font-style: italic;
padding-top: 20px;
}
.our-customers-section .slick-next::before,
.our-customers-section .slick-prev::after {
position: absolute;
content: "";
right: -10px;
background-image: url(//financehub.trustmat.com/wp-content/uploads/2023/12/slick-arrow.png);
background-repeat: no-repeat;
background-position: top left;
background-size: 28px;
width: 28px;
height: 19px;
}
.our-customers-section .slick-prev::after {
transform: rotate(180deg);
bottom: -3px;
left: -70px;
}
.our-customers-section .slick-prev.slick-disabled::after {
opacity: 0.25;
}
.our-customers-section .slick-next:after {
position: absolute;
content: "";
left: -20px;
width: 2px;
height: 25px;
background-color: #ccc;
top: 4px;
}
.our-customers-section .slick-prev,
.our-customers-section .slick-next {
left: 50%;
right: 150px;
position: absolute;
top: auto;
bottom: -60px;
font-size: 0;
background: #f8f8f8;
border: 0;
cursor: pointer;
}  .brand-logo-section {
position: relative;
width: 100%;
padding-block: 50px 50px;
padding-inline: 15px;
}
.brand-logo-section .slick-track {
display: flex;
align-items: center;
}
.brand-logo-section .slick-track picture {
display: flex;
justify-content: center;
}
.brand-logo-section .slick-slide img {
max-height: 54px;
max-width: 65px;
object-fit: contain;
}  .meet-our-team-section {
position: relative;
width: 100%;
text-align: center;
padding-bottom: 80px;
background: linear-gradient(
177deg,
rgba(255, 255, 255, 0.26) 2.41%,
rgba(10, 16, 47, 0.1) 293.13%
);
overflow: hidden;
padding-inline: 15px;
}
.meet-our-team-section p {
padding-block: 13px 54px;
}
.meet-our-team-section .our-team-slider .slick-slide {
background: #ffffff;
padding: 0 15px;
}
.meet-our-team-section .our-team-slider .slick-slide:hover ul {
border-color: #bb8922;
}
.meet-our-team-section .our-team-slider .slick-slide h3 {
font-family: "DMSans-Medium";
color: #000;
text-align: center;
font-size: 24px;
font-style: normal;
font-weight: 500;
line-height: 30px;
text-transform: capitalize;
}
.meet-our-team-section .our-team-slider .slick-slide p {
font-family: "DMSans-Regular";
font-size: 19px;
padding-block: 8px 20px;
}
.meet-our-team-section .our-team-slider .slick-slide picture img {
width: 100%;
margin-bottom: 17px;
filter: grayscale(1);
transition: 0.5s all;
height: 250px;
}
.meet-our-team-section .our-team-slider .slick-slide:hover picture img {
filter: inherit;
transition: 0.5s all;
}
.meet-our-team-section .our-team-slider .slick-slide ul {
display: flex;
align-items: center;
justify-content: center;
gap: 12px;
padding-bottom: 26px;
border-bottom: 4px solid #1f2753;
}
.meet-our-team-section .our-team-slider .slick-slide ul li a {
width: 28px;
height: 28px;
background: #ececec;
border-radius: 100px;
line-height: 28px;
display: inline-block;
}
.meet-our-team-section .our-team-slider .slick-slide ul li a svg {
height: 28px;
}
.meet-our-team-section .our-team-slider .slick-slide ul li a:hover {
background-color: #bb8922;
}
.meet-our-team-section .our-team-slider .slick-slide ul li a:hover svg path {
fill: #fff;
}
.meet-our-team-section .our-team-slider .slick-slide:first-child {
padding-left: 0;
}
.meet-our-team-section .our-team-slider .slick-slide:last-child {
padding-right: 0;
}
.meet-our-team-section .slick-track {
display: flex;
}
.left-side-shape {
right: auto;
left: 0;
} .meet-our-team-section .our-team-slider.without-slider-section {
display: flex;
flex-wrap: wrap;
gap: 45px;
justify-content: space-between;
}
.meet-our-team-section
.our-team-slider.without-slider-section
.awsome-team-block {
width: calc(25% - 34px);
background: #ffffff;
}
.meet-our-team-section
.our-team-slider.without-slider-section
.awsome-team-block
h3 {
font-family: "DMSans-Medium";
color: #000;
text-align: center;
font-size: 24px;
font-style: normal;
font-weight: 500;
line-height: 30px;
text-transform: capitalize;
}
.meet-our-team-section
.our-team-slider.without-slider-section
.awsome-team-block
p {
font-family: "DMSans-Regular";
font-size: 19px;
padding-block: 8px 20px;
}
.meet-our-team-section
.our-team-slider.without-slider-section
.awsome-team-block
picture
img {
width: 100%;
margin-bottom: 17px;
filter: grayscale(1);
transition: 0.5s all;
max-height: 307px;
}
.meet-our-team-section
.our-team-slider.without-slider-section
.awsome-team-block
ul {
display: flex;
align-items: center;
justify-content: center;
gap: 12px;
padding-bottom: 26px;
border-bottom: 4px solid #1f2753;
}
.meet-our-team-section
.our-team-slider.without-slider-section
.awsome-team-block
ul
li
a:hover
svg
path {
fill: #fff;
}
.meet-our-team-section
.our-team-slider.without-slider-section
.awsome-team-block:first-child {
padding-left: 0;
}
.meet-our-team-section
.our-team-slider.without-slider-section
.awsome-team-block:last-child {
padding-right: 0;
}
.meet-our-team-section
.our-team-slider.without-slider-section
.awsome-team-block:hover
picture
img {
filter: inherit;
transition: 0.5s all;
}
.meet-our-team-section
.our-team-slider.without-slider-section
.awsome-team-block:hover
ul {
border-color: #bb8922;
}
.meet-our-team-section
.our-team-slider.without-slider-section
.awsome-team-block
> a {
width: 326px;
display: inline-block;
height: 297px;
}
.meet-our-team-section
.our-team-slider.without-slider-section
.awsome-team-block
a
img {
width: 100%;
height: 100%;
object-fit: cover;
} .subscribe-section {
position: relative;
width: 100%;
padding-block: 40px;
background-size: cover !important;
padding-inline: 15px;
z-index: 1;
}
.subscribe-section h2 {
color: #fff;
font-family: "DMSans-Bold";
font-size: 36px;
font-style: normal;
font-weight: 700;
line-height: normal;
text-transform: capitalize;
position: relative;
}
.subscribe-section .subscribe-text {
width: 50%;
}
.subscribe-section::before {
position: absolute;
content: "";
top: 0;
bottom: 0;
left: 0;
right: 0;
background-color: rgba(0, 0, 0, 0.5);
width: 100%;
height: 100%;
z-index: -1;
}  .inner-page-banner-section { padding-block: 30px;
position: relative;
padding-inline: 15px;
background-color: #1f2753;
}
.inner-page-banner-section h1,
.inner-page-banner-section h1 span {
color: #ffffff;
font-family: "DMSans-Bold";
text-align: center;
font-size: 48px;
font-style: normal;
font-weight: 700;
line-height: normal;
text-transform: capitalize;
padding-bottom: 6px;
position: relative;
}
.inner-page-banner-section h1 span {
color: #d09a29;
}
.inner-page-banner-section ul {
display: flex;
align-items: center;
}
.inner-page-banner-section ul li a,
.inner-page-banner-section ul li span {
color: #fff;
font-family: "DMSans-Medium";
font-size: 16px;
font-style: normal;
font-weight: 500;
line-height: normal;
text-transform: capitalize;
position: relative;
padding: 0 3px;
}
.inner-page-banner-section::before {
position: absolute;
content: "";
display: none;
left: 0;
top: 0;
bottom: 0;
background: linear-gradient(90deg, #1f2753 0%, rgba(0, 0, 0, 0) 82.08%);
width: 100%;
height: 100%;
}  .trust-accountant-section {
position: relative;
width: 100%;
padding-block: 80px;
}
.trust-accountant-section h2 {
color: #000;
font-family: "DMSans-Bold";
font-size: 45px;
font-style: normal;
font-weight: 700;
line-height: normal;
text-transform: capitalize;
padding-bottom: 18px;
}
.trust-accountant-section .trust-accountant-top-img {
width: 50%;
position: relative;
padding: 0 15px;
}
.trust-accountant-section p {
padding-bottom: 18px;
}
.trust-accountant-top-img picture {
display: inline-block;
max-width: 635px;
overflow: hidden;
}
.trust-accountant-top-img .cross-img {
position: absolute;
top: -38px;
z-index: -1;
left: -30px;
width: 245px;
}
.trust-accountant-top-img .v-line-img {
position: absolute;
z-index: -1;
right: -120px;
bottom: -15px;
width: 371px;
}
.trust-accountant-section .row {
position: relative;
width: 100%;
display: flex;
align-items: center;
flex-wrap: wrap;
}
.trust-accountant-section .experience-box {
width: 19%;
border: 2px solid #bb8922;
padding: 30px 15px;
transform: scale(0.8);
height: 183px;
margin-left: 47px;
}
.trust-accountant-section .row + .row {
display: flex;
flex-wrap: wrap;
align-items: center;
padding-top: 10px;
gap: 45px;
}
.trust-accountant-section .experience-box p {
font-family: "DMSans-Medium";
font-size: 15.793px;
font-style: normal;
font-weight: 500;
line-height: 86.7%;
color: #0b111d;
}
.trust-accountant-section .experience-box p span {
color: #bb8922;
font-family: "DMSans-Bold";
font-size: 32.303px;
font-style: normal;
font-weight: 700;
line-height: normal;
text-transform: capitalize;
padding-right: 6px;
}
.trust-accountant-section .experience-box picture {
display: inline-block;
max-width: 130px;
}
.trust-accountant-section ul li {
font-family: "DMSans-Regular";
color: #757575;
font-size: 19px;
font-style: normal;
line-height: 26px;
padding-bottom: 16px;
position: relative;
padding-left: 32px;
}
.trust-accountant-section ul li::before {
position: absolute;
content: "";
left: 0;
width: 14px;
height: 14px;
border: 2px solid #bb8922;
border-radius: 100px;
top: 5px;
}
.trust-accountant-section ul li::after {
position: absolute;
content: "";
width: 8px;
height: 8px;
background-color: #bb8922;
border-radius: 100px;
top: 10px;
left: 5px;
}
.trust-accountant-section
.container:hover
.trust-accountant-top-img
.top-big-img
img,
.trust-accountant-section .container:hover .trust-bottom-box img {
transform: scale(1.2);
transition: 0.5s all;
}
.trust-accountant-section .container .trust-accountant-top-img .top-big-img img,
.trust-accountant-section .container .trust-bottom-box img,
.trust-accountant-section .container .experience-box {
transition: 0.5s all;
}
.trust-accountant-section .container:hover .experience-box {
transform: scale(1.24);
transition: 0.5s all;
}
.trust-accountant-section .container:hover ul li::after {
background-color: #000;
}
.trust-bottom-box picture {
overflow: hidden;
display: inline-block;
}
.trust-order-box {
flex: 1;
}
.trust-bottom-box {
position: relative;
}
.trust-bottom-box::before {
position: absolute;
content: "";
width: 0px;
height: 0px;
border-style: solid;
border-width: 0 200px 200px 0;
border-color: transparent #e8d9bb transparent transparent;
transform: rotate(0deg);
right: 0;
z-index: -1;
transition: 0.5s all;
}
.trust-accountant-section .container:hover .trust-bottom-box::before {
transition: 0.5s all;
transform: scale(1.09);
}  .our-service-listing-section {
padding-block: 80px 130px;
padding-inline: 15px;
}
.our-service-listing-section .row {
display: flex;
margin: 0 -15px;
flex-wrap: wrap;
}
.our-service-listing-section .our-service-main-box {
margin-bottom: 30px;
padding: 0 15px;
width: 33.33%;
}
.our-service-listing-section .our-service-box {
background-color: #f8f8f8;
transition: 0.5s all;
border-radius: 6px;
overflow: hidden;
}
.our-service-listing-section .our-service-box a {
display: inline-block;
}
.our-service-listing-section .our-service-box h3 {
color: #000;
font-family: "DMSans-Medium";
font-size: 26px;
font-style: normal;
font-weight: 500;
line-height: 86.7%;
text-transform: capitalize;
padding-bottom: 10px;
}
.our-service-listing-section .our-service-box .service-content-box {
padding: 30px 18px;
}
.our-service-listing-section .icon-box img,
.our-service-listing-section .icon-box svg {
background: #1f2753;
width: 70px;
height: 70px;
padding: 15px;
}
.our-service-listing-section .our-service-box picture {
display: inline-block;
width: 100%;
position: relative;
}
.our-service-listing-section .our-service-box .icon-box {
position: absolute;
transform: translate(345px, -75px);
transition: 0.5s all;
}
.our-service-listing-section .our-service-box:hover {
box-shadow: 0 0 9px 2px rgba(0, 0, 0, 0.1);
transition: 0.5s all;
}
.our-service-listing-section .our-service-box:hover .icon-box {
transform: translate(270%, -330%);
transition: 0.5s all;
}
.our-service-listing-section .service-content-box .circle-back-box {
background-color: #1f2753;
width: 53px;
height: 53px;
border-radius: 100px;
display: inline-block;
margin-top: 20px;
background-image: url(//financehub.trustmat.com/wp-content/uploads/2023/12/double-arrow.png);
background-position: -30px;
background-size: 67px;
background-repeat: no-repeat;
transition: 0.5s all;
}
.our-service-listing-section .our-service-box .service-img::before {
position: absolute;
content: "";
left: 0;
top: 0;
bottom: 0;
background: linear-gradient(0deg, #1f2753 0%, rgba(0, 0, 0, 0) 82.08%);
width: 100%;
height: 100%;
transform: translateY(350px);
transition: 0.5s all;
}
.our-service-listing-section .our-service-box .service-img {
overflow: hidden;
}
.our-service-listing-section .our-service-box:hover .service-img::before {
transform: translateY(0);
transition: 0.5s all;
}
.our-service-listing-section .our-service-box .service-img img {
width: 100%;
max-height: 337px;
object-fit: cover;
min-height: 337px;
}
.our-service-listing-section .our-service-box:hover .circle-back-box {
background-position: 15px 21px;
transition: 0.5s all;
}  .mortgage-loan-info-section {
padding-block: 80px 40px;
position: relative;
padding-inline: 15px;
}
.mortgage-loan-info-section h2 {
text-align: center;
font-family: "DMSans-Medium";
font-size: 30px;
font-style: normal;
font-weight: 500;
line-height: normal;
padding-bottom: 16px;
color: #0b111d;
}
.mortgage-loan-info-section p {
text-align: center;
max-width: 1170px;
margin: auto;
}  .faq-section {
padding-block: 80px;
position: relative;
padding-inline: 15px;
}
.faq-section h2 {
text-align: center;
font-family: "DMSans-Medium";
font-size: 45px;
font-style: normal;
font-weight: 500;
line-height: 86.7%;
color: #122038;
text-transform: capitalize;
padding-bottom: 53px;
}
.faq-section h2 span {
color: #bb8922;
}
.faq-section .right-side-shape {
top: 0;
transform: none;
}
.accordion {
position: relative;
padding: 18px 40px 18px 18px;
background-color: #eff2f6;
width: 100%;
text-align: left;
font-size: 26px;
border: 0;
transition: 0.4s;
border-radius: 10px;
outline: none;
cursor: pointer;
font-weight: 400;
font-family: "DMSans-Regular";
}
.accordion::after {
content: "";
position: absolute;
right: 18px;
top: 50%;
transform: translateY(-50%);
width: 16px;
height: 2px;
background-color: #808080;
transition: 0.5s all;
}
.accordion::before {
content: "";
position: absolute;
right: 25px;
top: 50%;
transform: translateY(-50%);
width: 2px;
height: 16px;
background-color: #808080;
transition: height 0.2s ease-in;
transition: 0.5s all;
}
.accordion.active::before {
transform: translateY(-7px) rotate(45deg);
transition: 0.5s all;
background-color: #bb8922;
}
.accordion.active::after {
transform: translateY(0px) rotate(45deg);
transition: 0.5s all;
background-color: #bb8922;
}
.accordion.active,
.accordion:hover {
background-color: #eff2f6;
color: #bb8922;
}
.accordion.active {
border-bottom-left-radius: 0px;
border-bottom-right-radius: 0px;
}
.panel + .accordion {
margin-top: 1px;
}
.panel {
padding: 0 18px;
background-color: #ffffffee;
max-height: 0;
overflow: hidden;
transition: max-height 0.2s ease-out;
box-shadow: none;
border-radius: 0;
background: #eff2f6;
border-bottom-left-radius: 10px;
border-bottom-right-radius: 10px;
margin-bottom: 20px;
}
.panel p:last-child {
padding-bottom: 20px;
}
.panel p + p {
margin-bottom: 15px;
}  .mortgage-rate-info-section {
padding-block: 150px;
position: relative;
padding-inline: 15px;
}
.mortgage-rate-info-section .row {
display: flex;
align-items: center;
flex-wrap: wrap;
}
.mortgage-rate-info-section .row .mortgage-rate-mainbox,
.mortgage-rate-info-section .row .mortgage-rate-content-box {
width: 50%;
position: relative;
}
.mortgage-rate-info-section h2 {
font-family: "DMSans-Medium";
font-size: 45px;
font-style: normal;
font-weight: 500;
line-height: normal;
color: #0b111d;
padding-bottom: 20px;
}
.mortgage-rate-info-section p {
padding-bottom: 16px;
}
.mortgage-rate-info-section a {
margin-top: 45px;
}
.mortgage-rate-info-section .row picture {
text-align: center;
}
.mortgage-rate-info-section .mortgage-rate-box {
-webkit-mask-image: url(//financehub.trustmat.com/wp-content/uploads/2023/12/whitemask-img.png);
-webkit-mask-repeat: no-repeat;
-webkit-mask-size: auto 100%;
}
.mortgage-rate-info-section .row .mortgage-rate-box {
max-width: 521px;
margin: auto;
width: 100%;
}
.mortgage-rate-info-section .row .mortgage-rate-mainbox .pos-shape {
width: 521px;
height: 616px;
position: absolute;
top: 0;
left: 0;
right: 0;
margin: auto;
}
.mortgage-rate-info-section .row .mortgage-rate-mainbox .pos-shape .shape-one {
z-index: -1;
position: relative;
left: 15px;
}
.mortgage-rate-info-section .row .mortgage-rate-mainbox .pos-shape .shape-two {
position: absolute;
left: 40px;
bottom: 15px;
}
.ract-box {
width: 61px;
height: 103px;
background-color: #e7cc94;
position: absolute;
right: -20px;
top: 46px;
z-index: -1;
}
.ract-gradiant-box1,
.ract-gradiant-box2 {
width: 61px;
height: 83px;
background: linear-gradient(
180deg,
#bb8922 -12.65%,
rgba(187, 137, 34, 0) 93.98%
);
position: absolute;
left: 70px;
bottom: 120px;
}
.ract-gradiant-box2 {
left: 280px;
bottom: 60px;
}
.mortgage-rate-info-section .right-side-shape {
transform: translateY(-100%);
}  .keep-in-touch-section {
padding-block: 80px;
position: relative;
width: 100%;
padding-inline: 15px;
}
.keep-in-touch-section h2 {
color: #000;
font-family: "DMSans-Bold";
font-size: 45px;
font-style: normal;
font-weight: 700;
line-height: 120%;
letter-spacing: -0.9px;
padding-bottom: 22px;
}
.keep-in-touch-section .social-contact-box {
display: flex;
align-items: center;
padding-top: 30px;
}
.keep-in-touch-section .social-contact-box h3 {
color: #1f2753;
font-family: "DMSans-Bold";
font-size: 24px;
font-style: normal;
font-weight: 700;
line-height: 40px;
letter-spacing: -0.24px;
}
.keep-in-touch-section .social-contact-box .svg-icon {
width: 65px;
height: 65px;
background: #1f2753;
border-radius: 6px;
display: inline-block;
margin-right: 27px;
display: flex;
align-items: center;
justify-content: center;
}
.keep-in-touch-section .keep-in-touch-left-box {
width: 50%;
}
.keep-in-touch-section .left-side-shape {
top: auto;
transform: none;
}
.keep-in-touch-section .right-side-shape {
top: 0;
transform: none;
}
.keep-in-touch-section .social-contact-box a:hover {
color: #d09a29;
}
.keep-in-touch-section .row {
display: flex;
flex-wrap: wrap;
}  .service-detail-section {
padding-block: 40px 100px;
padding-inline: 15px;
}
.service-detail-section .row {
display: flex;
gap: 60px;
}
.service-detail-section .serivces-list {
margin-bottom: 25px;
}
.service-detail-section .serivces-list li {
margin-bottom: 10px;
display: block;
line-height: 1.4;
}
.service-detail-section .serivces-list li a {
display: flex;
align-items: start;
gap: 10px;
padding: 15px 43px 15px 20px;
margin: 0 0 10px 0;
position: relative;
background-color: #fff;
border: none;
z-index: 1;
font-weight: 500;
font-size: 16px;
-webkit-transition: all 0.3s linear;
transition: all 0.3s linear;
border: 1px solid #dce4ed;
color: #0c2139;
}
.service-detail-section .serivces-list li a::before {
content: "";
width: 5px;
left: -1px;
bottom: 50%;
background: #bb8a04;
height: 0;
position: absolute;
transition: all 0.3s cubic-bezier(0.645, 0.045, 0.355, 1);
z-index: 1;
}
.service-detail-section .serivces-list li a:hover:before {
height: 100%;
bottom: 0;
}
.service-detail-section .serivces-list li a:after {
position: absolute;
content: "";
top: 17px;
right: 20px;
background-color: transparent;
font-size: 13px;
background: url(//financehub.trustmat.com/wp-content/uploads/2023/12/next-arrow.png) no-repeat;
width: 21px;
height: 21px;
background-size: 21px;
}
.service-detail-section .serivces-list li a:hover,
.download-section .pylon-links a:hover {
color: #bb8a04;
}
.service-detail-section .serivces-list li a.active::before {
height: 100%;
bottom: 0;
}
.service-detail-section .service-sidebar-box {
width: 25%;
position: relative;
background-color: #eff2f6;
padding: 10px;
border-radius: 12px;
position: sticky;
top: 110px;
height: max-content;
}
.service-detail-section .service-sidebar-box .main-title {
font-size: 30px;
margin-bottom: 20px;
}
.service-detail-section .service-sidebar-box .primary-btn {
width: 100%;
} .layout-left-sidebar {
width: 75%;
}
.layout-left-sidebar img {
border-radius: 6px;
width: 100%;
}
.layout-left-sidebar h2 {
margin-block: 30px 15px;
font-size: 34px;
}
.layout-left-sidebar h3 {
font-size: 28px;
margin-block: 15px;
}
.layout-left-sidebar p {
padding-bottom: 15px;
}
.layout-left-sidebar ul {
margin-block: 10px;
}
.layout-left-sidebar ul li,
.blog-description-block ul li {
font-size: 19px;
padding-bottom: 10px;
position: relative;
padding-left: 28px;
}
.layout-left-sidebar ul li::before,
.blog-description-block ul li:before {
position: absolute;
content: "";
left: 0;
width: 14px;
height: 14px;
border: 2px solid #bb8922;
border-radius: 100px;
top: 5px;
}
.layout-left-sidebar ul li::after,
.blog-description-block ul li:after {
position: absolute;
content: "";
width: 8px;
height: 8px;
background-color: #bb8922;
border-radius: 100px;
top: 10px;
left: 5px;
}
.blog-description-block ul {
margin: 30px 0;
}
.blog-description-block ul li {
font-family: "DMSans-Regular";
color: #757575;
font-size: 20px;
font-style: normal;
line-height: 26px;
}
.download-section {
margin-bottom: 40px;
}
.download-section h3 {
font-size: 23px;
color: #0c2139;
margin: 0;
padding-bottom: 10px;
margin-bottom: 25px;
position: relative;
border-bottom: 1px solid #dce4ed;
}
.download-section h3:after {
content: "";
width: 60px;
height: 4px;
background: #bb8922;
position: absolute;
bottom: -2px;
left: 0;
}
.download-section .pylon-links {
margin-bottom: 10px;
padding: 14px 15px;
background-color: #fff;
border: 1px solid #dce4ed;
}
.service-detail-section .accordion {
font-size: 20px;
}
.customer-contact-box { background-size: cover;
position: relative;
padding: 72px 45px;
border-radius: 6px;
overflow: hidden;
}
.customer-contact-box .banner-icon {
position: relative;
font-size: 32px;
width: 67px;
height: 67px;
background-color: #fff;
border-radius: 50%;
line-height: 2;
text-align: center;
margin-bottom: 30px;
display: flex;
align-items: center;
justify-content: center;
}
.customer-contact-box .contact-mail a {
margin: 15px 0;
font-size: 18px;
color: #fff;
display: inline-block;
}
.service-sidebar-contact-left p,
.service-sidebar-contact-left h3 {
color: #fff;
position: relative;
font-size: 19px;
}
.customer-contact-box::before {
position: absolute;
content: "";
background-color: #1f2753e6;
top: 0;
left: 0;
right: 0;
bottom: 0;
border-radius: 3px;
}
.service-sidebar-contact-left {
position: relative;
}
.customer-contact-box .banner-icon img {
filter: brightness(0);
width: 32px;
}  .footer-section {
position: relative;
width: 100%;
padding-block: 80px 0px;
background: #1f2753;
}
.footer-section .row {
display: flex;
align-items: center;
flex-wrap: wrap;
padding-inline: 15px;
justify-content: space-between;
}
.footer-logo {
width: 25%;
}
.footer-col-3 > div {
display: flex;
gap: 30px;
align-items: start;
flex-wrap: wrap;
}
.footer-section .footer-links {
display: flex;
gap: 30px;
}
.footer-section h3 {
color: #fff;
font-family: "DMSans-Regular";
font-size: 20px;
font-style: normal;
font-weight: 400;
line-height: 26px;
padding-bottom: 30px;
}
.footer-section ul li {
padding-bottom: 14px;
}
.footer-section ul li a,
.footer-section ul li {
color: #fff;
font-family: "DMSans-Regular";
font-size: 15px;
font-style: normal;
font-weight: 400;
line-height: 26px;
transition: 0.5s all;
}
.footer-section ul li a:hover {
color: #d09a29;
transition: 0.5s all;
}
.footer-logo img {
max-width: 280px;
}
.footer-copyright-section {
position: relative;
width: 100%;
background: #bb8a04;
padding: 12px 0px;
margin-top: 100px;
}
.footer-copyright-section .row {
display: flex;
align-items: center;
justify-content: space-between;
flex-wrap: wrap;
}
.footer-copyright-section .row p {
color: #fff;
font-family: "DMSans-Regular";
font-size: 18px;
font-style: normal;
font-weight: 400;
line-height: 26px;
}
.footer-copyright-section .row ul {
display: flex;
gap: 10px;
align-items: center;
}
.footer-copyright-section .row ul li {
padding-bottom: 0;
line-height: 0;
}
.footer-copyright-section .row ul li:first-child a img {
width: 16px;
}
.footer-copyright-section .row ul li a {
width: 25px;
height: 25px;
background-color: rgba(255, 255, 255, 0.2);
border-radius: 100px;
display: inline-block;
text-align: center;
line-height: 31px;
}
.footer-copyright-section .row ul li a:hover {
background-color: #1f2753;
}  .back-top-top-arrow {
width: 60px;
height: 60px;
background-color: #bb8a04;
border-radius: 6px;
position: fixed;
bottom: 60px;
right: 100px;
transition: 0.5s all;
opacity: 0;
visibility: hidden;
z-index: 1000;
cursor: pointer;
display: flex;
align-items: center;
justify-content: center;
}
.back-top-top-arrow.show {
opacity: 1;
visibility: visible;
}
.back-top-top-arrow:hover img {
animation: bounce 0.6s;
animation-direction: alternate;
animation-iteration-count: infinite;
}
html {
margin-top: 0 !important;
}
.calculator-banner {
padding: 50px 15px 0;
}
.calculator-banner h1 {
color: #1f2753;
font-family: "DMSans-Bold";
text-align: center;
font-size: 60px;
font-style: normal;
font-weight: 700;
line-height: normal;
text-transform: capitalize;
padding-bottom: 6px;
position: relative;
margin-bottom: 20px;
}
.calculator-banner h1 span {
color: #bb8922;
}
.calculator-banner h2 {
text-align: center;
}
.calculator-banner p {
text-align: center;
}
body:has(.banner-section) .main-header #menu-header-menu li a {
color: #fff;
}
#menu-header-menu li a.secondary-btn {
padding: 0px 20px;
width: fit-content;
color: #fff !important;
}
body:has(.banner-section) .main-header.fixed #menu-header-menu > li > a {
color: #333;
}
#menu-header-menu > li.two-col .megamenu_wrapper {
grid-template-columns: 1fr;
}
@keyframes bounce {
0% {
transform: translate3d(0, -5px, 0);
}
100% {
transform: translate3d(0px, 5px, 0);
}
} .bar-icon,
.close-icon {
display: none;
} .get-in-touch-popup-box-wrapper,
.check-rate-popup-box {
display: none;
background: rgba(0, 0, 0, 0.8);
width: 100%;
height: 100%;
position: fixed;
top: 0;
z-index: 1100;
}
.get-in-touch-popup-box {
position: fixed;
top: 50%;
left: 0;
width: 100%;
min-height: 470px;
z-index: 9999;
right: 0;
transform: translateY(-50%);
max-width: 1000px;
margin: auto;
background: #fff;
padding: 30px;
border: 3px solid #ddc490;
}
.get-in-touch-popup-inner-wrapper {
display: flex;
align-items: center;
justify-content: center;
}
.get-in-touch-popup-box .get-in-touch-text,
.get-in-touch-popup-box .get-in-touch-img {
width: 100%;
}
.get-in-touch-popup-box .get-in-touch-img {
text-align: right;
}
.get-in-touch-popup-box .get-in-touch-img img {
border-radius: 120px 0px 0px 0px;
height: 403px;
}
.get-in-touch-popup-box .get-in-touch-text img {
max-width: 156px;
}
.get-in-touch-popup-box .get-in-touch-text h2 {
color: #000;
font-family: "DMSans-Bold";
font-size: 36px;
font-style: normal;
font-weight: 700;
line-height: normal;
text-transform: capitalize;
margin-block: 35px 20px;
}
.get-in-touch-popup-box .get-in-touch-text h2 span {
color: #bb8922;
}
.get-in-touch-popup-box .get-in-touch-text p {
font-size: 26px;
color: #122038;
line-height: normal;
}
.get-in-touch-popup-box .get-in-touch-text .gform_footer {
margin-top: 45px;
}
.get-in-touch-popup-box #close,
#close-icon {
width: 40px;
height: 40px;
padding: 8px 15px;
background-color: #bb8a04;
float: right;
cursor: pointer;
border-radius: 1px;
font-weight: bold;
color: #fff;
position: absolute;
top: -18px;
right: -20px;
border-radius: 6px;
display: flex;
align-items: center;
justify-content: center;
}
.get-in-touch-popup-box .get-in-touch-text form input {
width: 471px;
height: 50px;
padding: 15px;
border: 1px solid #dce1e9;
margin-top: 30px;
}
.get-in-touch-popup-box .get-in-touch-text .gform_footer input {
padding-inline: 15px !important;
font-family: "Poppins-SemiBold" !important;
font-size: 16px !important;
font-style: normal !important;
text-transform: uppercase !important;
background: #bb8922 !important;
min-width: 154px !important;
height: 50px;
line-height: 50px !important;
display: inline-block !important;
transition: -0.5s all !important;
position: relative;
overflow: hidden;
border-radius: 6px !important;
}
.get-in-touch-popup-box .get-in-touch-text form input[type="email"],
.check-rate-popup-box
.get-in-touch-popup-box
.get-in-touch-text
form
input[type="text"] {
font-family: "DMSans-Regular";
width: 96% !important;
box-shadow: none;
font-size: 20px;
padding-left: 55px;
background-image: url(https://financehub.trustmat.com/wp-content/uploads/2023/12/mail.svg);
background-repeat: no-repeat;
background-position: 21px 12px;
border-radius: 6px;
}
.get-in-touch-popup-box
.get-in-touch-text
form
input[type="email"]::placeholder {
font-size: 20px;
color: #000;
opacity: 0.8;
}
.get-in-touch-popup-box .get-in-touch-text form input[type="submit"]:hover {
background-color: #1f2753 !important;
}
.get-in-touch-popup-box .gform_validation_errors h2,
.get-in-touch-popup-box .gform_validation_errors {
margin: 0 !important;
}
.get-in-touch-popup-box .gform_validation_errors {
margin-top: 15px !important;
width: 96%;
} #secondary-btn-check-rate {
cursor: pointer;
margin-top: 20px;
}
.check-rate-popup-box .get-in-touch-popup-box {
max-width: 1173px;
}
.check-rate-popup-box .get-in-touch-popup-box {
padding: 0;
border: 0;
background: #f8f3e6;
box-shadow: 0px 0px 50px 0px rgba(0, 0, 0, 0.1);
}
.check-rate-popup-box .get-in-touch-popup-box .get-in-touch-text {
padding: 30px;
}
.check-rate-popup-box
.get-in-touch-popup-box
.get-in-touch-text
form
input[type="email"] {
margin-top: 0;
}
.check-rate-popup-box .get-in-touch-popup-box form .description_below {
row-gap: 15px;
}
.check-rate-popup-box
.get-in-touch-popup-box
.get-in-touch-text
form
input[type="text"] {
background-image: url(https://financehub.trustmat.com/wp-content/uploads/2023/12/user.svg);
background-repeat: no-repeat;
}
.check-rate-popup-box .get-in-touch-popup-box .get-in-touch-img img {
height: 100%;
border-radius: 0;
}
.check-rate-popup-box
.get-in-touch-popup-box
.get-in-touch-popup-inner-wrapper {
align-items: unset;
}
.check-rate-popup-box .get-in-touch-popup-box .get-in-touch-text h2 {
margin-top: 10px;
}
.check-rate-popup-box .get-in-touch-popup-box #close-icon {
background-color: transparent;
width: initial;
padding: 0;
top: 15px;
right: 20px;
}
.gallery-img-box {
display: flex;
gap: 15px;
margin-block: 90px;
}
.gallery-img-box > div {
display: flex;
flex-direction: column;
gap: 15px;
}
#mortgage-wrap.calc-wrap {
max-width: 1260px;
margin: 40px auto 0px;
display: flex;
overflow: hidden;
}
#mortgage-wrap.calc-wrap #mortgage-plugin {
margin-block: 90px;
}
div#mortgage-wrap:before {
position: absolute;
content: "";
background: linear-gradient(
90deg,
#d9b54a 0.2%,
rgba(217, 181, 74, 0) 98.91%
);
width: 1314px;
height: 1383px;
opacity: 0.1;
left: 21%;
z-index: -1;
}
.mortgage-loan-info-section .left-side-shape {
top: 60%;
}
.gallery-img-inner-row {
gap: 15px;
display: flex;
flex-wrap: wrap;
} .desc-only-section {
padding: 40px 15px;
}
.desc-only-section h6.western,
.desc-only-section h2 {
font-size: 28px;
line-height: 1.2;
margin: 30px 0 15px;
font-family: "DMSans-Regular" !important;
}
.desc-only-section h6.western span {
font-family: "DMSans-Regular" !important;
}
.desc-only-section p {
margin-bottom: 15px;
}
.desc-only-section h6.western:first-child,
.desc-only-section h2:first-child {
margin-top: 0px;
}
.desc-only-section ul {
padding: 0;
margin: 30px auto 15px;
}
.desc-only-section ul li {
font-family: "DMSans-Regular";
color: #757575;
font-size: 19px;
font-style: normal;
line-height: 26px;
padding-bottom: 16px;
position: relative;
padding-left: 32px;
}
.desc-only-section ul li:before {
position: absolute;
content: "";
left: 0;
width: 14px;
height: 14px;
border: 2px solid #bb8922;
border-radius: 100px;
top: 5px;
}
.desc-only-section ul li::after {
position: absolute;
content: "";
width: 8px;
height: 8px;
background-color: #bb8922;
border-radius: 100px;
top: 10px;
left: 5px;
}
.desc-only-section ul li p {
margin: 0;
}
.desc-only-section p a,
.desc-only-section p a span {
color: #1f2753 !important;
text-decoration: none;
}
.desc-only-section p a:hover,
.desc-only-section p a:hover span {
color: #bb8922 !important;
}
.badges123Home {
display: flex;
justify-content: flex-end;
position: relative;
z-index: 99;
margin-top: 50px;
}
.google-reviews {
max-width: 1470px;
margin: 0 auto;
padding: 20px 15px;
} @media only screen and (max-width: 1599px) {
.our-service-listing-section {
padding-block: 100px 80px;
} .mortgage-rate-info-section {
padding-block: 100px;
}
.faq-section,
.keep-in-touch-section {
padding-block: 100px;
}
#mortgage-wrap.calc-wrap {
margin: 40px auto 120px;
}
}
@media only screen and (max-width: 1499px) {
.banner-section {
padding-block: 250px 180px;
min-height: inherit;
}
.why-us-section .why-us-img-box:after {
right: 45px;
}
.how-can-we-help-section {
padding-bottom: 100px;
}
.why-us-section {
padding-block: 100px 70px;
}
.meet-our-team-section {
padding-bottom: 130px;
}
.our-customers-section .slick-slide {
padding: 40px 15px;
}
.trust-accountant-section {
padding-block: 100px;
}
.trust-accountant-section ul li {
font-size: 17px;
}
}
@media only screen and (max-width: 1399px) {
.our-customers-section .our-customer-title {
padding-left: 15px;
}
.our-service-listing-section .our-service-box .icon-box {
transform: translate(315px, -75px);
}
.our-service-listing-section .our-service-box:hover .icon-box {
transform: translate(243%, -300%);
}
.customer-contact-box {
padding: 72px 25px;
}
}
@media only screen and (max-width: 1299px) {
.our-service-listing-section .our-service-box .icon-box {
transform: translate(285px, -75px);
}
.our-service-listing-section .our-service-box:hover .icon-box {
transform: translate(223%, -300%);
}
.our-service-listing-section {
padding-block: 70px 50px;
}
.get-in-touch-popup-box {
max-width: 960px;
}
#menu-header-menu > li.two-col .mega-menu {
width: 70.7vw !important;
}
}
@media only screen and (max-width: 1199px) {
.main-menu ul li a {
font-size: 18px;
}
.main-menu ul {
gap: 25px;
}
.why-us-section {
padding-block: 120px 70px;
}
.why-us-section .why-us-img-box:after {
right: 0px;
border-bottom: 410px solid #ddc490 !important;
width: 130px;
}
.why-us-section .multipal-arrow-img {
right: 5px;
bottom: 120px;
}
.help-photo-wrapper .gallery-box h3 {
left: 40px;
}
.how-can-we-help-section {
padding-bottom: 70px;
}
.mortgage-calculator-section .mortgage-img-section img {
width: 70%;
}
.mortgage-calculator-section .row::before {
left: 210px;
background-size: 970px;
height: 635px;
}
.mortgage-calculator-section .mortgage-img-section {
width: 45%;
}
.mortgage-calculator-section .mortgage-text-section {
width: 55%;
}
.main-title {
font-size: 36px;
}
.brand-logo-section {
padding-block: 60px;
}
.brand-logo-section .slick-track {
gap: 30px;
}
.meet-our-team-section {
padding-bottom: 90px;
}
.check-rate-section {
padding-block: 60px 0px;
}
.check-rate-section .check-out-mob-box {
height: 590px;
}
.check-rate-section .check-out-mob-box::before {
display: none;
}
.subscribe-section h2 {
font-size: 30px;
}
.footer-section {
padding-block: 70px 0px;
}
.footer-copyright-section {
margin-top: 50px;
}
.footer-logo img {
max-width: 200px;
}
.footer-copyright-section .row p {
font-size: 14px;
}
.banner-section {
padding-block: 220px 120px;
}
.banner-section h1 {
font-size: 60px;
}
.why-us-section .why-us-text h3 {
font-size: 22px;
}
.trust-accountant-section h2 {
font-size: 30px;
}
.trust-order-box {
flex: inherit;
padding-left: 65px;
}
.trust-accountant-section {
padding-block: 60px 40px;
}
.our-service-listing-section .our-service-box .icon-box {
transform: translate(208px, -75px);
}
.our-service-listing-section .our-service-box:hover .icon-box {
transform: translate(153%, -240%);
}
.our-service-listing-section .our-service-box .service-content-box p {
font-size: 18px;
}
.mortgage-loan-info-section {
padding-block: 60px;
}
.mortgage-rate-info-section .row .mortgage-rate-box {
max-width: 370px;
}
.ract-box {
right: 70px;
top: 26px;
}
.ract-gradiant-box2 {
left: 260px;
bottom: 190px;
}
.ract-gradiant-box1 {
left: 106px;
bottom: 240px;
}
.mortgage-rate-info-section
.row
.mortgage-rate-mainbox
.pos-shape
.shape-two {
bottom: 185px;
}
.mortgage-rate-info-section h2 {
font-size: 32px;
}
.mortgage-rate-info-section,
.keep-in-touch-section {
padding-block: 80px;
}
.faq-section {
padding-block: 80px;
}
.check-rate-popup-box .get-in-touch-popup-box {
max-width: 970px;
}
#mortgage-wrap.calc-wrap #mortgage-plugin {
margin-inline: 15px;
}
.gallery-img-inner-row img {
width: 100%;
}
.gallery-img-box {
padding-right: 15px;
}
}
@media only screen and (max-width: 991px) {
.main-menu ul li a {
font-size: 14px;
}
#menu-header-menu > li {
margin: 0 0px !important;
}
.site-logo img {
max-width: 180px;
}
.why-us-section {
padding-block: 40px;
}
.why-us-section .why-us-text,
.why-us-section .why-us-img-box {
width: 100%;
}
.why-us-section .why-us-img-box {
margin-top: 60px;
}
.why-us-section .why-us-img-box .big-img,
.why-us-section .why-us-img-box .big-img img {
width: 100%;
}
.why-us-section .multipal-arrow-img {
right: 115px;
bottom: 80px;
}
.how-can-we-help-section .why-us-text {
padding: 0 15px;
}
.help-photo-wrapper .gallery-box h3 {
left: 11px;
font-size: 16px;
bottom: 30px;
}
.how-can-we-help-section {
padding-bottom: 60px;
}
.why-us-section .why-us-text {
text-align: center;
}
.why-us-section .why-us-text h3 {
padding-top: 16px;
}
.check-rate-section {
padding-block: 0px;
}
.check-rate-section .check-rate-text .main-title br {
display: none;
}
.mortgage-calculator-section .row {
flex-direction: column;
align-items: flex-start;
}
.mortgage-calculator-section p {
padding-right: 0;
}
.mortgage-calculator-section .mortgage-text-section,
.mortgage-calculator-section .mortgage-img-section,
.mortgage-calculator-section .mortgage-img-section picture,
.mortgage-calculator-section .mortgage-img-section img {
width: 100%;
}
.mortgage-calculator-section .row::before {
display: none;
}
.mortgage-calculator-section {
padding-block: 80px;
}
.mortgage-calculator-section {
padding-block: 30px;
}
.mortgage-calculator-section .mortgage-text-section {
padding-top: 15px;
}
.our-customers-section {
padding-block: 60px 80px;
}
.meet-our-team-section {
padding-bottom: 60px;
}
.subscribe-section h2 {
font-size: 22px;
}
.footer-logo,
.footer-col-1,
.footer-col-2,
.footer-col-3 {
padding-bottom: 20px;
}
.footer-section h3 {
padding-bottom: 20px;
}
.footer-section {
padding-block: 60px 0px;
}
.footer-copyright-section {
margin-top: 30px;
text-align: center;
}
.footer-copyright-section .row {
justify-content: center;
row-gap: 10px;
}
.back-top-top-arrow {
bottom: 150px;
right: 30px;
}
.brand-logo-section {
padding-block: 30px;
overflow: hidden;
}
.why-us-section .why-us-text p {
padding: 0 0px 15px 0;
}
.main-menu ul {
gap: 18px;
}
.trust-accountant-section h2 {
font-size: 26px;
}
.trust-accountant-top-img .v-line-img {
width: 201px;
right: -87px;
}
.trust-accountant-section p {
font-size: 18px;
}
.our-service-listing-section .our-service-main-box {
width: 50%;
}
.our-service-listing-section .our-service-box .icon-box {
transform: translate(244px, -75px);
}
.our-service-listing-section .our-service-box:hover .icon-box {
transform: translate(183%, -260%);
}
.our-service-listing-section {
padding-block: 50px 20px;
}
.mortgage-rate-info-section .row .mortgage-rate-mainbox,
.mortgage-rate-info-section .row .mortgage-rate-content-box {
width: 100%;
}
.mortgage-rate-info-section .row .mortgage-rate-content-box {
text-align: center;
padding-top: 30px;
}
.mortgage-rate-info-section a {
margin-top: 15px;
}
.mortgage-rate-info-section,
.keep-in-touch-section {
padding-block: 60px;
}
.faq-section h2 {
font-size: 32px;
}
.service-detail-section .row {
flex-direction: column;
gap: 30px;
}
.service-detail-section .service-sidebar-box,
.layout-left-sidebar {
width: 100%;
}
.service-detail-section .service-sidebar-box::before {
display: none;
}
.service-detail-section {
padding-block: 30px;
}
.layout-left-sidebar ul li {
font-size: 16px;
}
.customer-contact-box {
padding: 30px 25px;
}
.get-in-touch-popup-box .get-in-touch-text {
padding-right: 20px;
}
.get-in-touch-popup-box {
max-width: 720px;
}
.get-in-touch-popup-box .get-in-touch-text p {
font-size: 20px;
}
.get-in-touch-popup-box .get-in-touch-text h2 {
font-size: 32px;
}
.get-in-touch-popup-box .get-in-touch-text form input[type="email"] {
padding-left: 40px;
background-position: 9px 12px;
}
.check-rate-popup-box .get-in-touch-popup-box {
max-width: 730px;
}
#mortgage-wrap.calc-wrap {
margin: 0px auto 60px;
}
}
@media only screen and (max-width: 767px) {
.main-header .row {
padding: 13px 0;
}
.main-header {
background-color: #fff !important;
margin-top: 0;
}
.top-bar {
display: none;
}
.footer-col-3 > div {
flex-direction: column;
align-items: center;
}
.footer-section .footer-links {
width: 100%;
flex-wrap: wrap;
}
.our-customers-section .row {
flex-direction: column;
}
.our-customers-section .our-customer-title {
padding-left: 0;
}
.our-customers-section .our-customer-title picture {
top: -40px;
width: 150px;
}
.our-customers-section h2 {
padding-bottom: 20px;
text-align: center;
}
.our-customers-section .customer-slider {
margin-top: 20px;
width: 100%;
padding: 0 15px;
}
.our-customers-section .slick-prev,
.our-customers-section .slick-next {
left: 55%;
}
.main-title {
font-size: 22px;
}
p {
font-size: 16px;
}
.meet-our-team-section p {
padding-block: 13px 24px;
}
.meet-our-team-section .our-team-slider .slick-slide {
padding: 0;
}
.brand-logo-section {
padding-block: 10px;
}
.meet-our-team-section {
padding-bottom: 40px;
}
.subscribe-section .subscribe-text {
width: 100%;
text-align: center;
}
.footer-logo,
.footer-col-1,
.footer-col-2,
.footer-col-3 {
width: 100%;
text-align: center;
}
.footer-copyright-section {
margin-top: 10px;
}
.footer-section {
padding-block: 40px 0px;
}
.our-customers-section .our-customer-title {
margin: 0;
text-align: center;
}
.our-customers-section .our-customer-title .secondary-btn {
max-width: 154px;
margin: auto;
display: block;
}
.our-customers-section {
padding-block: 40px 80px;
}
.our-customers-section .slick-track {
gap: 0;
}
.banner-section h1 {
font-size: 30px;
}
.banner-section {
padding-block: 60px;
}
.banner-section p {
padding-bottom: 25px;
}
.why-us-section .why-us-text h3 {
font-size: 16px;
}
.why-us-section .why-us-img-box:after {
right: 0px;
border-bottom: 305px solid #ddc490 !important;
width: 50px;
}
.why-us-section .why-us-img-box .small-img img {
margin-top: -240px;
}
.why-us-section .multipal-arrow-img {
display: none;
}
.why-us-section {
padding-block: 40px 20px;
}
.help-photo-wrapper {
display: block;
}
.help-photo-wrapper .gallery-box,
.help-photo-wrapper .gallery-box picture,
.help-photo-wrapper .gallery-box picture a,
.check-rate-section .check-rate-text,
.check-rate-section .check-out-mob-box {
width: 100%;
}
.how-can-we-help-section p {
padding-bottom: 25px;
}
.how-can-we-help-section {
padding-bottom: 10px;
}
.check-rate-section .row {
flex-direction: column;
}
.check-rate-section {
padding-block: 30px 0;
text-align: center;
}
.check-rate-section p {
padding-right: 0;
padding-block: 16px 25px;
}
.check-rate-section .check-out-mob-box {
height: 530px;
}
.mortgage-calculator-section ul {
padding-bottom: 10px;
}
.mortgage-calculator-section ul li {
font-size: 16px;
}
.mortgage-calculator-section .mortgage-text-section .secondary-btn {
max-width: 154px;
margin: auto;
display: block;
}
.bar-icon {
max-width: 30px;
cursor: pointer;
display: block;
}
.main-menu ul li {
width: 100%;
}
.main-menu ul li a {
font-size: 18px;
display: block;
width: 100%;
padding: 15px 0px;
border-bottom: 2px solid #000;
}
.main-menu {
position: fixed;
right: 0;
top: 0;
bottom: 0;
z-index: 9999;
background: #fff;
max-width: 280px;
width: 100%;
padding: 55px 15px;
transform: translateX(100%);
transition: 0.5s all;
}
.main-menu.open {
transform: translateX(0);
transition: 0.5s all;
}
body.open .overlay {
position: fixed;
content: "";
top: 0;
left: 0;
right: 0;
bottom: 0;
background-color: rgba(0, 0, 0, 0.5);
z-index: 2;
}
.main-menu ul {
flex-direction: column;
align-items: flex-start;
}
.bar-icon {
display: block;
}
.close-icon {
max-width: 20px;
position: absolute;
top: 15px;
left: 15px;
display: block;
cursor: pointer;
}
.inner-page-banner-section h1,
.inner-page-banner-section h1 span {
font-size: 32px;
}
.inner-page-banner-section {
padding-block: 30px;
}
.trust-accountant-section {
padding-block: 40px;
}
.trust-accountant-section .trust-accountant-top-img {
width: 100%;
}
.trust-accountant-section h2 {
font-size: 22px;
padding-block: 10px;
}
.trust-accountant-section .row + .row {
padding: 0 15px;
gap: 15px;
}
.trust-accountant-section .experience-box {
transform: scale(1);
margin-left: 0;
width: 100%;
text-align: center;
}
.trust-accountant-section .container:hover .experience-box {
transform: scale(1);
}
.trust-order-box {
padding-left: 0;
}
.trust-accountant-section p {
font-size: 16px;
}
.trust-accountant-section ul li {
font-size: 16px;
padding-bottom: 0;
}
.trust-accountant-top-img .v-line-img {
display: none;
}
.trust-accountant-top-img .cross-img {
top: -32px;
left: 0;
}
.our-service-listing-section .our-service-main-box {
width: 100%;
}
.our-service-listing-section {
padding-block: 20px 0px;
}
.our-service-listing-section .our-service-main-box {
margin-bottom: 20px;
}
.our-service-listing-section .our-service-box .icon-box {
transform: translate(274px, -75px);
}
.our-service-listing-section .our-service-box:hover .icon-box {
transform: translate(213%, -280%);
}
.mortgage-loan-info-section h2 {
font-size: 22px;
}
.mortgage-rate-info-section .row .mortgage-rate-mainbox .pos-shape {
width: 100%;
}
.mortgage-rate-info-section h2 {
font-size: 22px;
}
.mortgage-rate-info-section {
padding-block: 40px;
}
.accordion {
font-size: 18px;
padding: 18px 45px 18px 18px;
}
.faq-section h2 {
font-size: 22px;
padding-bottom: 20px;
}
.faq-section,
.keep-in-touch-section {
padding-block: 50px;
}
.get-in-touch-popup-inner-wrapper {
flex-direction: column;
}
.get-in-touch-popup-box .get-in-touch-text {
margin-bottom: 30px;
padding-right: 0;
}
.get-in-touch-popup-box .get-in-touch-img img {
height: auto;
}
.get-in-touch-popup-box .get-in-touch-text form input[type="email"] {
width: 100% !important;
}
.get-in-touch-popup-box {
padding: 15px;
max-width: 370px;
}
body.open::before {
background-color: rgba(0, 0, 0, 0.8);
position: fixed;
content: "";
left: 0;
top: 0;
bottom: 0;
right: 0;
z-index: 3;
}
.get-in-touch-popup-box .get-in-touch-text .gform_footer {
margin-top: 30px;
}
.get-in-touch-popup-box .get-in-touch-text h2 {
margin-top: 15px;
}
.check-rate-popup-box .get-in-touch-popup-box {
max-width: 380px;
}
.check-rate-popup-box .get-in-touch-popup-box .get-in-touch-text {
margin-bottom: 0;
}
.check-rate-popup-box
.get-in-touch-popup-box
.get-in-touch-text
form
input[type="text"] {
width: 100% !important;
}
.check-rate-popup-box
.get-in-touch-popup-box
.get-in-touch-popup-inner-wrapper {
flex-direction: column-reverse;
}
.check-rate-popup-box .get-in-touch-popup-box .get-in-touch-text {
padding: 30px 15px;
}
.check-rate-popup-box
.get-in-touch-popup-box
.get-in-touch-text
form
input[type="text"] {
padding-left: 40px;
background-position: 9px 12px;
}
#mortgage-wrap.calc-wrap {
flex-wrap: wrap;
}
#mortgage-wrap.calc-wrap #mortgage-plugin {
margin-block: 40px;
}
.gallery-img-box {
margin: 0;
margin-inline: 15px;
}
.main-header {
position: relative;
top: 0;
z-index: inherit;
}
body:has(.banner-section) .main-header {
position: relative;
top: 0;
}
body:has(.banner-section) .main-menu ul li a,
body:has(.banner-section) .email-area a {
color: #1f2753;
}
body:has(.banner-section) .back-logo {
display: block;
}
body:has(.banner-section) .white-logo {
display: none;
}
.banner-text-block .primary-btn {
z-index: 0;
}
.gallery-img-box {
padding-right: 0;
}
.main-header.fixed,
body:has(.banner-section) .main-header.fixed {
top: 0;
}
.calculator-banner h1 {
font-size: 32px;
}
}
@media only screen and (max-width: 390px) {
.our-service-listing-section .our-service-box .icon-box {
transform: translate(255px, -75px);
}
.our-service-listing-section .our-service-box:hover .icon-box {
transform: translate(189%, -270%);
}
.get-in-touch-popup-box {
max-width: 350px;
}
.get-in-touch-popup-box .get-in-touch-text .gform_footer {
margin-top: 25px;
}
}
@media only screen and (max-width: 375px) {
.why-us-section .why-us-img-box:after {
display: none;
}
.our-service-listing-section .our-service-box .icon-box {
transform: translate(237px, -75px);
}
.our-service-listing-section .our-service-box:hover .icon-box {
transform: translate(173%, -260%);
}
.get-in-touch-popup-box {
max-width: 320px;
}
.get-in-touch-popup-box .get-in-touch-text h2 {
font-size: 26px;
}
.get-in-touch-popup-box .get-in-touch-text p {
font-size: 17px;
}
.get-in-touch-popup-box .get-in-touch-text h2 {
margin-top: 15px;
}
.check-rate-popup-box .get-in-touch-popup-box {
max-width: 360px;
}
}
@media only screen and (max-width: 360px) {
.our-service-listing-section .our-service-box .icon-box {
transform: translate(223px, -75px);
}
.our-service-listing-section .our-service-box:hover .icon-box {
transform: translate(173%, -260%);
}
.mortgage-rate-info-section h2 {
padding-top: 30px;
}
.check-rate-popup-box .get-in-touch-popup-box {
max-width: 340px;
}
}
@media only screen and (max-width: 340px) {
.why-us-section .why-us-img-box .big-img {
height: 400px;
}
.why-us-section .why-us-img-box .small-img img {
margin-top: -320px;
height: auto;
max-width: 260px;
}
.our-service-listing-section .our-service-box .icon-box {
transform: translate(203px, -75px);
}
.our-service-listing-section .our-service-box:hover .icon-box {
transform: translate(154%, -245%);
}
.mortgage-rate-info-section .row .mortgage-rate-content-box {
padding-top: 60px;
}
.get-in-touch-popup-box {
max-width: 280px;
}
.check-rate-popup-box .get-in-touch-popup-box {
max-width: 320px;
}
}
@media only screen and (max-width: 320px) {
.our-service-listing-section .our-service-box .icon-box {
transform: translate(183px, -75px);
}
.our-service-listing-section .our-service-box:hover .icon-box {
transform: translate(141%, -239%);
}
.mortgage-rate-info-section .row .mortgage-rate-content-box {
padding-top: 80px;
}
.check-rate-popup-box .get-in-touch-popup-box {
max-width: 300px;
}
}
@media only screen and (max-width: 767px) {
.desc-only-section {
padding: 20px 15px;
}
}  header .menu-item.current-menu-item a {
color: #d09a29;
} .social-contact-title.address-contact p:nth-of-type(2) {
padding-left: 40px;
}
.social-contact-title.phone-contact p:nth-of-type(2),
.social-contact-title.phone-contact p:nth-of-type(3) {
padding-left: 49px;
}
.subscribe-form .gform_confirmation_message {
color: #fff;
}
div#gform_confirmation_message_2 {
font-size: 23px;
text-align: center;
color: #1f2753;
font-weight: 500;
} #menu-header-menu li {
position: relative;
}
#menu-header-menu > li {
margin: 0 10px;
}
#menu-header-menu li a {
color: #333;
text-decoration: none;
padding: 0px;
display: block;
} #menu-header-menu > li.current-menu-item > a,
#menu-header-menu > li.current-menu-parent > a {
color: #c87b23 !important; font-weight: 500;
}
#menu-header-menu > li.two-col .mega-menu {
width: 43.7vw !important;
top: 82px !important;
} #menu-header-menu li.menu-item-has-children > ul.sub-menu { position: absolute;
background-color: #333;
width: 257px;
box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2);
z-index: 100;
padding: 0;
margin: 0;
border-radius: 6px;
overflow: hidden;
top: 150%;
transform: translate3d(0px, 4rem, 0px) scale3d(1, 1, 1) rotateX(0deg)
rotateY(0deg) rotateZ(0deg) skew(0deg, 0deg);
transform-style: preserve-3d;
opacity: 0;
transition: all 0.5s;
pointer-events: none;
}
#menu-header-menu li.menu-item-has-children:hover > ul.sub-menu { transform: translate3d(0px, 0rem, 0px) scale3d(1, 1, 1) rotateX(0deg)
rotateY(0deg) rotateZ(0deg) skew(0deg, 0deg);
opacity: 1;
pointer-events: all;
}   #menu-header-menu li.menu-item-has-children > ul.sub-menu li a {
color: white;
padding: 15px;
border-bottom: 1px solid rgba(255, 255, 255, 0.05);
text-align: center;
} #menu-header-menu li.menu-item-has-children > ul.sub-menu li.active-submenu a {
background-color: #d09a29;
font-weight: 500;
text-align: center;
} #menu-header-menu li.menu-item-has-children > ul.sub-menu li a:hover {
background-color: #444;
} #menu-header-menu li.menu-item-has-children > a:after {
content: "▼";
font-size: 10px;
margin-left: 5px;
vertical-align: middle;
}
#menu-header-menu li.menu-item-has-children:hover > a:before {
pointer-events: all;
}
#menu-header-menu li.menu-item-has-children > a:before {
position: absolute;
left: -15px;
top: 0;
width: calc(100% + 30px);
height: 100px;
content: "";
pointer-events: none;
} .close-icon {
cursor: pointer;
padding: 0px;
display: none; }
.interest-rates-section {
padding: 60px 15px;
}
.interest-rates-section .custom-table {
margin-top: 50px;
}
.table-responsive {
overflow-x: auto;
}
.custom-table {
width: 100%;
border-collapse: collapse;
min-width: 1100px;
border-radius: 6px;
}
.custom-table thead th {
font-size: 16px;
line-height: 32px;
background: #1f2753;
color: #fff;
font-weight: 500;
padding: 16px;
text-align: left;
white-space: nowrap;
}
.custom-table tbody td {
font-size: 16px;
line-height: 32px;
color: #2e2e2e;
font-weight: 500;
padding: 10px 16px;
text-align: left;
border: 1px solid #e5e5e7;
}
.custom-table tbody td img {
max-width: 100px;
}
.custom-table tbody tr:nth-child(odd) {
background-color: #f1f1f2;
}
.custom-table thead tr th:first-child {
border-top-left-radius: 6px;
}
.custom-table thead tr th:last-child {
border-top-right-radius: 6px;
}
.custom-table tbody tr:last-child td:first-child {
border-bottom-left-radius: 6px;
}
.custom-table tbody tr:last-child td:last-child {
border-bottom-right-radius: 6px;
}
.get-in-touch-popup-box-wrapper
.get-in-touch-popup-box
.get-in-touch-text
.gform_footer
input {
background: #1f2753 !important;
}
.get-in-touch-popup-box-wrapper
.get-in-touch-popup-box
.get-in-touch-text
form
input[type="submit"]:hover {
background-color: #bb8922 !important;
}
.home-page-google {
display: block;
width: 100%;
padding: 50px 0 0;
margin: 0 0 50px;
}
.google-reviews-section .title-box {
text-align: center;
margin: 10px 0 16px;
padding: 0 15px;
}
.google-reviews-section .main-title {
margin: 0 0 13px;
}
.single-team-details-section {
padding-block: 50px 8px !important;
}
.interest-rates-section .why-us-text p {
text-align: center;
}
.interest-rates-section .why-us-text .main-title {
text-align: center;
} @media (max-width: 768px) {
#menu-header-menu li.menu-item-has-children > ul.sub-menu {
position: static;
width: 100%;
display: none;
}
body:has(.banner-section) .main-header #menu-header-menu li a {
color: #333;
}
#menu-header-menu li.menu-item-has-children > a:after {
display: none;
}
.close-icon {
display: block;
}
}
.menu-item-has-children:hover .mega-menu {
transform: translateY(0);
opacity: 1;
pointer-events: all;
}.slick-slider
{
position: relative;
display: block;
box-sizing: border-box;
-webkit-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none;
-webkit-touch-callout: none;
-khtml-user-select: none;
-ms-touch-action: pan-y;
touch-action: pan-y;
-webkit-tap-highlight-color: transparent;
}
.slick-list
{
position: relative;
display: block;
overflow: hidden;
margin: 0;
padding: 0;
}
.slick-list:focus
{
outline: none;
}
.slick-list.dragging
{
cursor: pointer;
cursor: hand;
}
.slick-slider .slick-track,
.slick-slider .slick-list
{
-webkit-transform: translate3d(0, 0, 0);
-moz-transform: translate3d(0, 0, 0);
-ms-transform: translate3d(0, 0, 0);
-o-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
.slick-track
{
position: relative;
top: 0;
left: 0;
display: block;
margin-left: auto;
margin-right: auto;
}
.slick-track:before,
.slick-track:after
{
display: table;
content: '';
}
.slick-track:after
{
clear: both;
}
.slick-loading .slick-track
{
visibility: hidden;
}
.slick-slide
{
display: none;
float: left;
height: 100%;
min-height: 1px;
}
[dir='rtl'] .slick-slide
{
float: right;
}
.slick-slide img
{
display: block;
}
.slick-slide.slick-loading img
{
display: none;
}
.slick-slide.dragging img
{
pointer-events: none;
}
.slick-initialized .slick-slide
{
display: block;
}
.slick-loading .slick-slide
{
visibility: hidden;
}
.slick-vertical .slick-slide
{
display: block;
height: auto;
border: 1px solid transparent;
}
.slick-arrow.slick-hidden {
display: none;
}
 .slick-loading .slick-list
{
background: #fff url(//financehub.trustmat.com/wp-content/uploads/2023/12/ajax-loader.gif) center center no-repeat;
} @font-face
{
font-family: 'slick';
font-weight: normal;
font-style: normal;
src: url(https://financehub.trustmat.com/wp-content/themes/financehub/css/fonts/slick.eot);
src: url(https://financehub.trustmat.com/wp-content/themes/financehub/css/fonts/slick.eot?#iefix) format('embedded-opentype'), url(//financehub.trustmat.com/wp-content/themes/financehub/fonts/slick.woff) format('woff'), url(//financehub.trustmat.com/wp-content/uploads/2023/12/slick-arrow.png) format('truetype'), url(https://financehub.trustmat.com/wp-content/themes/financehub/css/fonts/slick.svg#slick) format('svg');
} .slick-prev,
.slick-next
{
font-size: 0;
line-height: 0;
position: absolute;
top: 50%;
display: block;
width: 20px;
height: 20px;
padding: 0;
-webkit-transform: translate(0, -50%);
-ms-transform: translate(0, -50%);
transform: translate(0, -50%);
cursor: pointer;
color: transparent;
border: none;
outline: none;
background: transparent;
}
.slick-prev:hover,
.slick-prev:focus,
.slick-next:hover,
.slick-next:focus
{
color: transparent;
outline: none;
background: transparent;
}
.slick-prev:hover:before,
.slick-prev:focus:before,
.slick-next:hover:before,
.slick-next:focus:before
{
opacity: 1;
}
.slick-prev.slick-disabled:before,
.slick-next.slick-disabled:before
{
opacity: .25;
}
.slick-prev:before,
.slick-next:before
{
font-family: 'slick';
font-size: 20px;
line-height: 1;
opacity: .75;
color: white;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
}
.slick-prev
{
left: -25px;
}
[dir='rtl'] .slick-prev
{
right: -25px;
left: auto;
}
.slick-prev:before
{
content: '←';
}
[dir='rtl'] .slick-prev:before
{
content: '→';
}
.slick-next
{
right: -25px;
}
[dir='rtl'] .slick-next
{
right: auto;
left: -25px;
}
.slick-next:before
{
content: '→';
}
[dir='rtl'] .slick-next:before
{
content: '←';
} .slick-dotted.slick-slider
{
margin-bottom: 30px;
}
.slick-dots
{
position: absolute;
bottom: -25px;
display: block;
width: 100%;
padding: 0;
margin: 0;
list-style: none;
text-align: center;
}
.slick-dots li
{
position: relative;
display: inline-block;
width: 20px;
height: 20px;
margin: 0 5px;
padding: 0;
cursor: pointer;
}
.slick-dots li button
{
font-size: 0;
line-height: 0;
display: block;
width: 20px;
height: 20px;
padding: 5px;
cursor: pointer;
color: transparent;
border: 0;
outline: none;
background: transparent;
}
.slick-dots li button:hover,
.slick-dots li button:focus
{
outline: none;
}
.slick-dots li button:hover:before,
.slick-dots li button:focus:before
{
opacity: 1;
}
.slick-dots li button:before
{
font-family: 'slick';
font-size: 6px;
line-height: 20px;
position: absolute;
top: 0;
left: 0;
width: 20px;
height: 20px;
content: '•';
text-align: center;
opacity: .25;
color: black;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
}
.slick-dots li.slick-active button:before
{
opacity: .75;
color: black;
}.animated { 
-webkit-animation-duration: 1s; 
animation-duration: 1s; 
-webkit-animation-fill-mode: both; 
animation-fill-mode: both; 
} 
.slow{
-webkit-animation-duration: 1.5s; 
animation-duration: 1.5s; 
-webkit-animation-fill-mode: both; 
animation-fill-mode: both; 
}
.slower{
-webkit-animation-duration: 2s; 
animation-duration: 2s; 
-webkit-animation-fill-mode: both; 
animation-fill-mode: both; 
}
.slowest{
-webkit-animation-duration: 3s; 
animation-duration: 3s; 
-webkit-animation-fill-mode: both; 
animation-fill-mode: both; 
} .delay-250 {
-webkit-animation-delay:0.25s;
-moz-animation-delay:0.25s;
-o-animation-delay:0.25s;
animation-delay:0.25s;
}
.delay-500 {
-webkit-animation-delay:0.5s;
-moz-animation-delay:0.5s;
-o-animation-delay:0.5s;
animation-delay:0.5s;
}
.delay-750 {
-webkit-animation-delay:0.75s;
-moz-animation-delay:0.75s;
-o-animation-delay:0.75s;
animation-delay:0.75s;
}
.delay-1000 {
-webkit-animation-delay:1.0s;
-moz-animation-delay:1.0s;
-o-animation-delay:1.0s;
animation-delay:1.0s;
}
.delay-1250 {
-webkit-animation-delay:1.25s;
-moz-animation-delay:1.25s;
-o-animation-delay:1.25s;
animation-delay:1.25s;
}
.delay-1500 {
-webkit-animation-delay:1.5s;
-moz-animation-delay:1.5s;
-o-animation-delay:1.5s;
animation-delay:1.5s;
}
.delay-1750 {
-webkit-animation-delay:1.75s;
-moz-animation-delay:1.75s;
-o-animation-delay:1.75s;
animation-delay:1.75s;
}
.delay-2000 {
-webkit-animation-delay:2.0s;
-moz-animation-delay:2.0s;
-o-animation-delay:2.0s;
animation-delay:2.0s;
}
.delay-2500 {
-webkit-animation-delay:2.5s;
-moz-animation-delay:2.5s;
-o-animation-delay:2.5s;
animation-delay:2.5s;
}
.delay-2000 {
-webkit-animation-delay:2.0s;
-moz-animation-delay:2.0s;
-o-animation-delay:2.0s;
animation-delay:2.0s;
}
.delay-2500 {
-webkit-animation-delay:2.5s;
-moz-animation-delay:2.5s;
-o-animation-delay:2.5s;
animation-delay:2.5s;
}
.delay-3000 {
-webkit-animation-delay:3.0s;
-moz-animation-delay:3.0s;
-o-animation-delay:3.0s;
animation-delay:3.0s;
}
.delay-3500 {
-webkit-animation-delay:3.5s;
-moz-animation-delay:3.5s;
-o-animation-delay:3.5s;
animation-delay:3.5s;
}
.bounceInRight, .bounceInLeft, .bounceInUp, .bounceInDown{
opacity:0;
-webkit-transform: translateX(400px); 
transform: translateX(400px); 
}
.fadeInRight, .fadeInLeft, .fadeInUp, .fadeInDown{
opacity:0;
-webkit-transform: translateX(400px); 
transform: translateX(400px); 
}
.flipInX, .flipInY, .rotateIn, .rotateInUpLeft, .rotateInUpRight, .rotateInDownLeft, .rotateDownUpRight, .rollIn{
opacity:0;
}
.lightSpeedInRight, .lightSpeedInLeft{
opacity:0;
-webkit-transform: translateX(400px); 
transform: translateX(400px); 
} @-webkit-keyframes bounceIn { 
0% { 
opacity: 0; 
-webkit-transform: scale(.3); 
} 
50% { 
opacity: 1; 
-webkit-transform: scale(1.05); 
} 
70% { 
-webkit-transform: scale(.9); 
} 
100% { 
-webkit-transform: scale(1); 
} 
} 
@keyframes bounceIn { 
0% { 
opacity: 0; 
transform: scale(.3); 
} 
50% { 
opacity: 1; 
transform: scale(1.05); 
} 
70% { 
transform: scale(.9); 
} 
100% { 
transform: scale(1); 
} 
} 
.bounceIn.go { 
-webkit-animation-name: bounceIn; 
animation-name: bounceIn; 
} @-webkit-keyframes bounceInRight { 
0% { 
opacity: 0; 
-webkit-transform: translateX(400px); 
} 
60% { 
-webkit-transform: translateX(-30px); 
} 
80% { 
-webkit-transform: translateX(10px); 
} 
100% {
opacity: 1;
-webkit-transform: translateX(0); 
} 
} 
@keyframes bounceInRight { 
0% { 
opacity: 0; 
transform: translateX(400px); 
} 
60% { 
transform: translateX(-30px); 
} 
80% { 
transform: translateX(10px); 
} 
100% {
opacity: 1;
transform: translateX(0); 
} 
} 
.bounceInRight.go { 
-webkit-animation-name: bounceInRight; 
animation-name: bounceInRight; 
} @-webkit-keyframes bounceInLeft { 
0% { 
opacity: 0; 
-webkit-transform: translateX(-400px); 
} 
60% { 
-webkit-transform: translateX(30px); 
} 
80% { 
-webkit-transform: translateX(-10px); 
} 
100% {
opacity: 1;
-webkit-transform: translateX(0); 
} 
} 
@keyframes bounceInLeft { 
0% { 
opacity: 0; 
transform: translateX(-400px); 
} 
60% { 
transform: translateX(30px); 
} 
80% { 
transform: translateX(-10px); 
} 
100% {
opacity: 1;
transform: translateX(0); 
} 
} 
.bounceInLeft.go { 
-webkit-animation-name: bounceInLeft; 
animation-name: bounceInLeft; 
} @-webkit-keyframes bounceInUp { 
0% { 
opacity: 0; 
-webkit-transform: translateY(400px); 
} 
60% { 
-webkit-transform: translateY(-30px); 
} 
80% { 
-webkit-transform: translateY(10px); 
} 
100% {
opacity: 1;
-webkit-transform: translateY(0); 
} 
} 
@keyframes bounceInUp { 
0% { 
opacity: 0; 
transform: translateY(400px); 
} 
60% { 
transform: translateY(-30px); 
} 
80% { 
transform: translateY(10px); 
} 
100% {
opacity: 1;
transform: translateY(0); 
} 
} 
.bounceInUp.go { 
-webkit-animation-name: bounceInUp; 
animation-name: bounceInUp; 
} @-webkit-keyframes bounceInDown { 
0% { 
opacity: 0; 
-webkit-transform: translateY(-400px); 
} 
60% { 
-webkit-transform: translateY(30px); 
} 
80% { 
-webkit-transform: translateY(-10px); 
} 
100% {
opacity: 1;
-webkit-transform: translateY(0); 
} 
} 
@keyframes bounceInDown { 
0% { 
opacity: 0; 
transform: translateY(-400px); 
} 
60% { 
transform: translateY(30px); 
} 
80% { 
transform: translateY(-10px); 
} 
100% {
opacity: 1;
transform: translateY(0); 
} 
} 
.bounceInDown.go { 
-webkit-animation-name: bounceInDown; 
animation-name: bounceInDown; 
} @-webkit-keyframes fadeIn { 
0% {opacity: 0;} 
100% {opacity: 1;
display:block;} 
} 
@keyframes fadeIn { 
0% {opacity: 0;} 
100% {opacity: 1;
display:block;} 
}
.fadeIn{
opacity:0;
}
.fadeIn.go { 
-webkit-animation-name: fadeIn; 
animation-name: fadeIn; 
} @-webkit-keyframes growIn { 
0% { 
-webkit-transform: scale(0.2); 
opacity:0;
} 
50% { 
-webkit-transform: scale(1.2); 
} 
100% { 
-webkit-transform: scale(1); 
opacity:1;
} 
} 
@keyframes growIn { 
0% { 
transform: scale(0.2); 
opacity:0;
} 
50% { 
transform: scale(1.2); 
} 
100% { 
transform: scale(1); 
opacity:1;
} 
} 
.growIn { 
-webkit-transform: scale(0.2);
transform: scale(0.2);
opacity:0;
}
.growIn.go{
-webkit-animation-name: growIn; 
animation-name: growIn; 
} @-webkit-keyframes shake { 
0%, 100% {-webkit-transform: translateX(0);} 
10%, 30%, 50%, 70%, 90% {-webkit-transform: translateX(-10px);} 
20%, 40%, 60%, 80% {-webkit-transform: translateX(10px);} 
} 
@keyframes shake { 
0%, 100% {transform: translateX(0);} 
10%, 30%, 50%, 70%, 90% {transform: translateX(-10px);} 
20%, 40%, 60%, 80% {transform: translateX(10px);} 
} 
.shake.go { 
-webkit-animation-name: shake; 
animation-name: shake; 
} @-webkit-keyframes shakeUp { 
0%, 100% {-webkit-transform: translateY(0);} 
10%, 30%, 50%, 70%, 90% {-webkit-transform: translateY(-10px);} 
20%, 40%, 60%, 80% {-webkit-transform: translateY(10px);} 
} 
@keyframes shakeUp { 
0%, 100% {transform: translateY(0);} 
10%, 30%, 50%, 70%, 90% {transform: translateY(-10px);} 
20%, 40%, 60%, 80% {transform: translateY(10px);} 
} 
.shakeUp.go { 
-webkit-animation-name: shakeUp; 
animation-name: shakeUp; 
} @-webkit-keyframes fadeInLeft { 
0% { 
opacity: 0; 
-webkit-transform: translateX(-400px); 
} 
50%{
opacity: 0.3; 
}
100% { 
opacity: 1; 
-webkit-transform: translateX(0); 
} 
} 
@keyframes fadeInLeft { 
0% { 
opacity: 0; 
transform: translateX(-400px); 
} 
50%{
opacity: 0.3; 
}
100% { 
opacity: 1; 
transform: translateX(0); 
} 
} 
.fadeInLeft{ 
opacity: 0; 
-webkit-transform: translateX(-400px); 
transform: translateX(-400px);
}
.fadeInLeft.go { 
-webkit-animation-name: fadeInLeft; 
animation-name: fadeInLeft; 
} @-webkit-keyframes fadeInRight { 
0% { 
opacity: 0; 
-webkit-transform: translateX(400px); 
} 
50%{
opacity: 0.3; 
}
100% { 
opacity: 1; 
-webkit-transform: translateX(0); 
} 
} 
@keyframes fadeInRight { 
0% { 
opacity: 0; 
transform: translateX(400px); 
} 
50%{
opacity: 0.3; 
}
100% { 
opacity: 1; 
transform: translateX(0); 
} 
} 
.fadeInRight{ 
opacity: 0; 
-webkit-transform: translateX(400px); 
transform: translateX(400px);
}
.fadeInRight.go { 
-webkit-animation-name: fadeInRight; 
animation-name: fadeInRight; 
} @-webkit-keyframes fadeInUp { 
0% { 
opacity: 0; 
-webkit-transform: translateY(400px); 
} 
50%{
opacity: 0.3; 
}
100% { 
opacity: 1; 
-webkit-transform: translateY(0); 
} 
} 
@keyframes fadeInUp { 
0% { 
opacity: 0; 
transform: translateY(400px); 
} 
50%{
opacity: 0.3; 
}
100% { 
opacity: 1; 
transform: translateY(0); 
} 
} 
.fadeInUp{ 
opacity: 0; 
-webkit-transform: translateY(400px); 
transform: translateY(400px);
}
.fadeInUp.go { 
-webkit-animation-name: fadeInUp; 
animation-name: fadeInUp; 
} @-webkit-keyframes fadeInDown { 
0% { 
opacity: 0; 
-webkit-transform: translateY(-400px); 
} 
50%{
opacity: 0.3; 
}
100% { 
opacity: 1; 
-webkit-transform: translateY(0); 
} 
} 
@keyframes fadeInDown { 
0% { 
opacity: 0; 
transform: translateY(-400px); 
} 
50%{
opacity: 0.3; 
}
100% { 
opacity: 1; 
transform: translateY(0); 
} 
} 
.fadeInDown{ 
opacity: 0; 
-webkit-transform: translateY(-400px); 
transform: translateY(-400px);
}
.fadeInDown.go { 
-webkit-animation-name: fadeInDown; 
animation-name: fadeInDown; 
} @-webkit-keyframes rotateIn { 
0% { 
-webkit-transform-origin: center center; 
-webkit-transform: rotate(-200deg); 
opacity: 0; 
} 
100% { 
-webkit-transform-origin: center center; 
-webkit-transform: rotate(0); 
opacity: 1; 
} 
} 
@keyframes rotateIn { 
0% { 
transform-origin: center center; 
transform: rotate(-200deg); 
opacity: 0; 
} 
100% { 
transform-origin: center center; 
transform: rotate(0); 
opacity: 1; 
} 
} 
.rotateIn.go { 
-webkit-animation-name: rotateIn; 
animation-name: rotateIn; 
} @-webkit-keyframes rotateInUpLeft { 
0% { 
-webkit-transform-origin: left bottom; 
-webkit-transform: rotate(90deg); 
opacity: 0; 
} 
100% { 
-webkit-transform-origin: left bottom; 
-webkit-transform: rotate(0); 
opacity: 1; 
} 
} 
@keyframes rotateInUpLeft { 
0% { 
transform-origin: left bottom; 
transform: rotate(90deg); 
opacity: 0; 
} 
100% { 
transform-origin: left bottom; 
transform: rotate(0); 
opacity: 1; 
} 
} 
.rotateInUpLeft.go { 
-webkit-animation-name: rotateInUpLeft; 
animation-name: rotateInUpLeft; 
} @-webkit-keyframes rotateInDownLeft { 
0% { 
-webkit-transform-origin: left bottom; 
-webkit-transform: rotate(-90deg); 
opacity: 0; 
} 
100% { 
-webkit-transform-origin: left bottom; 
-webkit-transform: rotate(0); 
opacity: 1; 
} 
} 
@keyframes rotateInDownLeft { 
0% { 
transform-origin: left bottom; 
transform: rotate(-90deg); 
opacity: 0; 
} 
100% { 
transform-origin: left bottom; 
transform: rotate(0); 
opacity: 1; 
} 
} 
.rotateInDownLeft.go { 
-webkit-animation-name: rotateInDownLeft; 
animation-name: rotateInDownLeft; 
} @-webkit-keyframes rotateInUpRight { 
0% { 
-webkit-transform-origin: right bottom; 
-webkit-transform: rotate(-90deg); 
opacity: 0; 
} 
100% { 
-webkit-transform-origin: right bottom; 
-webkit-transform: rotate(0); 
opacity: 1; 
} 
} 
@keyframes rotateInUpRight { 
0% { 
transform-origin: right bottom; 
transform: rotate(-90deg); 
opacity: 0; 
} 
100% { 
transform-origin: right bottom; 
transform: rotate(0); 
opacity: 1; 
} 
} 
.rotateInUpRight.go { 
-webkit-animation-name: rotateInUpRight; 
animation-name: rotateInUpRight; 
} @-webkit-keyframes rotateInDownRight { 
0% { 
-webkit-transform-origin: right bottom; 
-webkit-transform: rotate(90deg); 
opacity: 0; 
} 
100% { 
-webkit-transform-origin: right bottom; 
-webkit-transform: rotate(0); 
opacity: 1; 
} 
} 
@keyframes rotateInDownRight { 
0% { 
transform-origin: right bottom; 
transform: rotate(90deg); 
opacity: 0; 
} 
100% { 
transform-origin: right bottom; 
transform: rotate(0); 
opacity: 1; 
} 
} 
.rotateInDownRight.go { 
-webkit-animation-name: rotateInDownRight; 
animation-name: rotateInDownRight; 
} @-webkit-keyframes rollIn { 
0% { opacity: 0; -webkit-transform: translateX(-100%) rotate(-120deg); } 
100% { opacity: 1; -webkit-transform: translateX(0px) rotate(0deg); } 
} 
@keyframes rollIn { 
0% { opacity: 0; transform: translateX(-100%) rotate(-120deg); } 
100% { opacity: 1; transform: translateX(0px) rotate(0deg); } 
} 
.rollIn.go { 
-webkit-animation-name: rollIn; 
animation-name: rollIn; 
} @-webkit-keyframes wiggle { 
0% { -webkit-transform: skewX(9deg); } 
10% { -webkit-transform: skewX(-8deg); } 
20% { -webkit-transform: skewX(7deg); } 
30% { -webkit-transform: skewX(-6deg); } 
40% { -webkit-transform: skewX(5deg); } 
50% { -webkit-transform: skewX(-4deg); } 
60% { -webkit-transform: skewX(3deg); } 
70% { -webkit-transform: skewX(-2deg); } 
80% { -webkit-transform: skewX(1deg); } 
90% { -webkit-transform: skewX(0deg); } 
100% { -webkit-transform: skewX(0deg); } 
} 
@keyframes wiggle { 
0% { transform: skewX(9deg); } 
10% { transform: skewX(-8deg); } 
20% { transform: skewX(7deg); } 
30% { transform: skewX(-6deg); } 
40% { transform: skewX(5deg); } 
50% { transform: skewX(-4deg); } 
60% { transform: skewX(3deg); } 
70% { transform: skewX(-2deg); } 
80% { transform: skewX(1deg); } 
90% { transform: skewX(0deg); } 
100% { transform: skewX(0deg); } 
} 
.wiggle.go { 
-webkit-animation-name: wiggle; 
animation-name: wiggle; 
-webkit-animation-timing-function: ease-in; 
animation-timing-function: ease-in; 
} @-webkit-keyframes swing { 
20%, 40%, 60%, 80%, 100% { -webkit-transform-origin: top center; } 
20% { -webkit-transform: rotate(15deg); } 
40% { -webkit-transform: rotate(-10deg); } 
60% { -webkit-transform: rotate(5deg); } 
80% { -webkit-transform: rotate(-5deg); } 
100% { -webkit-transform: rotate(0deg); } 
} 
@keyframes swing { 
20% { transform: rotate(15deg); } 
40% { transform: rotate(-10deg); } 
60% { transform: rotate(5deg); } 
80% { transform: rotate(-5deg); } 
100% { transform: rotate(0deg); } 
} 
.swing.go { 
-webkit-transform-origin: top center; 
transform-origin: top center; 
-webkit-animation-name: swing; 
animation-name: swing; 
} @-webkit-keyframes tada { 
0% {-webkit-transform: scale(1);} 
10%, 20% {-webkit-transform: scale(0.9) rotate(-3deg);} 
30%, 50%, 70%, 90% {-webkit-transform: scale(1.1) rotate(3deg);} 
40%, 60%, 80% {-webkit-transform: scale(1.1) rotate(-3deg);} 
100% {-webkit-transform: scale(1) rotate(0);} 
} 
@keyframes tada { 
0% {transform: scale(1);} 
10%, 20% {transform: scale(0.9) rotate(-3deg);} 
30%, 50%, 70%, 90% {transform: scale(1.1) rotate(3deg);} 
40%, 60%, 80% {transform: scale(1.1) rotate(-3deg);} 
100% {transform: scale(1) rotate(0);} 
} 
.tada.go { 
-webkit-animation-name: tada; 
animation-name: tada; 
} @-webkit-keyframes wobble { 
0% { -webkit-transform: translateX(0%); } 
15% { -webkit-transform: translateX(-25%) rotate(-5deg); } 
30% { -webkit-transform: translateX(20%) rotate(3deg); } 
45% { -webkit-transform: translateX(-15%) rotate(-3deg); } 
60% { -webkit-transform: translateX(10%) rotate(2deg); } 
75% { -webkit-transform: translateX(-5%) rotate(-1deg); } 
100% { -webkit-transform: translateX(0%); } 
} 
@keyframes wobble { 
0% { transform: translateX(0%); } 
15% { transform: translateX(-25%) rotate(-5deg); } 
30% { transform: translateX(20%) rotate(3deg); } 
45% { transform: translateX(-15%) rotate(-3deg); } 
60% { transform: translateX(10%) rotate(2deg); } 
75% { transform: translateX(-5%) rotate(-1deg); } 
100% { transform: translateX(0%); } 
} 
.wobble.go { 
-webkit-animation-name: wobble; 
animation-name: wobble; 
} @-webkit-keyframes pulse { 
0% { -webkit-transform: scale(1); } 
50% { -webkit-transform: scale(1.1); } 
100% { -webkit-transform: scale(1); } 
} 
@keyframes pulse { 
0% { transform: scale(1); } 
50% { transform: scale(1.1); } 
100% { transform: scale(1); } 
} 
.pulse.go { 
-webkit-animation-name: pulse; 
animation-name: pulse; 
} @-webkit-keyframes lightSpeedInRight { 
0% { -webkit-transform: translateX(100%) skewX(-30deg); opacity: 0; } 
60% { -webkit-transform: translateX(-20%) skewX(30deg); opacity: 1; } 
80% { -webkit-transform: translateX(0%) skewX(-15deg); opacity: 1; } 
100% { -webkit-transform: translateX(0%) skewX(0deg); opacity: 1; } 
} 
@keyframes lightSpeedInRight { 
0% { transform: translateX(100%) skewX(-30deg); opacity: 0; } 
60% { transform: translateX(-20%) skewX(30deg); opacity: 1; } 
80% { transform: translateX(0%) skewX(-15deg); opacity: 1; } 
100% { transform: translateX(0%) skewX(0deg); opacity: 1; } 
} 
.lightSpeedInRight.go { 
-webkit-animation-name: lightSpeedInRight; 
animation-name: lightSpeedInRight; 
-webkit-animation-timing-function: ease-out; 
animation-timing-function: ease-out; 
} @-webkit-keyframes lightSpeedInLeft { 
0% { -webkit-transform: translateX(-100%) skewX(30deg); opacity: 0; } 
60% { -webkit-transform: translateX(20%) skewX(-30deg); opacity: 1; } 
80% { -webkit-transform: translateX(0%) skewX(15deg); opacity: 1; } 
100% { -webkit-transform: translateX(0%) skewX(0deg); opacity: 1; } 
} 
@keyframes lightSpeedInLeft { 
0% { transform: translateX(-100%) skewX(30deg); opacity: 0; } 
60% { transform: translateX(20%) skewX(-30deg); opacity: 1; } 
80% { transform: translateX(0%) skewX(15deg); opacity: 1; } 
100% { transform: translateX(0%) skewX(0deg); opacity: 1; } 
} 
.lightSpeedInLeft.go { 
-webkit-animation-name: lightSpeedInLeft; 
animation-name: lightSpeedInLeft; 
-webkit-animation-timing-function: ease-out; 
animation-timing-function: ease-out; 
} @-webkit-keyframes flip { 
0% { 
-webkit-transform: perspective(400px) rotateY(0); 
-webkit-animation-timing-function: ease-out; 
} 
40% { 
-webkit-transform: perspective(400px) translateZ(150px) rotateY(170deg); 
-webkit-animation-timing-function: ease-out; 
} 
50% { 
-webkit-transform: perspective(400px) translateZ(150px) rotateY(190deg) scale(1); 
-webkit-animation-timing-function: ease-in; 
} 
80% { 
-webkit-transform: perspective(400px) rotateY(360deg) scale(.95); 
-webkit-animation-timing-function: ease-in; 
} 
100% { 
-webkit-transform: perspective(400px) scale(1); 
-webkit-animation-timing-function: ease-in; 
} 
}
@keyframes flip { 
0% { 
transform: perspective(400px) rotateY(0); 
animation-timing-function: ease-out; 
} 
40% { 
transform: perspective(400px) translateZ(150px) rotateY(170deg); 
animation-timing-function: ease-out; 
} 
50% { 
transform: perspective(400px) translateZ(150px) rotateY(190deg) scale(1); 
animation-timing-function: ease-in; 
} 
80% { 
transform: perspective(400px) rotateY(360deg) scale(.95); 
animation-timing-function: ease-in; 
} 
100% { 
transform: perspective(400px) scale(1); 
animation-timing-function: ease-in; 
} 
} 
.flip.go { 
-webkit-backface-visibility: visible !important; 
-webkit-animation-name: flip; 
backface-visibility: visible !important; 
animation-name: flip; 
} @-webkit-keyframes flipInX { 
0% { 
-webkit-transform: perspective(400px) rotateX(90deg); 
opacity: 0; 
} 
40% { 
-webkit-transform: perspective(400px) rotateX(-10deg); 
} 
70% { 
-webkit-transform: perspective(400px) rotateX(10deg); 
} 
100% { 
-webkit-transform: perspective(400px) rotateX(0deg); 
opacity: 1; 
} 
} 
@keyframes flipInX { 
0% { 
transform: perspective(400px) rotateX(90deg); 
opacity: 0; 
} 
40% { 
transform: perspective(400px) rotateX(-10deg); 
} 
70% { 
transform: perspective(400px) rotateX(10deg); 
} 
100% { 
transform: perspective(400px) rotateX(0deg); 
opacity: 1; 
} 
} 
.flipInX.go { 
-webkit-backface-visibility: visible !important; 
-webkit-animation-name: flipInX; 
backface-visibility: visible !important; 
animation-name: flipInX; 
} @-webkit-keyframes flipInY { 
0% { 
-webkit-transform: perspective(400px) rotateY(90deg); 
opacity: 0; 
} 
40% { 
-webkit-transform: perspective(400px) rotateY(-10deg); 
} 
70% { 
-webkit-transform: perspective(400px) rotateY(10deg); 
} 
100% { 
-webkit-transform: perspective(400px) rotateY(0deg); 
opacity: 1; 
} 
} 
@keyframes flipInY { 
0% { 
transform: perspective(400px) rotateY(90deg); 
opacity: 0; 
} 
40% { 
transform: perspective(400px) rotateY(-10deg); 
} 
70% { 
transform: perspective(400px) rotateY(10deg); 
} 
100% { 
transform: perspective(400px) rotateY(0deg); 
opacity: 1; 
} 
} 
.flipInY.go { 
-webkit-backface-visibility: visible !important; 
-webkit-animation-name: flipInY; 
backface-visibility: visible !important; 
animation-name: flipInY; 
}  @-webkit-keyframes bounceOut { 
0% { 
-webkit-transform: scale(1); 
} 
25% { 
-webkit-transform: scale(.95); 
} 
50% { 
opacity: 1; 
-webkit-transform: scale(1.1); 
} 
100% { 
opacity: 0; 
-webkit-transform: scale(.3); 
} 
} 
@keyframes bounceOut { 
0% { 
transform: scale(1); 
} 
25% { 
transform: scale(.95); 
} 
50% { 
opacity: 1; 
transform: scale(1.1); 
} 
100% { 
opacity: 0; 
transform: scale(.3); 
} 
} 
.bounceOut.goAway { 
-webkit-animation-name: bounceOut; 
animation-name: bounceOut; 
} @-webkit-keyframes bounceOutUp { 
0% { 
-webkit-transform: translateY(0); 
} 
20% { 
opacity: 1; 
-webkit-transform: translateY(20px); 
} 
100% { 
opacity: 0; 
-webkit-transform: translateY(-2000px); 
} 
} 
@keyframes bounceOutUp { 
0% { 
transform: translateY(0); 
} 
20% { 
opacity: 1; 
transform: translateY(20px); 
} 
100% { 
opacity: 0; 
transform: translateY(-2000px); 
} 
} 
.bounceOutUp.goAway { 
-webkit-animation-name: bounceOutUp; 
animation-name: bounceOutUp; 
} @-webkit-keyframes bounceOutDown { 
0% { 
-webkit-transform: translateY(0); 
} 
20% { 
opacity: 1; 
-webkit-transform: translateY(-20px); 
} 
100% { 
opacity: 0; 
-webkit-transform: translateY(2000px); 
} 
} 
@keyframes bounceOutDown { 
0% { 
transform: translateY(0); 
} 
20% { 
opacity: 1; 
transform: translateY(-20px); 
} 
100% { 
opacity: 0; 
transform: translateY(2000px); 
} 
} 
.bounceOutDown.goAway { 
-webkit-animation-name: bounceOutDown; 
animation-name: bounceOutDown; 
} @-webkit-keyframes bounceOutLeft { 
0% { 
-webkit-transform: translateX(0); 
} 
20% { 
opacity: 1; 
-webkit-transform: translateX(20px); 
} 
100% { 
opacity: 0; 
-webkit-transform: translateX(-2000px); 
} 
} 
@keyframes bounceOutLeft { 
0% { 
transform: translateX(0); 
} 
20% { 
opacity: 1; 
transform: translateX(20px); 
} 
100% { 
opacity: 0; 
transform: translateX(-2000px); 
} 
} 
.bounceOutLeft.goAway { 
-webkit-animation-name: bounceOutLeft; 
animation-name: bounceOutLeft; 
} @-webkit-keyframes bounceOutRight { 
0% { 
-webkit-transform: translateX(0); 
} 
20% { 
opacity: 1; 
-webkit-transform: translateX(-20px); 
} 
100% { 
opacity: 0; 
-webkit-transform: translateX(2000px); 
} 
} 
@keyframes bounceOutRight { 
0% { 
transform: translateX(0); 
} 
20% { 
opacity: 1; 
transform: translateX(-20px); 
} 
100% { 
opacity: 0; 
transform: translateX(2000px); 
} 
} 
.bounceOutRight.goAway { 
-webkit-animation-name: bounceOutRight; 
animation-name: bounceOutRight; 
} @-webkit-keyframes fadeOut { 
0% {opacity: 1;} 
100% {opacity: 0;} 
} 
@keyframes fadeOut { 
0% {opacity: 1;} 
100% {opacity: 0;} 
} 
.fadeOut.goAway { 
-webkit-animation-name: fadeOut; 
animation-name: fadeOut; 
} @-webkit-keyframes fadeOutUp { 
0% { 
opacity: 1; 
-webkit-transform: translateY(0); 
} 
100% { 
opacity: 0; 
-webkit-transform: translateY(-2000px); 
} 
} 
@keyframes fadeOutUp { 
0% { 
opacity: 1; 
transform: translateY(0); 
} 
100% { 
opacity: 0; 
transform: translateY(-2000px); 
} 
} 
.fadeOutUp.goAway { 
-webkit-animation-name: fadeOutUp; 
animation-name: fadeOutUp; 
} @-webkit-keyframes fadeOutDown { 
0% { 
opacity: 1; 
-webkit-transform: translateY(0); 
} 
100% { 
opacity: 0; 
-webkit-transform: translateY(2000px); 
} 
} 
@keyframes fadeOutDown { 
0% { 
opacity: 1; 
transform: translateY(0); 
} 
100% { 
opacity: 0; 
transform: translateY(2000px); 
} 
} 
.fadeOutDown.goAway { 
-webkit-animation-name: fadeOutDown; 
animation-name: fadeOutDown; 
} @-webkit-keyframes fadeOutLeft { 
0% { 
opacity: 1; 
-webkit-transform: translateX(0); 
} 
100% { 
opacity: 0; 
-webkit-transform: translateX(-2000px); 
} 
} 
@keyframes fadeOutLeft { 
0% { 
opacity: 1; 
transform: translateX(0); 
} 
100% { 
opacity: 0; 
transform: translateX(-2000px); 
} 
} 
.fadeOutLeft.goAway { 
-webkit-animation-name: fadeOutLeft; 
animation-name: fadeOutLeft; 
} @-webkit-keyframes fadeOutRight { 
0% { 
opacity: 1; 
-webkit-transform: translateX(0); 
} 
100% { 
opacity: 0; 
-webkit-transform: translateX(2000px); 
} 
} 
@keyframes fadeOutRight { 
0% { 
opacity: 1; 
transform: translateX(0); 
} 
100% { 
opacity: 0; 
transform: translateX(2000px); 
} 
} 
.fadeOutRight.goAway { 
-webkit-animation-name: fadeOutRight; 
animation-name: fadeOutRight; 
} @-webkit-keyframes flipOutX { 
0% { 
-webkit-transform: perspective(400px) rotateX(0deg); 
opacity: 1; 
} 
100% { 
-webkit-transform: perspective(400px) rotateX(90deg); 
opacity: 0; 
} 
} 
@keyframes flipOutX { 
0% { 
transform: perspective(400px) rotateX(0deg); 
opacity: 1; 
} 
100% { 
transform: perspective(400px) rotateX(90deg); 
opacity: 0; 
} 
} 
.flipOutX.goAway { 
-webkit-animation-name: flipOutX; 
-webkit-backface-visibility: visible !important; 
animation-name: flipOutX; 
backface-visibility: visible !important; 
} @-webkit-keyframes flipOutY { 
0% { 
-webkit-transform: perspective(400px) rotateY(0deg); 
opacity: 1; 
} 
100% { 
-webkit-transform: perspective(400px) rotateY(90deg); 
opacity: 0; 
} 
} 
@keyframes flipOutY { 
0% { 
transform: perspective(400px) rotateY(0deg); 
opacity: 1; 
} 
100% { 
transform: perspective(400px) rotateY(90deg); 
opacity: 0; 
} 
} 
.flipOutY { 
-webkit-backface-visibility: visible !important; 
-webkit-animation-name: flipOutY; 
backface-visibility: visible !important; 
animation-name: flipOutY; 
} @-webkit-keyframes lightSpeedOutRight { 
0% { -webkit-transform: translateX(0%) skewX(0deg); opacity: 1; } 
100% { -webkit-transform: translateX(100%) skewX(-30deg); opacity: 0; } 
} 
@keyframes lightSpeedOutRight { 
0% { transform: translateX(0%) skewX(0deg); opacity: 1; } 
100% { transform: translateX(100%) skewX(-30deg); opacity: 0; } 
} 
.lightSpeedOutRight.goAway { 
-webkit-animation-name: lightSpeedOutRight; 
animation-name: lightSpeedOutRight; 
-webkit-animation-timing-function: ease-in; 
animation-timing-function: ease-in; 
} @-webkit-keyframes lightSpeedOutLeft { 
0% { -webkit-transform: translateX(0%) skewX(0deg); opacity: 1; } 
100% { -webkit-transform: translateX(-100%) skewX(30deg); opacity: 0; } 
} 
@keyframes lightSpeedOutLeft { 
0% { transform: translateX(0%) skewX(0deg); opacity: 1; } 
100% { transform: translateX(-100%) skewX(30deg); opacity: 0; } 
} 
.lightSpeedOutLeft.goAway { 
-webkit-animation-name: lightSpeedOutLeft; 
animation-name: lightSpeedOutLeft; 
-webkit-animation-timing-function: ease-in; 
animation-timing-function: ease-in; 
} @-webkit-keyframes rotateOut { 
0% { 
-webkit-transform-origin: center center; 
-webkit-transform: rotate(0); 
opacity: 1; 
} 
100% { 
-webkit-transform-origin: center center; 
-webkit-transform: rotate(200deg); 
opacity: 0; 
} 
} 
@keyframes rotateOut { 
0% { 
transform-origin: center center; 
transform: rotate(0); 
opacity: 1; 
} 
100% { 
transform-origin: center center; 
transform: rotate(200deg); 
opacity: 0; 
} 
} 
.rotateOut.goAway { 
-webkit-animation-name: rotateOut; 
animation-name: rotateOut; 
} @-webkit-keyframes rotateOutUpLeft { 
0% { 
-webkit-transform-origin: left bottom; 
-webkit-transform: rotate(0); 
opacity: 1; 
} 
100% { 
-webkit-transform-origin: left bottom; 
-webkit-transform: rotate(-90deg); 
opacity: 0; 
} 
} 
@keyframes rotateOutUpLeft { 
0% { 
transform-origin: left bottom; 
transform: rotate(0); 
opacity: 1; 
} 
100% { 
-transform-origin: left bottom; 
-transform: rotate(-90deg); 
opacity: 0; 
} 
} 
.rotateOutUpLeft.goAway { 
-webkit-animation-name: rotateOutUpLeft; 
animation-name: rotateOutUpLeft; 
} @-webkit-keyframes rotateOutDownLeft { 
0% { 
-webkit-transform-origin: left bottom; 
-webkit-transform: rotate(0); 
opacity: 1; 
} 
100% { 
-webkit-transform-origin: left bottom; 
-webkit-transform: rotate(90deg); 
opacity: 0; 
} 
} 
@keyframes rotateOutDownLeft { 
0% { 
transform-origin: left bottom; 
transform: rotate(0); 
opacity: 1; 
} 
100% { 
transform-origin: left bottom; 
transform: rotate(90deg); 
opacity: 0; 
} 
} 
.rotateOutDownLeft.goAway { 
-webkit-animation-name: rotateOutDownLeft; 
animation-name: rotateOutDownLeft; 
} @-webkit-keyframes rotateOutUpRight { 
0% { 
-webkit-transform-origin: right bottom; 
-webkit-transform: rotate(0); 
opacity: 1; 
} 
100% { 
-webkit-transform-origin: right bottom; 
-webkit-transform: rotate(90deg); 
opacity: 0; 
} 
} 
@keyframes rotateOutUpRight { 
0% { 
transform-origin: right bottom; 
transform: rotate(0); 
opacity: 1; 
} 
100% { 
transform-origin: right bottom; 
transform: rotate(90deg); 
opacity: 0; 
} 
} 
.rotateOutUpRight.goAway { 
-webkit-animation-name: rotateOutUpRight; 
animation-name: rotateOutUpRight; 
} @-webkit-keyframes rollOut { 
0% { 
opacity: 1; 
-webkit-transform: translateX(0px) rotate(0deg); 
} 
100% { 
opacity: 0; 
-webkit-transform: translateX(100%) rotate(120deg); 
} 
} 
@keyframes rollOut { 
0% { 
opacity: 1; 
transform: translateX(0px) rotate(0deg); 
} 
100% { 
opacity: 0; 
transform: translateX(100%) rotate(120deg); 
} 
} 
.rollOut.goAway { 
-webkit-animation-name: rollOut; 
animation-name: rollOut; 
}  @-webkit-keyframes fadeInUpShort { 
0% { 
opacity: 0; 
-webkit-transform: translateY(20px); 
} 
100% { 
opacity: 1; 
-webkit-transform: translateY(0); 
} 
} 
@keyframes fadeInUpShort { 
0% { 
opacity: 0; 
transform: translateY(20px); 
} 
100% { 
opacity: 1; 
transform: translateY(0); 
} 
} 
.fadeInUpShort{
opacity: 0; 
-webkit-transform: translateY(20px); 
transform: translateY(20px); 
}
.fadeInUpShort.go { 
-webkit-animation-name: fadeInUpShort; 
animation-name: fadeInUpShort; 
} @-webkit-keyframes fadeInDownShort { 
0% { 
opacity: 0; 
-webkit-transform: translateY(-20px); 
} 
100% { 
opacity: 1; 
-webkit-transform: translateY(0); 
} 
} 
@keyframes fadeInDownShort { 
0% { 
opacity: 0; 
transform: translateY(-20px); 
} 
100% { 
opacity: 1; 
transform: translateY(0); 
} 
} 
.fadeInDownShort{
opacity: 0; 
-webkit-transform: translateY(-20px); 
transform: translateY(-20px); 
}
.fadeInDownShort.go { 
-webkit-animation-name: fadeInDownShort; 
animation-name: fadeInDownShort; 
} @-webkit-keyframes fadeInRightShort { 
0% { 
opacity: 0; 
-webkit-transform: translateX(20px); 
} 
100% { 
opacity: 1; 
-webkit-transform: translateX(0); 
} 
} 
@keyframes fadeInRightShort { 
0% { 
opacity: 0; 
transform: translateX(20px); 
} 
100% { 
opacity: 1; 
transform: translateX(0); 
} 
} 
.fadeInRightShort { 
opacity: 0; 
-webkit-transform: translateX(20px);  
transform: translateX(20px); 
}
.fadeInRightShort.go { 
-webkit-animation-name: fadeInRightShort; 
animation-name: fadeInRightShort; 
} @-webkit-keyframes fadeInLeftShort { 
0% { 
opacity: 0; 
-webkit-transform: translateX(-20px); 
} 
100% { 
opacity: 1; 
-webkit-transform: translateX(0); 
} 
} 
@keyframes fadeInLeftShort { 
0% { 
opacity: 0; 
transform: translateX(-20px); 
} 
100% { 
opacity: 1; 
transform: translateX(0); 
} 
} 
.fadeInLeftShort { 
opacity: 0; 
-webkit-transform: translateX(-20px);  
transform: translateX(-20px); 
}
.fadeInLeftShort.go { 
-webkit-animation-name: fadeInLeftShort; 
animation-name: fadeInLeftShort; 
}.keep-in-touch-section .keep-in-touch-right-box {
width: 50%;
max-width: 606px;
}
.keep-in-touch-section .keep-in-touch-right-box form input.large,
.keep-in-touch-section .keep-in-touch-right-box form .textarea.medium {
background-repeat: no-repeat;
border-radius: 6px;
padding: 30px 15px 30px 60px;
background-position: 21px 50%;
background-size: 24px;
border: 1px solid #dce1e9;
font-size: 20px;
font-style: normal;
font-weight: 400;
color: rgb(0 0 0 / 50%);
}
.keep-in-touch-section .keep-in-touch-right-box form input#input_2_1 {
background-image: url(https://financehub.trustmat.com/wp-content/uploads/2023/12/user.svg);
}
.keep-in-touch-section .keep-in-touch-right-box form input#input_2_3 {
background-image: url(https://financehub.trustmat.com/wp-content/uploads/2023/12/mail.svg);
}
.keep-in-touch-section .keep-in-touch-right-box form input#input_2_4 {
background-image: url(https://financehub.trustmat.com/wp-content/uploads/2023/12/phone.svg);
}
.keep-in-touch-section .keep-in-touch-right-box form textarea#input_2_5 {
background-image: url(https://financehub.trustmat.com/wp-content/uploads/2023/12/edit.svg);
background-position: 25px 30px;
word-wrap: break-word;
}
.keep-in-touch-section
.keep-in-touch-right-box
form
.gfield--type-checkbox
.gform-field-label {
font-size: 18px;
font-style: normal;
font-weight: 400;
line-height: 1;
letter-spacing: -0.18px;
color: rgb(0 0 0 / 50%);
}
.keep-in-touch-section
.keep-in-touch-right-box
form
.gfield--type-checkbox
.gfield-choice-input {
border-color: #bb8a04;
}
.keep-in-touch-section
.keep-in-touch-right-box
form
.gfield--type-checkbox
.gfield-choice-input:before {
color: #bb8a04;
}
.keep-in-touch-section
.keep-in-touch-right-box
form
textarea#input_2_5::-webkit-input-placeholder {
font-size: 20px;
font-style: normal;
font-weight: 400;
line-height: 180%;
letter-spacing: -0.2px;
opacity: 0.5;
}
.keep-in-touch-section
.keep-in-touch-right-box
form
textarea#input_2_5::-moz-placeholder {
font-size: 20px;
font-style: normal;
font-weight: 400;
line-height: 180%;
letter-spacing: -0.2px;
opacity: 0.5;
}
.keep-in-touch-section
.keep-in-touch-right-box
form
textarea#input_2_5:-ms-input-placeholder {
font-size: 20px;
font-style: normal;
font-weight: 400;
line-height: 180%;
letter-spacing: -0.2px;
opacity: 0.5;
}
.keep-in-touch-section
.keep-in-touch-right-box
form
textarea#input_2_5:-moz-placeholder {
font-size: 20px;
font-style: normal;
font-weight: 400;
line-height: 180%;
letter-spacing: -0.2px;
opacity: 0.5;
}
.keep-in-touch-section
.gform-theme--framework
.gform_validation_errors
.gform_submission_error {
padding-bottom: 0;
}
.keep-in-touch-section
.keep-in-touch-right-box
form
input#gform_submit_button_2 {
display: block;
border-radius: 6px;
width: 100%;
padding: 17px 0;
background-color: #bb8a04;
font-size: 16px;
font-style: normal;
font-weight: 700;
line-height: 125%; letter-spacing: 0.32px;
}
.keep-in-touch-section
.keep-in-touch-right-box
form
input::-webkit-input-placeholder {
font-size: 20px;
font-style: normal;
font-weight: 400;
line-height: 180%;
letter-spacing: -0.2px;
opacity: 0.5;
}
.keep-in-touch-section .keep-in-touch-right-box form input::-moz-placeholder {
font-size: 20px;
font-style: normal;
font-weight: 400;
line-height: 180%;
letter-spacing: -0.2px;
opacity: 0.5;
}
.keep-in-touch-section
.keep-in-touch-right-box
form
input:-ms-input-placeholder {
font-size: 20px;
font-style: normal;
font-weight: 400;
line-height: 180%;
letter-spacing: -0.2px;
opacity: 0.5;
}
.keep-in-touch-section .keep-in-touch-right-box form input:-moz-placeholder {
font-size: 20px;
font-style: normal;
font-weight: 400;
line-height: 180%;
letter-spacing: -0.2px;
opacity: 0.5;
}
.keep-in-touch-section .keep-in-touch-right-box .gform_fields {
row-gap: 20px;
}
.subscribe-section .subscribe-inner-box {
display: flex;
flex-wrap: wrap;
justify-content: space-between;
align-items: center;
}
.subscribe-section .subscribe-inner-box .subscribe-form {
width: 50%;
max-width: 566px;
margin-left: auto;
}
.subscribe-section
.subscribe-inner-box
.subscribe-form
.ginput_container.ginput_container_email {
position: relative;
}
.subscribe-section
.subscribe-inner-box
.subscribe-form
form
.gform_footer.before {
margin: 0;
}
.subscribe-section .subscribe-inner-box .subscribe-form form {
position: relative;
padding: 15px;
background: #fff;
}
.subscribe-section
.subscribe-inner-box
.subscribe-form
form
.gform_footer.before
.gform_button {
background: #1f2753 !important;
display: block;
font-size: 16px;
font-style: normal;
font-weight: 600;
line-height: 28px;
text-transform: uppercase;
}
.subscribe-section
.subscribe-inner-box
.subscribe-form
.ginput_container.ginput_container_email
.large {
border: none;
box-shadow: none;
width: 100%;
}
.subscribe-section
.subscribe-inner-box
.subscribe-form
.ginput_container.ginput_container_email
.large::-webkit-input-placeholder {
font-size: 16px;
font-style: normal;
font-weight: 400;
line-height: normal;
text-transform: capitalize;
opacity: 0.5;
}
.subscribe-section
.subscribe-inner-box
.subscribe-form
.ginput_container.ginput_container_email
.large::-moz-placeholder {
font-size: 16px;
font-style: normal;
font-weight: 400;
line-height: normal;
text-transform: capitalize;
opacity: 0.5;
}
.subscribe-section
.subscribe-inner-box
.subscribe-form
.ginput_container.ginput_container_email
.large:-ms-input-placeholder {
font-size: 16px;
font-style: normal;
font-weight: 400;
line-height: normal;
text-transform: capitalize;
opacity: 0.5;
}
.subscribe-section
.subscribe-inner-box
.subscribe-form
.ginput_container.ginput_container_email
.large:-moz-placeholder {
font-size: 16px;
font-style: normal;
font-weight: 400;
line-height: normal;
text-transform: capitalize;
opacity: 0.5;
}
.subscribe-section
.subscribe-inner-box
.subscribe-form
#gform_1_validation_container {
display: none;
}
.subscribe-section
.subscribe-inner-box
.subscribe-form
#validation_message_1_1 {
position: absolute;
top: 0;
font-size: 12px;
}
.subscribe-section
.subscribe-inner-box
.subscribe-form
form
.gform_footer.before
input#gform_submit_button_1 {
font-size: 16px;
font-style: normal;
font-weight: 600;
line-height: 28px;
text-transform: uppercase;
padding: 11px 24px;
}
.subscribe-section .subscribe-inner-box .subscribe-form form {
display: flex;
flex-wrap: wrap;
align-items: center;
justify-content: space-between;
border-radius: 6px;
}
.subscribe-section
.subscribe-inner-box
.subscribe-form
form
.gform-body.gform_body {
width: 70%;
}
.subscribe-section
.subscribe-inner-box
.subscribe-form
form
.gform_footer.top_label {
margin: 0;
width: 30%;
justify-content: flex-end;
}
.subscribe-section
.subscribe-inner-box
.subscribe-form
form
.gform_footer.top_label
#gform_submit_button_1 {
background: #1f2753;
border-radius: 6px;
padding: 11px 24px;
font-size: 16px;
line-height: 28px;
font-weight: 600;
text-transform: uppercase;
top: 0;
}
.input,
.select select,
.textarea {
border-radius: 6px;
}
.calc-table-info {
display: none;
}
.calc-table-info.active {
display: block;
}
.calc-table-info1 {
display: none;
}
.calc-table-info1.active {
display: block;
}
.result-data-main-wrap .height-overly::-webkit-scrollbar {
width: 0.5em;
}
.result-data-main-wrap .height-overly::-webkit-scrollbar-track {
box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.3);
}
.result-data-main-wrap .height-overly::-webkit-scrollbar-thumb {
background-color: #bb8a04;
outline: 1px solid #bb8a04;
}  .blog-listing-inner {
display: flex;
flex-wrap: wrap;
gap: 25px;
}
.blog-listing-inner .blog-items {
display: flex;
flex-wrap: wrap;
width: calc(33.33% - 17px);
flex-direction: column;
background: #fff;
border-radius: 6px;
box-shadow: 0px 18.947px 31.579px 0px rgba(0, 0, 0, 0.06);
z-index: 1;
}
.blog-listing-inner .blog-items .blog-img {
width: 100%;
height: 300px;
position: relative;
border-top-left-radius: 6px;
border-top-right-radius: 6px;
}
.blog-listing-inner .blog-items .blog-img span {
position: absolute;
left: 20px;
top: 20px;
background: #fff;
z-index: 9;
padding: 7px 20px;
border-radius: 30px;
font-size: 16px;
font-style: normal;
font-weight: 500;
line-height: normal;
color: #bb8922;
text-align: center;
}
.blog-listing-inner .blog-items .blog-img img {
width: 100%;
height: 100%;
object-fit: cover;
border-top-left-radius: 6px;
border-top-right-radius: 6px;
}
.blog-details h4 {
font-size: 26px;
font-style: normal;
font-weight: 500;
line-height: normal;
margin-bottom: 20px;
}
.blog-details h4 a:hover {
color: #bb8a04;
}
.blog-details {
padding: 30px 40px;
}
.author-img {
width: 52px;
height: 52px;
border-radius: 50%;
overflow: hidden;
}
.author-block {
display: flex;
gap: 14px;
flex-wrap: wrap;
padding: 0 40px 30px;
align-items: center;
margin-top: auto;
}
.author-img img {
width: 100%;
height: 100%;
}
.author-details h3 {
font-size: 18px;
font-style: normal;
font-weight: 600;
line-height: 22px;
}
.author-details p {
display: flex;
align-items: flex-end;
gap: 10px;
flex-wrap: wrap;
}
.blog-listing-section {
padding: 70px 0;
}
.blog-listing-title {
text-align: center;
padding-bottom: 30px;
}
.blog-listing-title p {
font-size: 20px;
font-style: normal;
font-weight: 400;
line-height: 26px;
color: rgb(117 117 117 / 80%);
}
.blog-listing-title .main-title {
margin-bottom: 13px;
}
.with-shape-section {
position: relative;
}
.with-shape-section:before {
content: "";
background-image: url(https://financehub.co.nz/wp-content/uploads/2024/03/Image-2.png);
background-repeat: no-repeat;
width: 281px;
height: 335px;
position: absolute;
left: 0;
top: 50%;
transform: translateY(-50%);
}
.with-shape-section:after {
content: "";
background-image: url(https://financehub.co.nz/wp-content/uploads/2024/03/Image-2.png);
background-repeat: no-repeat;
width: 281px;
height: 335px;
right: 0;
bottom: 15%;
transform: rotate(180deg);
position: absolute;
}
.pagination-blog {
display: flex;
margin: 50px 0 0;
text-align: center;
align-items: center;
justify-content: center;
gap: 10px;
}
.pagination-blog .page-numbers {
background: #000000;
padding: 5px 15px;
color: #fff;
border-radius: 5px;
display: block;
text-align: center;
}
.pagination-blog .page-numbers.current {
background: #bb8a04;
}
.pagination-blog .page-numbers:hover {
background: #bb8a04;
}  .section-spacing {
padding: 80px 0;
}
.meet-our-team-section .our-team-slider .awsome-team-block ul li a:last-child {
background: transparent;
width: auto;
height: auto;
}
.meet-our-team-section .our-team-slider .awsome-team-block ul {
flex-direction: column;
gap: 10px;
}
.meet-our-team-section .our-team-slider .awsome-team-block ul li {
align-items: center;
display: flex;
gap: 14px;
max-width: 190px;
margin: 0 auto;
width: 100%;
align-items: start;
}
.meet-our-team-section .our-team-slider .awsome-team-block h3 a:hover {
color: #bb8922;
}
.meet-our-team-section .our-team-slider .awsome-team-block ul li a:hover {
color: #bb8a04;
}
.meet-our-team-section .our-team-slider .awsome-team-block ul li a svg {
width: 28px;
height: 28px;
background: #ececec;
border-radius: 100px;
line-height: 28px;
display: inline-block;
}
.meet-our-team-section .our-team-slider .awsome-team-block ul li a:hover svg {
background: #bb8a04;
}
.meet-our-team-section .our-team-slider .awsome-team-block ul li spna {
line-height: 1;
}
.meet-our-team-section .our-team-slider .awsome-team-block ul li a {
display: flex;
align-items: center;
gap: 10px;
}  .single-team-details-section.with-shape-section:after {
bottom: inherit;
top: 280px;
}
.single-team-left {
width: 45%;
padding-right: 70px;
position: relative;
}
.single-team-right {
width: 55%;
}
.single-team-details-box {
display: flex;
flex-wrap: wrap;
justify-content: space-between;
}
.team-image {
position: relative;
padding: 20px;
}
.team-image img {
width: 100%;
height: auto;
object-fit: cover;
}
.team-image:before {
content: "";
background-image: url(https://financehub.co.nz/wp-content/uploads/2024/03/Vector.png);
background-size: contain;
background-position: bottom left;
position: absolute;
bottom: 0;
left: 0;
width: 370px;
height: 70%;
z-index: -1;
background-repeat: no-repeat;
}
.team-image:after {
content: "";
background-image: url(https://financehub.co.nz/wp-content/uploads/2024/03/Group.png);
background-size: contain;
width: 112px;
height: 185px;
left: 0;
top: 0;
position: absolute;
background-repeat: no-repeat;
z-index: -1;
}
.single-team-left:before {
content: "";
background-image: url(https://financehub.co.nz/wp-content/uploads/2024/03/Group-1.png);
background-repeat: no-repeat;
background-size: contain;
height: 36px;
position: absolute;
right: 40px;
bottom: 0;
background-position: right;
width: 218px;
}
.single-team-right-inner h3 {
font-size: 45px;
font-style: normal;
font-weight: 500;
line-height: normal;
margin-bottom: 15px;
}
.single-team-right-inner h3 span {
color: #bb8922;
}
.single-team-right-inner small {
font-size: 20px;
font-style: normal;
font-weight: 400;
line-height: normal;
text-transform: capitalize;
margin-bottom: 20px;
display: block;
}
.single-team-right-inner p {
margin-bottom: 20px;
}
.connecting-box ul {
display: flex;
align-items: center;
padding: 20px 0;
border-top: 1px solid #e5eaf4;
border-bottom: 1px solid #e5eaf4;
}
.connecting-box ul li a {
display: flex;
align-items: center;
gap: 10px;
font-size: 18px;
font-style: normal;
font-weight: 400;
line-height: normal;
}
.connecting-box ul li:first-child {
margin-right: 100px;
}
.connecting-box ul li a svg {
width: 28px;
height: 28px;
background: #ececec;
border-radius: 100px;
line-height: 28px;
display: inline-block;
}
.connecting-box ul li a:hover svg {
background: #bb8a04;
}
.connecting-box ul li a:hover svg path {
fill: #fff;
}
.connecting-box ul li a:hover span {
color: #bb8a04;
}
.connecting-box ul li a span {
line-height: 1;
}
.our-teams-detailing {
padding: 100px 100px 50px;
background: linear-gradient(
180deg,
rgba(187, 137, 34, 0.07) -30.18%,
rgba(187, 137, 34, 0) 100%
);
margin: 140px 0 0;
}
.our-teams-detailing h5 {
font-size: 30px;
font-style: normal;
font-weight: 500;
line-height: normal;
margin-bottom: 30px;
}
.our-teams-detailing p {
margin-bottom: 30px;
font-size: 20px;
font-style: normal;
font-weight: 400;
line-height: 26px;
opacity: 0.8;
}
.our-teams-detailing h6 {
padding: 26px 0 62px;
font-size: 20px;
font-style: italic;
font-weight: 700;
line-height: 26px;
color: #122038;
}
.full-image-box {
position: relative;
padding: 0 20px 20px 0;
line-height: 0;
}
.full-image-box:before {
content: "";
background-image: url(https://financehub.co.nz/wp-content/uploads/2024/03/Vector-1.png);
background-size: contain;
background-position: right bottom;
position: absolute;
bottom: 0;
right: 0;
width: 370px;
height: 518px;
background-repeat: no-repeat;
z-index: -1;
}
.full-image-box:after {
content: "";
background-image: url(https://financehub.co.nz/wp-content/uploads/2024/03/Group-2.png);
background-size: contain;
background-position: right bottom;
position: absolute;
bottom: 9px;
left: -86px;
width: 170px;
height: 25px;
background-repeat: no-repeat;
z-index: -1;
}  section.mortgage-loan-info-section.content-left-align {
text-align: left;
}
.mortgage-loan-info-section.content-left-align h2 {
font-size: 43px;
margin-bottom: 30px;
color: #bb8a04;
}
.content-left-align ol li {
font-family: "DMSans-Regular";
color: #757575;
font-size: 20px;
font-style: normal;
line-height: 26px;
}
.content-left-align p {
text-align: left;
max-width: 100%;
margin-bottom: 19px;
}
.content-left-align ul li {
text-align: left;
}
.content-left-align ol {
list-style-position: inside;
display: block;
}
.content-left-align ol {
margin-bottom: 20px;
padding-left: 20px;
}
.content-left-align p strong {
display: block;
margin-bottom: 20px;
}  .blog-details-inner {
display: flex;
gap: 140px;
flex-wrap: wrap;
}
.blog-details-inner-left {
width: 45px;
}
.blog-details-inner-right {
width: calc(100% - 185px);
display: flex;
flex-direction: column;
gap: 50px;
}
.share-lable {
color: #5a7184;
text-align: center;
font-size: 16px;
font-style: normal;
font-weight: 700;
line-height: normal;
}
.blog-details-inner-left ul {
margin-top: 34px;
display: flex;
flex-direction: column;
}
.blog-details-inner-left ul li {
margin: 15px 0;
text-align: center;
display: block;
}
.blog-details-inner-left ul li:first-child {
margin-top: 0;
}
.blog-details-inner-left ul li img {
height: 21px;
}
.blog-top-title h2 {
color: #bb8922;
font-size: 45px;
font-style: normal;
font-weight: 500;
line-height: normal;
text-transform: capitalize;
margin-bottom: 30px;
}
.author-block-wrapper {
display: flex;
flex-wrap: wrap;
justify-content: space-between;
align-items: center;
}
.author-block-wrapper .author-block {
padding: 0;
}
.blog-full-img img {
width: 100%;
}
.blog-description-block h3 {
color: #000;
font-size: 30px;
font-style: normal;
font-weight: 500;
line-height: normal;
text-transform: capitalize;
margin: 30px 0;
}
.blog-description-block strong {
font-size: 22px;
font-weight: 900;
color: #807f7f;
}
.blog-description-block img {
width: 100%;
object-fit: cover;
}
.author-block-wrapper .publish-date h6 {
color: rgb(90 113 132 / 80%);
text-align: right;
font-size: 14px;
font-style: normal;
font-weight: 700;
line-height: 20px;
}
.blog-description-block p + p {
margin-top: 30px;
}
.blog-details-center-golder-box {
background-image: url(https://financehub.co.nz/wp-content/uploads/2024/03/Group-1000006187.png);
padding: 45px 60px;
background-repeat: no-repeat;
width: 100%;
background-size: cover;
background-position: center;
}
.blog-details-center-golder-box h4 p {
color: #fff;
text-align: center;
font-size: 30px;
font-style: normal;
font-weight: 500;
line-height: 40px; text-transform: capitalize;
}
.blog-details-inner-right .author-block-wrapper:last-child {
padding: 22px 0;
border-top: 1px solid #e5eaf4;
border-bottom: 1px solid #e5eaf4;
}
.blog-details-pagination {
display: flex;
gap: 20px;
justify-content: space-between;
}
.blog-details-pagination .left-page-blog,
.blog-details-pagination .right-page-blog {
display: flex;
align-items: center;
gap: 20px;
}
.blog-details-pagination .icon svg {
width: 40px;
height: 40px;
}
.direct-page h6 {
color: #757575;
font-size: 14px;
font-style: normal;
font-weight: 500;
line-height: 20px;
margin-bottom: 3px;
}
.right-page-blog .direct-page h5 {
margin-left: auto;
}
.direct-page h5 {
color: #000;
font-size: 18px;
font-style: normal;
font-weight: 500;
line-height: normal;
padding: 10px;
background-color: #eff2f6;
border-radius: 10px;
max-width: 330px;
}
.right-page-blog .direct-page {
text-align: right;
}
.icon a:hover svg {
background: #bb8a04;
}
.icon a:hover svg path {
stroke: #fff;
opacity: 1;
}
.relatated-blog-section {
background: rgba(248, 248, 248, 0.97);
padding: 50px 0;
}  .custom-left-calc-form {
width: calc(50% - 17px);
}
.custom-right-calc-form {
width: calc(50% - 17px);
}
.custom-calculator-box {
display: flex;
flex-wrap: wrap;
width: 100%;
gap: 34px;
}
.calc-new-design-main-wrap form .form-group label {
font-family: "DMSans-Bold";
font-size: 20px;
font-weight: 500;
line-height: 26px;
letter-spacing: 0em;
}
.calc-new-design-main-wrap form .form-group {
display: flex;
flex-flow: column;
margin-bottom: 25px;
position: relative;
}
.calc-new-design-main-wrap form {
padding-top: 25px;
}
.calc-new-design-main-wrap form .form-group input,
.calc-new-design-main-wrap form .form-group select {
border: 1px solid rgb(0 0 0 / 10%);
border-radius: 6px;
padding: 17px 18px 17px 75px;
margin-top: 10px;
font-family: DM Sans;
font-size: 18px;
font-weight: 400;
line-height: 23px;
letter-spacing: 0em;
text-align: left;
outline: none !important;
font-family: "DMSans-Regular";
}
.calc-new-design-main-wrap form .form-group:after {
content: "";
position: absolute;
left: 0;
bottom: 0;
width: 60px;
height: 59px;
font-size: 22px;
font-weight: 400;
line-height: 29px;
letter-spacing: 0em;
text-align: left;
}
.calc-new-design-main-wrap form .form-group .symbol-icon {
position: absolute;
left: 0;
bottom: 0;
width: 60px;
height: 59px;
border-top-left-radius: 6px;
border-bottom-left-radius: 6px;
background: #f8f8f8;
display: flex;
align-items: center;
justify-content: center;
border: 1px solid rgb(0 0 0 / 10%);
}
.symbol-icon svg {
width: 27px;
height: 27px;
}
.calc-new-design-main-wrap form button.btn {
padding: 11px 30px;
border: 0;
background-color: #d09a29;
font-family: Poppins;
font-size: 16px;
font-weight: 600;
line-height: 28px;
letter-spacing: 0em;
text-align: center;
text-transform: uppercase;
color: #fff;
transition: all 800ms ease-in-out;
cursor: pointer;
font-family: "DMSans-Regular";
}
.calc-new-design-main-wrap form button.btn:hover {
background-color: #1f2753;
}
.calc-new-design-main-wrap form select {
-moz-appearance: none;
-webkit-appearance: none;
appearance: none;
}
.calc-new-design-main-wrap h1 {
font-size: 25px;
font-family: "DMSans-Bold";
font-weight: 500;
line-height: 39px;
letter-spacing: 0em;
margin-bottom: 30px;
}
.calc-new-design-main-wrap:before {
display: none;
}
.calc-new-design-main-wrap > div.container {
border: 2px solid #000;
padding: 20px;
border-radius: 6px;
}
.calc-new-design-main-wrap {
padding: 0px 15px;
flex-flow: wrap;
}
.calc-new-design-main-wrap form .form-group select {
background-image: url("data:image/svg+xml,%3Csvg xmlns=!string!xmlns:xlink=!string!version=!string!width=!string!height=!string!viewBox=!string!xml:space=!string!%3E%3Cdefs%3E%3C/defs%3E%3Cg style=!string!transform=!string!%3E%3Cpath d=!string!style=!string!transform=!string!stroke-linecap=!string!/%3E%3C/g%3E%3C/svg%3E");
background-size: 17px;
background-position: 97%;
background-repeat: no-repeat;
padding-left: 16px;
width: calc(100% - 59px);
margin-left: auto;
background-color: transparent;
}
.result-data-main-wrap p {
font-family: DM Sans;
font-size: 20px;
font-weight: 500;
line-height: 26px;
letter-spacing: 0em;
text-align: left;
color: #000000;
margin-bottom: 6px;
}
.result-data-main-wrap h4 {
font-size: 25px;
line-height: normal;
margin-bottom: 11px;
color: #fff;
}
.result-data-main-wrap {
padding: 25px 0 0px;
overflow-x: auto;
}
.result-data-main-wrap .table-bordered thead {
background-color: #d09a29;
}
.result-data-main-wrap .table-bordered thead th {
padding: 9px;
color: #fff;
font-size: 16px;
font-weight: 600;
font-family: "DMSans-Bold";
}
.result-data-main-wrap table.table.table-bordered {
border: 1px solid #e7e7e7;
border-spacing: 0;
}
.result-data-main-wrap .table-bordered td {
padding: 7px;
text-align: center;
border-top: 1px solid #e7e7e7;
}
.result-data-main-wrap .table-bordered tbody tr:nth-child(even) {
background-color: hsl(41deg 67% 49% / 10%);
}
.result-data-main-wrap .height-overly {
max-height: 408px;
overflow-y: auto;
}
.calc-new-design-main-wrap .gallery-img-inner-row img {
width: 47%;
}
.calc-new-design-main-wrap .result-data-main-wrap {
order: 3;
width: 100%;
}
.result-data-main-wrap table.table.table-bordered {
width: 100%;
}
.custom-calculator-box h2,
.calc-table-info h4,
.calc-table-info1 h4 {
display: inline-block;
border-radius: 6px;
padding: 5px 10px;
color: #fff;
font-weight: 500;
font-size: 20px;
background-color: #d09a29;
}
.result-data-box {
background: #1f2753;
padding: 10px;
}
.result-data-box p {
color: #fff;
font-family: "DMSans-Regular";
font-size: 19px;
line-height: 1.4;
}
. .calc-table-info1 h4,
.calc-table-info h4 {
color: #000;
} .calculator-table-button {
margin: 20px 0;
}
.calculator-table-button .calc-table-btn,
.calculator-table-button .calc-table-btn1 {
color: #fff;
text-align: center;
z-index: 1;
padding-inline: 15px;
font-size: 16px;
font-style: normal;
line-height: 28px;
text-transform: uppercase;
background: #bb8922;
min-width: 154px;
height: 50px;
line-height: 50px;
display: inline-block;
transition: 0.5s all;
position: relative;
overflow: hidden;
}
.calculator-table-button .calc-table-btn:hover {
color: #fff;
transition: 0.5s all;
}
.calculator-table-button .calc-table-btn1:hover {
color: #fff;
transition: 0.5s all;
}
.calculator-table-button .calc-table-btn:hover:before {
transform: translateX(0px);
}
.calculator-table-button .calc-table-btn1:hover:before {
transform: translateX(0px);
}
.calculator-table-button .calc-table-btn:before {
position: absolute;
content: "";
background-color: #1f2753;
height: 50px;
left: 0;
z-index: -1;
width: 100%;
transform: translateX(-100%);
transition: 0.5s all;
}
.calculator-table-button .calc-table-btn1:before {
position: absolute;
content: "";
background-color: #1f2753;
height: 50px;
left: 0;
z-index: -1;
width: 100%;
transform: translateX(-100%);
transition: 0.5s all;
}
.mortgage-loan-info-section.calc-desclaimer {
padding-top: 60px;
} @media only screen and (max-width: 1500px) {
.keep-in-touch-section .right-side-shape {
z-index: -1;
}
.with-shape-section {
padding: 50px;
}
.meet-our-team-section .our-team-slider.without-slider-section {
justify-content: center;
}
.meet-our-team-section
.our-team-slider.without-slider-section
.awsome-team-block {
width: auto;
}
.meet-our-team-section
.our-team-slider.without-slider-section
.awsome-team-block
> a {
width: auto;
}
.blog-details-section.section-spacing {
padding: 100px 50px;
}
.blog-details-inner {
gap: 50px;
}
}
@media only screen and (min-width: 992px) and (max-width: 1400px) {
.meet-our-team-section
.our-team-slider.without-slider-section
.awsome-team-block {
width: calc(33.33% - 45px);
}
.single-team-left:before {
content: none;
}
}
@media only screen and (max-width: 991px) {
.keep-in-touch-section .keep-in-touch-left-box {
width: 50%;
padding-right: 15px;
}
.keep-in-touch-section .keep-in-touch-right-box {
padding-left: 15px;
}
.keep-in-touch-section
.keep-in-touch-right-box
.gform-theme--foundation
.gfield {
grid-column: 1/-1;
min-inline-size: 0;
}
.subscribe-section .subscribe-inner-box .subscribe-form {
margin: 0 auto;
}
.subscribe-section .subscribe-inner-box .subscribe-form form {
padding: 15px;
align-items: self-start;
}
.subscribe-section
.subscribe-inner-box
.subscribe-form
form
.gform-body.gform_body {
width: calc(100% - 150px);
}
.subscribe-section
.subscribe-inner-box
.subscribe-form
#validation_message_1_1 {
position: relative;
}
.blog-details {
padding: 15px;
}
.blog-details h4 {
font-size: 22px;
}
.author-block {
padding: 15px;
}
.blog-listing-inner .blog-items {
width: calc(50% - 17px);
}
.with-shape-section {
padding: 20px;
}
.meet-our-team-section
.our-team-slider.without-slider-section
.awsome-team-block {
width: calc(50% - 45px);
}
.single-team-left {
width: 100%;
padding: 0;
}
.team-image img {
width: 100%;
}
.single-team-right {
width: 100%;
}
.our-teams-detailing {
padding: 30px;
margin: 50px 0;
}
.full-image-box:before {
height: 100px;
}
.single-team-right-inner {
margin-top: 50px;
}
.section-spacing {
padding: 20px;
}
.blog-details-inner-left {
width: 100%;
display: flex;
align-items: center;
}
.blog-details-inner-right {
width: 100%;
}
.blog-details-inner-left ul {
flex-direction: row;
margin-left: 30px;
margin-top: 0;
align-items: center;
}
.blog-details-inner-left ul li {
margin: 10px 20px;
}
.blog-details-inner {
gap: 30px;
}
.relatated-blog-section {
padding: 30px 20px;
}
.blog-details-section.section-spacing {
padding: 50px 20px;
}
.blog-details-pagination {
justify-content: center;
gap: 30px;
}
.direct-page {
display: none;
}
}
@media only screen and (max-width: 767px) {
.keep-in-touch-section .keep-in-touch-right-box {
max-width: 100%;
width: 100%;
margin-top: 50px;
}
.keep-in-touch-section .keep-in-touch-left-box {
width: 100%;
}
.subscribe-section .subscribe-inner-box .subscribe-form {
width: 100%;
margin-top: 50px;
}
.subscribe-section
.subscribe-inner-box
.subscribe-form
#validation_message_1_1 {
position: relative;
margin-bottom: 10px;
}
.subscribe-section
.subscribe-inner-box
.subscribe-form
form
.gform-body.gform_body {
width: calc(100% - 150px);
}
.subscribe-section
.subscribe-inner-box
.subscribe-form
.ginput_container.ginput_container_email
.large {
width: 100%;
padding: 0;
}
.keep-in-touch-section .left-side-shape {
z-index: -1;
}
.keep-in-touch-section .keep-in-touch-right-box {
padding: 0;
}
.blog-listing-inner .blog-items {
width: 100%;
z-index: 1;
}
.blog-listing-title {
padding-bottom: 50px;
}
.meet-our-team-section
.our-team-slider.without-slider-section
.awsome-team-block {
width: 100%;
}
.custom-left-calc-form {
width: 100%;
}
.custom-right-calc-form {
width: 100%;
}
.subscribe-section
.subscribe-inner-box
.subscribe-form
form
.gform_footer.top_label {
justify-content: flex-start;
}
.subscribe-section .subscribe-inner-box .subscribe-form form {
align-items: center;
}
.single-team-left:before {
content: none;
}
}
@media only screen and (max-width: 480px) {
.subscribe-section .subscribe-inner-box .subscribe-form form {
flex-wrap: wrap;
flex-direction: column;
gap: 10px;
align-items: center;
}
.subscribe-section
.subscribe-inner-box
.subscribe-form
form
.gform-body.gform_body {
width: 100%;
}
.subscribe-section
.subscribe-inner-box
.subscribe-form
form
.gform_footer.before {
text-align: center;
display: block;
}
.subscribe-section
.subscribe-inner-box
.subscribe-form
.ginput_container.ginput_container_email
.large {
padding: 0 20px;
border: 1px solid #dce1e9;
}
.subscribe-section
.subscribe-inner-box
.subscribe-form
form
.gform_footer.top_label {
width: 100%;
padding: 0;
}
} .popup {
display: none;
position: fixed;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
padding: 20px;
background-color: #fff;
border: 1px solid #ccc;
box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
z-index: 20;
}
.popup-content {
text-align: center;
}  .gallery-slider {
margin-top: 80px;
padding: 0 20px;
}
.gallery-item { margin-bottom: 10px; padding: 0 10px;
}
.gallery-item .img-div {
display: flex;
align-items: center;
justify-content: center;
}
.gallery-item img {
width: 100%; height: auto; display: block; max-width: 280px;
}
.gallery-slider .slick-prev,
.gallery-slider .slick-next {
background: #023459;
border-radius: 50%;
width: 23px;
height: 23px;
}
.gallery-slider .slick-prev:before,
.gallery-slider .slick-next:before {
opacity: 1;
}
.gallery-slider .slick-dots li {
margin: 0 0px;
} .rating_section {
padding: 25px 20px;
}
.rate_card {
grid-column-gap: 27px;
grid-row-gap: 27px;
border: 1px solid #757575;
border-radius: 13.5px;
align-items: center;
padding: 13.5px 27px;
display: flex;
font-family: "DMSans-Regular";
}
.slick-slide {
cursor: grab;
}
.profile {
object-fit: cover;
border-radius: 13.5px;
flex: none;
width: 54px;
height: 54px;
}
.profile.icon {
object-fit: contain;
}
.splide__slide img {
vertical-align: bottom;
}
.small_text {
color: #757575;
cursor: pointer;
margin-bottom: 0.25rem;
font-size: 0.875rem;
}
.mb-0 {
margin-bottom: 0px;
}
.rate_rate_wrapper {
display: flex;
}
.rate_rate {
font-size: 2.5rem;
font-weight: 600;
line-height: 1.125;
display: inline;
font-family: "DMSans-Bold";
}
.rate_subscript {
display: inline;
color: #757575;
cursor: pointer;
}
.brand-logo-section .row {
display: flex;
align-items: center;
gap: 20px;
}
.brand-logo-section .notice_wrapper {
width: 33.33%;
float: left;
position: relative;
}
.brand-logo-section .logo-box-wrapper {
width: 66.6667%;
}
.relative {
position: relative;
}
.logo_shadow {
z-index: 5;
opacity: 1;
background-image: linear-gradient(90deg, #fff 15%, #fff0);
width: 33.33%;
height: 100%;
position: absolute;
}
.logo_shadow.left {
background-image: linear-gradient(90deg, #fff0, #fff 85%);
inset: 0% 0% 0% auto;
} .process_section {
padding: 50px 20px;
overflow: hidden;
}
.process_section .container {
overflow: visible;
}
.process_section .process_for .slick-slider,
.process_section .process_for .slick-list {
overflow: visible;
border-radius: 12px;
}
.process_section .process_nav p {
margin: 20px 0px;
font-size: 16px;
color: #757575;
cursor: pointer;
margin-right: 20px;
}
.process_section .process_nav .slick-current p {
color: #1f2753;
}
.process_section .process_nav .slick-track {
margin-left: 0;
}
.process_slider {
display: flex !important;
gap: 10px;
height: auto;
}
.process_section .slick-active.slick-current .card {
background-color: #ddc490;
color: #1f2753;
}
.process_section .slick-active.slick-current .card p {
color: #1f2753;
}
.card_wrapper,
.process_img {
height: 450px;
width: 50%;
border-radius: 12px;
}
.process_img img {
width: 100%;
height: 100%;
object-fit: cover;
border-radius: 12px;
}
.card_wrapper .card {
background-color: #eff2f6;
border-radius: 12px;
height: 100%;
width: 100%;
display: flex;
flex-direction: column;
gap: 3;
justify-content: space-between;
padding: 20px;
transition-property: background-color;
transition-duration: 0.4s;
transition-timing-function: ease;
}
.card_wrapper .card h5 {
font-size: 28px;
font-weight: 600;
}
.card_wrapper .card p {
font-size: 16px;
}
@media screen and (max-width: 768px) {
.card_wrapper {
width: 100%;
}
.process_img {
display: none;
}
.brand-logo-section .row {
flex-direction: column;
align-items: start;
}
.brand-logo-section .notice_wrapper,
.brand-logo-section .logo-box-wrapper {
width: 100%;
}
}
@media screen and (min-width: 1024px) {
.process_nav .slick-track {
transform: unset !important;
}
.slick-slide {
margin-right: 20px;
}
}
.secondary-btn {
color: #fff;
text-align: center;
z-index: 1;
padding-inline: 15px;
font-family: "Poppins-SemiBold";
font-size: 16px;
font-style: normal;
line-height: 28px;
border-radius: 6px;
background: #1f2753;
min-width: 154px;
height: 50px;
line-height: 50px;
display: inline-block;
transition: 0.5s all;
position: relative;
overflow: hidden;
cursor: pointer;
text-decoration: none;
} .loan_section .card_wrapper {
width: 100%;
height: 100%;
}
.loan_section .process_for .slick-slider,
.loan_section .process_for .slick-list {
overflow: hidden;
}
.loan_section .loan_card {
overflow: hidden;
}
.loan_section .loan_card:hover .loan_content {
transform: translateY(0px) !important;
}
.loan_section .slick-current.slick-active .loan_content {
transform: translateY(0px) !important;
}
.loan_section .loan_content {
display: flex;
flex-direction: column;
gap: 20px;
overflow: hidden;
transform: translateY(70px) !important;
transition: all 1s ease;
}
.loan_card .animation {
width: 100px;
height: 100px;
object-fit: cover;
}
.loan_card h5 {
font-size: 24px !important;
font-weight: 500 !important;
} .banner-section .row {
position: relative;
max-width: 650px;
z-index: 2;
}
.banner-section ul {
display: flex;
gap: 3px;
color: #fff;
}
.banner-section ul li {
display: flex;
}
.banner-section ul a {
color: #fff;
} .mega-menu {
width: 70.7vw !important;
}
#menu-header-menu li.menu-item-has-children > ul.mega-menu {
position: fixed !important;
top: 85px !important;
left: 50%;
transform: translate3d(0px, 4rem, 0px) scale3d(1, 1, 1) rotateX(0deg)
rotateY(0deg) rotateZ(0deg) skew(0deg, 0deg) translateX(-50%) !important;
}
#menu-header-menu li.menu-item-has-children:hover > ul.mega-menu {
transform: translate3d(0px, 0rem, 0px) scale3d(1, 1, 1) rotateX(0deg)
rotateY(0deg) rotateZ(0deg) skew(0deg, 0deg) translateX(-50%) !important;
}
.mega-menu-inner {
padding: 20px;
display: flex;
gap: 20px;
}
.megamenu_sidebar {
width: 25%;
display: flex;
flex-direction: column;
justify-content: space-between;
}
.megamenu_sidebar .small_heading {
font-size: 28px;
color: #fff;
}
.megamenu_sidebar p {
padding-bottom: 20px;
font-size: 16px;
color: #ffffff9c;
}
.megamenu_sidebar button {
width: max-content;
}
.menu-item.two-col .megamenu_sidebar {
width: 34%;
}
.megamenu_content {
flex: 1;
}
.megamenu_wrapper {
display: grid;
grid-template-columns: 1fr 1fr;
gap: 20px;
}
.megamenu_item a.menu-drop-item {
display: flex !important;
gap: 16px;
align-items: center;
border-radius: 10px;
transition: all 0.3s ease-in;
height: 100%;
}
.megamenu_item a.menu-drop-item:hover {
background-color: #fff;
}
.megamenu_item a.menu-drop-item:hover p,
.megamenu_item a.menu-drop-item:hover div {
color: #000;
}
.megamenu_item a.menu-drop-item:hover img {
border-top-right-radius: 0px;
border-bottom-right-radius: 0px;
}
.menu_details {
flex: 1;
padding: 10px 0px;
}
.menu-icon {
display: flex;
height: 100%;
}
.menu-icon img {
width: 105px;
height: 100%;
border-radius: 10px;
object-fit: cover;
}
.menu_details div {
font-size: 20px;
color: #fff;
margin-bottom: 5px;
}
.menu_details p {
font-size: 16px;
color: #ffffff9c;
} .faq-section {
padding-block: 40px !important;
}
.faq-section .main-title {
margin-bottom: 22px;
}
.single-service .process_section {
padding-left: 0px;
padding-right: 0px;
} @media screen and (max-width: 991px) {
.mega-menu-inner {
flex-direction: column;
}
.megamenu_sidebar {
width: 100% !important;
}
.megamenu_sidebar .small_heading {
font-size: 20px;
color: #fff;
}
.megamenu_sidebar p {
padding-top: 10px;
padding-bottom: 10px;
}
.menu_details div {
font-size: 18px;
}
.menu_details p {
font-size: 14px;
}
#menu-header-menu li.menu-item-has-children > ul.mega-menu {
top: 92px !important;
}
}