body{
font-family: "Roboto", Helvetica, Arial, sans-serif;
font-style:normal;
color: rgb(90, 90, 90);
background-color: #ffffff;
}
h1,h2,h3,h4,h5,h6{
font-family: 'Montserrat', Helvetica, Arial;
font-weight: bold;
color: #1B3559;
}
a{
color: #368099;
text-decoration: none;
}
@keyframes popUp{
0%{
transform: scale(0.5);
opacity: 0;
}
70%{
transform: scale(1.1);
opacity: 1;
}
100%{
transform: scale(1);
opacity: 1;
}
}
@keyframes fadeIn{
from {opacity: 0;
transform: translateY(20px);
} to {
opacity: 1;
transform: translateY(0px)
}
}
.review-box{
animation-name: popUp;
animation-duration: 0.3s;
animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1.275);
animation-fill-mode: both;
}
#review1{
animation-delay: 1.3s;
}
#review2{
animation-delay: 1.5s;
}
.header-bg{
background-image: url(https://cdn.moneykey.com/images/landing/desktop_bg_widescreen.webp);
background-color: #1C3655;
background-position: center bottom;
background-repeat: no-repeat;
background-attachment: scroll;
background-size: cover;
height: 100vh;
width: 100%;
}
@media (max-width: 992px) {
.header-bg{
background-image: url(https://cdn.moneykey.com/images/landing/med-keyfob-2.webp);
background-position: center bottom;
background-size: cover;
height: 100vh;
width: 100%;  
}
.hero-img-sm{
background-image: url(https://cdn.moneykey.com/images/landing/hero-img2.webp);
background-repeat: no-repeat;
width: 100%;
height: 200%;
background-size: contain;
background-position: bottom right;
}
.ml-n3{
margin-left: -5rem;
}
.ml-n5{
margin-left: -10rem;
}
}
@media (max-width: 768px) {
.hero-img-sm{
background-image: url(https://cdn.moneykey.com/images/landing/hero-img2.webp);
background-repeat: no-repeat;
width: 100%;
height:170%;
background-size: contain;
background-position: bottom right;
}
.banner-container{
border-radius: 0 !important;
background-attachment: scroll !important;
background-image: url(https://cdn.moneykey.com/images/landing/woman-typing2.webp);
background-size: cover;
height: 30vh;
}
}
@media (max-width: 575.98px){
.header-bg{
background-image: url(https://cdn.moneykey.com/images/landing/mobile-keyfob.webp);
background-position: center bottom;
background-size: cover;
height: 100vh;
width: 100%; 
}
.hero-img-sm{
background-image: url(https://cdn.moneykey.com/images/landing/hero-img2.webp);
background-repeat: no-repeat;
width: 100%;
height:170%;
background-size: contain;
background-position: bottom right;
}
}
.hero-img{
background-image: url(https://cdn.moneykey.com/images/landing/hero-img2.webp);
background-repeat: no-repeat;
width: 100%;
height: 85vh;
margin-top: 15vh;
background-size: contain;
background-position: bottom center;
}
.logo{
max-height:6vh;
margin-top:5vh;
}
.apply-btn{
background: #42b35c;
padding: 0.9em 2.5em 0.9em 2.5em;
font-weight: 500; color:#fff !important;
border-radius: 5px;
border: none;
transition: background-color 0.3s ease;
}
.btn-main {
background-color: rgba(66, 179, 92, 1);
color: #fff;
font-size: 1em;
padding: 0.9em 2.5em 0.9em 2.5em;
font-weight: bold;
}
.bullet-pt{
width: 30px;
height: 30px;
border-radius: 50%;
background-color: #EAF4FF;
position: relative;
margin-right: 1rem;
transform: translateY(-30%);        
display: inline-block;
}
.bullet-pt::after{
content: '';
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
width: 12px;
height: 12px;
background-color: #1565C0;
border-radius: 50%;
}
.bullet-txt{
display: inline-block;
vertical-align: middle;
padding-bottom: 20px;
padding-right: 10px;
font-weight: bold;
flex: 1;
}
.list-dash{
display: flex;
align-items: center;
margin-bottom: 1rem;
}
.banner-container{
background-image: url(https://cdn.moneykey.com/images/landing/woman-typing2.webp);
background-size: cover;
background-attachment: fixed;
height: 30vh;
border-radius: 15px;
}
.footer-container{
background-color: #E7F3FF;
font-size: smaller;
font-style: italic;
color: #5e5e5e;
padding: 20px;
}
.ml-n5{
margin-left: -18rem;
}
.ml-n3{
margin-left: -8rem;
}
.ml-n1{
margin-left: -2rem;
}
.ml-n2{
margin-left: 1rem;
}
.pb-n5{
padding-bottom: 15rem;
}
.step:nth-child(1){
transition-delay: 300ms;
}
.step:nth-child(3){
transition-delay: 600ms;
}
.step:nth-child(5){
transition-delay: 900ms;
}
.hidden {
opacity: 0;
transform: translateY(20px);
transition: opacity 0.8s ease-out, 
transform 0.8s ease-out;
}
.hidden.show {
opacity: 1;
transform: translateY(0);
}
@media(prefers-reduced-motion) {
.hidden {
transition: none;
}
} .mail-header {
background: url(https://cdn.moneykey.com/images/hero/fobkey-sm2.webp) no-repeat;
top: 0;
left: 0;
text-align: left;
width: 100vw;
height: auto;
padding: 0 2em 0 2em;
background-color: rgb(240, 240, 240);
}
.mail-logo {
max-height: 15vh;
}
.footer {
background-color: #1C3655;
font-size: smaller;
color: #ffffff;
}
.icon-circled {
background-color: #f1f1f1;
padding: 10px;
border-radius: 50%;
width: 250px;
height: 250px;
text-align: center;
display: inline-block;
}
.icon-mobile-check {
width: 50px;
padding-top: 40px;
padding-bottom: 10px;
}
.icon-form-check {
width: 70px;
padding-top: 55px;
padding-bottom: 10px;
}
.icon-approve-check {
width: 70px;
padding-top: 55px;
padding-bottom: 10px;
}
.form-group {
margin-bottom: 1rem;
}