*,
*::before,
*::after {
  box-sizing: border-box; }

html {
  font-family: sans-serif;
  line-height: 1.15;
  -webkit-text-size-adjust: 100%;
  -ms-text-size-adjust: 100%;
  -ms-overflow-style: scrollbar;
  -webkit-tap-highlight-color: rgba(0, 0, 0, 0); }

@-ms-viewport {
  width: device-width; }

article, aside, dialog, figcaption, figure, footer, header, hgroup, main, nav, section {
  display: block; }

body {
  margin: 0;
  padding: 0; }

[tabindex="-1"]:focus {
  outline: none !important; }

hr {
  box-sizing: content-box;
  height: 0;
  overflow: visible; }

h1, h2, h3, h4, h5, h6 {
  margin: 0; }

p {
  margin: 0; }

abbr[title],
abbr[data-original-title] {
  text-decoration: underline;
  text-decoration: underline dotted;
  cursor: help;
  border-bottom: 0; }

address {
  margin-bottom: 1rem;
  font-style: normal;
  line-height: inherit; }

ol,
ul,
dl {
  margin: 0; }

b,
strong {
  font-weight: bolder; }

small {
  font-size: 80%; }

figure {
  margin: 0; }

img {
  vertical-align: middle;
  border-style: none; }

svg:not(:root) {
  overflow: hidden; }

a,
area,
button,
[role="button"],
input:not([type="range"]),
label,
select,
summary,
textarea {
  touch-action: manipulation; }

table {
  border-collapse: collapse; }

th {
  text-align: inherit; }

label {
  display: inline-block; }

button {
  border-radius: 0; }

button:focus {
  outline: 1px dotted;
  outline: 5px auto -webkit-focus-ring-color; }

input,
button,
select,
optgroup,
textarea {
  margin: 0;
  font-family: inherit;
  font-size: inherit;
  line-height: inherit; }

button,
input {
  overflow: visible; }

button,
select {
  text-transform: none; }

button,
html [type="button"],
[type="reset"],
[type="submit"] {
  -webkit-appearance: button; }

button::-moz-focus-inner,
[type="button"]::-moz-focus-inner,
[type="reset"]::-moz-focus-inner,
[type="submit"]::-moz-focus-inner {
  padding: 0;
  border-style: none; }

input[type="radio"],
input[type="checkbox"] {
  box-sizing: border-box;
  padding: 0; }

input[type="date"],
input[type="time"],
input[type="datetime-local"],
input[type="month"] {
  -webkit-appearance: listbox; }

textarea {
  overflow: auto;
  resize: vertical; }

fieldset {
  min-width: 0;
  padding: 0;
  margin: 0;
  border: 0; }

[type="search"]::-webkit-search-cancel-button,
[type="search"]::-webkit-search-decoration {
  -webkit-appearance: none; }

::-webkit-file-upload-button {
  font: inherit;
  -webkit-appearance: button; }

[hidden] {
  display: none !important; }

@font-face {
  font-family: 'IBMPlexSans';
  src: local("IBMPlexSans-Thin"), url(../fonts/IBMPlexSans-Thin.ttf) format("truetype");
  font-weight: 100;
  font-style: normal; }

@font-face {
  font-family: 'IBMPlexSans';
  src: local("IBMPlexSans-ExtraLight"), url(../fonts/IBMPlexSans-ExtraLight.ttf) format("truetype");
  font-weight: 200;
  font-style: normal; }

@font-face {
  font-family: 'IBMPlexSans';
  src: local("IBMPlexSans-Light"), url(../fonts/IBMPlexSans-Light.ttf) format("truetype");
  font-weight: 300;
  font-style: normal; }

@font-face {
  font-family: 'IBMPlexSans';
  src: local("IBMPlexSans-Regular"), url(../fonts/IBMPlexSans-Regular.ttf) format("truetype");
  font-weight: 400;
  font-style: normal; }

@font-face {
  font-family: 'IBMPlexSans';
  src: local("IBMPlexSans-Medium"), url(../fonts/IBMPlexSans-Medium.ttf) format("truetype");
  font-weight: 500;
  font-style: normal; }

@font-face {
  font-family: 'IBMPlexSans';
  src: local("IBMPlexSans-SemiBold"), url(../fonts/IBMPlexSans-SemiBold.ttf) format("truetype");
  font-weight: 600;
  font-style: normal; }

@font-face {
  font-family: 'IBMPlexSans';
  src: local("IBMPlexSans-Bold"), url(../fonts/IBMPlexSans-Bold.ttf) format("truetype");
  font-weight: 700;
  font-style: normal; }

input::-ms-clear {
  display: none; }

input {
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none; }

* {
  margin: 0;
  padding: 0;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box; }

body {
  font-family: "IBMPlexSans", sans-serif;
  font-size: 15px;
  font-size: 0.9375rem;
  font-weight: 300; }

