body {
  /* font-family: "Segoe UI", Tahoma, Geneva, Verdana, sans-serif; */
  background: linear-gradient(100deg, rgb(219, 255, 247), #fff9f9);
  margin: 0;
  font-family: "Segoe UI", Tahoma, Geneva, Verdana, sans-serif;
  padding: 0;
  overflow-x: hidden;
}
@media (max-width: 370px) {
  .all ::selection {
    display: none;
    opacity: 0;
    width: 100%;
    margin-right: -30px;
    overflow: auto;
    transition: opacity 2s ease-in;
  }
}
.dotted {
  position: absolute;
  display: grid;
  grid-template-columns: repeat(6, 1fr);
  left: 53%;
  top: 35%;
}
.dotted div {
  width: 5px;
  height: 5px;
  margin: 5px;
  border-radius: 50px;
  background: rgb(202, 89, 255);
}

.orange-back {
  width: 88px;
  position: absolute;
  left: 54%;
  height: 88px;
  top: 30%;
  z-index: 0;
  margin: 5px;
  border-radius: 50px;
  background: rgb(255, 230, 87);
}
.first-landing-with-imge {
  margin-top: 12%;
}
.first-landing-with-imge img {
  width: 429px;
  top: 45%;
  height: 498px;
  position: absolute;
  left: 58%;
}
.dotted-two div {
  width: 3px;
  height: 3px;
  margin: 6px;
  border-radius: 50px;
  background: rgb(26, 4, 36);
}
.dotted-two {
  position: absolute;
  display: grid;
  grid-template-columns: repeat(6, 1fr);
  left: 2%;
  top: 55%;
}
.dotted-two .one17 {
  background: rgb(229, 255, 0);
}
.dotted-two .one11 {
  background: rgb(229, 255, 0);
}
.dotted-two .one28 {
  background: rgb(229, 255, 0);
}
.dotted-two .one28 {
  background: rgb(229, 255, 0);
}
.dotted-two .one2 {
  background: rgb(229, 255, 0);
}
.dotted-two .one34 {
  background: rgb(229, 255, 0);
}
.blow-bob {
  background: #00051a;
  width: 34px;
  height: 34px;
  position: absolute;
  left: 55%;
  top: 66%;
  border-radius: 50px;
  animation: blow 7s infinite ease-in-out;
}
@keyframes blow {
  from {
    left: 55%;
    top: 55%;
    height: 2px;
    width: 2px;
    opacity: 0;
  }

  to {
    top: 66%;
    left: 22%;
    width: 41px;
    height: 41px;
    opacity: 1;
  }
}
.first-landing-with-h1 h1 {
  font-size: 2.9rem;
  font-family: "Segoe UI", Tahoma, Geneva, Verdana, sans-serif;
  margin-top: 123px;
  color: #000000;
  margin-left: 100px;
}
.first-landing-with-h1 p {
  font-family: "Segoe UI", Tahoma, Geneva, Verdana, sans-serif;
  font-size: 17px;
  margin-left: 100px;
  color: #686363;
}
.btn-apply-now {
  position: relative;
  width: 10%;
  margin-top: 10%;
  margin-left: 100px;
  background: #0023b1;
  padding: 17px;
  cursor: pointer;
  text-align: center;
  border: none;
  outline: none;
  overflow: hidden;
  transition: 0.3s;
  z-index: 1;
}
.btn-apply-now::before {
  position: absolute;
  transition: 0.3s;
  content: "";
  width: 0;
  bottom: 0;
  background: #000000;
  height: 120%;
  left: -10%;
  transform: skewX(20deg);
  z-index: -1;
}
.btn-apply-now:hover::before {
  width: 62%;
}
.btn-apply-now::after {
  position: absolute;
  transition: 0.3s;
  content: "";
  width: 0;
  right: 50%;
  bottom: 0;
  height: 4px;
  background: #000000;
}
.btn-apply-now:hover::after {
  width: 62%;
}
.btn-apply-now:after {
  height: 120%;
  right: -10%;
  transform: skewX(20deg);
  z-index: -1;
}
.btn-apply-now a {
  text-decoration: none;
  font-family: "Segoe UI", Tahoma, Geneva, Verdana, sans-serif;
  color: #ffffff;
  font-weight: 700;
  font-size: 17px;
}

@media (max-width: 1187px) {
  .first-landing-with-h1 h1 {
    font-size: 3rem;
    font-family: "Segoe UI", Tahoma, Geneva, Verdana, sans-serif;
    margin-top: 223px;
    margin-left: 47px;
  }
  .first-landing-with-imge img {
    width: 399px;
    top: 49%;
    height: 498px;
    position: absolute;
    left: 50%;
  }
  .first-landing-with-h1 p {
    font-family: "Segoe UI", Tahoma, Geneva, Verdana, sans-serif;
    font-size: 17px;
    margin-left: 47px;
    margin-right: 30px;
    color: #686363;
  }
  .btn-apply-now {
    margin-left: 47px;
  }
}
.three-walking-stuff {
  display: flex;
  text-align: center;
  justify-content: center;
}
.three-walking-stuff div i {
  font-size: 3.7rem;
  color: #ffffff;
  font-weight: 900;
}
.three-walking-stuff div {
  display: flex;
  justify-content: center;
  align-items: center;
  width: 28%;
  border-radius: 10px;
  height: 137px;
  margin: 10px;
}
.three-walking-stuff .text {
  font-family: "Segoe UI", Tahoma, Geneva, Verdana, sans-serif;
  color: #ffffff;
  text-align: start;
  margin-left: 10px;
  line-height: 2px;
}
.three-walking-stuff .text h4 {
  font-size: 23px;
}
.three-walking-stuff .one {
  background: rgb(73, 73, 255);
}
.three-walking-stuff .two {
  background: rgb(179, 1, 170);
}
.three-walking-stuff .three {
  background: rgb(0, 72, 139);
}
.fi-home {
  position: absolute;
  font-size: 40px;
  left: 40%;
  top: 50%;
}
@media (max-width: 966px) {
  .three-walking-stuff {
    display: grid;
    grid-template-columns: 1fr;
  }
  .three-walking-stuff div {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 80%;
    border-radius: 10px;
    height: 137px;
    margin: 10px;
    margin-left: 10%;
  }
  .first-landing-with-imge img {
    width: 349px;
    display: block;
    top: 39%;
    height: 397px;
    /* position: absolute; */
    left: 10%;
  }
  .dotted {
    left: 80%;
  }
  .btn-apply-now {
    width: 50%;
  }
  .first-landing-with-h1 h1 {
    font-size: 2.8rem;
    font-family: "Segoe UI", Tahoma, Geneva, Verdana, sans-serif;
    margin-top: 529px;
  }
}
@media (max-width: 417px) {
  .first-landing-with-imge img {
    width: 349px;
    display: block;
    top: 44%;
    height: 397px;
    /* position: absolute; */
    left: 10%;
  }
}
.fastsecure {
  display: flex;
  /* width: 70%; */
  justify-content: center;
  align-items: center;
  margin-left: -100px;
  margin-top: 3%;
}
.fastsecure ol {
  margin-top: 110px;
}
.fastsecure .two {
  margin-left: 50px;
}
.fastsecure .three {
  margin-left: 30px;
}
.fastsecure .two ol li {
  color: #868686;
  font-size: 17px;
  line-height: 48px;
}
.fastsecure .three ol li {
  color: #585858;
  background: #c8d3ff;
  margin-top: 10px;
  padding: 7px;
  border-radius: 10px;
  font-size: 17px;
  line-height: 29px;
}
.fastsecure h1 {
  font-size: 40px;
  letter-spacing: -2px;
}
.fastsecure .one p {
  color: #868686;
  font-size: 16px;
}
@media (max-width: 1195px) {
  .fastsecure {
    display: flex;
    /* width: 70%; */
    justify-content: center;
    align-items: center;
    margin-left: 40px;
    margin-right: 30px;
    margin-top: 3%;
  }
}
@media (max-width: 979px) {
  .fastsecure {
    display: grid;
    grid-template-columns: 1fr 1fr;
    margin-left: 40px;
    margin-right: 30px;
    margin-top: 3%;
  }
  .fastsecure .three {
    margin-left: -6%;
    margin-bottom: -30%;
  }
}
@media (max-width: 690px) {
  .fastsecure {
    display: grid;
    grid-template-columns: 1fr;
    margin-left: 60px;
    margin-right: 30px;
    margin-top: 3%;
  }
  .fastsecure .two {
    margin-left: -3%;
    /* margin-bottom: -30%; */
  }
  .learn-for-loan {
    width: 88%;
  }
  .apply-for-loan {
    width: 88%;
  }
}
@media (max-width: 458px) {
  .fastsecure {
    display: grid;
    grid-template-columns: 1fr;
    margin-left: 40px;
    margin-right: 30px;
    margin-top: 3%;
  }
  .fastsecure .two {
    margin-left: -3%;
    /* margin-bottom: -30%; */
  }
  .learn-for-loan {
    width: 88%;
  }
  .apply-for-loan {
    width: 88%;
  }
}

.safepartner {
  width: 100%;
  padding: 30px;
  background: #dce3ff;
  margin-top: 5%;
}
.safepartner h1 {
  text-align: center;
  font-size: 25px;
  line-height: 38px;
  letter-spacing: -2px;
}

.safepartner h3 {
  text-align: center;
  font-size: 18px;
  font-weight: 490;
  color: #525252;
}
.safepartner .three {
  display: flex;
  justify-content: center;
  align-items: center;
  text-align: center;
}

.safepartner img {
  width: 80px;
  height: 80px;
}
.safepartner .iicon {
  width: 50px;
  background: rgb(227, 221, 255);
  padding: 10px;
  border-radius: 20px;
  height: 50px;
}
.safepartner .three div {
  margin: 17px;
  background: #ffffff;
  padding: 20px;
  border-radius: 10px;
  color: #525252;
  transition: 0.6s transform;
  height: 192px;
  width: 200px;
}

.safepartner .three div:hover {
  box-shadow: 30px 0px 40px rgba(236, 236, 236, 0.4),
    -30px 0px 40px rgba(189, 187, 187, 0.4);
  transform: scale(1.1);
}
.threethings div:hover {
  transform: scale(1.1);
}
.safepartner .safe-pathmner-saving {
  background: #ffffff;
  padding: 10px;
  border: 2px solid #0023b1;
  border-radius: 10px;
  font-weight: 700;
  cursor: pointer;
  font-size: 17px;
  color: #00051a;
}
.safepartner .safe-pathmner-saving a {
  border-radius: 10px;
  text-decoration: none;
  font-weight: 700;
  font-size: 13px;
  color: #000000;
  white-space: nowrap; /* Prevent text from wrapping */
}

.safepartner .three h2 {
  font-size: 16px;
  white-space: nowrap; /* Prevent text from wrapping */
}
@media (max-width: 1172px) {
  .safepartner h3 {
    text-align: center;
    font-size: 20px;
    font-weight: 490;
    color: #525252;
  }
  .safepartner .three {
    display: flex;
    justify-content: center;
    align-items: center;
    text-align: center;
  }

  .safepartner img {
    width: 80px;
    height: 80px;
  }
  .safepartner .iicon {
    width: 40px;
    background: rgb(126, 156, 255);
    padding: 10px;
    border-radius: 20px;
    height: 40px;
  }
  .safepartner .three div {
    margin: 8px;
    background: #ffffff;
    padding: 20px;
    border-radius: 10px;
    color: #525252;
    transition: 0.6s transform;
  }
}
@media (max-width: 1000px) {
  .safepartner .three {
    display: grid;
    grid-template-columns: 1fr 1fr;
    margin-right: 30px;
    text-align: center;
  }
  .safepartner {
    margin-top: 44%;
  }
}

@media (max-width: 600px) {
  .safepartner .three {
    display: grid;
    grid-template-columns: 1fr;
    margin-right: 30px;
    text-align: center;
  }

  .safepartner .three div {
    margin: 20px;
    background: #ffffff;
    padding: 20px;
    border-radius: 10px;
    color: #525252;
    transition: 0.6s transform;
  }
}
@media (max-width: 499px) {
  .safepartner .three {
    display: grid;
    grid-template-columns: 1fr;
    margin-right: 30px;
    text-align: center;
  }
  .safepartner {
    margin-top: 50%;
  }
  .safepartner .three div {
    /* margin: 5px; */
    margin-left: 2%;
    background: #ffffff;
    padding: 20px;
    border-radius: 10px;
    color: #525252;
    transition: 0.6s transform;
    width: 80%;
  }
}
.howtowork .two {
  display: flex;
  justify-content: center;
  align-items: center;
  margin-top: 40px;
}
.howtowork .two .dok {
  background: #040b25;
  width: 100%;
  color: #fff9f9;
  height: 100px;
  padding: 8px;
  display: flex;
  justify-content: center;
  align-items: center;
  text-align: start;
}
.howtowork .two h3 {
  font-size: 23px;
}
.howtowork .two .rap {
  background: #0b0b0e;
  display: flex;
  width: 100%;
  justify-content: center;
  align-items: center;
  color: #fff9f9;
  text-align: start;
  height: 88px;
  padding: 8px;
}
.howtowork .two img {
  width: 90px;
  height: 90px;
}

.howtowork .two .ka-rap {
  overflow: hidden;
  width: 42%;
  background: #fff9f9;
  margin-left: 40px;
  border-radius: 17px;
  padding-bottom: 30px;
  box-shadow: 30px 0px 40px rgba(236, 236, 236, 0.4),
    -10px 0px 10px rgba(189, 187, 187, 0.4);
}
.howtowork .two .ka-dok {
  padding-bottom: 30px;
  overflow: hidden;
  background: #fff9f9;
  border-radius: 17px;
  width: 42%;
  box-shadow: 30px 0px 40px rgba(236, 236, 236, 0.4),
    -30px 0px 40px rgba(189, 187, 187, 0.4);
}
.howtowork {
  text-align: center;
  margin-top: 90px;
}
.howtowork h1 {
  font-size: 33px;
  margin-top: 30px;
}
.howtowork .one p {
  font-size: 13px;
  color: #868686;
}
.ka-rap .rap p {
  font-size: 13px;
  margin-left: 10px;
}
.ka-dok .dok p {
  font-size: 13px;
  margin-left: 10px;
}

.all-the-ul p {
  text-align: start;
  margin-left: 140px;
  font-weight: 600;
  font-size: 18px;
  line-height: 55px;
}
.inline-line {
  position: absolute;
  margin-left: 60px;
  margin-top: -33px;
}
.inline-line p {
  background: #0023b1;
  border-radius: 50px;
  padding: 5px;
  display: flex;
  justify-content: center;
  align-items: center;
  margin-top: 40px;
  width: 33px;
  height: 33px;
  color: #fff9f9;
  font-weight: 900;
  text-align: center;
  z-index: 1;
}
.inline-line .liness {
  width: 22px;
  height: 43px;
  border-radius: 30px;
  margin-left: 20px;
  z-index: 0;
  margin-top: -432px;
  background: #e71414;
  text-align: center;
  display: flex;
  align-items: center;
  justify-content: center;
  position: absolute;
}
@media (max-width: 1211px) {
  .howtowork .two .ka-dok {
    width: 55%;
  }
  .howtowork .two .ka-rap {
    width: 55%;
  }
}

@media (max-width: 1146px) {
  .howtowork .two .ka-dok {
    width: 55%;
  }
  .howtowork .two .ka-rap {
    width: 55%;
    margin-top: 30px;
  }
}
@media (max-width: 1177px) {
  .howtowork .two .ka-dok {
    width: 88%;
  }
  .howtowork .two .ka-rap {
    margin-left: -30px;
    width: 88%;
    margin-top: 80px;
  }
  .howtowork .two {
    display: grid;
    grid-template-columns: 1fr;
    margin-top: 80px;
    margin-left: 15%;
  }
}
@media (max-width: 800px) {
  .howtowork .two .ka-dok {
    width: 99%;
  }
  .howtowork .two .ka-rap {
    width: 99%;
    /* margin-top: 80px; */
  }
  .howtowork .two {
    display: grid;
    grid-template-columns: 1fr;
    margin-top: 80px;
    /* margin-left: 2%; */
  }
}
@media (max-width: 666px) {
  .all-the-ul p {
    text-align: start;
    margin-left: 120px;
    font-weight: 600;
    font-size: 22px;
    line-height: 44px;
  }
  .howtowork .two {
    display: grid;
    grid-template-columns: 1fr;
    margin-top: 80px;
    /* margin-left: -30px; */
  }
  .inline-line .liness {
    width: 2px;
    height: 43px;
    border-radius: 30px;
    margin-left: 20px;
    z-index: 0;
    margin-top: -15px;
    background: #000000;
    text-align: center;
    display: flex;
    align-items: center;
    justify-content: center;
    position: absolute;
  }
}
@media (max-width: 666px) {
  .all-the-ul p {
    text-align: start;
    margin-left: 120px;
    font-weight: 600;
    font-size: 22px;
    line-height: 57px;
  }
  .howtowork .two {
    display: grid;
    grid-template-columns: 1fr;
    margin-top: 80px;
    margin-left: -30px;
  }

  .inline-line .liness {
    width: 2px;
    height: 43px;
    border-radius: 30px;
    margin-left: 20px;
    z-index: 0;
    margin-top: -15px;
    background: #ff7676;
    text-align: center;
    display: flex;
    align-items: center;
    justify-content: center;
    position: absolute;
  }
  .howtowork .two .ka-rap {
    margin-left: 5px;
  }
  .howtowork .two .ka-rap .she p {
    line-height: 46px;
  }
  .safepartner h1 {
    text-align: start;
    font-size: 30px;
    line-height: 38px;
    letter-spacing: -2px;
  }

  .safepartner h3 {
    text-align: start;
    font-size: 20px;
    font-weight: 490;
    color: #525252;
  }
}
@media (max-width: 430px) {
  .all-the-ul p {
    text-align: start;
    margin-left: 120px;
    font-weight: 600;
    font-size: 17px;
    line-height: 63px;
  }
  .howtowork .two {
    display: grid;
    grid-template-columns: 1fr;
    margin-top: 80px;
    margin-left: -30px;
  }
  .ka-rap .rap p {
    font-size: 12px;
    margin-left: 3px;
  }
  .ka-dok .dok p {
    font-size: 12px;
    margin-left: 3px;
  }

  .inline-line .liness {
    width: 2px;
    height: 43px;
    border-radius: 30px;
    margin-left: 20px;
    z-index: 0;
    margin-top: -15px;
    background: #000000;
    text-align: center;
    display: flex;
    align-items: center;
    justify-content: center;
    position: absolute;
  }

  .howtowork .two .ka-dok {
    /* margin-left: 5px; */
    padding-bottom: 90px;
  }
  .howtowork .two .ka-rap {
    margin-left: 5px;
    padding-bottom: 50px;
  }
  .howtowork .two .ka-rap .she p {
    line-height: 52px;
  }
}
@media (max-width: 352px) {
  .safepartner h1 {
    margin-left: -29px;
    text-align: start;
    font-size: 22px;
    line-height: 38px;
    letter-spacing: -2px;
  }

  .safepartner h3 {
    text-align: start;
    font-size: 16px;
    font-weight: 490;
    color: #525252;
    margin-left: -29px;
  }
  .all-the-ul p {
    text-align: start;
    margin-left: 120px;
    font-weight: 600;
    font-size: 17px;
    line-height: 49px;
  }
  .howtowork .two {
    display: grid;
    grid-template-columns: 1fr;
    margin-top: 80px;
    margin-left: -30px;
  }

  .inline-line .liness {
    width: 2px;
    height: 43px;
    border-radius: 30px;
    margin-left: 20px;
    z-index: 0;
    margin-top: -15px;
    background: #000000;
    text-align: center;
    display: flex;
    align-items: center;
    justify-content: center;
    position: absolute;
  }

  .howtowork .two .ka-dok {
    /* margin-left: 5px; */
    padding-bottom: 90px;
  }
  .howtowork .two .ka-rap {
    margin-left: 5px;
    padding-bottom: 50px;
  }
  .howtowork .two .ka-rap .she p {
    line-height: 52px;
  }
}

@media (min-height: 352px) {
  .inline-line .liness {
    width: 2px;
    height: 41px;
    border-radius: 30px;
    margin-left: 20px;
    z-index: 0;
    margin-top: -15px;
    background: #000000;
    text-align: center;
    display: flex;
    align-items: center;
    justify-content: center;
    position: absolute;
  }
}

.have-qs {
  position: relative;
  overflow: hidden;
  display: flex;
  justify-content: center;
  align-items: center;
  text-align: start;
  background: #0023b1;
  width: 78%;
  padding: 47px;
  color: #fff9f9;
  border-radius: 20px;
  z-index: 1;
  margin-top: 5%;
  margin-left: 5%;
}
.have-qs h1 {
  z-index: 1;
  font-size: 29px;
}

.have-qs p {
  font-size: 12px;
}
.have-qs .havewqs {
  margin-left: 20%;
}
@media (max-width: 957px) {
  .have-qs {
    display: flex;
    justify-content: center;
    align-items: center;
    text-align: start;
    background: #0023b1;
    width: 78%;
    padding: 60px;
    color: #fff9f9;
    border-radius: 20px;
    margin-top: 5%;
    margin-left: 5%;
  }
  .have-qs h1 {
    font-size: 23px;
  }

  .have-qs p {
    font-size: 14px;
  }
  .have-qs .havewqs {
    margin-left: 10%;
  }
  .havewqs a {
    text-decoration: none;
    font-family: "Segoe UI", Tahoma, Geneva, Verdana, sans-serif;
    color: #ffffff;
    font-weight: 700;
    font-size: 18px;
    padding: 16px;
  }
}
@media (max-width: 768px) {
  .have-qs {
    display: flex;
    justify-content: center;
    align-items: center;
    text-align: start;
    background: #0023b1;
    width: 78%;
    padding: 45px;
    color: #fff9f9;
    border-radius: 20px;
    margin-top: 5%;
    margin-left: 5%;
  }
  .have-qs h1 {
    font-size: 23px;
  }

  .have-qs p {
    font-size: 14px;
  }
  .have-qs .havewqs {
    margin-left: 2%;
  }
  .havewqs a {
    text-decoration: none;
    font-family: "Segoe UI", Tahoma, Geneva, Verdana, sans-serif;
    color: #ffffff;
    font-weight: 700;
    font-size: 18px;
    padding: 16px;
  }
  .havewqs {
    width: 28%;
  }
}
@media (max-width: 768px) {
  .have-qs {
    display: grid;
    grid-template-columns: 1fr;
    text-align: start;
    background: #0023b1;
    width: 78%;
    padding: 45px;
    color: #fff9f9;
    border-radius: 20px;
    margin-top: 5%;
    margin-left: 2%;
  }
  .have-qs h1 {
    font-size: 23px;
  }

  .have-qs p {
    font-size: 14px;
  }
  .have-qs .havewqs {
    margin-left: 2%;
  }
  .havewqs a {
    text-decoration: none;
    font-family: "Segoe UI", Tahoma, Geneva, Verdana, sans-serif;
    color: #ffffff;
    font-weight: 700;
    font-size: 18px;
    padding: 16px;
  }
  .havewqs {
    width: 90%;
  }
}
.last-thing p {
  font-size: 12px;
}

@media (max-width: 413px) {
  .first-landing-with-imge img {
    width: 429px;
    top: 53%;
    height: 498px;
    position: absolute;
    left: 1%;
  }
  .first-landing-with-imge img {
    width: 329px;
    top: 15%;
    height: 408px;
    position: absolute;
  }
  .have-qs{
    display: none;
  }
}

.container-eg-btn-2 {
  color: #c7c4c4;
}