html {
  scroll-behavior: smooth;
}

body {
  background-color: #ffffff;
  font-family: 'Inter', sans-serif, -apple-system, system-ui, BlinkMacSystemFont;
}
.navbar-announcement {
  background-color: #13123c;
  color: #fff;
  letter-spacing: 0.5px;
  line-height: 1.5rem;
  font-weight: 400;
  font-size: 0.9rem;
  font-family: 'Inter', sans-serif, -apple-system, system-ui, BlinkMacSystemFont;
}

a.announcement:link {
  color:#fff;
  text-decoration:underline;
}

a.announcement:visited {
  color:#fff;
  text-decoration:underline;
}

a.announcement:hover {
  text-decoration:underline;
}

.ml11 {
  font-weight: 700;
  font-size: 3.5em;
}

.ml11 .text-wrapper {
  position: relative;
  display: inline-block;
  padding-top: 0.1em;
  padding-right: 0.05em;
  padding-bottom: 0.15em;
}

.ml11 .line {
  opacity: 0;
  position: absolute;
  left: 0;
  height: 100%;
  width: 3px;
  background-color: #4D3A90;
  transform-origin: 0 50%;
}

.ml11 .line1 {
  top: 0;
  left: 0;
}

.ml11 .letter {
  display: inline-block;
  line-height: 1em;
}


/* title styles */
.rent-title p{
    position: relative;
    overflow: hidden;
    display: block;
    line-height: 1.2;
}

.rent-title p::after{
    content: '';
    position: absolute;
    top: 0;
    right: 0;
    width: 100%;
    height: 100%;
    background: #7A54D2;
    animation: a-ltr-after 2s cubic-bezier(.77,0,.18,1) forwards;
    transform: translateX(-101%);
}

.rent-title p::before{
    content: '';
    position: absolute;
    top: 0;
    right: 0;
    width: 100%;
    height: 100%;
    background: #fff;
    animation: a-ltr-before 2s cubic-bezier(.77,0,.18,1) forwards;
    transform: translateX(0);
}

.rent-title p:nth-of-type(1)::before,
.rent-title p:nth-of-type(1)::after{
    animation-delay: 1s;
}

.rent-title p:nth-of-type(2)::before,
.rent-title p:nth-of-type(2)::after{
    animation-delay: 1.5s;
}

@keyframes a-ltr-after{
    0% {transform: translateX(-100%)}
    100% {transform: translateX(101%)}
}

@keyframes a-ltr-before{
    0% {transform: translateX(0)}
    100% {transform: translateX(200%)}
}

.colour-bg {
  background-color: #4D3A90;
  height: 500px;
  font-family: 'Inter', sans-serif, -apple-system, system-ui, BlinkMacSystemFont;
}

.purple-bg {
  position: relative;
  background-color: #4D3A90;
  background-image: url('images/bg1.jpg');
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
  height: 460px;
  font-family: 'Inter', sans-serif, -apple-system, system-ui, BlinkMacSystemFont;
}

.support-bg {
  position: relative;
  background-position: left;
  background-repeat: no-repeat;
  color: #fff;
  background-color: #F8F9FA;
  background-image: url('images/support-bg.svg');
}

.team-bg {
  position: relative;
  background-position: left;
  background-repeat: no-repeat;
  background-color: #7953d2;
}

.alert-light {
  background-color: #ffffff;
  border-color: #E5E8EC;
  border-width: 0px;
  border-style: solid;
  border-radius: 0.4rem;
  -webkit-box-shadow: 0px 2px 10px 0px rgba(128, 142, 164, 0.24);
  -moz-box-shadow: 0px 2px 10px 0px rgba(128, 142, 164, 0.24);
  box-shadow: 0px 2px 10px 0px rgba(128, 142, 164, 0.24);
  padding: 1.5rem;
  font-weight: 500;
  font-size: 0.9rem;
  color: #6B778C;
  position: fixed;
  z-index: 100;
  left: 10%;
  bottom: 5%;
  width: 500px;
}