main {
  min-height: 100vh; }

h1 {
  font-size: 60px;
  font-size: 3.75rem; }

h2 {
  font-size: 50px;
  font-size: 3.125rem;
  line-height: 54px; }

h3 {
  font-size: 32px;
  font-size: 2rem;
  line-height: 40px; }

h4 {
  font-size: 22px;
  font-size: 1.375rem; }

h5 {
  font-size: 16px;
  font-size: 1rem; }

p {
  font-weight: 400; }

a {
  text-decoration: none; }

.container-wrap {
  max-width: 1218px;
  margin-left: auto;
  margin-right: auto;
  padding: 0 10px; }

.d-flex {
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: -webkit-flex;
  display: flex;
  flex-wrap: wrap; }

.flex-wrap {
  flex-wrap: wrap; }

.flex-nowwrap {
  flex-wrap: nowrap; }

.justify-content-start {
  -ms-flex-pack: start;
  justify-content: flex-start; }

.justify-content-end {
  -ms-flex-pack: end;
  justify-content: flex-end; }

.justify-content-center {
  -ms-flex-pack: center;
  justify-content: center; }

.justify-content-between {
  -ms-flex-pack: justify;
  justify-content: space-between; }

.align-items-start {
  -ms-flex-align: start;
  align-items: flex-start; }

.align-items-end {
  -ms-flex-align: end;
  align-items: flex-end; }

.align-items-center {
  -ms-flex-align: center;
  align-items: center; }

.grid-two {
  width: -moz-calc(100% / 2);
  width: -webkit-calc(100% / 2);
  width: calc(100% / 2); }

.grid-three {
  width: -moz-calc(100% / 3);
  width: -webkit-calc(100% / 3);
  width: calc(100% / 3); }

.grid-four {
  width: -moz-calc(100% / 4);
  width: -webkit-calc(100% / 4);
  width: calc(100% / 4); }

.grid-five {
  width: -moz-calc(100% / 5);
  width: -webkit-calc(100% / 5);
  width: calc(100% / 5); }

.grid-six {
  width: -moz-calc(100% / 6);
  width: -webkit-calc(100% / 6);
  width: calc(100% / 6); }

.fade-in {
  animation: fadeIn ease .2s;
  -webkit-animation: fadeIn ease .2s;
  -moz-animation: fadeIn ease .2s;
  -o-animation: fadeIn ease .2s;
  -ms-animation: fadeIn ease .2s; }

@keyframes fadeIn {
  0% {
    opacity: 0; }
  100% {
    opacity: 1; } }

@-moz-keyframes fadeIn {
  0% {
    opacity: 0; }
  100% {
    opacity: 1; } }

@-webkit-keyframes fadeIn {
  0% {
    opacity: 0; }
  100% {
    opacity: 1; } }

