@import url(//fonts.googleapis.com/css?family=Roboto:100,300,400,500,600,700);
*,*::before,*::after {box-sizing: border-box;-webkit-box-sizing: border-box;}
html {-webkit-text-size-adjust: 100%;}
body{width:100%; height:100%; display:inline-block; margin:0; padding:0;line-height: 1.5;word-wrap: break-word;-webkit-text-size-adjust: none;font-family:'Roboto';font-size:16px;color:#333333; background-color:#fff}
a{text-decoration: none; color:#333333}
.container{font-size:13px;color:#333333; width:calc(100%); padding:0; display:inline-block;font-family:'Roboto'; max-width:550px; margin:0 auto;}
.pagetitle{ font-size: 14px;color: #666;text-transform:uppercase; font-weight:500; float:left; padding-left:10px}
#content{display:inline-block; width:calc(100% - 0px); padding:10px 20px 50px 20px;}
.row::after {content: "";clear: both;display: block;}
[class*="col-"] {float: left;padding: 15px;}
.col-1 {width: 8.33%!important;} .col-2 {width: 16.66%!important;} .col-3 {width: 25%!important;} .col-4 {width: 33.33%!important;} 
.col-5 {width: 41.66%!important;} .col-6 {width: 50%!important;} .col-7 {width: 58.33%!important;} 
.col-8 {width: 66.66%!important;} .col-9 {width: 75%!important;} .col-10 {width: 83.33%!important;} 
.col-11 {width: 91.66%!important;} .col-12 {width: 100%!important;}
.m-0{ margin:0!important;} .p-0{ padding:0!important;}
.mt-0{ margin-top:0!important} .mb-0{ margin-bottom:0!important} .ml-0{ margin-left:0!important} .mr-0{ margin-rigjt:0!important}
.pt-0{ padding-top:0!important} .pb-0{ padding-bottom:0!important} .pl-0{ padding-left:0!important} .pr-0{ padding-rigjt:0!important}

/* login form */
.userlogin1{ width:80%; margin:40px auto; }
.element-input{ position:relative; }
.icon { display: inline-block; background-repeat: no-repeat; width: 25px; margin:14px 20px 0 0px;position: absolute; border-right:1px #ccc dotted; background-position: 2px 0px;height: 20px;background-size: 21px; background-size:17px; }
.home{vertical-align: middle;background-repeat: no-repeat;width: 20px;height: 20px;background-size: 20px;; margin-top:-3px;}
.icon32 { display: inline-block; background-repeat: no-repeat; width: 32px; height: 32px;background-size: 28px;}

.icon-person{ background:url(../images/person.svg) 0px 0px no-repeat; background-size:17px;}
.icon-password {background:url(../images/icon.png) 2px -53px no-repeat; background-size:17px;}
.icon-mobile {background-image:url(../images/cell.svg);  background-size:17px;}
.icon-operator {background-image:url(../images/settings.svg);}
.icon-amount {background-image:url(../images/rupee.svg);}
.icon-date {background-image:url(../images/calendar.svg);}
.icon-email{ background-image:url(../images/email.svg);}
.icon-bussiness{ background-image:url(../images/bussiness.svg);}
.icon-address{ background-image:url(../images/address.svg);}
.icon-website{ background-image:url(../images/website.svg);}
.icon-home{background-image:url(../images/home.svg); background-size:14px;}

.selling_ic{background-image:url(../images/selling.svg); background-size:18px;}
.homeicon_ic{background-image:url(../images/homeicon.svg); background-size:18px;}
.transaction_ic{background-image:url(../images/transaction.svg); background-size:auto 18px;}
.sales_ic{background-image:url(../images/salesreport.svg); background-size:18px;}
.pickup_ic{background-image:url(../images/pickup.svg); background-size:22px;}
.rupeeround_ic{background-image:url(../images/rupee-round.svg); background-size:18px;}
.merchants_ic{background-image:url(../images/merchantgroup.svg); background-size:18px;}
.payments_ic{background-image:url(../images/payments.svg); background-size:18px;}
.comm_ic{background-image:url(../images/affiliate-marketing.svg); background-size:18px;}
.announcemike_ic{background-image:url(../images/announcemike.svg); background-size:18px;}
.desktop_ic{background-image:url(../images/desktop.svg); background-size:18px;}
.logout_ic{background-image:url(../images/logout.svg); background-size:18px;}
.padlock_ic{background-image:url(../images/padlock.svg); background-size:18px;}
.app_ic{background-image:url(../images/link.svg); background-size:18px;}
.mobile_ic{background-image:url(../images/mobile.svg);}
.call_ic{background-image:url(../images/call.svg);}





#show {right: 0;top: 0;padding:18px 15px;color: #666;z-index: 10; position:absolute}
.forgot-password {padding-top: 10px; color:#666666}
.forgot-password a {color: #666; text-decoration:none}

/*header*/
.header{  background-color:#FFFFFF; display:inline-block; width:100%; padding:10px; border-bottom:1px solid #ccc;}
.menuicon{ width:25px; float:left;font-size:24px;cursor:pointer}
.sitetitle{  float:left; margin-left:10px;}
#walletbalance{ float:right; text-align:right;}
/*Slide navigation*/
.sidenav {height: 100%; width:270px;position: fixed;z-index: 1;top: 0;left:-280px;background-color:#fff;overflow-x: hidden;transition: 0.5s;padding:0px;
font-size:12px; box-shadow: 9px 3px 7px -7px rgba(227,216,216,0.54);
-webkit-box-shadow: 9px 3px 7px -7px rgba(227,216,216,0.54);
-moz-box-shadow: 9px 3px 7px -7px rgba(227,216,216,0.54);;
}

.navheader{padding:15px 20px; color:#000; font-size:16px; font-weight:500; background-color:#FCFCFC;}
.sidenav a {padding:8px 20px;text-decoration: none;font-size: 16px;color: #000;display: block;transition: 0.3s; font-weight:400 }
.sidenav a:hover{background-color: #fbfbfb;}
.aicon { display: inline-block; background-repeat: no-repeat; background-position: left+20px center; }
a.aicon { padding:8px 50px !important;}
.line{height:1px; background-color:#F9F9F9; display:block; width:100%;}

.closebtn {position: absolute;top: 0; padding:0;font-size:32px; text-align:right; width:265px; color:#818181; right:15px; clear:both; cursor:pointer }
/*content*/
.homepage{ background-color:#FFFFFF; display:inline-block; width:100%;}
.haomepage{display:inline-block; width:calc(100% - 0px); padding:10px 20px 50px 20px;}
.miniatm {}
.product-holder{ float:left; width:105.5px;height:81px; text-align:center;border: 1px solid #F0F4F5;border-left: none;border-top: none; margin:0 auto  }
.homepage .miniatm a, .homepage .product-holder a {text-align: center;color: #868686;}
.prod-icon { background-color:#0000FF; height:35px; width:35px; border-radius:50px; }
.prod-icon1 { background-repeat: no-repeat;width: 100%; background-image:url(../images/strip-new-product.png); height:35px; margin-top:15px; margin-left:15px; }
.prod-icon.i-prepaid {background-position: 25px 1px;}
.prod-icon.i-postpaid {background-position: 25px 2px; background-image:url(../images/old-mobile-phone.png)}
.prod-icon.i-dth { background-position: 25px -67px;}
.prod-icon.i-datacard {background-position: 25px -135px;}
.prod-icon.i-electricity {background-position: 25px -34px;}
.prod-icon.i-landline {background-position: 25px -203px;}
.prod-icon.i-broadband {background-position: 25px -234px;}
.prod-icon.i-gas {background-position: 25px -169px;}
.prod-icon.i-insurance {background-position: 25px 2px; background-image:url(../images/security.png)}
.prod-icon.i-miniatm {background-position: 25px 2px; background-image:url(../images/atm.png)}
.prod-icon.i-moneytrans {background-position: 25px 2px; background-image:url(../images/bank.png)}
.prod-icon.i-busbooking {background-position: 25px 2px; background-image:url(../images/bus.png)}
.rechargeinput{ width:100%;  margin:0 auto; display:none;}
.rechargeinput li#payformset{ display:none;}

.value1,.value2,.value3{ display:none}
ul{ list-style:none; margin:0; padding:0}
.rechargeinput ul li { line-height:40px;}

.pageheader { width:calc(100% -30px); letter-spacing:0px; font-size:25px; padding-bottom:10px; font-weight:200px;}
.pagetitle { width:100%; background-color:#F0F4F5; text-transform:uppercase; letter-spacing:3px; font-weight:bold; padding:10px 15px; }
.pageoptions {width:100%; height:40px; font-size:13px;}
.addpayment{ background-image:url(../images/add.png); background-repeat:no-repeat; background-size:10px 10px;  background-position:center center; float:left; width:20px; height:20px; border:1px solid #ccc; margin:0 10px;}
.searchicon{ background-image:url(../images/search.png); background-repeat:no-repeat;background-size:30px 30px; background-position:center center;width:32px; height:32px; border:0; float:left; cursor:pointer;}
.addicon{ background-image:url(../images/addnew.svg); background-repeat:no-repeat; background-size:30px 30px; background-position:center center;width:32px; height:32px; border:0; float:left; cursor:pointer;}



#prevpage{ width:40px; height:40px; border:0px solid #CCCCCC; border:1px solid #ccc; border-radius:50px; background-image: url(../images/left.png); background-size:10px; background-repeat:no-repeat; background-position:center center; float:right;cursor:pointer; margin-right:15px;}
#nextpage{ width:40px; height:40px; border:0px solid #CCCCCC; border:1px solid #ccc; border-radius:50px; background-image: url(../images/right.png); background-size:10px; background-repeat:no-repeat; background-position:center center;float:right;cursor:pointer;}
#numpage { font-weight:600; text-align:center; line-height:30px; display:none }
.navicon{margin:0;}

/*Table*/
.datahistory{ clear:both; width:100%; margin:5px 0;}
.table { clear:both; width:98%; font-size:13px; font-family:"Roboto"; font-weight:400; margin:0 auto; background-color:#FFFFFF}
.table .row { clear:both; width:100%; display:inline-block; border-bottom:1px #f2f2f2 solid; }
.table .headrow { font-weight:500;  background-color:#f2f2f2; color:#666; font-size:14px;}
.table .row:not(:first-child):hover { background-color:#f8f8f8; display:inline-block; cursor:pointer; _curson:pointer; }
.table .row:hover { background-color:#f8f8f8; display:inline-block; cursor:pointer; _curson:pointer; }
.table .row .col { float:left; padding:7px 4px 7px 4px; width:auto;box-sizing: border-box;-webkit-box-sizing: border-box;}
.table .row .col span { color:#a8a8a3; }
#rechargehistory .table .row .sno { width:60px; text-align:center }
#rechargehistory .table .row .cnno { width:calc(100% - 70px);  }
#rechargehistory .table .row .number1 { width:128px; width:-moz-calc(100% - 172px); width:-webkit-calc(100% - 172px);  width:calc(100% - 172px);}
#rechargehistory .table .row .number { width:128px; width:-moz-calc(100% - 172px); width:-webkit-calc(100% - 172px);  width:calc(100% - 172px);}
#rechargehistory .table .row .amount { width:65px; text-align:right;}
#rechargehistory .table .row .status { width:15px; text-align:right;  }

/*Icon*/
[id^="micon_"] {background-repeat:no-repeat; background-size:15px auto;  height:30px; width:auto; background-position:center center; }
#micon_reversal {  background-image:url(../images/reversal.png); }
#micon_refund {  background-image:url(../images/refund.png); }
#micon_declined,#micon_failure {  background-image:url(../images/failure.png); }
#micon_accepted ,#micon_success {  background-image:url(../images/success.png); }
#micon_awaiting {  background-image:url(../images/awaiting.png);}
#micon_pending {  background-image:url(../images/pending.png); }
#micon_sent {  background-image:url(../images/sent.png); }
#micon_debit {  background-image:url(../images/debit.png); }
#micon_receipt {  background-image:url(../images/receipt.png); }

/*recharge Search*/
#popupBackground { position: fixed; left: 0px; top: 0px; width: 100%; height: 100%; z-index: 1; border:0;background:rgba(0,0,0,0.7); display:none;}

/*Slider*/
.searchrecharge { height: 100%; width: 0; position: fixed; z-index:99999; top: 0; right:0; background-color:#fff; overflow-x: hidden; transition: 0.5s; padding:0;}
.closebtn {position: absolute;top: 0; padding:0;font-size:32px; width:50px; color:#818181; right:0;clear:both; cursor:pointer; text-align:center; }
#rechargehistory [id^="showrequest_"]{transition: 0.5s; padding:10px 0; text-align:right; display:none;}
#merchant .table .row .balance { width:90px; text-align:right;  padding-right:10px; }
#merchant .table .row .number { width:184px; width:-moz-calc(100% - 126px); width:-webkit-calc(100% - 126px);  width:calc(100% - 126px);padding-left:10px;}
.adpay{ color:#0000FF}
/*dashboaard*/
.dashboard { width:320px; margin:0 auto; padding-top:30px; }
.rechargedetails{ text-align:center}

.result{ width:100%;  display:inline-block; padding:5px 0; margin:1px 0; font-weight:400; font-size:14px;}

.resultval{ font-size:20px; font-weight:600}

.menulist{font-size:16px;width:100%; text-align:center;}

.menulist ul{padding:0;display:inline;}

.menulist ul li{  cursor:pointer; display:inline-block; width:45%;float:left; margin:1px 5px; list-style:none; background-color:#ff8e14;  height:40px; line-height:40px; float:left}

.menulist ul li a{ color:#fff; font-weight:500}

/*View recharge History*/

.viewcol{ clear:both; line-height:25px;width:100%; height:25px}

.viewdate{ width:100px;  float:left}

.viewdata{ width:calc(100% - 100px); float:left; text-align:right;}

.compaintlog .table .row .leftpanel{width:100px; text-align:left; }

.compaintlog .table .row .rightpanel{width:calc(100% - 116px); text-align:left;}



/*recharge panel*/

#oper_msg{float:left;font-weight:500;color:#333333; font-size:20px; height:150px; width:100%; line-height:20px; text-align:center}

#loginerr{float:left;font-weight:400; font-size:13px; color:#FF0000; width:100%; text-align:center; padding:10px 0}

.decline{background-image:url(../images/exclamation.svg);background-repeat: no-repeat;background-size: 50px; width:100%; height:50px; display:inline-block; margin:10px auto; text-align:center; background-position:center center;}

.accept{ background-image:url(../images/accept.svg);background-repeat: no-repeat;background-size:120px 120px; width:120px; height:120px; display:inline-block; margin:10px auto; text-align:center; background-position:center center;}



.acceptpay{background-color:#00CC00; color:#FFFFFF; padding:7px 10px;}

.declinepay{background-color:#FF0000; color:#FFFFFF; padding:7px 10px;margin:0 10px;}



.fieldrow{ display:inline-block; clear:both; width:100%; font-size:15px; padding:5px 0;}

.labelhead{font-weight:500;display:inline-block; font-size:18px; padding:10px 0; }

.labelname{ font-weight:300; min-width:70px; display:inline-block; }

.labelvalue{ font-weight:500 }



#homepage .holder, #homepage .holder1 { width:100%; padding:15px 0; text-align:center;}

#homepage .holder .dashboard-icon, #homepage .holder1 .dashboard-icon { height:60px; width:60px; background-repeat:no-repeat;float:left; background-position:center;border: 1px solid white;border-radius: 50px;-moz-border-radius: 50px;-webkit-border-radius: 50px;}





#iconpre{ background-image:url(../images/svg-prepaid.svg); background-size:auto 70%; background-color:#ec1562; background-position:center center; }

#iconpos { background-image:url(../images/svg-postpaid.svg); background-size:auto 70%; background-color:#ffc91b; background-position:10px center;}

#icondish{ background-image:url(../images/radar.svg); background-size:auto 60%; background-color:#366796; background-position:center center;}

#iconland { background-image:url(../images/telephone.svg); background-size:auto 65%; background-color:#ff5608; background-position:center center;}

#iconlight { background-image:url(../images/light.svg); background-size:auto 70%; background-color:#f05253; background-position:center center;}

#icongas { background-image:url(../images/gascylinder.svg); background-size:auto 70%; background-color:#ffcd34; background-position:center center;}

#iconheart { background-image:url(../images/heart.svg); background-size:auto 60%; background-color:#feca65; background-position:center center;}

#iconrupee { background-image:url(../images/rupeesvg.svg); background-size:auto 52%; background-color:#324a5e; background-position:center center;}

#iconatm { background-image:url(../images/icon-miniatm.png); background-size:auto 60%; background-color:#712357; background-position:13px center;}

#iconwifi { background-image:url(../images/wifi.svg); background-size:auto 45%; background-color:#383fcb; background-position:center center;}



#homepage .holder .title,#homepage .holder1 .title { clear:both; color:#000; text-align:center; padding:3px 0 }



.rechargeform { width:calc(100% - 30px)}



#commission .table .row .name { width:calc(100% - 130px); float:left; padding-left:15px;}

#commission .table .row .com { width:80px; float:right; text-align:right; padding-right:15px;}



#salesreport .table .row .date { width:90px;}

#salesreport .table .row .totalsales { width:calc(100% - 220px); float:left; text-align:right}

#salesreport .table .row .profit { width:100px; float:left; text-align:right;}





/*flash*/

.flash{border-bottom:1px solid #f2f2f2; padding:10px 0; display:inline-block;}

.flash .flashtitle{ font-size:14px;}

.flash .date{ font-size:11px;}



/* Horizontal Tab*/

.hztab .hztab__head {margin: 0;padding: 0;float: left;list-style: none;height: 32px;border-bottom: 1px solid #ccc;width: 100%;}

.hztab .hztab__head li {float: left;margin: 0 1px 0 0;cursor: pointer;padding: 0px 20px;height: 32px;line-height: 31px;color: #333;border-bottom: 0px;overflow: hidden;position: relative;background-color: #e5e5e5;}

.hztab .hztab__head li:hover {background-color: #e5e5e5;color: #000;}

.hztab .hztab__head li.active {border: 1px solid #ccc;background-color: #fff;color: #333;border-bottom: 1px solid #fff;display: block;}

.hztab .hztab__container {border: 1px solid #ccc;border-top: 0px;clear: both;float: left;width: 100%;}

.hztab .hztab__content {padding: 20px;display: none;}

.hztab__content{ display:none;}

.hztab__content:first-child{ display:block;}



/*Notifications*/

.alert {position: relative;padding:7px 15px; width:calc(100% - 30px); margin:5px 0; border: 1px solid transparent;border-top-color: transparent;border-right-color: transparent;        border-bottom-color: transparent;border-left-color: transparent;border-radius: 0.25rem;}

.alert-success {color: #06a054; background-color: rgba(8, 210, 111, 0.2); border-color: #07c166;}

.alert-info {color: #2886c2;background-color: rgba(53, 176, 255, 0.2);border-color: #31a2eb;}

.alert-warning {color: #c28f28;background-color: rgba(255, 188, 52, 0.2);border-color: #ebad30;}

.alert-danger {color: #c25858;background-color: rgba(255, 116, 116, 0.2);border-color: #eb6b6b;}

.alert-primary {color: #655dc2;background-color: rgba(133, 123, 255, 0.2);border-color: #7a71eb;}

.alert-secondary {color: #93969f;background-color: rgba(194, 198, 209, 0.2);border-color: #b2b6c0;}

.alert i { width:20px; height:20px; display:block; float:left;}

.alert-fill-primary {color: #ffffff;background-color: #857bff;border-color: #857bff;  line-height:20px;}

.alert-fill-success {color: #ffffff;background-color: #08d26f; border-color: #08d26f;line-height:20px;}

.alert-fill-info {color: #ffffff;background-color: #35b0ff; border-color: #35b0ff;line-height:20px;}

.alert-fill-warning {color: #ffffff;background-color: #ffbc34;border-color: #ffbc34;line-height:20px;}

.alert-fill-danger { color: #ffffff; background-color: #ff7474; border-color: #ff7474;line-height:20px;}

.alert-circle{background-repeat:no-repeat; background-position: center center; background-image:url(../images/icons/danger.svg);background-size: 16px auto; padding-right:10px;}

mark {

    color: red;

    font-size: 11px;

    background: transparent;

	}

/*BUTTONS*/

.btn {font-family: 'Roboto', sans-serif; padding: 12px 30px; font-size:14px; font-weight:500; border-radius:0px; border:3px solid transparent; border-radius:0px;cursor: pointer; box-sizing: border-box;text-decoration: none;display:inline-block; line-height: inherit; outline:none;}

.btn-sm {padding: 5px 10px!important;font-size:12px;}

.btn-outline {padding: 12px 30px; font-size:14px; font-weight:500; border-radius:0px; border:3px solid transparent; border-radius:0px; margin:5px 0; background:transparent}

.btn-outline.btn-sm {padding:5px 10px!important;}

.btn-black {color: #fff!important; background-color: #000!important; border-color: #000!important;}

.btn-master {color: #fff; background-color: #16a89f; border-color: #16a89f;}

.btn-primary{color: #fff; background-color: #6255ff; border-color: #5648ff;}

.btn-green {color: #fff; background-color: #00a308; border-color: #00a308;}

.btn-success {color: #fff; background-color: #fb641b; border-color: #fb641b;}

.btn-secondary{color: #212529;background-color: #c2c6d1; border-color: #c2c6d1;}

.btn-light {color: #212529; background-color: #f3f5f6; border-color: #f3f5f6;}

.btn-info{color: #fff; background-color: #35b0ff; border-color: #35b0ff;}

.btn-danger {color: #212529; background-color: #ff7474; border-color: #ff7474;}

.btn-warning {color: #212529;background-color: #ffbc34;border-color: #ffbc34;}

.btn-dark {color: #fff;background-color: #354168; border-color: #354168;}

.btn-link {font-weight: 400;color: #007bff;background-color: transparent;}

.btn-outline-primary{ color: #857bff;background-color: transparent; background-image: none;border-color: #857bff;}

.btn-outline-secondary {color: #c2c6d1;background-color: transparent; background-image: none; border-color: #c2c6d1;}

.btn-outline-success {color: #08d26f; background-color: transparent; background-image: none;border-color: #08d26f;}

.btn-outline-danger {color: #ff7474;background-color: transparent; background-image: none; border-color: #ff7474;}

.btn-outline-warning {color: #ffbc34; background-color: transparent;background-image: none; border-color: #ffbc34;}

.btn-outline-info {color: #35b0ff; background-color: transparent; background-image: none;  border-color: #35b0ff;}

.btn-outline-dark {color: #354168; background-color: transparent; background-image: none;  border-color: #354168;}

.btn-outline-light {color: #354168; background-color: transparent; background-image: none; border-color: #354168;}



.err{ color:red;}

#popbox { position: fixed; left: 0px; top: 0px; width: 100%; height: 100%; z-index: 99999; border:0;background:rgba(0,0,0,0.7); padding:10px 10px 20px 10px; box-sizing:border-box;}

#pophtml {position:fixed;border: 5px solid #CCCC00;z-index: 999999; background-color:#fff; top:-100px;left:0;right:0;bottom:0; margin:auto; height:300px; width:100%;text-align:center;box-sizing:border-box;  }



#hdTuto_search{display: none; position:absolute; z-index:9999; width:100%; padding:0; margin:0; max-height:175px; overflow-y:scroll}

.list-gpfrm-list a{text-decoration: none !important;}

.list-gpfrm li{cursor: pointer;padding: 5px; font-size:12px; border-bottom:1px solid #f1f1f1;}

.list-gpfrm{list-style-type: none;background: #fafafa; }

.list-gpfrm li:hover{color:#333;background-color: #f1f1f1;}

