* {
  box-sizing: border-box;
  font-family: "Poppins", sans-serif;
}

body {
  margin: 0;
  padding: 0;
  background: #eee;
}
.bdcont {
  position: relative;
  top: 20px;
  overflow-x: hidden;
}
.cont1 {
  background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' version='1.1' xmlns:xlink='http://www.w3.org/1999/xlink' xmlns:svgjs='http://svgjs.com/svgjs' width='350' height='200' preserveAspectRatio='none' viewBox='0 0 350 200'%3e%3cg mask='url(%26quot%3b%23SvgjsMask1026%26quot%3b)' fill='none'%3e%3crect width='350' height='200' x='0' y='0' fill='rgba(255%2c 255%2c 255%2c 1)'%3e%3c/rect%3e%3cpath d='M417.67 71.2C373.72 71.79 337.63 124.39 249.7 123.2 161.77 122.01 137.94-21.66 81.73-33.1' stroke='rgba(151%2c 246%2c 117%2c 0.37)' stroke-width='2'%3e%3c/path%3e%3cpath d='M385.78 52.69C359.36 52.51 334.44 27.69 283.11 27.69 231.77 27.69 232.94 52.94 180.43 52.69 127.93 52.44 108.55-13.31 77.76-16.43' stroke='rgba(151%2c 246%2c 117%2c 0.37)' stroke-width='2'%3e%3c/path%3e%3cpath d='M397.94 90.67C353.83 91.19 317.59 142 228.73 140.67 139.87 139.34 116.32-6.34 59.52-18.09' stroke='rgba(151%2c 246%2c 117%2c 0.37)' stroke-width='2'%3e%3c/path%3e%3cpath d='M389.03 90.54C344.48 91.11 307.84 143.76 218.58 142.54 129.33 141.32 105.13-4.19 48.14-15.74' stroke='rgba(151%2c 246%2c 117%2c 0.37)' stroke-width='2'%3e%3c/path%3e%3cpath d='M405.33 103.73C359.59 101.11 313.61 22.8 243.52 17.73 173.43 12.66 187.05-35.45 162.62-38.07' stroke='rgba(151%2c 246%2c 117%2c 0.37)' stroke-width='2'%3e%3c/path%3e%3c/g%3e%3cdefs%3e%3cmask id='SvgjsMask1026'%3e%3crect width='350' height='200' fill='white'%3e%3c/rect%3e%3c/mask%3e%3c/defs%3e%3c/svg%3e");

  padding: 70px 10px;
}
.cont1 p {
  color: #0a150f;
}
.cont1 .p1 {
  margin: 0;
  padding: 10px;
  font-size: 30px;
  font-family: "Varela Round", sans-serif;
  text-align: center;
  font-weight: 500;
}
.cont1 .p2 {
  margin: 0;
  padding: 5px;
  text-align: center;
  font-size: 1em;
}
.cont1 .top-up {
  color: red;
}
.cont1 .inputbox {
  margin: 0 15px;
}
.cont1 input {
  width: 100%;
  padding: 15px 7px;
  background: #eee;
  border: none;
  outline: none;
  color: #d0ada7;
  font-size: 14px;
  font-weight: 500;
  border-radius: 3px;
}
.cont2 {
  background: #fff;
  padding: 10px;
}
.cont2 .img {
  position: relative;
  top: -70px;
  display: flex;
  justify-content: center;
  margin-bottom: -60px;
}
.cont2 img {
  width: 400px;
  border-radius: 5px;
}
.cont2 p {
  font-size: 0.85em;
  color: #7a7a7a;
  padding: 0 14px;
  line-height: 1.5;
}
.cont3 {
  padding: 10px;
  background: #fff;
  overflow: hidden;
}
.cont3 .innerCont3 {
  display: flex;
  justify-content: center;
  flex-wrap: wrap;
}
.subcont3 {
  min-width: 150px;
  height: 215px;
  /* border:0.3px solid #484848; */
  border-radius: 4px;
  margin: 10px 5px;
  padding: 10px;
  box-shadow: 0 2px 4px #c5c5c5;
  position: relative;
  cursor: pointer;
  transition: 0.3s;
}
.subcont3:hover {
  top: -5px;
  box-shadow: 0 5px 4px #afacac;
}

