@import url('https://fonts.googleapis.com/css?family=Poppins:300,400,500,600,700');
html{ margin: 0; padding: 0; position: relative;}
body{ background: #202125; font-family: "Poppins", arial; font-size: 16px; line-height: 1.3em; font-weight: 300; color: #fafafa; margin: 0px; padding: 0px; -webkit-text-size-adjust: none; position: relative;}
h1, h2, h3, h4, h5, h6{ font-weight: 500; font-family: "Poppins"}
a{ color: #111; text-decoration: none !important; outline: none; -moz-outline: none;}
a:hover{ color: #ea960f; text-decoration: none;}
a:active, a:focus{ outline: none;}
p{line-height: 1.5em;}
.mt5{ margin-top: 5px !important;}
.mt10{ margin-top: 10px !important;}
.mt20{ margin-top: 20px !important;}
.mt30{ margin-top: 30px !important;}
.mb10{ margin-bottom: 10px !important;}
.mb20{ margin-bottom: 20px !important;}
.mb5{ margin-bottom: 5px !important;}
.mr5{ margin-right: 5px !important;}
.mr10{ margin-right: 10px !important;}
.mr20{ margin-right: 20px !important;}
.ml10{ margin-left: 10px !important;}
.ml5{ margin-left: 5px !important;}
.block{ display: block;}
.highlight{ color: #ea960f;}
strong{ font-weight: 500;}
.ulclear{ list-style: none; margin: 0; padding: 0;}
.badge{font-weight:500;}
.transition, .btn{ transition: all 0.3s ease 0s; -webkit-transition: all 0.3s ease 0s; -moz-transition: all 0.3s ease 0s;}
.no-select, #menu, .grid-item li .thumb{ -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none;}
.text-base{line-height: 1.4em;}
.logo-icon img{width: 100px;}
.heading-2x{font-size: 2.2em; font-weight: 500; line-height: 1.4em; margin-bottom: 30px;}
.heading-2x span{position: relative;}
.heading-2x strong{font-weight: 700;}
.container{width: 1000px; max-width: 100%;}
/* button */
.pre {
      background-color: #1e1e1e;
      color: #d4d4d4;
      padding: 1em;
      border-radius: 8px;
      font-family: 'Courier New', Courier, monospace;
      overflow-x: auto;
      border: 1px solid #f49118;
    }
code {
      color: #f49118;
    }
.btn{ border-radius: 0px; border: none; box-shadow: 0 20px 20px rgba(0,0,0,.1);}
.btn:hover{ box-shadow: 0 20px 20px rgba(0,0,0,.2);}
.btn:active, .btn:focus{ box-shadow: none !important;}
.btn-lg{padding: 10px 20px;}
.btn-pre{color: #111 !important; background: #ea960f;}
.btn-radius{ border-radius: 80px; padding-left: 30px; padding-right: 30px;}
.button-store{width: 250px; height: 76px; display: inline-block; background-size: cover; background-position: 50% 25%; margin: 10px;}
.button-google-play{background-image: url("../images/flPF5ybzPNi7.png")}
.btn-border{ background: none; border: 1px solid rgba(255,255,255,.5); color: #fff;}
.btn-border:hover{ border-color: #ea960f; color: #ea960f}
.btn-border.btn-radius.btn-sm{padding: 8px 20px; font-size: 12px; letter-spacing: 1px; box-shadow: none; font-weight: 300;}
.btn-border.btn-radius.btn-sm i{font-size: 16px; position: relative; bottom: -2px;}
/* layout */
#header{position: relative; height: 60px; text-align: center}
#logo{margin: 5px 0; display: inline-block; position: absolute; z-index: 6; top: 0; transform: translateX(-50%)}
#logo img{ height: 50px;}
#header #menu{float: right; position: relative; z-index: 6; margin: 10px 0;}
#header #menu .top-menu{list-style: none; padding: 0; margin: 0;}
#header #menu .top-menu li{float: left; margin: 0 0 0 40px; position: relative; line-height: 30px; font-size: 16px;}
#header #menu .top-menu li a{color: #fff; cursor: pointer}
#header #menu .top-menu li a:hover{color: #ea960f;}
#header #m-menu{display: none;}
#top-bg{padding: 0; position: relative; z-index: 1;}
#top-bg:before{content: ""; position: absolute; top: 0; left: 0; right: 0; height: 150px; z-index: 5; display: none;
  /* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#000111+0,333333+100 */
  background: rgb(0,1,17); /* Old browsers */
  background: -moz-linear-gradient(top,  rgba(0,1,17,.7) 0%, rgba(51,51,51,0) 100%); /* FF3.6-15 */
  background: -webkit-linear-gradient(top,  rgba(0,1,17,.7) 0%,rgba(51,51,51,0) 100%); /* Chrome10-25,Safari5.1-6 */
  background: linear-gradient(to bottom,  rgba(0,1,17,.7) 0%,rgba(51,51,51,0) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#000111', endColorstr='#333333',GradientType=0 ); /* IE6-9 */

}
.top-sl{position: relative; z-index: 4; text-align: center; color: #fff; padding: 50px 0 0; text-align: center}
.top-sl .container{width: 100%;}
.top-sl .ts-heading{font-size: 2.5em; font-family: "Poppins"; font-weight: 600; line-height: 1.3em; margin: 0 0 20px; position: relative; z-index: 4;}
.top-sl .ts-body{font-size: 1.3em; line-height: 1.4em; margin-bottom: 50px; opacity: .9; position: relative; z-index: 4;}
.top-sl .ts-button .btn-pre{font-size: 20px; padding: 12px 20px; margin-bottom: 40px; border-radius: 10px; position: relative; z-index: 4;}
.top-sl .ts-button .btn-pre:hover{box-shadow: 0 30px 30px rgba(0,0,0,0.5);}
.top-sl .ts-button .btn-pre i{font-weight: normal;}
.top-sl .ts-button .tsb-other{color: #fff; position: relative; z-index: 4;}
.top-sl-content{padding: 60px 40px 60px; margin: 0; text-align: center}
.section{width: 100%; display: block; position: relative; padding: 60px 0 60px;}
.section-about{ /*background: #202125 url("../images/about-bg.jpg") bottom center repeat-x;*/ position: relative; z-index: 9; margin-top: 50px; padding-bottom: 0}
.section-about:before{content: ""; width: 100%; height: 50%; position: absolute; left: 0; bottom: 0; right: 0; background: rgb(43,45,51);
  background: -moz-linear-gradient(0deg, rgba(43,45,51,1) 0%, rgba(32,33,37,1) 100%);
  background: -webkit-linear-gradient(0deg, rgba(43,45,51,1) 0%, rgba(32,33,37,1) 100%);
  background: linear-gradient(0deg, rgba(43,45,51,1) 0%, rgba(32,33,37,1) 100%);
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#2b2d33",endColorstr="#202125",GradientType=1); }
.section-about .container{padding: 0px 15px 0; position: relative; z-index: 9; width: 100%; max-width: 1600px;}
.section-about .sac-content{min-height: 360px; position: relative; margin-bottom: 150px;}
.section-about .sac-content .h-inline{display: inline-block; font-size: 1em !important; line-height: 1.5em !important; font-weight: 400; margin: 0;}
.section-about .sac-content .text{ line-height: 1.5em; margin-bottom: 1em;}
.section-about .features-list{ padding-right: 500px; position: relative; padding-bottom: 50px;}
.section-about .features-list .features-img{position: absolute; bottom: 0; right: 0;}
.section-about .features-list .features-img img{width: 400px; height: auto}
.section-download{padding: 100px 0; background: #202125 url("../images/eK0fqrp6ctEA.jpg") center center no-repeat}
.section-01{padding: 0 0 100px; z-index: 4;}
.section-01 .container{position: relative;}
.st-caret{position: absolute; top: -75px; left: 0; right: 0; height: 75px; width: 100%; display: none;}
.st-caret span{width: 150px; height: 114px; background-image: url(../images/7cZC7vDc9mog.png); background-position: 50% 25%; background-size: cover; display: inline-block; position: absolute; top: -39px; left: 50%; margin-left: -75px;}
.st-caret:after, .st-caret:before{ content: ""; position: absolute; display: inline-block; height: 75px; background: #F9F9F9; left: 0; right: 50%; margin-right: 75px; width: auto;}
.st-caret:after{left: 50%; margin-left: 75px; margin-right: 0; right: 0; background: #F9F9F9}
.section-2col .st2-col{width: 50%; float: left; position: relative; padding-right: 50px; margin-bottom: 50px;}
.section-2col .st2-right{padding-left: 50px; padding-right: 0;}
.section-2col .st2-col .desc{font-size: 18px;}
.section .st-line{margin: 20px 0; text-align: center;}
.section .st-line span{height: 2px; width: 100px; background: #ea960f; display: inline-block;}
.section-01 .st-icon img{width: 80px; height: 80px;}
.section-02{padding: 0; background: #232E3C; padding-bottom: 0; color: #fff;}
.section-02 .container{z-index: 4; position: relative; padding: 0 15px 0;}
.section-02 .kmau-second .aa-description p{margin-bottom: 0;}
.section-02 .kmau-text-4col{position: relative ;padding: 50px 0 50px;}
.section-02 .kmau-text-4col:after{left: 66.66%;}
.section-02 .popcorn{position: absolute; bottom: 0; left: -30px;}
.section-02 .popcorn img{width: 460px;}
.section-02 .kmau-text-4col .count-stats{font-size: 18px; line-height: 1.2em; text-align: center;}
.section-02 .kmau-text-4col .count-stats .aa-number{font-size: 3.5em; line-height: 1.2em; color: #ea960f; font-weight: 600;}
.section-02 .kmau-text-4col .count-stats .aa-number:before{content: ">"; margin-right: 3px; font-size: 30px; position: relative; top: -10px;}
.section-news{background: rgba(0,0,0,.15);}
.section-news .container{width: 100%; max-width: 1300px;}
.section-partners{background: #f8f8f8; padding: 50px 0;}
.partners-list ul{padding: 0;}
.partners-list ul li{ display: inline-block; margin: 10px;}
.partners-list ul li img{opacity: 0.6}
.partners-list ul li:hover img{opacity: 1}
.aa-description{font-size: 18px; line-height: 1.3em;}
.features-list{ position: relative}
.features-list .fl-otherapp{position: absolute; top: 30px; right: 0; width: 410px;}
.features-list .fl-item{padding-left: 50px; margin-bottom: 40px; position: relative; padding: 3px 0 0 40px}
.features-list .fl-title{font-weight: 500; margin-bottom: 10px; font-size: 14px; line-height: 1.3em;}
.features-list .fl-item p{line-height: 1.4em; font-size: 12px; font-weight: 300; margin-bottom: 0;}
.features-list .fl-item .fl-icon{position: absolute; left: 0px; top: 0px;}
.features-list .fl-item .fl-icon img{width: 24px; height: 24px;}
.dlu-item{width: 100%; display: block; background: #f6f6f6; padding: 30px 5px; margin-bottom: 20px; position: relative; border-radius: 30px;}
.dlu-item .btn{position: relative;}
.dlu-item.hidden{box-shadow: none !important; background: #f6f6f6 !important; opacity: .7}
.dlu-item.hidden:before{ content: "coming soon"; position: absolute; top: 0px; right: 0px; font-size: 12px; display: inline-block; padding: 3px 8px; background: #aaa; color: #fff;}
.dlu-item.hidden .btn{background: #ccc !important; color: #888 !important; box-shadow: none !important; cursor:not-allowed; text-shadow: none;}
.dlu-item:hover{box-shadow: 0 30px 30px rgba(0,0,0,0.1); background: #fff;}
.dlu-item .dlu-icon{ font-size: 60px; line-height: 100px; height: 100px; width: 100px; text-align: center; margin: 0 auto 20px;}
.dlu-item .small{color: #888; margin-top: 15px; display: block}
.dlu-item .small:hover{color: #ea960f;}
.dlu-item.hidden .small{cursor: default; color: #888 !important;}
.fl-otherapp .flo-content{background: #EAEEF2; padding: 30px; border-radius: 20px;}
/* block list */
.block-list li{display: inline-block; width: 100%; margin: 10px 0; overflow: hidden;}
.block-list li .bl-head{margin-bottom: 10px; font-size: 20px;}
.block-list-wicon li .bl-head i{font-size: 24px; margin-right: 10px; color: #ea960f; vertical-align: text-bottom;}
/* parallax bg */
#top-bg{ position: relative; background: #34353C; background-image: url("../images/eK0fqrp6ctEA.jpg"); }
.video-demo{display: block; width: 90%; max-width: 1000px; margin: 0px auto; position: relative; z-index: 3}
.video-demo img{width: 100%; height: auto}
.svg-corner{width: 100%; height: auto; position: absolute; bottom: -10px; left: 0; right: 0;}
.button-store{margin-bottom: 20px;}
#footer{ background: #2B2D33;}
#footer .container{width: 100%; max-width: 1600px; padding-top: 80px; padding-bottom: 80px; position: relative}
#footer .container .content{font-size: 12px;}
#footer .container .copyright{margin-bottom: 20px;}
#footer .footer-logo{ display: block; margin-bottom: 10px;}
#footer .footer-logo img{ height: 40px;}
#footer .footer-arrow{width: 120px; height: 120px; position: absolute; top: 0; right: 15px; z-index: 9; background-size: cover; background-position: 50% 25%; background-image: url("../images/9ExqQ6Yj23kM.png")}
.modal-medium .modal-dialog .modal-content{border-radius: 0; color: #111;}
.modal-medium .modal-dialog .modal-content .modal-body{padding: 40px; font-size: 14px;}
.modal-medium .modal-dialog .modal-content .modal-header{border-bottom: none; text-align: center;}
.modal-medium .close{position: absolute; top: 10px; right: 10px; line-height: 1em; padding: 5px;}
.modal-medium .close span{font-size: 30px; text-shadow: none;}
.modal-medium .heading-2x{ font-size: 2em; margin-bottom: 20px; line-height: 1.3em;}
.modal-how{background: #e9ebf4; padding: 30px; padding-bottom: 0;}
.modal-how .mh-title{font-size: 1.2em; font-weight: 500; margin-bottom: 20px;}
.modal-how .mh-title-big{font-size: 1.4em; font-weight: 500; margin-bottom: 40px;}
.mhc-item{position: relative; padding-left: 100px; padding-right: 40px; margin-bottom: 20px; float: left; width: 50%; border-bottom: 3px solid rgba(0,0,0,0.075); padding-bottom: 20px;}
.mhc-item:nth-of-type(5), .mhc-item:nth-of-type(6){margin-bottom: 30px; padding-bottom: 0; border-bottom: none;}
.mhc-item .mhcu-thumb{ width: 80px; height: 80px; border-radius: 50%; position: absolute; top: 0px; left: 0px; overflow: hidden;}
.mhc-item .mhcu-thumb img{width: 100%; height: auto;}
.mhc-item span.picksort{width: 30px; text-align: center; line-height: 30px; border-radius: 50%; font-weight: 600; z-index: 9; position: absolute; top: -5px; left: -5px; background: #ea960f; color: #fff;}
.mhc-item .mhcu-infor{min-height: 80px;}
#pop-download .modal-dialog{max-width: 680px;}
.social-list .btn{min-width: 120px;}
.fts-icon{color: #2E2F34; display: inline-block; margin: 0 5px 0; width: 30px; height: 30px; border-radius: 50%; text-align: center; line-height: 30px; background: #fff;}
#copyright{background: #181E26; padding: 20px;}
#copyright .small{color: #fff; opacity: 0.7; font-size: 12px; letter-spacing: 1.5px;}
.div-relative{position: relative; display: inline-block; margin: 0 auto;}
.div-relative .dropdown-menu{ width: 100%; border-radius: 0; box-shadow: 0 20px 20px rgba(0,0,0,0.15);}
.div-relative .dropdown-menu .dropdown-item:active{color: #fff;}
.block-iframe{margin: 0 0 40px; position: relative; width: 100%; padding-bottom: 56.25%; z-index: 9;}
.block-iframe iframe{width: 100% !important; height: 100% !important; position: absolute; top: 0; left: 0; right: 0; bottom: 0;}
.app-icon{display: block; margin-bottom: 20px;}
.app-icon img{width: 100px; height: 100px; border-radius: 18px; box-shadow: 0 5px 30px rgba(0,0,0,0.3);}
.sac-content{width: 100%; max-width: 800px; margin: 0 auto; text-align: center}
.iframe-16x9{width: 100%; padding-bottom: 177.777%; position: relative}
.iframe-16x9 iframe{position: absolute; top: 0; left: 0; right: 0; bottom: 0; width: 100% !important; height: 100% !important; z-index: 3; border-radius: 16px;}
.video-intro{padding: 10px; background: #fff; box-shadow: 0 10px 20px rgba(0,0,0,.1); margin-top: -140px; border-radius: 20px;}
.section-about{position: relative;}
.section-news{}
.section-news a{color: #fff;}
.news-list-ul{margin: 0 -1.5%;}
.news-list-ul li{width: 22%; margin: 0 1.5% 40px; float: left; border-radius: 10px; background: #34353C; overflow: hidden}
.news-list-ul li .news-detail{ min-height: 86px; overflow: hidden; padding: 10px 15px 20px;}
.news-list-ul li .news-title{font-size: 1.1em; line-height: 1.4em; margin-bottom: 15px; font-weight: 500; max-height: 50px; overflow: hidden;}
.news-list-ul li .time{font-size: 14px; line-height: 1.2em; margin-bottom: 15px; opacity: .6}
.news-list-ul li p{font-size: 14px; line-height: 1.4em; opacity: .6; max-height: 59px;}
.news-list-ul li .thumb{margin-bottom: 0px; display: inline-block; width: 100%; padding-bottom: 62%; position: relative;}
.news-list-ul li .thumb img{height: 100%; width: 100%; object-fit: cover; position: absolute;}
.section-news .btn-more{padding: 10px 30px; color: #fff !important; box-shadow: none;}
#top-bg.page-header{ background: #232E3C;}
#top-bg.page-header .top-sl{padding: 10px 0;}
.section-page{min-height: calc(100vh - 342px); background: #fff; color: #111;}
.section-page a{color: #111;}
.pre-pagination .pagination .page-item{ margin: 5px;}
.pre-pagination .pagination .page-item .page-link{border-radius: 3px; border: none; background: none; color: #fff;font-weight: 400;}
.pre-pagination .pagination .page-item .page-link:hover{color: #ea960f}
.pre-pagination .pagination .page-item.active .page-link{background: #ea960f; color: #111; cursor: default;}
.pre-pagination .pagination-lg .page-item .page-link{border-radius: 20px; padding: 0 5px; line-height: 40px; font-size: 18px; min-width: 40px; text-align: center;}
.body-article img{max-width: 100%;}
.read-news{padding-top: 30px !important;}
.if-load{position: absolute; top: 0; left: 0; right: 0; bottom: 0; border-radius: 20px; overflow: hidden}
.if-load img{position: absolute; top: 0; left: 0; right: 0; bottom: 0; object-fit: cover; width: 100%; height: 100%;}
.if-load .btn-play{width: 80px; height: 80px; position: absolute; z-index: 9; top: 50%; margin-top: -40px; left: 50%; margin-left: -40px; border-radius: 50%; background: #fff; box-shadow: 0 0 0 10px rgba(0,0,0,.3); text-align: center}
.if-load .btn-play:hover{transform: scale(1.1)}
.if-load .btn-play i{ font-size: 30px; color: #6DC546; line-height: 80px; position: relative; right: -3px;}
.section-demo{width: 100%; height: 300px; position: relative; background: #ea960f}
.section-demo:before{content: ""; position: absolute; top: 0; left: 0; right: 0; bottom: 0; background-image: url("../images/iqf5QmRDzRVv.jpg"); background-size: cover; background-position: 50% 25%; opacity: .2}
.section-demo .block-demo-btn{cursor: pointer; color: #111; position: absolute; top: 50%; left: 50%; transform: translate(-50%,-50%); z-index: 9}
.section-demo .block-demo-btn:hover{transform: translate(-50%,-50%) scale(1.1)}
.section-demo .block-demo-btn .text{font-size: 20px; line-height: 80px; display: inline-block; padding: 0 20px; font-weight: 500; float: left}
.section-demo .block-demo-btn .play-icon{display: inline-block; float: left; width: 80px; height: 80px; background: #fff; border-radius: 50%; text-align: center; position: relative}
.section-demo .block-demo-btn .play-icon:before{ content: ""; background: rgba(255,255,255,.3); width: 100px; height: 100px; border-radius: 50%; position: absolute; top: -10px; left: -10px;}
.section-demo .block-demo-btn .play-icon i.fas{line-height: 80px; color: #111; font-size: 30px; position: relative; right: -3px;}
#header #m-menu{ display: inline-block !important; top: 10px; right: 15px; font-size: 20px; width: 40px; line-height: 40px; height: 40px; z-index: 9; position: absolute; text-align: center; color: #fafafa; cursor: pointer; border-radius: 3px;}
#header #m-menu.active{color: #ea960f}
#header #menu{display: none;}
#header #menu.active{display: block !important; position: absolute; top: 50px; left: auto; right: 0px; width: 280px; background: rgba(27,28,31,.95); border-radius: 20px;}
#header #menu .top-menu{margin: 0;}
#header #menu .top-menu li{display: block; float: none; margin: 0; border-bottom: 1px solid rgba(255,255,255,.05);}
#header #menu .top-menu li:last-of-type{border: none;}
#header #menu .top-menu li a{display: block; padding: 10px 10px;}
.layout-page #top-bg{background: #2B2D33}
.layout-page #top-bg .top-sl{padding: 10px 0}
.layout-page #logo{margin: 10px 0;}
.layout-page #logo img{height: 40px;}
#m-back{position: absolute; top: 10px; left: 0; text-align: center; line-height: 40px; width: 40px; height: 40px; color: #fff; font-size: 20px;}
.section-article{min-height: calc(100vh - 368px); padding: 40px 0;}
.article{color: #C4C7D0; margin-bottom: 50px;}
.article p{font-weight: 300; font-size: 1em; line-height: 1.5em}
.prebreadcrumb{margin-bottom: 30px;}
.prebreadcrumb .breadcrumb{background: none; padding: 0; font-size: 14px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis}
.prebreadcrumb .breadcrumb a{color: #C4C7D0;}
.st0{fill:#202125;}
.st1{opacity:1;fill:#335765;}
.st2{opacity:.5;fill:#335765;}
.st3{opacity:.2;fill:#335765;}
.st4{opacity:.1;fill:#335765;}
.st5{opacity:.05;fill:#335765;}
.heading-medium{font-size: 1.4em; line-height: 1.3em; margin-bottom: 1em;}
.article.article-policy{font-size: 14px; line-height: 1.7em;}
.article.article-policy a{color: #fff;}