h1 {
  height: auto;
  color: #fff;
  letter-spacing: 0.5px;
  font-weight: 800;
  font-family: 'Inter', sans-serif, -apple-system, system-ui, BlinkMacSystemFont;
}

h2 {
  width: auto;
  height: auto;
  color: #000;
  letter-spacing: 0.5px;
  font-size: 2rem;
  font-weight: 500;
  font-family: 'Inter', sans-serif, -apple-system, system-ui, BlinkMacSystemFont;
}

h3 {
  width: auto;
  height: auto;
  color: #000;
  letter-spacing: 0.5px;
  font-size: 1.2rem;
  font-weight: 500;
  font-family: 'Inter', sans-serif, -apple-system, system-ui, BlinkMacSystemFont;
}

h4 {
  color: #000;
  letter-spacing: 0.5px;
  font-weight: 500;
  font-size: 1rem;
  font-family: 'Inter', sans-serif, -apple-system, system-ui, BlinkMacSystemFont;
}

h5 {
  color: #808EA4;
  letter-spacing: 0.5px;
  line-height: 1.5rem;
  font-weight: 300;
  font-size: 1rem;
  font-family: 'Inter', sans-serif, -apple-system, system-ui, BlinkMacSystemFont;
}

h6 {
  color: #808EA4;
  letter-spacing: 0.5px;
  line-height: 1.5rem;
  font-weight: 300;
  font-size: 0.8rem;
  font-family: 'Inter', sans-serif, -apple-system, system-ui, BlinkMacSystemFont;
}

p {
  color: #000;
  letter-spacing: 0.5px;
  line-height: 1.5rem;
  font-weight: 300;
  font-size: 0.9rem;
  font-family: 'Inter', sans-serif, -apple-system, system-ui, BlinkMacSystemFont;
}

p.jumbo {
  color: #fff;
  letter-spacing: 0.5px;
  line-height: 1.5rem;
  font-weight: 300;
  font-size: 1rem;
  font-family: 'Inter', sans-serif, -apple-system, system-ui, BlinkMacSystemFont;
}

p.rent-collected {
  color: #4527A0;
  letter-spacing: 0.5px;
  font-weight: 800;
  font-size: 3rem;
  font-family: 'Inter', sans-serif, -apple-system, system-ui, BlinkMacSystemFont;
}

p.rent-payments {
  color: #000;
  letter-spacing: 0.5px;
  font-weight: 500;
  font-size: 1.1rem;
  font-family: 'Inter', sans-serif, -apple-system, system-ui, BlinkMacSystemFont;
}

li {
  color: #808EA4;
  letter-spacing: 0.5px;
  line-height: 1.5rem;
  font-weight: 300;
  font-size: 1rem;
  font-family: 'Inter', sans-serif, -apple-system, system-ui, BlinkMacSystemFont;
}

.bg-light {
  transition: 300ms ease;
  background: #fff !important;
}

.bg-light.scrolled {
  background: #4D3A90 !important;
}

.navbar-light .navbar-nav .nav-link {
  color: #4D3A90;
  font-weight: 500;
  letter-spacing: 0.5px;
  font-family: 'Inter', sans-serif, -apple-system, system-ui, BlinkMacSystemFont;
}

.navbar-dark .navbar-nav .nav-link {
  color: #fff;
  font-weight: 500;
  letter-spacing: 0.5px;
  font-family: 'Inter', sans-serif, -apple-system, system-ui, BlinkMacSystemFont;
}

.btn-nav-signup {
  color: #fff !important;
  background-color: #7953d2;
  border-color: #7953d2;
  border-width: 1px;
  border-radius: 6px;
  padding: 0.4rem 1.2rem 0.4rem 1.2rem;
  letter-spacing: 0.5px;
  font-size: 0.9rem;
  font-weight: 500;
}

