﻿@charset "utf-8";

:root {
     --white:#ffffff;
     --green:#13a538;
     --dgreen:#13a538;
     --gry:#4e5452;

     --green-color: #13a538;
}


* {
  font-family: 'Muli', sans-serif;
}

figure,h1,h2,h3,h4,p{padding:0;margin:0}h4,ol,ul,ul ul{-webkit-margin-before:0;-webkit-margin-after:0;-webkit-margin-start:0;-webkit-margin-end:0;-webkit-padding-start:0}:focus,body a,body a:active,input[type=text]:focus,textarea:focus{outline:0}article,aside,dialog,figure,footer,header,hgroup,nav,ol,p,section{display:block}a,abbr,acronym,address,applet,article,aside,audio,b,big,blockquote,body,canvas,caption,center,cite,code,command,datalist,dd,del,details,dfn,div,dl,dt,em,embed,fieldset,figcaption,figure,font,footer,form,h1,h2,h3,h4,h5,h6,header,hgroup,html,i,iframe,img,ins,kbd,keygen,label,legend,li,meter,nav,object,ol,output,p,pre,progress,q,s,samp,section,small,source,span,strike,strong,sub,sup{outline:0;vertical-align:baseline}figure,p{-webkit-margin-before:0;-webkit-margin-after:0;-webkit-margin-start:0;-webkit-margin-end:0}ol{list-style-type:decimal}a img,img{vertical-align:middle}a img{border:0}body a:focus{-mos-outline-style:none;outline:0}body:-moz-any-link:focus{outline:0}::-moz-selection{background:#000;color:#fff}::selection{background:#000;color:#fff}

html {-webkit-text-size-adjust:none;}
div{vertical-align:top;}
img{max-width:100%; height:auto;}
a{cursor:pointer; text-decoration:none!important;  transition:all 0.5s ease;}
a:hover, a:focus{text-decoration:none!important;}
html {-webkit-font-smoothing:antialiased; -moz-osx-font-smoothing:grayscale;}
html {position:relative; min-height:100%;}
aside, .right-side, .navbar-collapse{-webkit-transition:all 0.5s ease; -moz-transition:all 0.5s ease; -o-transition:all 0.5s ease; -ms-transition:all 0.5s ease; transition:all 0.5s ease;}
button:focus {outline:0px dotted; outline:0px auto -webkit-focus-ring-color;}
.btn.focus, .btn:focus {outline:0; box-shadow:0 0 0 0rem rgb(0 123 255 / 25%);}

/*Typekit*/
.container{max-width:1600px;}
html, body{font-family: 'Muli', sans-serif; font-size:16px; color:#272727;  padding:0px;margin:0px;}
p{margin-bottom:25px}

.position-relative{position:relative;}
select, input{font-family: 'Muli', sans-serif;}

div p:last-child{margin-bottom:0px;}
.form-control:focus{box-shadow:0 0 0 0rem rgba(0,123,255,.25);}
.row:before, .row:after {display:none !important;}

h1, h2, h3, h4, h5, h6{font-family:"museo-sans"; margin-bottom:15px;}
h1{font-size:70px;color:var(--white);font-weight:700;line-height:85px;max-width:50%;}
h1 strong{font-weight:bold; color:var(--white);}

h2{font-size:30px; font-weight:500; color:var(--blue);}
h3{font-size:24px;}
h4{font-size:20px;}
h5{font-size:18px;}
h6{font-size:16px}

/*Typekit END*/

/* GRID CSS */
*, ::after, ::before {box-sizing:border-box;}
.container{width:100%; padding-right:15px; padding-left:15px; margin-right:auto; margin-left:auto;}
.row {display:-ms-flexbox; display:flex; -ms-flex-wrap:wrap; flex-wrap:wrap; margin-right:-15px; margin-left:-15px;}
.col-md-3, .col-md-4, .col-md-5, .col-md-6, .col-md-7, .col-md-8, .col-md-12{padding-left:15px; padding-right:15px; position:relative; width:100%;}

@media (min-width:769px){
  .order-md-2{order:2;}
  .col-md-3 {-ms-flex:0 0 25%; flex:0 0 25%; max-width:25%;}
  .col-md-5 {-webkit-box-flex:0; -ms-flex:0 0 41.66666667%; flex:0 0 41.66666667%; max-width:41.66666667%;}
  .col-md-6 {-webkit-box-flex:0; -ms-flex:0 0 50%; flex:0 0 50%; max-width:50%;}
  .col-md-7 {-webkit-box-flex:0; -ms-flex:0 0 58.33333333%; flex:0 0 58.33333333%; max-width:58.33333333%;}
  .col-md-8 {-webkit-box-flex:0; -ms-flex:0 0 66.666667%; flex:0 0 66.666667%; max-width:66.666667%;}
  .col-md-4 {-webkit-box-flex:0; -ms-flex:0 0 33.333333%; flex:0 0 33.333333%; max-width:33.333333%;}
  .col-md-12{-webkit-box-flex:0; -ms-flex:0 0 100%; flex:0 0 100%; max-width:100%;}
}

/* GRID CSS END */
.top-header{float:left; width:100%; padding:40px 0px;}
.brand-logo img{width:230px; max-width: 230px;}
.top-section{float:left; width:100%; position:absolute; top:70px; left:0px;}
.hero-caption span{color:var(--white);font-size:250px;transform:rotate(180deg);font-weight:bold;display:inline-block;line-height:250px;margin-left:-11px;}

.footer{background:var(--dgreen); padding:60px 0px 44px 0px; float: left; width: 100%;}
.footer .container{max-width:1400px;}
.footer-top{display:flex; justify-content:space-between;}
.invert-logo img{min-width:181px; max-width: 181px;}
.invert-logo{display: flex; align-items: center;}

.f-right .f-nav{list-style:none; padding:0px; margin:0px; text-align:right;}
.f-right .f-nav li{position:relative; display:inline-block;}
.f-right .f-nav li a{padding:0px 8px; color:var(--white); font-size:14px; line-height: 1.5;}
.f-right .f-nav li:first-child:after{display:none;}
.f-right .f-nav li:after {position:absolute; content:"|"; top:-2px; color:var(--white); font-weight:lighter; left:-4px;}

ul.social-md {margin-bottom:9px; list-style:none; text-align:right;}
ul.social-md li{display:inline-block;}
ul.social-md li a {font-size:25px; padding:0px 8px; color:var(--white);line-height: 1.5;}

.footer-bootm{border-top:solid 1px #ffffff; padding-top:16px; margin-top:11px; display:flex; justify-content:space-between;}
.footer-bootm p{color:var(--white); font-size:12px;}
.footer-bootm .text-right p{text-align:right;}

/* COntact btn */
/*contct-expand*/

#center-text {display: flex; flex: 1; flex-direction:column; justify-content: center; align-items: center; height:100%;}
#chat-circle {position: fixed; bottom: 50px; right: 50px; background: #13a538; width: 46px; border: 2px solid #fff; height: 46px; z-index: 1000; border-radius: 50%; color: white; padding: 28px; cursor: pointer;
box-shadow: 0 0 0 0 rgb(39, 158, 78); transform: scale(0.8); animation: pulse 2s infinite;}

@keyframes pulse {
  0% {
    box-shadow: 0 0 0 0 rgba(39, 158, 78, 0.7);
  }
  70% {
    box-shadow: 0 0 0 10px rgba(39, 158, 78, 0);
  }
  100% {
    box-shadow: 0 0 0 0 rgba(39, 158, 78, 0);
  }
}

div#chat-circle i.fa-phone {transform: translate(-9px, -9px); font-size: 23px;}
.btn#my-btn {background: var(--white); padding: 13px 40px 12px 40px; border-radius: 45px; color: #5865C3;}

#chat-overlay {background: rgba(255,255,255,0.1); position: absolute; top: 0; left: 0; width: 100%; height: 100%; border-radius: 50%; display: none;}
.chat-box:after {position: absolute; content: ""; width: 0; height: 0; border-left: 15px solid transparent; border-right: 15px solid transparent; border-top: 15px solid #fff; right: 34px; bottom: -12px;}
.chat-box {display: none; background: #ffffff; position: fixed; z-index: 1000; right: 30px; bottom: 128px; width: 200px; max-width: 85vw; transition: 0.5s all; max-height: 100vh; border-radius: 12px 12px 0 0;
box-shadow: 0px 17px 26px -2px #0000001f; line-height: 1.5;}

.chat-box-toggle {float:right; margin-right:15px; cursor:pointer;}
.chat-box-header {background: #13a538; height: 51px; border-top-left-radius: 10px; border-top-right-radius: 10px;color: white; text-align: left; font-size: 18px; padding-top: 11px; padding-left: 18px;}
.chat-box-body {position: relative; height:370px; height:auto; overflow: hidden;}
.chat-box-body:after {content: ""; opacity: 0.1; top: 0; left: 0; bottom: 0; right: 0; height:100%; position: absolute; z-index: -1;}

.chat-logs {padding: 15px; display: flex; align-items: center; height: 114px;}
.chat-logs a {display: inline-block; width: 45px; height: 45px; background: var(--green-color); border-radius: 50%; transition: 0.5s all; margin-right: 10px; position: relative;}
.chat-logs a:hover {animation: pulse 2s infinite;}
.chat-logs a i {position: absolute; left: 50%; color: #ffffff; top: 50%; transform: translate(-50% , -50%);}
.chat-logs a span {display: block; font-size: 11px; position: absolute; bottom: -23px; width: 115%; color: #989898;}

.chat-logs::-webkit-scrollbar-track{-webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.3); background-color: #F5F5F5;}
.chat-logs::-webkit-scrollbar{width: 5px; background-color: #F5F5F5}
.chat-logs::-webkit-scrollbar-thumb{background-color: #5A5EB9;}

.anchrs {margin: auto;}
.ctrm-sp  {color: grey; background: #e4e4e478; padding: 13px; border-radius: 7px; border: 1px solid #cecece;}
#chat-circle .fa-comment {transform: translate(-11px, -11px); font-size: 23px;}
.ctrm-sp a {color: grey; display: block; line-height: 24px; font-size: 13px;}
.chat-logs p {margin-bottom: 9px; font-weight: 700; color: grey;}

.alp-hero{position: relative; overflow: hidden; padding-top:40%; margin-top: 80px;}
.alp-hero figure{position: absolute; top: 0px; left: 0px; width: 100%; height: 100%;}
.alp-hero figure img{position: absolute; top: 0px; left: 0px; width: 100%; height: 100%; object-fit: cover;}

.hero-caption{position: absolute; top: 0px; left: 0px; width: 100%; height: 100%; padding: 5rem 0px 0rem 0px; display: flex; align-items: center;}
.hero-caption-body h1{color: var(--green-color);font-size: 3rem;}
.hero-caption-body p{font-size: 1.6rem; max-width: 30%;}

.mid-body{padding: 4rem 0px 0rem 0px;}
.mid-top{font-size:1.8rem; font-weight: 300; color:#515551;}

.primiup-row{display: flex;flex-wrap: wrap;padding:5rem 0px 4rem 0px;}
.prm-left{width: 100%;}
.prm-left h3{font-weight: 700; margin-bottom: 1.4rem;}
.prm-left ul{list-style: none; padding: 0px; margin: 0px;}
.prm-left ul li{position: relative;padding-left: 1.9rem;padding-bottom: 1.2rem;max-width: 88%;font-size:21px;}
.prm-left ul li:before{content: '';position: absolute;top: 5px;left: 0px;background: url('../images/logo-icon.svg') no-repeat center;background-size: contain;width: 18px;height: 18px;}

.prm-right{width: 40%;}
.prm-form-area{
  -webkit-box-shadow: -1px 0px 5px 0px rgba(0,0,0,0.25);
  -moz-box-shadow: -1px 0px 5px 0px rgba(0,0,0,0.25);
  box-shadow: -1px 0px 5px 0px rgba(0,0,0,0.25);
  background: #ffffff;
  border-radius: 53px;
  padding:45px 30px;
}
.prm-form-area span{color: var(--green-color); margin-bottom:1rem; display:block; font-weight:700; line-height:26px; font-size: 18px;}
.prm-form-area .row{display:flex; row-gap:1rem;}
.prm-form-area label{width:100%; color:#4f5552; margin-bottom:5px; display:block; font-weight: 700;}
.prm-form-area .form-control{width:100%; border:solid 1px #4f5552; padding:0.7rem 0.7rem;}
.submit-btn{background: #515551;border-radius: 30px;width: auto;padding: 11px 30px;outline: none;border-bottom: none;margin-top: 10px;color: #ffffff;border: 0px;font-size: 1rem;font-weight: 300;cursor: pointer;}
.submit-btn:hover{background: var(--green-color);}

.mid-footer{font-size:1.4rem; text-align: center; font-weight: 300;}
.mid-footer a{color: var(--green-color); font-weight: 800; text-decoration: underline!important; font-size: 1rem;}

.wap-show{display: none;}

.qr-code-section{position: relative; }
.qr-code-section figure{width: 100%; height: 100%;}
.qr-code-section figure img{width: 100%; height: 100%;}

.card-section{padding: 5rem 0px;}
.card-main{display: flex; align-items: center;}
.card-left{width: 80%;}
.card-left h3{
  color: var(--dgreen);
  font-weight: 500;
  font-size: 2rem;
}

.btn-knowmore{
  background: var(--dgreen);
  border-radius: 16px;
  color: var(--white);
  padding: 0.7rem 1.4rem;
  font-size: 1.2rem;
  margin-top: 0.5rem;
  display: inline-block;
}
.btn-knowmore img{
  margin-left: 10px;
  filter: invert(100%) sepia(0%) saturate(0%) hue-rotate(246deg) brightness(255%) contrast(255%);
  max-width: 23px;
  position: relative;
  top: -2px;
}
.card-section figure{width: 25%;/* text-align: center; */}
.card-section figure img{max-width: 60%;}

/* AR CSS */
.mid-body-ar{direction: rtl;}
.mid-body-ar .prm-left ul li{padding-right: 1.9rem;}
.mid-body-ar .prm-left ul li:before{right: 0px;  transform: rotate(180deg);}

.mid-body-ar .tnc-link{padding-right: 1.9rem;}
.tnc-ar .close{float: right;}
.tnc-ar ul li{line-height:26px; font-size:16px;position: relative; padding-right:15px; padding-left: 0px;}
.tnc-ar ul li:last-child{margin-bottom: 0px;}
.tnc-ar ul li:before{content: ''; width:6px; height:6px; position: absolute; top: 10px; right: 0px; border-radius:30px; background: var(--green-color);}


/* The Modal (background) */ 
.modal {display: none;position: fixed;z-index: 9999;left: 0;top: 0;width: 100%;height: 100%;overflow: auto;background-color: rgb(0,0,0);background-color: rgba(0,0,0,0.4);}
.modal-content {background-color: #fefefe;margin: auto;padding: 20px;border: 1px solid #888;width: 100%;max-width:900px;height: 90vh;overflow: auto;margin-top: 5vh;}
.close {color: var(--green-color); float: right; font-size: 28px; font-weight: bold; cursor: pointer;}

.modal h2 {color: var(--green-color);}
.faq-modal h6{margin-bottom: 10px; font-family:"museo-sans"; font-weight:600; color: var(--dgreen); text-transform: uppercase;}
.faq-modal p strong{margin-bottom: -20px; display: block;}
.faq-modal p{color: #272727;}
.faq-modal a{color: #179d49;}

.faq-modal ul{list-style: none;padding: 0px;margin: 0px 0px 20px 0px;position: relative;}
.faq-modal ul li{line-height:26px;font-size:16px;position: relative; padding-left:15px}
.faq-modal ul li:last-child{margin-bottom: 0px;}
.faq-modal ul li:before{content: '';width: 6px;height: 6px;position: absolute;top: 10px;left: 0px;border-radius: 30px;background: var(--green-color);}

.tnc-link{padding-left: 1.9rem;}
.tnc-link a{color: var(--dgreen); font-weight: 400; font-size: 1.2rem;}




/* COntact btn END */
@media (min-width: 768px){
  .footer .container{max-width: 720px;}
  .ftr-links-content .container {max-width: 720px;}
}
@media (min-width: 992px){
  .footer .container{max-width: 960px;}
  .call-section .container {max-width:960px;}
  .ftr-links-content .container {max-width: 960px;}
}
@media (min-width: 1200px){
  .footer .container,
  .call-section .container,
  .ftr-links-content .container,
  .special-rewards .container,
  .hero-caption .container,
  .mid-body .container {max-width: 1140px;}
}

@media (min-width: 1024px) and (max-width: 1450px){
  .footer .container,
  .call-section .container,
  .ftr-links-content .container,
  .special-rewards  .container ,
  .hero-caption .container,
  .mid-body .container{max-width: 1100px;}

  .f-right .f-nav li a{font-size: 12px;}
  .footer-bootm p{font-size: 10px;}
  /* .mid-content p{font-size: 14px; line-height: 26px;} */

  .set > a, .set2 > a{font-size: 16px;}
  .content p, .content2 p,
  .content ul li, .content2 ul li{font-size: 14px; line-height: 22px;}
  .footer-bootm p{line-height: 21px;}
  .f-right .f-nav li:after{top: 0px;}

  .call-left p,.call-right ul li{font-size: 18px;}
  .call-right ul li + li + li{border-bottom: 0px;}
  .call-right {padding: 0px 25px 60px 25px;}
  .call-right ul:before {height: calc(100% - 170px);}

  .hero-caption-body p {font-size: 1.5rem; max-width: 31%; line-height: 1.9rem!important;}

  .mid-top {font-size: 1.4rem;}
  .mid-top p{line-height:30px!important;}

  .prm-form-area span {line-height: 24px; font-size: 16px;}
  .prm-left {width: 58%;}
  .prm-right {width: 42%;}
  .prm-left ul li{font-size: 20px;}
  .mid-footer {font-size: 1.2rem;}



}

@media (min-width: 1451px){
  .footer .container,
  .call-section .container,
  .ftr-links-content .container,
  .hero-caption .container,
  .special-rewards .container,
  .mid-body .container {max-width: 1400px;}

  .call-right ul li + li + li{border-bottom: 0px;}

}

@media (max-width: 1700px){
  ul.social-md{margin-bottom:9px;}
  .footer{padding-bottom: 43px;}
  .footer-bootm{margin-top: 12px;}

  .reward-col h4{padding: 0px 30px;}
  .reward-col p{padding: 0px 8%;}
}

@media all and (max-width:1460px){
  .container{max-width:1280px;}
  .top-header{padding:20px 0px;}
}

@media all and (max-width:1280px){
  .container{max-width:960px;}
  ul.social-md{margin-bottom:8px;}
  .invert-logo{margin-top: 1px;}
  .f-right .f-nav li a{line-height: 1.7;}
  .footer-bootm{margin-top:11px;}
}

@media all and (max-width:767px){
  .wap-hide{display: none;}
  .wap-show{display: block;}

  .mid-content h1{font-size:32px; line-height: 32px; }
  .mid-content h1 span{font-size: 20px;}

  .top-header {padding:10px 0px; text-align: center;}
  .top-section{position:relative;}
  .mid-content {padding:20px 6%;}

  .footer-top{flex-direction:column;}
  .invert-logo{ margin-bottom:15px; display: inline-block;}

  .f-right .f-nav li{padding:5px 0px;}
  .f-right .f-nav li:after{top:5px;}

  ul.social-md, .f-right .f-nav,
  .footer-bootm .text-right p {text-align: left;}

  .footer-bootm{flex-direction:column;}
  .fb-col{text-align:left; margin-bottom:15px;}
  .footer-bootm .text-right{margin-bottom:0px;}
  .footer {padding:40px 0px 20px 0px;}

  .set > a span, .set2 > a span{padding-left:10px; position: initial; height: auto;}
  .set > a, .set2 > a{font-size:14px; display: flex; align-items: center;}
  .faq-section .fa-plus:before{width:30px; font-size:20px; height: 100%;} 

  .set > a.active, .set2 > a.active{overflow: hidden;}
  .set > a.active::after, .set2 > a.active::after{height: 3px; border-radius: 0px 0px 10px 10px;}

  .chat-box {right: 8px;bottom: 154px;}
  #chat-circle {bottom: 76px;right: 22px;}
  .brand-logo img {width: 180px; max-width: 180px;}

  .alp-hero{margin-top: 80px; padding-top:0%;}
  .alp-hero figure,
  .alp-hero figure img{position: relative;}

  .hero-caption {position: relative; top: 0; padding: 2rem 0px; text-align: center;}
  .hero-caption h1{font-size: 2rem; max-width: 100%; line-height: inherit;}
  .hero-caption-body p {font-size: 1rem; max-width: 100%; padding: 0px 2rem;}
  .mid-body {padding: 2rem 0px 0rem 0px;}
  .mid-top {font-size: 1rem; text-align: center;}
  .prm-left {width: 100%; order: 1; margin-top: 2rem;}
  .prm-left ul li{max-width: 100%;}
  .prm-form-area .row{row-gap: 0.8rem;}
  .prm-form-area .form-control {padding: 0.5rem 0.5rem;}
  .primiup-row {padding: 0px;}
  .mid-footer{font-size: 1rem;}
  .prm-right {width: 100%;}

  .prm-form-area label{font-size: 0.9rem;}
  .prm-form-area span {line-height: 18px; font-size: 13px;}
  .prm-left ul li{font-size: 16px;}

  .card-left h3{font-size: 1.2rem;}
  .card-section {padding: 2rem 0px;}
  .card-main {display: flex; align-items: center; flex-direction: column; text-align: center;}
  .btn-knowmore {padding: 0.6rem 1.2rem; font-size: 1rem;}
  .btn-knowmore img{max-width: 16px;}
  .card-section figure{width: 80%; margin-top: 1.2rem;}

}