/**
* @version   $1.0.0: custom.scss 2022-06-15 18:24 [Son Nguyen] $
* @author PHPKUNGFU https://phpkungfu.com/
* @copyright Copyright (C) 2022 PHPKUNGFU (Son Nguyen)
* @support info@phpkungfu.com
*/
/* @group VARIABLES */
/* @end */
/**
* @version   $1.0.0: custom.scss 2022-06-15 18:24 [Son Nguyen] $
* @author PHPKUNGFU https://phpkungfu.com/
* @copyright Copyright (C) 2022 PHPKUNGFU (Son Nguyen)
* @support info@phpkungfu.com
*/
/* @group VARIABLES */
/* @end */
/* @group BUTTONS */
/* @end */
/* @group COMPONENTS */
/* @end */
/* @group FONTS */
@font-face {
  font-family: "Frutiger";
  src: url("../../fonts/FTUBL.woff2") format("woff2"); }
/* @end */
body {
  background: #14161A; }

.txt-green {
  color: #17D87C; }

.uk-section-default {
  background: #14161A; }

.tm-header, .tm-header-mobile {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  z-index: 88; }
  .tm-header .uk-navbar-container, .tm-header-mobile .uk-navbar-container {
    background: transparent;
    border: 0 none; }
    .tm-header .uk-navbar-container:not(.uk-navbar-transparent), .tm-header-mobile .uk-navbar-container:not(.uk-navbar-transparent) {
      backdrop-filter: none; }
  .tm-header .uk-navbar-left, .tm-header .uk-navbar-right, .tm-header-mobile .uk-navbar-left, .tm-header-mobile .uk-navbar-right {
    border: 0 none; }
    .tm-header .uk-navbar-left .uk-navbar-item, .tm-header .uk-navbar-right .uk-navbar-item, .tm-header-mobile .uk-navbar-left .uk-navbar-item, .tm-header-mobile .uk-navbar-right .uk-navbar-item {
      border: 0 none; }
    .tm-header .uk-navbar-left .uk-navbar-nav, .tm-header .uk-navbar-left .uk-navbar-toggle, .tm-header .uk-navbar-right .uk-navbar-nav, .tm-header .uk-navbar-right .uk-navbar-toggle, .tm-header-mobile .uk-navbar-left .uk-navbar-nav, .tm-header-mobile .uk-navbar-left .uk-navbar-toggle, .tm-header-mobile .uk-navbar-right .uk-navbar-nav, .tm-header-mobile .uk-navbar-right .uk-navbar-toggle {
      border: 0 none; }

.sec-banner {
  color: #fff;
  font-size: 30px;
  font-weight: 600;
  line-height: 1.5;
  background-image: url("../../img/payright/bg-banner.png");
  background-repeat: no-repeat;
  background-position: center right;
  background-size: 100% auto;
  position: relative;
  padding-top: 100px; }
@media (max-width: 1440px) {
  .sec-banner {
    background-size: cover; } }
@media (max-width: 991px) {
  .sec-banner {
    font-size: 20px;
    background-image: url("../../img/payright/bg-banner-sp.png");
    background-position: center bottom;
    background-size: 100% auto; } }
.sec-banner::after {
  content: "";
  position: absolute;
  left: 0;
  bottom: 0;
  width: 100%;
  height: 250px;
  background: linear-gradient(180deg, rgba(20, 22, 26, 0) 0%, #14161A 100%); }
.sec-banner::before {
  content: "";
  position: absolute;
  left: -450px;
  top: calc(100% - 450px);
  background-image: url("../../img/payright/circle-green.png");
  background-repeat: no-repeat;
  background-position: center right;
  background-size: contain;
  width: 900px;
  height: 900px;
  z-index: 2;
  filter: blur(100px); }
.sec-banner .uk-container {
  max-width: 1480px; }
.sec-banner .list-banner {
  align-items: center; }
.sec-banner .title-banner {
  font-size: 80px;
  font-weight: 700;
  line-height: 1.2; }
@media (max-width: 767px) {
  .sec-banner .title-banner {
    font-size: 40px; } }

.vending-machine {
  color: #fff;
  font-size: 22px;
  font-weight: 500;
  line-height: 1.4;
  position: relative;
  background-image: url("../../img/payright/bg-vending-machne.png");
  background-repeat: no-repeat;
  background-position: top -55px right;
  background-size: cover;
  padding: 100px 0 300px; }
@media (max-width: 767px) {
  .vending-machine {
    padding: 100px 0 200px;
    font-size: 18px;
    background-image: url("../../img/payright/bg-vending-machne-sp.png");
    background-position: bottom right;
    background-size: contain; } }
.vending-machine::after {
  content: "";
  position: absolute;
  left: 0;
  bottom: 0;
  width: 100%;
  height: 250px;
  opacity: 0.3;
  background: linear-gradient(180deg, #14161A 0%, rgba(20, 22, 26, 0) 68.87%, #14161A 91.22%); }
.vending-machine .title-vending {
  font-size: 36px;
  font-weight: 700;
  line-height: 1.3; }
@media (max-width: 767px) {
  .vending-machine .title-vending {
    font-size: 28px; } }
.vending-machine ul > li {
  margin: 0 0 10px; }

.mobile-app .image-mobile {
  position: relative; }
  .mobile-app .image-mobile::before, .mobile-app .image-mobile::after {
    position: absolute;
    content: ""; }
  .mobile-app .image-mobile::before {
    left: 50%;
    top: 50%;
    background-image: url("../../img/payright/circle-blue.png");
    background-repeat: no-repeat;
    background-position: center right;
    background-size: contain;
    width: 1000px;
    height: 1000px;
    transform: translate(-50%, -50%);
    z-index: 2;
    filter: blur(100px); }
  .mobile-app .image-mobile::after {
    left: calc((100vw - 100%) / 2 * -1);
    right: calc((100vw - 100%) / 2 * -1);
    top: 50%;
    background-image: url("../../img/payright/mobile-app-txt.png");
    background-repeat: no-repeat;
    background-position: center center;
    background-size: contain;
    width: 100vw;
    height: 347px;
    transform: translate(0%, -50%); }
  @media (max-width: 991px) {
    .mobile-app .image-mobile::after {
      background-image: url("../../img/payright/mobile-app-txt-sp.png"); } }
  .mobile-app .image-mobile > picture {
    position: relative;
    z-index: 3; }
.mobile-app .title-app {
  font-size: 60px;
  font-weight: 700;
  line-height: 1.2;
  margin-bottom: 40px; }
@media (max-width: 991px) {
  .mobile-app .title-app {
    font-size: 40px; } }
.mobile-app .list-mobile-app .el-item {
  text-align: center; }
  .mobile-app .list-mobile-app .el-item .uk-padding {
    padding: 0;
    margin: 30px 0 0;
    color: #D8D8D8;
    font-size: 22px;
    font-weight: 500;
    line-height: 1.3; }
  @media (max-width: 991px) {
    .mobile-app .list-mobile-app .el-item .uk-padding {
      font-size: 18px; } }

.sec-features {
  position: relative; }
  .sec-features::after {
    content: "";
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    background-image: url("../../img/payright/circle-blue-2.png");
    background-repeat: no-repeat;
    background-position: center right;
    background-size: contain;
    width: 1200px;
    height: 1200px;
    z-index: 2; }
  .sec-features::before {
    content: "";
    position: absolute;
    left: 60px;
    top: calc(100% - 165px);
    background-image: url("../../img/payright/circle-green.png");
    background-repeat: no-repeat;
    background-position: center center;
    background-size: contain;
    width: 650px;
    height: 650px;
    z-index: 2;
    filter: blur(100px); }
  @media (max-width: 991px) {
    .sec-features::before {
      left: -300px;
      top: calc(100% - 200px); } }
  .sec-features > .uk-container {
    position: relative;
    z-index: 2; }
  .sec-features .list-features {
    color: #fff;
    font-size: 22px;
    font-weight: 400;
    line-height: 1.4; }
  @media (max-width: 991px) {
    .sec-features .list-features {
      font-size: 18px; } }
  .sec-features .list-features .el-title {
    color: #17D87C;
    font-size: 32px;
    font-weight: 600;
    line-height: 1.4; }
  @media (max-width: 991px) {
    .sec-features .list-features .el-title {
      font-size: 28px; } }
  .sec-features .list-features .el-item {
    padding: 60px 0;
    border-bottom: 1px solid #464445;
    background-color: transparent;
    background-image: none; }
  @media (max-width: 991px) {
    .sec-features .list-features .el-item {
      padding: 30px 0; } }
  .sec-features .list-features ul.uk-list-primary > ::before {
    color: #fff !important; }

.sec-contact {
  position: relative; }
  .sec-contact::before, .sec-contact::after {
    position: absolute;
    content: ""; }
  @media (max-width: 991px) {
    .sec-contact::before, .sec-contact::after {
      content: none; } }
  .sec-contact::before {
    background-image: url("../../img/payright/bg-contact-2.png");
    background-repeat: no-repeat;
    background-position: left bottom;
    background-size: contain;
    width: 50%;
    height: 634px;
    bottom: 0;
    left: 0; }
  .sec-contact::after {
    width: 50%;
    left: 50%;
    bottom: 0;
    height: 1004px;
    background-image: url("../../img/payright/bg-contact-3.png");
    background-repeat: no-repeat;
    background-position: center bottom;
    background-size: 100% auto; }
  .sec-contact .title-contact {
    font-size: 50px;
    font-weight: 700;
    line-height: 1.5; }
  @media (max-width: 991px) {
    .sec-contact .title-contact {
      font-size: 32px; } }
  .sec-contact .txt-intro {
    color: #fff;
    font-size: 22px;
    font-weight: 400;
    line-height: 2; }
  @media (max-width: 991px) {
    .sec-contact .txt-intro {
      line-height: 1.4;
      font-size: 18px; } }
  .sec-contact > .uk-container {
    position: relative;
    z-index: 2; }
    .sec-contact > .uk-container > .uk-grid > div {
      position: relative; }
      .sec-contact > .uk-container > .uk-grid > div:last-child > .uk-panel {
        margin-right: calc((67vw - 100%) / 2 * -1); }
      @media (max-width: 1460px) {
        .sec-contact > .uk-container > .uk-grid > div:last-child > .uk-panel {
          margin: 0; } }
      .sec-contact > .uk-container > .uk-grid > div:last-child #userForm {
        max-width: 600px;
        margin: 0 auto; }
      @media (max-width: 991px) {
        .sec-contact > .uk-container > .uk-grid > div:last-child #userForm {
          max-width: 100%; } }
  .sec-contact #userForm > h2 {
    display: none; }
  .sec-contact #userForm .rsform-block-header {
    display: none; }
  .sec-contact #userForm input, .sec-contact #userForm textarea, .sec-contact #userForm select {
    border-radius: 5px;
    border: 1px solid #808080;
    background: rgba(128, 128, 128, 0.15);
    padding: 0 22px;
    height: 57px;
    line-height: 57px;
    color: #fff;
    box-shadow: none; }
    .sec-contact #userForm input::-webkit-input-placeholder, .sec-contact #userForm textarea::-webkit-input-placeholder, .sec-contact #userForm select::-webkit-input-placeholder {
      /* Chrome/Opera/Safari */
      color: #888; }
    .sec-contact #userForm input::-moz-placeholder, .sec-contact #userForm textarea::-moz-placeholder, .sec-contact #userForm select::-moz-placeholder {
      /* Firefox 19+ */
      color: #888; }
    .sec-contact #userForm input:-ms-input-placeholder, .sec-contact #userForm textarea:-ms-input-placeholder, .sec-contact #userForm select:-ms-input-placeholder {
      /* IE 10+ */
      color: #888; }
    .sec-contact #userForm input:-moz-placeholder, .sec-contact #userForm textarea:-moz-placeholder, .sec-contact #userForm select:-moz-placeholder {
      /* Firefox 18- */
      color: #888; }
    .sec-contact #userForm input::-webkit-input-selection, .sec-contact #userForm textarea::-webkit-input-selection, .sec-contact #userForm select::-webkit-input-selection {
      /* Chrome/Opera/Safari */
      color: #888; }
    .sec-contact #userForm input::-moz-selection, .sec-contact #userForm textarea::-moz-selection, .sec-contact #userForm select::-moz-selection {
      /* Firefox 19+ */
      color: #888; }
    .sec-contact #userForm input:-ms-input-selection, .sec-contact #userForm textarea:-ms-input-selection, .sec-contact #userForm select:-ms-input-selection {
      /* IE 10+ */
      color: #888; }
    .sec-contact #userForm input:-moz-selection, .sec-contact #userForm textarea:-moz-selection, .sec-contact #userForm select:-moz-selection {
      /* Firefox 18- */
      color: #888; }
  .sec-contact #userForm textarea {
    height: 140px; }
  .sec-contact #userForm select {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    background-image: url("../../img/payright/icon-arrow-down.svg");
    background-repeat: no-repeat;
    background-position: right 21px center;
    background-size: 15px auto; }
    .sec-contact #userForm select option {
      background: #808080; }
  .sec-contact #userForm .formControlLabel {
    color: #F2F2F7;
    font-size: 20px;
    font-weight: 700;
    line-height: 40px; }
  .sec-contact #userForm .formRequired {
    color: #FF6376;
    font-size: 20px;
    font-weight: 700;
    line-height: 2;
    visibility: hidden; }
    .sec-contact #userForm .formRequired::before {
      content: "*";
      visibility: visible; }
  .sec-contact #userForm .rsform-submit-button {
    border-radius: 100px;
    border: 1px solid rgba(255, 255, 255, 0.6) !important;
    background: #15BF6D !important;
    color: #FFF;
    font-size: 20px;
    font-weight: 700;
    line-height: normal;
    height: 63px;
    line-height: 63px;
    display: block;
    max-width: 190px;
    width: 100%;
    margin: 0 auto; }
    .sec-contact #userForm .rsform-submit-button::before, .sec-contact #userForm .rsform-submit-button::after {
      content: none; }
    .sec-contact #userForm .rsform-submit-button:hover {
      opacity: 0.7; }
  .sec-contact .formError {
    font-size: 14px;
    color: #FF6376;
    font-weight: 400;
    line-height: normal; }
    .sec-contact .formError::before {
      content: "* ";
      display: inline-block;
      margin-right: 2px; }