.btn-nav-signup:hover,
.btn-nav-signup:focus,
.btn-nav-signup:active,
.btn-nav-signup.active,
.open>.dropdown-toggle.btn-nav-signup {
  color: #fff !important;
  background-color: #4D3A90;
  border-color: #4D3A90;
}

.btn-nav-signup.scrolled {
  color: #fff !important;
  background-color: #7953d2;
  border-color: #7953d2;
  border-width: 1px;
  border-radius: 6px;
  padding: 0.4rem 1.2rem 0.4rem 1.2rem;
  letter-spacing: 0.5px;
  font-size: 0.9rem;
  font-weight: 500;
}

.btn-nav-signup.scrolled:hover,
.btn-nav-signup.scrolled:focus,
.btn-nav-signup.scrolled:active,
.btn-nav-signup.active,
.open>.dropdown-toggle.btn-nav-signup.scrolled {
  color: #4D3A90 !important;
  background-color: #fff;
  border-color: #fff;
}

.btn-nav-login {
  color: #4D3A90;
  background-color: #fff;
  border-color: #4D3A90;
  border-width: 2px;
  border-radius: 6px;
  padding: 0.4rem 1.2rem 0.4rem 1.2rem;
  letter-spacing: 0.5px;
  font-size: 0.9rem;
  font-weight: 500;
}

.btn-nav-login:hover,
.btn-nav-login:focus,
.btn-nav-login:active,
.btn-nav-login.active,
.open>.dropdown-toggle.btn-nav-login {
  color: #fff;
  background-color: #4D3A90;
  border-color: #4D3A90;
}

.btn-nav-login.scrolled {
  color: #fff;
  background-color: #4D3A90;
  border-color: #fff;
  border-width: 2px;
  border-radius: 6px;
  padding: 0.4rem 1.2rem 0.4rem 1.2rem;
  letter-spacing: 0.5px;
  font-size: 0.9rem;
  font-weight: 500;
}

.btn-nav-login.scrolled:hover,
.btn-nav-login.scrolled:focus,
.btn-nav-login.scrolled:active,
.btn-nav-login.active,
.open>.dropdown-toggle.btn-nav-login.scrolled {
  color: #4D3A90;
  background-color: #fff;
  border-color: #fff;
}

.btn-nav-login.footer {
  color: #fff !important;
  background-color: #3d355d;
  border-color: #fff;
  border-width: 2px;
  border-radius: 6px;
  padding: 0.4rem 1.2rem 0.4rem 1.2rem;
  letter-spacing: 0.5px;
  font-size: 0.9rem;
  font-weight: 500;
  width: 150px;
}

.btn-nav-login.footer:hover,
.btn-nav-login.footer:focus,
.btn-nav-login.footer:active,
.btn-nav-login.active,
.open>.dropdown-toggle.btn-nav-login.footer {
  color: #fff !important;
  background-color: #7953d2;
  border-color: #7953d2;
}

.btn-nav-signup.footer {
  color: #3d355d !important;
  background-color: #fff;
  border-color: #fff;
  border-width: 1px;
  border-radius: 6px;
  padding: 0.4rem 1.2rem 0.4rem 1.2rem;
  letter-spacing: 0.5px;
  font-size: 0.9rem;
  font-weight: 500;
  width: 150px;
}

.btn-nav-signup.footer:hover,
.btn-nav-signup.footer:focus,
.btn-nav-signup.footer:active,
.btn-nav-signup.active,
.open>.dropdown-toggle.btn-nav-signup.footer {
  color: #fff !important;
  background-color: #7953d2;
  border-color: #7953d2;
}

.btn-full-white {
  color: #4D3A90 !important;
  background-color: #ffffff;
  border-color: #fff;
  border-width: 1px;
  border-radius: 6px;
  padding: 0.5rem 2rem 0.5rem 2rem;
  letter-spacing: 0.5px;
  font-size: 0.9rem;
  font-weight: 500;
}