header {
  width: 100%;
  padding: 10px 0;
  border-bottom: 1px solid rgba(0, 0, 0, 0.14);
  box-shadow: 0px 1px 0px rgba(0, 0, 0, 0.05);
  background-color: #fff; }
  header .header-content {
    display: -webkit-box;
    display: -moz-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    -webkit-box-align: center;
    -moz-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: space-between;
    -moz-box-pack: space-between;
    -webkit-justify-content: space-between;
    -ms-flex-pack: space-between;
    justify-content: space-between; }
  header .link-logo {
    cursor: pointer; }
  header .web-logo {
    max-width: 160px; }
    header .web-logo img {
      width: 100%; }
  header nav {
    flex-grow: 1;
    padding: 0 60px; }
    header nav ul {
      display: flex; }
      header nav ul li {
        list-style: none; }
        header nav ul li a {
          font-size: 18px;
          font-size: 1.125rem;
          color: #6A6A6A;
          font-weight: 400;
          text-decoration: none;
          padding: 12px 20px;
          display: block;
          transition: all 250ms ease;
          -webkit-transition: all 250ms ease;
          -moz-transition: all 250ms ease; }
          header nav ul li a:hover {
            color: #80AC78; }
          header nav ul li a.active {
            color: #80AC78; }
  header .btn-login {
    background-color: #E5E5E5;
    border-radius: 6px;
    font-size: 18px;
    font-size: 1.125rem;
    color: black;
    font-weight: 400;
    padding: 8px 20px;
    cursor: pointer;
    border: none;
    outline: none; }
    header .btn-login:disabled {
      cursor: not-allowed;
      color: #6A6A6A; }

main {
  background-color: #F7F7F7; }

.section-landing {
  padding-top: 36px; }
  .section-landing h2 {
    font-weight: 600;
    padding-bottom: 18px; }
    .section-landing h2 span {
      display: block;
      color: #80AC78;
      font-weight: 300; }
  .section-landing .landing-card {
    background: #FFFFFF;
    box-shadow: 0px 8px 16px #00000008;
    border-radius: 28px;
    margin-bottom: 36px; }
    .section-landing .landing-card .d-flex {
      align-items: center; }
    .section-landing .landing-card .grid-wrap {
      -webkit-box-pack: space-between;
      -moz-box-pack: space-between;
      -webkit-justify-content: space-between;
      -ms-flex-pack: space-between;
      justify-content: space-between; }
    .section-landing .landing-card .text-wrap {
      padding-left: 60px; }
      .section-landing .landing-card .text-wrap p {
        font-size: 25px;
        font-size: 1.5625rem;
        color: #9B9B9B; }
    .section-landing .landing-card .image-wrap {
      max-width: 598px; }
      .section-landing .landing-card .image-wrap img {
        width: 100%; }
  .section-landing .features-card {
    background: transparent linear-gradient(180deg, #F0F0F0 0%, #FFFFFF00 100%) 0% 0% no-repeat;
    border-radius: 19px;
    padding: 32px 16px;
    margin-bottom: 50px; }
    .section-landing .features-card figure {
      text-align: center; }
    .section-landing .features-card img {
      margin-bottom: 12px; }
    .section-landing .features-card label {
      font-size: 14px;
      font-size: 0.875rem;
      color: #9B9B9B;
      font-weight: 300;
      display: block; }
      .section-landing .features-card label span {
        font-size: 18px;
        font-size: 1.125rem;
        font-weight: 500;
        display: block;
        padding-bottom: 4px; }

.section-about {
  padding: 100px 0; }
  .section-about h3 {
    font-weight: 600;
    padding-bottom: 20px; }
    .section-about h3 span {
      display: block;
      color: #80AC78;
      font-weight: 500;
      padding-bottom: 20px; }
  .section-about .grid-left {
    flex-grow: 1; }
  .section-about .about-description {
    margin-bottom: 40px; }
    .section-about .about-description .text-wrap {
      max-width: 450px; }
      .section-about .about-description .text-wrap p {
        font-size: 20px;
        font-size: 1.25rem;
        color: #5C5C5C;
        font-weight: 500;
        line-height: 26px; }
  .section-about .our-moto-card {
    background: transparent linear-gradient(100deg, #F0F0F0 0%, #F7F7F700 100%) 0% 0% no-repeat padding-box;
    border-radius: 28px;
    padding: 36px 30px;
    margin-bottom: 40px; }
    .section-about .our-moto-card .text-wrap {
      max-width: 370px; }
    .section-about .our-moto-card h4 {
      color: #9B9B9B;
      font-weight: 500;
      padding-bottom: 12px; }
    .section-about .our-moto-card p {
      font-size: 20px;
      font-size: 1.25rem;
      color: #5C5C5C;
      font-weight: 400;
      line-height: 26px; }
  .section-about .bottom-text {
    max-width: 390px; }
    .section-about .bottom-text p {
      font-size: 20px;
      font-size: 1.25rem;
      color: #5C5C5C;
      font-weight: 300;
      line-height: 26px; }
  .section-about .image-wrap {
    max-width: 540px;
    position: relative;
    height: 100%;
    max-height: 680px; }
    .section-about .image-wrap img {
      width: 100%;
      position: absolute; }
    .section-about .image-wrap .image-pattern {
      z-index: 1;
      height: 100%;
      max-width: 500px; }
    .section-about .image-wrap .image-car {
      z-index: 3;
      left: 110px;
      bottom: -50px; }
    .section-about .image-wrap .image-phone {
      z-index: 2;
      left: -100px;
      max-width: 360px;
      bottom: 0; }

.section-our-system-services .dark-gray-card {
  background: #2B2B2B 0% 0% no-repeat padding-box;
  border-radius: 28px;
  padding: 60px 50px;
  height: 100%; }
  .section-our-system-services .dark-gray-card .d-flex {
    align-items: center;
    justify-content: space-between; }
    .section-our-system-services .dark-gray-card .d-flex h3 {
      color: #80AC78;
      font-weight: 500; }
    .section-our-system-services .dark-gray-card .d-flex img {
      max-width: 180px;
      width: 100%; }
  .section-our-system-services .dark-gray-card ul li {
    list-style: none;
    padding: 20px 0;
    border-bottom: 1px solid #6A6A6A; }
    .section-our-system-services .dark-gray-card ul li:last-child {
      border-bottom: none; }
    .section-our-system-services .dark-gray-card ul li .icon {
      width: 52px;
      display: block;
      display: inline-block;
      margin-right: 12px; }
      .section-our-system-services .dark-gray-card ul li .icon img {
        width: 100%; }
    .section-our-system-services .dark-gray-card ul li h4 {
      color: #ffffff;
      font-weight: 700;
      padding-bottom: 12px; }
    .section-our-system-services .dark-gray-card ul li p {
      font-size: 18px;
      font-size: 1.125rem;
      font-weight: 400;
      line-height: 24px;
      color: #ffffff; }

.section-our-system-services .our-system-card {
  margin-right: 14px; }

.section-our-system-services .our-service-card {
  margin-left: 14px; }

.section-our-system {
  padding: 80px 0 60px 0; }
  .section-our-system h3 {
    color: #80AC78;
    font-weight: 500;
    padding-bottom: 30px; }
  .section-our-system .our-system-card {
    background: transparent linear-gradient(180deg, #FFFFFF 0%, #FFFFFF00 100%) 0% 0% no-repeat padding-box;
    border-radius: 19px;
    padding: 32px 16px; }
  .section-our-system .grid-four-wrap {
    max-width: 880px;
    margin-left: auto;
    margin-right: auto; }
  .section-our-system .grid-four:hover .original {
    display: none; }
  .section-our-system .grid-four:hover .disabled {
    display: block; }
  .section-our-system .grid-four .original {
    display: block; }
  .section-our-system .grid-four .disabled {
    display: none; }
  .section-our-system .grid-four img {
    max-width: 180px;
    width: 100%;
    margin: auto; }

.section-contact {
  background-color: #090909;
  padding: 140px 0; }
  .section-contact .grid-left {
    flex-grow: 1; }
  .section-contact .text-wrap h1 {
    padding-bottom: 16px;
    color: #fff; }
  .section-contact .text-wrap p {
    font-size: 30px;
    font-size: 1.875rem;
    font-weight: 400;
    color: #fff; }
  .section-contact .address-wrap {
    padding: 40px 0; }
    .section-contact .address-wrap label {
      font-size: 18px;
      font-size: 1.125rem;
      font-weight: 400;
      color: #868686;
      text-decoration: underline;
      line-height: 24px;
      display: block;
      padding: 10px 0;
      max-width: 400px; }
  .section-contact .privacy-wrap {
    padding-top: 40px }
    .section-contact .privacy-wrap a {
      font-size: 18px;
      font-size: 1.125rem;
      font-weight: 400;
      color: #868686;
      line-height: 24px;
      display: block;
      padding: 10px 0;
      max-width: 400px; }
  .section-contact .privacy-wrap a:hover {
    color: #fff;
  }
  .section-contact .map {
    min-width: 380px;
    height: 100%;
    border-radius: 24px; }
  .section-contact .enquiry-card {
    min-width: 330px;
    box-shadow: 0px 0px 25px #00000017;
    border-radius: 24px;
    padding: 40px 30px;
    background-color: #fff; }
    .section-contact .enquiry-card ul li {
      list-style: none;
      padding: 4px 0; }
    .section-contact .enquiry-card h5 {
      color: #000;
      text-align: center;
      padding-bottom: 6px; }
    .section-contact .enquiry-card p {
      font-size: 12px;
      font-size: 0.75rem;
      line-height: 16px;
      font-weight: 400;
      color: #696969;
      text-align: center;
      max-width: 240px;
      margin: auto;
      padding-bottom: 12px; }
    .section-contact .enquiry-card input,
    .section-contact .enquiry-card textarea {
      width: 100%;
      font-size: 8px;
      font-size: 0.5rem;
      line-height: 10px;
      font-weight: 400;
      color: #696969;
      padding: 12px;
      outline: none;
      border: 1px solid #E0E0E0;
      border-radius: 7px; }
    .section-contact .enquiry-card textarea {
      resize: none;
      min-height: 86px; }
    .section-contact .enquiry-card .btn-send {
      background: transparent linear-gradient(266deg, #30B0D6 0%, #6398E0 100%) 0% 0% no-repeat padding-box;
      box-shadow: 0px 6px 15px #00000026;
      border-radius: 4px;
      width: 100%;
      padding: 12px;
      outline: none;
      border: none;
      font-size: 10px;
      font-size: 0.625rem;
      line-height: 12px;
      font-weight: 600;
      color: #fff; }

.section-privacy {
  padding: 30px 0; }
  .section-privacy .privacy-landing {
    background: #FFFFFF;
    box-shadow: 0px 8px 16px #00000008;
    border-radius: 28px;
    margin-bottom: 50px; }
    .section-privacy .privacy-landing h2 {
      text-align: center;
      padding: 120px 0; }
  .section-privacy .privacy-content .text-wrap {
    margin-bottom: 50px;
    max-width: 90%; }
  .section-privacy .privacy-content h3 {
    font-weight: 600;
    padding-bottom: 10px; }
  .section-privacy .privacy-content p {
    font-size: 16px;
    font-size: 1rem;
    color: #9B9B9B; }
    .section-privacy .privacy-content p a {
      color: #80AC78; }

footer {
  width: 100%; }

  .portal-link {
    color: black;
  }