footer .uk-padding-remove-top {
  padding: 0; }
  footer .uk-padding-remove-top hr {
    display: none; }
footer .uk-section-secondary {
  background: #3E4146; }
footer .footer-intro {
  color: #D8D8D8;
  font-size: 14px;
  font-weight: 500;
  line-height: 1.4; }
  footer .footer-intro .el-title {
    color: #D8D8D8;
    font-size: 36px;
    font-weight: 700;
    line-height: 1.2; }
footer .company-name {
  font-size: 14px;
  font-weight: 500;
  line-height: 1.4; }
footer .list-address {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0 24px; }
@media (max-width: 767px) {
  footer .list-address {
    margin: 0; } }
footer .list-address > li {
  color: #D8D8D8;
  font-size: 14px;
  font-weight: 500;
  line-height: 1.4;
  margin: 0 !important; }
  footer .list-address > li:first-child {
    color: #808080; }
  @media (max-width: 767px) {
    footer .list-address > li:first-child {
      width: 100%;
      margin: 0 0 10px; } }
footer .list-address .el-image {
  width: 12px;
  height: 16px;
  background-image: url("../../img/payright/icon-map.png");
  background-repeat: no-repeat;
  background-size: contain; }
  footer .list-address .el-image svg {
    display: none; }
footer .list-address .uk-link {
  color: #fff; }
@media (min-width: 1200px) {
  footer * + .uk-margin-large {
    margin-top: 30px !important; } }
footer .copyright {
  color: #808080;
  font-size: 12px;
  font-weight: 500;
  line-height: 1.4;
  text-align: center; }
footer hr {
  border-top: 1px solid #4D4D4D; }
@media (max-width: 767px) {
  footer .uk-grid-large > .uk-grid-margin {
    margin-top: 20px; } }
footer .btn-btt {
  float: right; }
@media (max-width: 767px) {
  footer .btn-btt {
    position: absolute;
    content: "";
    right: 15px;
    bottom: 10px; } }
footer .btn-btt > a {
  width: 50px;
  height: 50px;
  border-radius: 100%;
  background: #fff;
  display: flex;
  align-items: center;
  justify-content: center;
  box-shadow: 0px 0px 5px rgba(0, 178, 255, 0.5); }
@media (max-width: 767px) {
  footer .btn-btt > a {
    width: 40px;
    height: 40px; } }
footer .btn-btt > a:hover {
  opacity: 0.7; }
footer .btn-btt .uk-icon:not(.uk-preserve) [stroke*="#"]:not(.uk-preserve) {
  stroke: #009ADC; }

@media (max-width: 767px) {
  .page-login #tm-main {
    height: calc(100vh - 80px);
    display: flex;
    align-items: center;
    justify-content: center; } }