.btn-full-white:hover,
.btn-full-white:focus,
.btn-full-white:active,
.btn-full-white.active,
.open>.dropdown-toggle.btn-full-white {
  color: #fff !important;
  background-color: #3d355d;
  border-color: #3d355d;
}

.btn-full-purple {
  color: #fff !important;
  background-color: #7953d2;
  border-color: #7953d2;
  border-width: 1px;
  border-radius: 6px;
  padding: 0.5rem 2rem 0.5rem 2rem;
  letter-spacing: 0.5px;
  font-size: 0.9rem;
  font-weight: 500;
}

.btn-full-purple:hover,
.btn-full-purple:focus,
.btn-full-purple:active,
.btn-full-purple.active,
.open>.dropdown-toggle.btn-full-purple {
  color: #fff !important;
  background-color: #4D3A90;
  border-color: #4D3A90;
}

.btn-link {
  color: #40E1E8;
}

.btn-link:hover,
.btn-link:focus,
.btn-link:active,
.btn-link.active {
  color: #fff;
}

hr {
  background-color: #fff;
}

.bank-container {
  position: relative;
  width: 80px;
}

.bank-image {
  display: block;
  width: 100%;
  height: auto;
}

.overlay {
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  height: 100%;
  width: 100%;
  opacity: 0;
  transition: .5s ease;
}

.overlay.anz {
  background-image: url('images/banks/anz.svg');
}

.overlay.asb {
  background-image: url('images/banks/asb.svg');
}

.overlay.bnz {
  background-image: url('images/banks/bnz.svg');
}

.overlay.kb {
  background-image: url('images/banks/kb.svg');
}

.overlay.coop {
  background-image: url('images/banks/coop.svg');
}

.overlay.tsb {
  background-image: url('images/banks/tsb.svg');
}

.overlay.westpac {
  background-image: url('images/banks/westpac.svg');
}

.bank-container:hover .overlay {
  opacity: 1;
}

.img-container {
  position: relative;
  display: inline-block;
}

.img-container .overlay {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: #000;
  opacity: 0;
  transition: opacity 350ms ease-in-out;
}

.img-container:hover .overlay {
  opacity: 0.3;
}

.img-text {
  position: absolute;
  top: 35%;
  left: 40%;
  transform: translate(-50%, -50%);
  color: #fff;
  font-size: 1.2rem;
  font-weight: 300;
  letter-spacing: 0.5px;
  font-family: 'Inter', sans-serif, -apple-system, system-ui, BlinkMacSystemFont;
  text-align: left;
}

.plan-box {
  border-style: solid;
  border-color: #E3E7F1;
  border-radius: 8px;
  border-width: 1px;
  color: #000;
  height: auto;
  width: 268px;
  font-size: 1rem;
  font-weight: 300;
  font-family: 'Inter', sans-serif, -apple-system, system-ui, BlinkMacSystemFont;
}

p.plan-name {
  width: auto;
  height: auto;
  color: #000;
  letter-spacing: 0.5px;
  font-size: 1.2rem;
  font-weight: 500;
  font-family: 'Inter', sans-serif, -apple-system, system-ui, BlinkMacSystemFont;
}

p.plan-cost {
  width: auto;
  height: auto;
  color: #000;
  letter-spacing: 0.5px;
  font-size: 2.8rem;
  font-weight: 600;
  font-family: 'Inter', sans-serif, -apple-system, system-ui, BlinkMacSystemFont;
}

p.plan-billing {
  width: auto;
  height: auto;
  color: #808EA4;
  letter-spacing: 0.5px;
  font-size: 0.9rem;
  font-weight: 400;
  font-family: 'Inter', sans-serif, -apple-system, system-ui, BlinkMacSystemFont;
}

p.plan-regular {
  width: auto;
  height: auto;
  color: #000;
  letter-spacing: 0.5px;
  font-size: 0.9rem;
  font-weight: 400;
  font-family: 'Inter', sans-serif, -apple-system, system-ui, BlinkMacSystemFont;
}