.subcont3 .img {
  display: flex;
  justify-content: center;
}
.subcont3 img {
  width: 100%;
}
.subcont3 .blur {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  left: 0;
  height: 100%;
  width: 100%;
  z-index: 0;
}
.cont3 p {
}
.cont3 .p1 {
  font-size: 18px;
  color: #6b6b6b;
}
.cont3 .p2 {
  font-size: 1em;
  color: #00928c;
  text-align: center;
  font-weight: 500;
  font-family: "Varela Round", sans-serif;
}
.cont3 .p3 {
  font-size: 0.82em;
  color: #525252;
  font-weight: 500;
  padding: 5px;
  text-align: center;
}
.cont3 .p4 {
  position: absolute;
  top: 50%;
  left: 0;
  transform: translate(0, -50%);
  text-align: center;
  display: none;
  z-index: 1;
  font-size: 16px;
  font-weight: 600;
  color: #00422c;
  text-shadow: 0 0 5px #fff;
  font-family: "Varela Round", sans-serif;
  pointer-events: none;
}
.cont4 {
  /* background :linear-gradient(to bottom right, #00D2A6, #00FF7E); */
  padding: 40px 10px;
}
.cont4 .p1 {
  text-align: right;
  font-size: 25px;
  font-weight: 600;
  margin: 0;
  padding: 3px 5px;
  color: red;
  opacity: 0.7;
  font-family: "Varela Round", sans-serif;
}
.cont4 .p2 {
  color: #4d726b;
  font-size: 0.82em;
  line-height: 1.7;
  padding: 0 10px;
}
.cont5 {
  display: block;
  background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' version='1.1' xmlns:xlink='http://www.w3.org/1999/xlink' xmlns:svgjs='http://svgjs.com/svgjs' width='500' height='1060' preserveAspectRatio='none' viewBox='0 0 500 1060'%3e%3cg mask='url(%26quot%3b%23SvgjsMask1017%26quot%3b)' fill='none'%3e%3crect width='500' height='1060' x='0' y='0' fill='rgba(111%2c 26%2c 7%2c 1)'%3e%3c/rect%3e%3cpath d='M -109.84004048271117%2c561 C -76.44%2c538.2 -9.64%2c386.4 57.15995951728883%2c447 C 123.96%2c507.6 157.36%2c908.2 224.15995951728883%2c864 C 290.96%2c819.8 324.36%2c234.6 391.1599595172888%2c226 C 457.96%2c217.4 536.39%2c819 558.1599595172888%2c821 C 579.93%2c823 511.63%2c353 500%2c236' stroke='rgba(176%2c 43%2c 13%2c 0.38)' stroke-width='2'%3e%3c/path%3e%3cpath d='M -96.2728265807385%2c236 C -62.87%2c311.4 3.93%2c618.2 70.7271734192615%2c613 C 137.53%2c607.8 170.93%2c185.4 237.7271734192615%2c210 C 304.53%2c234.6 337.93%2c710.8 404.7271734192615%2c736 C 471.53%2c761.2 552.67%2c342.4 571.7271734192615%2c336 C 590.78%2c329.6 514.35%2c630.4 500%2c704' stroke='rgba(176%2c 43%2c 13%2c 0.38)' stroke-width='2'%3e%3c/path%3e%3cpath d='M -158.33815835960678%2c612 C -124.94%2c545.8 -58.14%2c261.4 8.661841640393218%2c281 C 75.46%2c300.6 108.86%2c689 175.66184164039322%2c710 C 242.46%2c731 275.86%2c345.8 342.6618416403932%2c386 C 409.46%2c426.2 478.19%2c953.8 509.6618416403932%2c911 C 541.13%2c868.2 501.93%2c319.8 500%2c172' stroke='rgba(176%2c 43%2c 13%2c 0.38)' stroke-width='2'%3e%3c/path%3e%3cpath d='M -237.46180396531395%2c877 C -204.06%2c742.6 -137.26%2c242.2 -70.46180396531395%2c205 C -3.66%2c167.8 29.74%2c670 96.53819603468605%2c691 C 163.34%2c712 196.74%2c319.8 263.53819603468605%2c310 C 330.34%2c300.2 383.25%2c613.6 430.53819603468605%2c642 C 477.83%2c670.4 486.11%2c490 500%2c452' stroke='rgba(176%2c 43%2c 13%2c 0.38)' stroke-width='2'%3e%3c/path%3e%3c/g%3e%3cdefs%3e%3cmask id='SvgjsMask1017'%3e%3crect width='500' height='1060' fill='white'%3e%3c/rect%3e%3c/mask%3e%3c/defs%3e%3c/svg%3e");
  background: #fff;

  background-repeat: no-repeat;
  background-size: cover;
  padding: 10px;
}
.subcont5 {
  padding: 5px 45px;
}
.subcont5 i {
  color: #c2c2c2;
  font-size: 30px;
  display: flex;
  justify-content: center;
  padding: 10px 0;
  text-shadow: 0 2px 5px #6f1a07;
}
.subcont5 p {
  text-align: center;
}
.subcont5 .p1 {
  font-size: 20px;
  color: #6f1a07;
  color: #176e27;
  font-weight: 500;
  font-family: "Varela Round", sans-serif;
}
.subcont5 .p2 {
  font-size: 0.8em;
  color: #414141;
  line-height: 1.5;
  font-family: "Sora", sans-serif;
}
.cont6 {
  height: 200px;
  overflow: hidden;
}
.subcont6 {
  background: rgba(0, 0, 0, 0.6);
  width: 100%;
  height: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
}
.subcont6 p {
  text-align: center;
  color: #fff;
  font-weight: 500;
  font-family: "Varela Round", sans-serif;
  font-size: 20px;
}
.svg {
  display: none;
  position: relative;
}
svg {
  position: absolute;
  background-color: #383838;
  top: -60px;
}
.image {
  display: flex;
  justify-content: center;
  margin: 7px 0;
}
.image img {
  width: 300px;
}
.get-started {
  display: flex;
  justify-content: center;
  background: #eee;
  padding: 10px;
  margin: 7px 0;
}
.get-started:nth-child(1n) {
  background-color: transparent;
}
.get-started button {
  background: #176e27;
  color: #fff;
  padding: 10px;
  border-radius: 5px;
  outline: none;
  border: none;
  font-size: 13px;
  font-weight: 500;
  font-family: "Sora", sans-serif;
  width: 200px;
  cursor: pointer;
}
.get-started button:hover {
  background: #0f5c1d;
}
.cont7 {
  margin: 7px 0;
  padding: 10px;
}
.cont7 img {
  border-radius: 50%;
}
.cont7 .p1 {
  margin: 0;
  padding: 5px;
  /*color: #ac0002;*/
  color: red;
  opacity: 0.7;
  font-size: 25px;
  font-family: "Varela Round", sans-serif;
  font-weight: 500;
}
.cont7 .p2 {
  margin: 0;
  padding: 5px;
  color: #696969;
  font-size: 15px;
  font-family: "Sora", sans-serif;
}
@media screen and (min-width: 1000px) {
  .bdcont {
    position: absolute;
    right: 0;
    width: 80%;
  }
  .cont1 {
    /* display: flex;
    justify-content: center; */
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' version='1.1' xmlns:xlink='http://www.w3.org/1999/xlink' xmlns:svgjs='http://svgjs.com/svgjs' width='1000' height='200' preserveAspectRatio='none' viewBox='0 0 1000 200'%3e%3cg mask='url(%26quot%3b%23SvgjsMask1033%26quot%3b)' fill='none'%3e%3crect width='1000' height='200' x='0' y='0' fill='rgba(255%2c 255%2c 255%2c 1)'%3e%3c/rect%3e%3cpath d='M1036.6 45.33C932.66 45.58 781.22 115.41 626.76 115.33 472.3 115.25 482.48-10.78 421.84-16.29' stroke='rgba(151%2c 246%2c 117%2c 0.37)' stroke-width='2'%3e%3c/path%3e%3cpath d='M1118.85 180.52C1037.61 180.5 956.85 155.52 794.85 155.52 632.85 155.52 637.58 181.65 470.85 180.52 304.12 179.39 239.64 3.94 146.85-2.21' stroke='rgba(151%2c 246%2c 117%2c 0.37)' stroke-width='2'%3e%3c/path%3e%3cpath d='M1027.37 35.4C920.76 35.46 815.53 79.41 603.19 79.4 390.86 79.39 287.16-4.91 179.02-5.32' stroke='rgba(151%2c 246%2c 117%2c 0.37)' stroke-width='2'%3e%3c/path%3e%3cpath d='M1064.91 137.2C996.27 135.75 941.54 44.84 806.88 43.2 672.22 41.56 615.1-16.87 548.85-17.27' stroke='rgba(151%2c 246%2c 117%2c 0.37)' stroke-width='2'%3e%3c/path%3e%3cpath d='M1140.83 63.46C1021.42 63.7 905.65 139.5 669.25 139.46 432.86 139.42 320.92-2.72 197.68-4.31' stroke='rgba(151%2c 246%2c 117%2c 0.37)' stroke-width='2'%3e%3c/path%3e%3c/g%3e%3cdefs%3e%3cmask id='SvgjsMask1033'%3e%3crect width='1000' height='200' fill='white'%3e%3c/rect%3e%3c/mask%3e%3c/defs%3e%3c/svg%3e");
  }
  .subcont1 {
    background-color: rgba(10, 20, 15, 0.05);
    /* width: 100%; */
    padding: 10px 0;
    border-radius: 5px;
  }
  .cont1 p {
    color: #00422c;
  }
  .cont2 {
    display: flex;
    justify-content: space-around;
    align-items: center;
  }
  .cont2 p {
    opacity: 0.8;
    color: #00422c;
    font-size: 1.1em;
    max-width: 400px;
    line-height: 2;
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' version='1.1' xmlns:xlink='http://www.w3.org/1999/xlink' xmlns:svgjs='http://svgjs.com/svgjs' width='360' height='250' preserveAspectRatio='none' viewBox='0 0 360 250'%3e%3cg mask='url(%26quot%3b%23SvgjsMask1243%26quot%3b)' fill='none'%3e%3crect width='360' height='250' x='0' y='0' fill='rgba(238%2c 238%2c 238%2c 1)'%3e%3c/rect%3e%3cuse xlink:href='%23SvgjsPath1244' x='30' y='30' stroke='rgba(10%2c 21%2c 15%2c 0.39)'%3e%3c/use%3e%3cuse xlink:href='%23SvgjsPath1245' x='30' y='90' stroke='rgba(10%2c 21%2c 15%2c 0.39)'%3e%3c/use%3e%3cuse xlink:href='%23SvgjsPath1246' x='30' y='150' stroke='rgba(10%2c 21%2c 15%2c 0.39)'%3e%3c/use%3e%3cuse xlink:href='%23SvgjsPath1244' x='30' y='210' stroke='rgba(10%2c 21%2c 15%2c 0.39)'%3e%3c/use%3e%3cuse xlink:href='%23SvgjsPath1246' x='30' y='270' stroke='rgba(10%2c 21%2c 15%2c 0.39)'%3e%3c/use%3e%3cuse xlink:href='%23SvgjsPath1247' x='90' y='30' stroke='rgba(10%2c 21%2c 15%2c 0.39)'%3e%3c/use%3e%3cuse xlink:href='%23SvgjsPath1247' x='90' y='90' stroke='rgba(10%2c 21%2c 15%2c 0.39)'%3e%3c/use%3e%3cuse xlink:href='%23SvgjsPath1244' x='90' y='150' stroke='rgba(10%2c 21%2c 15%2c 0.39)'%3e%3c/use%3e%3cuse xlink:href='%23SvgjsPath1247' x='90' y='210' stroke='rgba(10%2c 21%2c 15%2c 0.39)'%3e%3c/use%3e%3cuse xlink:href='%23SvgjsPath1248' x='90' y='270' stroke='rgba(10%2c 21%2c 15%2c 0.39)'%3e%3c/use%3e%3cuse xlink:href='%23SvgjsPath1245' x='150' y='30' stroke='rgba(10%2c 21%2c 15%2c 0.39)'%3e%3c/use%3e%3cuse xlink:href='%23SvgjsPath1245' x='150' y='90' stroke='rgba(10%2c 21%2c 15%2c 0.39)'%3e%3c/use%3e%3cuse xlink:href='%23SvgjsPath1247' x='150' y='150' stroke='rgba(10%2c 21%2c 15%2c 0.39)'%3e%3c/use%3e%3cuse xlink:href='%23SvgjsPath1246' x='150' y='210' stroke='rgba(10%2c 21%2c 15%2c 0.39)'%3e%3c/use%3e%3cuse xlink:href='%23SvgjsPath1247' x='150' y='270' stroke='rgba(10%2c 21%2c 15%2c 0.39)'%3e%3c/use%3e%3cuse xlink:href='%23SvgjsPath1244' x='210' y='30' stroke='rgba(10%2c 21%2c 15%2c 0.39)'%3e%3c/use%3e%3cuse xlink:href='%23SvgjsPath1244' x='210' y='90' stroke='rgba(10%2c 21%2c 15%2c 0.39)'%3e%3c/use%3e%3cuse xlink:href='%23SvgjsPath1246' x='210' y='150' stroke='rgba(10%2c 21%2c 15%2c 0.39)'%3e%3c/use%3e%3cuse xlink:href='%23SvgjsPath1246' x='210' y='210' stroke='rgba(10%2c 21%2c 15%2c 0.39)'%3e%3c/use%3e%3cuse xlink:href='%23SvgjsPath1247' x='210' y='270' stroke='rgba(10%2c 21%2c 15%2c 0.39)'%3e%3c/use%3e%3cuse xlink:href='%23SvgjsPath1246' x='270' y='30' stroke='rgba(10%2c 21%2c 15%2c 0.39)'%3e%3c/use%3e%3cuse xlink:href='%23SvgjsPath1246' x='270' y='90' stroke='rgba(10%2c 21%2c 15%2c 0.39)'%3e%3c/use%3e%3cuse xlink:href='%23SvgjsPath1244' x='270' y='150' stroke='rgba(10%2c 21%2c 15%2c 0.39)'%3e%3c/use%3e%3cuse xlink:href='%23SvgjsPath1246' x='270' y='210' stroke='rgba(10%2c 21%2c 15%2c 0.39)'%3e%3c/use%3e%3cuse xlink:href='%23SvgjsPath1247' x='270' y='270' stroke='rgba(10%2c 21%2c 15%2c 0.39)'%3e%3c/use%3e%3cuse xlink:href='%23SvgjsPath1245' x='330' y='30' stroke='rgba(10%2c 21%2c 15%2c 0.39)'%3e%3c/use%3e%3cuse xlink:href='%23SvgjsPath1247' x='330' y='90' stroke='rgba(10%2c 21%2c 15%2c 0.39)'%3e%3c/use%3e%3cuse xlink:href='%23SvgjsPath1247' x='330' y='150' stroke='rgba(10%2c 21%2c 15%2c 0.39)'%3e%3c/use%3e%3cuse xlink:href='%23SvgjsPath1247' x='330' y='210' stroke='rgba(10%2c 21%2c 15%2c 0.39)'%3e%3c/use%3e%3cuse xlink:href='%23SvgjsPath1249' x='330' y='270' stroke='rgba(10%2c 21%2c 15%2c 0.39)' stroke-width='3'%3e%3c/use%3e%3c/g%3e%3cdefs%3e%3cmask id='SvgjsMask1243'%3e%3crect width='360' height='250' fill='white'%3e%3c/rect%3e%3c/mask%3e%3cpath d='M-1 0 a1 1 0 1 0 2 0 a1 1 0 1 0 -2 0z' id='SvgjsPath1248'%3e%3c/path%3e%3cpath d='M-3 0 a3 3 0 1 0 6 0 a3 3 0 1 0 -6 0z' id='SvgjsPath1245'%3e%3c/path%3e%3cpath d='M-5 0 a5 5 0 1 0 10 0 a5 5 0 1 0 -10 0z' id='SvgjsPath1244'%3e%3c/path%3e%3cpath d='M2 -2 L-2 2z' id='SvgjsPath1246'%3e%3c/path%3e%3cpath d='M6 -6 L-6 6z' id='SvgjsPath1247'%3e%3c/path%3e%3cpath d='M30 -30 L-30 30z' id='SvgjsPath1249'%3e%3c/path%3e%3c/defs%3e%3c/svg%3e");

    background-repeat: no-repeat;
    background-size: cover;
    box-shadow: 0 2px 5px #c9c9c9;
    padding: 50px 15px;
    border-radius: 10px;
  }
  .cont3 .p1 {
    padding-left: 20px;
    font-size: 2em;
  }
  .subcont3 {
    margin: 10px 5px;
  }
  .cont4 {
    padding: 50px 20px;
    padding-left: 40px;
  }
  .cont4 .p1 {
    font-size: 2em;
  }
  .cont4 .p2 {
    font-size: 1em;
  }
  .cont5 {
    display: flex;
    justify-content: center;
    flex-wrap: wrap;
  }
  .subcont5 {
    max-width: 300px;
    padding: 5px 10px;
  }
}