p.plan-bold {
  width: auto;
  height: auto;
  color: #000;
  letter-spacing: 0.5px;
  font-size: 0.9rem;
  font-weight: 500;
  font-family: 'Inter', sans-serif, -apple-system, system-ui, BlinkMacSystemFont;
}

p.plan-disabled {
  width: auto;
  height: auto;
  color: #7F7F7F;
  letter-spacing: 0.5px;
  font-size: 0.9rem;
  font-weight: 300;
  font-family: 'Inter', sans-serif, -apple-system, system-ui, BlinkMacSystemFont;
}

small.fineprint {
  color: #808EA4;
  font-size: 0.8rem;
  font-weight: 300;
  letter-spacing: 0.5px;
  font-family: 'Inter', sans-serif, -apple-system, system-ui, BlinkMacSystemFont;
}

.footer-top {
  background-color: #3d355d;
  color: #fff;
  font-size: 0.8rem;
  font-weight: 300;
  letter-spacing: 0.5px;
  line-height: 1.8rem;
  font-family: 'Inter', sans-serif, -apple-system, system-ui, BlinkMacSystemFont;
}

.footer-top a.item {
  color: #C4C2CE;
}

.footer-top a.header {
  color: #fff;
  font-size: 0.8rem;
  font-weight: 400;
  letter-spacing: 0.5px;
  line-height: 1.8rem;
  font-family: 'Inter', sans-serif, -apple-system, system-ui, BlinkMacSystemFont;
}

.footer-bottom {
  background-color: #13123c;
  color: #fff;
  font-size: 0.7rem;
  font-weight: 300;
  letter-spacing: 0.5px;
  font-family: 'Inter', sans-serif, -apple-system, system-ui, BlinkMacSystemFont;
}

a {
  color: #4D3A90;
  font-weight: 400;
}

@media (max-width: 575px) {
  h1 {
    font-size: 2rem;
  }

  img.logo-responsive {
    width: 50%;
  }

  .purple-bg {
    height: 450px;
  }

  .img-text {
    font-size: 1.2rem;
  }
}

@media (min-width: 575.5px) {
  h1 {
    font-size: 2rem;
  }

  img.logo-responsive {
    width: 50%;
  }

  .purple-bg {
    height: 450px;
  }

  .img-text {
    font-size: 1.5rem;
  }
}

@media (min-width: 768px) {
  h1 {
    font-size: 3rem;
    width: 600px;
  }

  p.jumbo {
    font-size: 1rem;
    line-height: 1.8rem;
    width: 650px;
  }

  img.logo-responsive {
    width: 45%;
  }

  .purple-bg {
    height: 500px;
  }

  .img-text {
    font-size: 1.5rem;
  }
}

@media (min-width: 992px) {
  h1 {
    font-size: 3rem;
    width: 600px;
  }

  img.logo-responsive {
    width: 35%;
  }

  p.jumbo {
    font-size: 1rem;
    width: 650px;
  }

  .purple-bg {
    height: 500px;
  }

  .nav-link {
    font-size: 0.8rem;
  }
}

@media (min-width: 1200px) {
  h1 {
    font-size: 3rem;
    width: 600px;
  }

  img.logo-responsive {
    width: 25%;
  }

  p.jumbo {
    font-size: 1rem;
    width: 580px;
  }

  .purple-bg {
    height: 500px;
  }

  .nav-link {
    font-size: 1rem;
  }

  .img-text {
    font-size: 1.3rem;
  }
}

@media (min-width: 1400px) {
  h1 {
    font-size: 3rem;
    width: 600px;
  }

  p.jumbo {
    font-size: 1rem;
    width: 580px;
  }

  img.logo-responsive {
    width: 25%;
  }

  .purple-bg {
    height: 500px;
  }

  .img-text {
    font-size: 1.5rem;
  }
}