.clearfix:before,
.clearfix:after{
    display: table;
    content: "";
    line-height: 0;
}
.clearfix:after{
    clear: both;
}
article, aside, details, figcaption, figure, footer, header, hgroup, nav, section{
    display: block;
}
html{
    font-size: 100%;
    -webkit-text-size-adjust: 100%;
    -ms-text-size-adjust: 100%;
}
a:focus{
    outline: thin dotted #333;
    outline: 5px auto -webkit-focus-ring-color;
    outline-offset: -2px;
}
a:hover,
a:active{
    outline: 0;
}
img{
    max-width: 100%;
    width: auto\9;
    height: auto;
    vertical-align: middle;
    border: 0;
    -ms-interpolation-mode: bicubic;
}
form{
    margin: 0;
}
button,
input,
select,
textarea{
    margin: 0;
    font-size: 100%;
    vertical-align: middle;
}
button,
input{
    line-height: normal;
}
button::-moz-focus-inner,
input::-moz-focus-inner{
    padding: 0;
    border: 0;
}
button,
html input[type="button"],
input[type="submit"],
input[type="reset"]
{
    -webkit-appearance: button;
    cursor: pointer;
    text-transform: uppercase;
}
label,
select,
button,
input[type="button"],
input[type="submit"],
input[type="radio"],
input[type="checkbox"]{
    cursor: pointer;
}
textarea{
    overflow: auto;
    vertical-align: top;
}
body{
    margin: 0;
    padding: 0;
    font: 12px Verdana, Geneva, sans-serif;
    color: #000000;
    line-height: 18px;
}
a{
    color: #000000;
    text-decoration: none;
}
a:hover,
a:focus{
    color: #444;
    text-decoration: none;
}
h1, h2, h3, h4, h5, h6{
    margin: 0 0 10px;
    padding: 0;
    font-family: Verdana, Arial, sans-serif;
    font-weight: normal;
    line-height: 20px;
    color: #000000;
    text-rendering: optimizelegibility;
}
h1{
    font-size: 30px;
    line-height: 42px;
}
h2{
    font-size: 24px;
    font-weight: bold;
    line-height: 32px;
}
h3{
    font-size: 22px;
    line-height: 30px;    
}
h4{
    font-size:18px;
    line-height: 26px;
}
h5{
    font-size: 14px;
}
h6{
    font-size: 12px;
}
p {
    margin: 0 0 10px;
}
ul{
    list-style: none;
}
ul, ol{
    margin: 0;
    padding: 0;
}
form{
    margin: 0;
}
label, input, button, select, textarea{
    font-size: 14px;
    font-weight: normal;
    line-height: 20px;
}
input, button, select, textarea{
    font-family: Helvetica, Arial, "Lucida Grande", sans-serif;
}
label{
    display: block;
    margin-bottom: 5px;
}
select,
textarea,
input[type="text"],
input[type="password"], 
input[type="number"]{
    display: inline-block;
    height: 20px;
    padding: 4px 6px;
    margin-bottom: 10px;
    font-size: 14px;
    /*line-height: 20px;*/
    line-height: normal;
    color: #000000;
    -webkit-border-radius: 6px;
    -moz-border-radius: 6px;
    border-radius: 6px;
    vertical-align: middle;
}
input,
textarea{
    /*width: 206px;*/
}
textarea{
    height: auto;
}
select,
input[type="file"]{
    height: 30px;
    line-height: 30px;
}
input[type="checkbox"]{
    width: auto;
}
input[type="button"], input[type="submit"].redBtn,input[type="reset"].redBtn{
    display: inline-block;
    padding: 4px;
    font-family: Arial;
    font-size: 14px;
    line-height: normal;
    font-weight: bold;
    color: #f00;
    border: 2px solid #ff0000;
    background: #f5f0eD;
    /*text-transform: uppercase;*/
    cursor: pointer;
    vertical-align: middle;
}

table{
    border-collapse: collapse;
}
table td{
    /*word-break: break-all;*/
    word-break: normal;
}

/* icons */
[class^="icon-"],
[class*=" icon-"]{
    display: inline-block;
    margin-top: 1px;
    width: 14px;
    height: 14px;
    line-height: 14px;
    vertical-align: middle;
    background: url("../images/iconSprite.png") no-repeat;
}
.icon-finger{
    width: 45px;
    height: 25px;
}
.icon-edit,.icon-edit1,.icon-edit2{
    width: 20px;
    height: 20px;
    background-position: 6px -25px;
    cursor: pointer;
    
}
.icon-save,.icon-save1,.icon-save2{
    width: 20px;
    height: 20px;
    background-position: 0 -45px;
    cursor: pointer;
}
.icon-close,.icon-close1,.icon-close2{
    width: 15px;
    height: 15px;
    background-position: 2px -67px;
    cursor: pointer;
}
.icon-remove,.icon-remove1,.icon-remove2{
    width: 20px;
    height: 20px;
    background-position: 2px -82px;
    cursor: pointer;
}
.icon-add{
    width: 50px;
    height: 50px;
    background-position: 3px -105px;
    cursor: pointer;
}
.icon-closeBtn{
    width: 50px;
    height: 50px;
    background-position: 3px -155px;
}
.icon-refund{
    width: 20px;
    height: 20px;
    background-position: 0 -204px;
}
.icon-addSmall{
    width: 25px;
    height: 25px;
    background-position: 0 -225px;
    cursor: pointer;
}
.icon-print{
    width: 30px;
    height: 30px;
    background-position: 0 -255px;
    cursor: pointer;
}
.icon-logout{
    width: 22px;
    height: 20px;
    background-position: 0 -285px;
    cursor: pointer;
}
.icon-down, .icon-up{
    width: 20px;
    height: 15px;
    background-position: 0 -310px;
    cursor: pointer;
}
.icon-up{
    background-position: -25px -310px;
}
.icon-list{
    width: 20px;
    height: 20px;
    background: url("../images/list.png") no-repeat 0 0;
}

/* container */
/* Aug 2020 Changed to 1010 width from 1000 to allow home icon and not contact to go down */
.container{
    margin-right: auto;
    margin-left: auto;
    width: 1010px;
}
.container:before,
.container:after{
    display: table;
    content: "";
    line-height: 0;
}
.container:after{
    clear: both;
}
.pull-right{
    float: right;
}
.pull-left{
    float: left;
}
.hide{
    display: none;
}
.show{
    display: block;
}
.disabled{ 
    opacity: .5;
    filter:alpha(opacity=50); 
}
.error{
    color: #f00;
}
.redText{
    color: #f00;
}
.errorBigFont {
    font-size: 16px;
    font-weight: normal;
    color: #f00;
}
.success {
    font: 12px Verdana,Geneva,sans-serif;
    font-weight: bold;
    color: #1B7601;
}
.transError {
    font-size: 12px;
    font-weight: bold;
    color: #f00;
}
.grayBtn, input[type="button"].grayBtn{
    display: inline-block;
    margin: 0 5px 0 0;
    padding: 5px 25px;
    color: #fff;
    font-family: Arial;
    font-size: 14px;
    font-weight: bold;
    line-height: normal;
    border: 2px solid #000;
    border-radius: 3px;
    cursor: pointer;
    background: #000;
}
.grayBtn:hover, input[type="button"].grayBtn:hover{
    border: 2px solid #f00;
    background: #f00;
}
input[type="text"].smInput,
input[type="number"].smInput{
    margin: 0;
    font-size: 12px;
    min-width: 130px;
    height: 14px;
    border: 1px solid #777876;
    border-radius: 0;
}
select.smSelect{
    margin: 0;
    padding: 2px 4px;
    font-size: 12px;
    min-width: 120px;
    height: 24px;
    line-height: normal;
    border: 1px solid #777876;
    border-radius: 0;
    background: #fdfcfd;
}

/* header */
.header{
    /*height: 150px;*/
    height:auto;
}    
.header .container{
    position: relative;
}
.mainLogo{
    float: left;
    margin: 20px 0 0;
    width: 290px;
    height: 130px;
    background: url("../images/logo_2024.png") no-repeat;
    background-size: 290px auto;
}
.langSelCnt{
    float: right;
    margin: 15px 0 0;
    width: 150px;
    height: 30px;
}
.langList{
    margin: 0;
    padding: 2px 5px;
    width: 100px;
    height: auto;
    line-height: normal;
    font-size: 12px;
    color: #000;
    border: 1px solid #777876;
    background: #fdfcfd;
    border-radius: 3px;
}
.centerHdr{
    float: left;
    margin: 10px 0 0;
    padding: 0 0 0 10px;
    width: 450px;
    font-weight: bold;
    text-align: center;
    text-transform: uppercase;
}
.centerHdr span{
    text-transform: none;
}
.centerHdr .storeinfo {font-weight:normal;} 
.centerHdr span.name{
    display: inline-block;
    margin: 0 30px 0 0;
}
.storeid { white-space: nowrap;}
.centerHdr .storeName{
    padding: 5px 0 0;
    font-size: 25px;
    line-height: 25px;
    font-weight: bold;
    color: #000000;
}
.logoutLink{
    position: absolute;
    top: 110px;
    right: 95px;
    color: #f00;
    text-transform: uppercase;
    z-index: 999;
}
.logoutLink:hover{
    color: #f00;
}

/* navigation */
.navWrap{
    margin: 0 0 25px;
    height: 40px;
    background: #000;
}
.navMenu ul{
    margin: 0;
    padding: 0;
}
.navMenu li{
    position: relative;
    float: left;
    margin: 0 0 0 10px;
}
.navMenu li:first-child{
    margin: 0;
}
.navMenu li a{
    display: block;
    color: #cccccc;
    font-size: 13px;
    font-weight: bold;
    padding: 11px 10px;
    text-transform: uppercase;
    letter-spacing: -0.05em;
}
.navMenu li a.current{
    color: #ffffff;
}
.subnav a {
    text-decoration: underline;
}
.subnav ul{
    display: none;
    position: absolute;
    top: 40px;
    left: 0;
    margin: 0px;
    padding: 0 9px 9px 9px;
    width: 170px;
    list-style: none;
    background: #000000;
    z-index: 2;
}
.subnav li {
    margin: 0;
    padding: 0;
    clear: both;
    width: 170px;
}
.subnav li a {
    float: left;
    padding: 6px 0px 6px 18px;
    width: 151px;
    font-size: 11px;
    color: #fff;
    text-align: left;
    text-decoration: none;
    cursor: pointer;
}

.subnav li a.current{
    color: #ffffff;
    text-decoration: underline;
}

.respBtn {
    display: none;
}

.mainCnt{
    margin-bottom: 80px;
}
.lftCol{
    float: left;
    padding: 0 20px;
    width: 620px;
    font-size: 15px;
    color:#444;
    line-height: 24px;
}
.lftCol .imgBox{
    display: block;
    margin: -5px 0 0;
}
.lftCol p{
    margin: 0 0 25px;
}
.infolist li{
    margin: 30px 0 0;  
}
.infolist li:first-child{
    margin: 0;
}
.lftCol .icon-finger{
    margin: -5px 10px 0 0;
}
.rhtCol{
    float: right;
    padding: 20px;
    width: 280px;
    background: #000;
}
.rhtCol label{
    margin: 0 0 5px;
    font-family: Lucida Sans Unicode, Lucida Grande, sans-serif;
    font-size: 16px;
    color: #fff;
    font-weight: bold;
    text-transform: uppercase;
    cursor: text;
}
.rhtCol label span{
    color: #ff0000;
}
.inputBox{
    padding: 0 0 15px;
}
.inputBox input[type="text"], .inputBox input[type="password"]{
    margin: 0;
    padding: 5px;
    width: 100%;
    height: 40px;
    font-size: 25px;
    color: #000000;
    border: 1px solid #777876;
    border-radius: 3px;
    background: #fdfcfd;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
}
.rhtCol label.error{
    margin: 0 0 5px;
    padding: 0;
    font-size: 10px;
    color: #ff0000;
    text-transform: none;
}
.buttonLogin {
    margin: 5px 0;
    padding: 10px 45px;
    width: auto;
    color: #000;
    font-family: Arial;
    font-size: 18px;
    font-weight: bold;
    border-radius: 3px;
    text-transform: uppercase;
    border: 1px solid #afafaf;
    background: #afafaf;
    cursor: pointer;
}
.spinLoader{
    display: none;
}

.footer{
    padding: 0 0 20px;
    font-family: "Trebuchet MS", Verdana, Arial, Helvetica, sans-serif;
    font-size: 11px;
    line-height: 20px;
    color: #10100F;
    text-align: center;
    text-transform: uppercase;
}
.footer p{
    margin: 0;
}
.ipCnt{
    font-size: 13px;
    line-height: 16px;
    text-align: right;
}

/* user manage page */
.userCnt{
    margin-top: -25px; 
    padding: 3px;
    border: 1px solid #ccc;
}
.mainHeading{
    margin: 0;
    padding: 5px;
    color: #fff;
    height: 30px;
    font-size: 17px;
    font-weight: bold;
    background-color: #000;
    text-transform: none;
}
.agentCnt{
    padding: 5px 5px 20px;
    overflow: hidden;
}
.agentCnt span{
    width: 20%;
    float: left;
}
.agentCnt input[type="text"], .agentCnt input[type="password"]{
    display: block;
    margin: 5px 0 0;
    padding: 2px;
    width: 151px;
    height: 16px;
    font-size: 14px;
    color: #000;
    border: 1px solid #777876;
    border-radius: 0;
    background: #fdfcfd;
}
.agentCnt select{
    display: block;
    margin: 5px 0 0;
    padding: 1px;
    font-size: 13px;
    width: 120px;
    height: 22px;
    color: #000;
    border: 1px solid #777876;
    border-radius: 0;
    background: #fdfcfd;
}
.agentCnt input[type="submit"]{
    float: left;
    margin: 16px 0 0;
    padding: 2px 4px 4px;
    width: auto;
    height: 28px;
    line-height: none;
    font-family: Arial;
    font-size: 14px;
    font-weight: bold;
    color: #ff0000;
    cursor: pointer;
    border: 2px solid #ff0000;
    background: #F5F0ED;
    text-transform: uppercase;
}
.agentCnt b.error{
    color: red;
    font-size: 10px;
}
.agentList{
    font-size: 15px;
    background: #f7f7f6;
}
.agentList ul{
    display: table;
    width: 100%;
}
.agentList li{
    display: table-row;
}
.agentList li div{
    display: table-cell;
    padding: 7px 10px;
    width: 16%;
    text-align: right;
    vertical-align: middle;
    border-right: 1px solid #ccc;;
    border-bottom: 1px solid #ccc;;
}
.agentList li .login{
    width: 20%;
    text-align: left;
    border-left: 1px solid #ccc;;
}
.agentList li:first-child{
    background: #000;
}
.agentList li:first-child div{
    padding: 8px 10px 8px;
    font-size: 15px;
    font-weight: bold;
    line-height: normal;
    color: #fff;
    border-color: transparent; 
}

 
.pass span{
    /*display: inline-block;*/
    margin: 2px 0 0;
}
.pass input.hide{
    display: none;
}
.pass input[type="password"]{
    margin: 0;
    width: 100%;
    height: 20px;
    border: 1px solid #a9a9a9;
    border-radius: 0;
    box-sizing: border-box;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
}

.email span{
    /*display: inline-block;*/
    margin: 2px 0 0;
}
.email input.hide{
    display: none;
}
.email input[type="text"]{
    margin: 0;
    width: 100%;
    height: 20px;
    border: 1px solid #a9a9a9;
    padding:0;
    border-radius: 0;
    box-sizing: border-box;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
}
.role select{
    margin: 0;
    padding: 1px 4px 2px;
    width: 100%;
    height: 22px;
    font-size: 13px;
    border: 1px solid #a9a9a9;
    border-radius: 0;
}


.active label{
    display: inline-block;
    margin: -2px 0 0;
    width: 25px;
    height: 20px;
}

.action .icon-save, .action .icon-close{
    cursor: pointer;
}
.action .icon-close{
    margin: -1px 0 0 12px;
}

.actList .pass span, 
.actList .role span, 
.actList .action .icon-edit{
    /*display: none;*/
}
.actList .pass input[type="password"],
.actList .role select,
.actList .action .icon-save,
.actList .action .icon-close{
    display: inline-block;
    
}


/*Report Page CSS Start */
.userCnt{
    margin-top: -25px; 
    padding: 3px;
    border: 1px solid #ccc;
}
.mainHeading{
    margin: 0;
    padding: 5px;
    color: #fff;
    height: 30px;
    font-size: 17px;
    font-weight: bold;
    background-color: #000;
    text-transform: none;
}
.reportCnt{
    padding: 5px 5px 20px;
    overflow: hidden;
}
.reportBtnCnt{
    float: left;
    margin: 0 10px 0 0;
}
.reportDateCnt{
    float: left;
}


.reportCntRow{
    padding: 5px 5px 20px;
    overflow: hidden;
}
.reportCntRow:even{
    background:#fff;
    padding: 5px 5px 20px;
    overflow: hidden;
}
.reportCntRow:odd{
    background:#fff;
    padding: 5px 5px 20px;
    overflow: hidden;
}
.reportCntRow div.leftCnt{
    width:25%;
    float:left;
}
.reportCntRow div.rightCnt{
    width:60%;
    float:left;
}
.reportCnt span{
    width: 25%;
    /*float: left;*/
}
.reportCnt div.button{
    float: left;
    margin-top:15px;
    margin-right:10px;
    /*width: 15%;*/
}
.reportCnt div.button1{
    float: left;
    margin-top:15px;
    /*width: 20%;*/
}
.reportCnt div.transactionDate{
    /*width: 22%;*/
    float: left;
    margin-top:17px;
    margin-right: 15px;
}
.reportDateCnt input[type="text"]{
    cursor: pointer;
}
.reportCnt input[type="text"], .reportCnt input[type="password"]{
    display: inline-block;
    margin: 0;
    padding: 2px;
    width: 151px;
    height: 16px;
    font-size: 14px;
    color: #000;
    border: 1px solid #777876;
    border-radius: 0;
    background: #fdfcfd;
    vertical-align: middle;
}
.reportCnt input[type="text"]{
    padding: 4px;
    height: 18px;
    border-radius: 4px;
}
.reportCnt .transactionDate span{
    display: inline-block;
    margin: 3px 10px 0 0;
    width: auto;
}
.reportCnt select{
    display: block;
    margin: 5px 0 0;
    padding: 1px;
    font-size: 13px;
    width: 120px;
    height: 22px;
    color: #000;
    border: 1px solid #777876;
    border-radius: 0;
    background: #fdfcfd;
}
.reportFromList span, .reportFromList select{
    display: inline-block;
    margin: 17px 0 0;
    vertical-align: middle;
}
.reportFromList span{
    margin: 17px 6px 0 10px;
    width: auto;
}
.reportFromList select{
    padding: 2px 4px;
    height: 26px;
    line-height: 26px;
    border: 1px solid #777876;
    border-radius: 4px;
}



/*
.buttonBlockSubmit, input[type="button"].buttonBlockSubmit{
    width:auto;
    border-radius:4px;
    background: #F5F0ED;
    border: 1px solid #ff0000;
    color: #ff0000;
    float: left;
    font-family: Arial;
    font-size: 14px;
    font-weight: bold;
    padding: 4px 10px;
    margin: 2px;
    height: 30px;
    cursor: pointer;
    text-transform: uppercase;
}
.buttonBlockSubmit:hover, input[type="button"].buttonBlockSubmit:hover {
    color: #fff;
    background: #ff0000;
}
.reportCnt input[type="submit"]{
    border-radius:4px;
    float: left;
    padding: 4px 10px;
    width: auto;
    line-height: none;
    font-family: Arial;
    font-size: 14px;
    font-weight: bold;
    color: #ff0000;
    cursor: pointer;
    border: 1px solid #ff0000;
    background: #F5F0ED;
    text-transform: uppercase;
}

.reportCnt input[type="submit"]:hover{
    border-radius:5px;
    float: left;
    padding: 4px 10px;
    width: auto;
    line-height: none;
    font-family: Arial;
    font-size: 14px;
    font-weight: bold;
    color: #fff;
    cursor: pointer;
    border: 1px solid #ff0000;
    background: #ff0000;
    text-transform: uppercase;
}
*/
.reportCnt b.error{
    color: red;
    font-size: 10px;
}
.reportList{
    font-size: 14px;
    background: #f7f7f6;
}
.reportList ul{
    display: table;
    width: 100%;
}
.reportList li{
    display: table-row;
}
.reportList li:first-child div{
    padding: 8px 10px 8px;
    font-size: 15px;
    font-weight: bold;
    line-height: normal;
    color: #fff;
    border-color: transparent; 
} 
.reportList li .number{
    width:4%;
    text-align: left;
    border-left: 1px solid #ccc;;
}
.reportList li .date{
    width:10%;
    text-align: left;
}
.reportList .retSale,
.reportList .cost,
.reportList .profit{
    width:9%;
    text-align: left;
}
.reportList li .blank{
    width:30%;
    text-align: left;
    border-left: 1px solid #ccc;;
}
.reportList li .transaction{
    width:30%;
    text-align: left;
    border-left: 1px solid #ccc;;
}
.reportList li .receipt{
    width:1%;
    text-align: left;
    padding: 1px 1px 1px 1px;
}
.reportList li .role{
    width:1%;
    text-align: left;
    border-left: 1px solid #ccc;;
    padding: 2px 2px 2px 4px;
}
.reportList li div{
    display: table-cell;
    padding: 7px 10px;
    width: 15%;
    text-align: left;
    vertical-align: middle;
    border-right: 1px solid #ccc;;
    border-bottom: 1px solid #ccc;;
}
.reportList li:first-child{
    background: #000;
}

.trHeading{
    font-size: 13px;
    font-weight: bold;
}
.trHeading .action{
    position: relative; 
}
.trHeading .action span{
    display: inline-block;
    margin-left: -90px;
}
.reportList .trHeading .number,
.reportList .trHeading .date,
.reportList .trHeading .active,
.reportList .trHeading .role,
.reportList .trHeading .destination
{
    border-right-color: transparent;
}
/*Report page CSS End */




/*Home Page Start here */
.showcase {
    height: 80px;
    margin: auto;
    position: relative;
}
.showcase-slide{
    max-width:1200px;
    margin:0 auto;
}
.showcase-content-container{
    background-color: #fff; 
}

/* Navigation arrows */
.showcase-arrow-previous, .showcase-arrow-next{
    position: absolute;
    width: 33px;
    height: 33px;
    cursor: pointer;
    background: url('../images/arrows.png');
}
.showcase-arrow-previous{
    left: -60px;
}
.showcase-arrow-previous:hover{
    background-position: 0px -34px;
}
.showcase-arrow-next{
    right: -56px;
    background-position: -34px 0;
}
.showcase-arrow-next:hover{
    background-position: -34px -34px;
}

/* Content */
.showcase-content{
    text-align: center;
    cursor: pointer;
    background-color: #cccccc;
}
.showcase-content-wrapper{
    height: 80px;
    width: auto;
    font-size:18px;
    text-align: center;
    vertical-align: middle;
}
.showcase-content-wrapper table{
    width:100%;
    margin: auto;
    height:100%;
    border: none; 
}  
.showcase-content-wrapper img, .showcase-content-wrapper p{
    vertical-align: top;
}
.Ph_num_Cnt{
    max-width:560px;
    margin:0 auto;
    padding: 3px;
    border: 1px solid #ccc;
}
.mainTitle{
    margin: 0;
    padding: 17px 0 0 17px;
    height:48px;
    font-size: 17px;
    font-weight: bold;
    color: #FFFFFF;
    text-transform: none;
    background-color: #000000;
}
.phoneNoWrap{
    padding: 30px 24px;
}
input#txtPhoneNumber{
    display: block;
    margin: 0;
    padding: 2px 5px 5px 5px;
    width: 100%;
    height: 90px;
    font-size: 60px;
    font-weight: bold;
    color: #000000;
    border: 1px solid #dee0da;
    border-radius: 5px;
    background-color: #cccccc;
    line-height:normal;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    text-align: center;
}
.phoneNoWrap p.error{
    margin: 10px 0 0;
    font-size: 18px;
    font-weight: bold;
    color: #f00;
    text-align: center;
}
.buttonContainer{
    float:right;
    margin:0 15px 15px 0;
}
.buttonContainer .buttonSubmit, .buttonContainer .buttonTopup{
    margin-right:13px;
    padding: 4px 5px; 
    min-width:90px;
    width:auto;
    height: 32px;
    font-family: verdana;
    font-size: 17px;
    font-weight: bold;
    color: #FFFFFF;
    text-align:center;
    text-transform: uppercase;
    border: 1px outset #8E8F8F;
    background-color: #000000;
    cursor: pointer;
} 
.buttonContainer .buttonTopup{
    width: 100px;
}
.buttonSubmit:hover, .buttonTopup:hover{
    background-color:#e91b23;
}
/*Home Page CSS End*/



/* Acount page*/
.acountCnt{

}
.orderBox{
    margin: -25px 0 10px;
    padding: 3px;
    border: 1px solid #ccc;
}
.orderBox .mainHeading span, .orderBox .mainHeading i{
    display: none;
}
.orderCnt{
    padding: 5px;
}
.orderCnt .spinner{
    display: block;
    margin: 5px 0;
}
.orderCnt .hide{
    display: none;   
}
.orderMain{
    overflow: hidden;
}
.ordleft{
    float: left;
    width: 60%;
}
.ordTable{
    display: table;
    width: 100%;
}
.ordRow{
    margin: 0 0 1px;
    overflow: hidden;
    display: table-row;
}
.ordleft span{
    display: table-cell;
}
.ordleft .del{
    width: 10%;
}
.ordleft .icon-remove{
    background-position: 2px -84px;
}
.ordleft .product{
    width: 35%;
}
.ordleft .phoneNo{
    width: 35%;
}
.ordleft .price{
    width: 20%;
}
.ordleft b{
    display: block;
    font-size: 12px;
    font-weight: bold;
    color: red;
    text-transform: uppercase;
    text-decoration: underline;
}
.ordRht{
    float: left;
    width: 40%;
}
.ordTotal{
    float: left;
    width: 50%;
}
.ordTotal b{
    display: block;
    padding: 3px;
    height: 22px;
    font-size: 18px;
    line-height: 22px;
    color: #fff;
    text-align: center;
    text-transform: uppercase;
    border: 1px solid transparent;
    background-color: #a3cc33;
}
.ordTotal input[type="button"]{
    display: block;
    margin: 4px 0 0;
    padding: 4px;
    width: 100%;
    color: #ff0000;
    font: bold 14px Arial;
    text-transform: uppercase;
    border: 2px solid #ff0000;
    background: #f5f0ed;
    cursor: pointer;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
}
.ordAmnt{
    float: left;
    width: 50%;
}
.ordAmnt b{
    margin: 0 0 0 2px;
    display: block;
    padding: 3px;
    font-size: 18px;
    height: 22px;
    line-height: 22px;
    text-align: center;
    border: 1px solid #a3cc33;
}

.tablist{
    margin: 0 0 10px;
    border-bottom: 2px solid #ec1824;
}
.tablist li{
    float: left;
    margin: 0 0 0 10px;
    background: #dee0da;
    border-bottom: 4px solid transparent;
}
.tablist li:first-child,.tablist .firstPinless{
    margin: 0;
}
.tablist li.active{    
    border-bottom: 4px solid #f00;
}
.tablist li a{
    display: block;
    padding: 0 10px;
    height: 40px;
    font-family: Arial;
    font-size: 18px;
    line-height: 42px;
    color: #000;
}

.tabsCnt{
    display: none;
}
.tabsCnt.actTab{
    display: block;
}

.sinpinCnt{
    padding: 3px;
    border: 1px solid #ccc;
}
.rechForm{
    margin: 0 0 15px;
    border: 1px solid #ccc;
}
.rechFormTop{
    background: #ed1c24;
    overflow: hidden;
}
.rechFormTop span{
    float: left;
    width: 50%;
}
.rechFormTop span.spanBal{
    float: left;
    width: 80%;
}
.rechFormTop b{
    display: block;
    color: #fff;
    font-size: 18px;
    font-weight: bold;
    padding: 8px 25px 8px 25px;
    border: 2px solid #ed1c24;
    background: #000;
}
.rechFormTop span:first-child b{
    border-right: none;    
}
.rechFormTop i{
    display: block;
    padding: 8px 25px 12px;
    font-size: 18px;
    font-weight: bold;
    font-style: normal;
    color: #000;
}
.enterAmt{
    padding: 10px 5px 15px;
}
.heading2{
    margin: 0 0 0 5px;
    font-family: Arial;
    font-size: 24px;
    line-height: 30px;
    color: #000000;
}
.entAmtLft, .entAmtRht{
    float: left;
    width: 50%;
}
.entAmtLft .error{
    margin: 0 0 5px;
    height: 18px;
    font-size: 10px;
    font-weight: bold;
    color: #f00;
}
.entAmtLft .error span{
    display: none;
}

.amtBox input[type="text"], input[type="text"].grayInputBig{
    display: inline-block;
    margin: 0 15px 0 0;
    padding: 10px 5px;
    width: 135px; 
    height: 58px;
    font-size: 48px;
    color: #000;
    border: none;
    border-radius: 3px;
    background: #ccc;
    vertical-align: middle;
}
.amtBox .icon-add, .amtBox input[type="image"], .amtBox .icon-closeBtn{
    margin: 4px 0 0 0;
    cursor: pointer;
}
.amtBox .entAmtLft{
    display: inline-block;
}
.entAmtRht {
    padding: 30px 0 0;
}
.entAmtRht label{
    margin: 0 5px 5px 0;
    display: inline-block;
}
.entAmtRht label input{
    margin: -2px 0 0;
    vertical-align: middle;
}

.amtBox table{
    width:90%
}
.amtBox table td{
    text-align:center;
    vertical-align: top;
}

.dollorSign{
    display: inline-block;
    margin: 0 6px 0 0;
    font-size: 60px;
    line-height: 60px;
    font-weight: normal;
    color: #000000;
    vertical-align: middle;
}

.tableGray {
    background: #ffffff;
    margin-bottom: 15px;
    border: 1px solid #cccccc;
}
.tableGray td {
    color: #000000;
    font-weight: normal;
    font-size: 14px;
    padding: 5px;
    text-decoration: none;
    margin-right: 3px;
    position: relative;
    border: 1px solid #cccccc;
}
.saveBtnCnt{
    text-align: center;
}
.saveBtn{
    display: inline-block;
    margin: 2px;
    padding: 2px 4px;
    width: auto;
    font-family: Arial;
    font-size: 14px;
    font-weight: bold;
    color: #ff0000;
    text-transform: uppercase;
    border: 2px solid #ff0000;
    background: #F5F0ED;
    cursor: pointer;
}
input[type="button"].disableBtn{
    color: #666;
    border: 2px solid #666;
    background: #ccc;
    cursor: not-allowed;
}
.custInfo{

}
.sinpinTabsList{
    border-bottom: 2px solid #ed1c24;
    overflow: hidden;
}
.sinpinTabsList li{
    float: left;
    margin-right: 3px;
}
.sinpinTabsList li a{
    display: block;
    padding: 8px 25px;
    font-size: 12px;
    font-weight: bold;
    line-height: 14px;
    color: #000000;
    text-decoration: none;
    background: #ccc;
}
.sinpinTabsList li.active a, .sinpinTabsList li a:hover{
    background: #ed1C24;
}
.sinpinTabsCnt{
    display: none;
    padding: 15px 0 10px;
}
.sinpinTabsCnt.sinpinActTab{
    display: block;
}
.sinpinTabsCnt .error{
    margin: 0 0 10px 5px;
}
.histFormCnt{
    margin: 0 0 15px;
}
.histFormCnt span{
    display: inline-block;
    margin: 0 15px 0 0;
    vertical-align: middle;
}
.histFormCnt input[type="text"]{
    display: inline-block;
    margin: 0;
    padding: 5px 5px;
    width: 100px;
    height: 15px;
    line-height: 15px;
    font-size: 12px;
    color: #000;
    border: 1px solid #777876;
    border-radius: 3px;
    background: #fdfcfd;
}
.histFormCnt input[type="button"]{
    margin: -2px 10px 0 0;
    text-transform: uppercase;
}
.histFormCnt span.hide{
    display: none;
}
.tableCntWrap{
    height: 300px;
    overflow: auto;
}
.tableCnt{
    width: 100%;
    border-top: 1px solid #000;
}
.tableCnt td{
    padding: 2px 4px;
    border-right: 1px solid #000;
    border-bottom: 1px solid #000;
    vertical-align: middle;
    font-size:14px;
    color:#000000;
}

.tableCnt td a, .amtBox td a{
    color:#0000ff;
}

.tableCnt tr td:first-child{
    border-left: 1px solid #000;
}
.tableCnt .heading td{
    padding: 4px;
    font-size: 14px;
    font-weight: bold;
    color: #fff;
    background: #000;
}
.refundPopup{

}
.refundPopup .success, .refundPopup .transError{
    margin: 0 0 15px;
}
.entHeading{
    display: block;
    margin: 0 0 0 48px;
}
.refundError{
    display: block;
    margin-left: 48px;
    height: 10px;
}
.refundRow{
    margin: 0 0 15px;
}
.regPhoneForm{
    margin: 0 0 15px;
}
.regPhoneForm span, .regPhoneForm .error{
    margin: 0 5px 0 0;
}
.regPhoneForm .icon-addSmall, .regPhoneForm input[type="image"]{
    margin: 1px 5px 0;
}
/*.regPhoneTable table td:first-child{
    width: 60%;
}*/
.regPhoneTable input[type="text"].smInput,.regPhoneTable input[type="number"].smInput{
    font-size: 12px;
    height: 12px;
}
.regPhoneTable .icon-edit{
    margin: 2px 10px 0 0;
}
.regPhoneTable .icon-remove{
    margin: -1px 0 0 0;
}
.regPhoneTable .icon-save{
    margin: 2px 15px 0 0;
}
.showCnt{
    display: inline-block;
    overflow: hidden;
}
.hideCnt{
    display: none;
}
.actList .showCnt{
    display: none;
}
.actList .hideCnt{
    display: inline-block;
}
.updateDel div:last-child .showCnt, .updateDel div:last-child .hideCnt,
.updateDel td:last-child .showCnt, .updateDel td:last-child .hideCnt{
    display: none;
}
.updateDel .smLoading img{
    display: block;
}
.smLoading img{
    width: 20px;
}
.hotlineForm{
    margin: 0 0 15px;
}
.hotlineFormCnt{
    font-size: 12px;
    overflow: hidden;
}
.hotlineFormCnt div{
    float: left;
    margin: 0 15px 0 0;
    min-width: 170px;
}
.hotlineFormCnt .entName{
    margin: 0 10px 0 0;
}
.hotlineFormCnt .addCnt{
    min-width: 50px;
}
.hotlineFormCnt .addCnt .error{
    margin: 0;
}
.hotlineFormCnt b{
    display: block;
    margin: 0 0 5px;
    font-weight: normal;
}
.hotlineFormCnt input[type="text"], .hotlineFormCnt select.smSelect{
    min-width: 140px;
    font-size: 12px;
    border: 1px solid #777876;
}
.hotlineFormCnt select.smSelect.error{
    margin: 0;
    color: #555;
}
.hotlineFormCnt .error{
    margin-left: 0;
}
.hotlinesTable{

}
.hotlinesTable .icon-edit {
    margin: 2px 10px 0 0;
}
.hotlinesTable select.smSelect{
    height: 22px;
}
.hotlinesTable .icon-save{
    margin: 2px 15px 0 0    ;
}
.speedDialForm{
    margin: 0 0 15px;
    overflow: hidden;
}
.speedDialForm div{
    float: left;
    margin: 0 15px 0 0;
}
.speedDialForm b{
    display: block;
    font-weight: normal;
}
.speedDialForm .error{
    margin-left: 0;
}
.dialCode input[type="text"]{
    min-width: 50px;
}
.speedDialTable .icon-edit{
    margin: 2px 10px 0 0;
}
.speedDialTable .icon-save{
    margin: 2px 15px 0 0;
}
.actionBtn{
    width: 15%;
}
.tableCnt input.smInput{
    font-family: verdana;
    color: #000;
}
.showCnt .icon-remove{
    margin: -2px 0 0;
}

/* international topup */
.intPopupCnt{
    padding: 15px 10px;
    border: 1px solid #ccc;
}
.intPopupTop .errorBigFont{
    margin: 0 0 20px;
}
.intPopupForm{

}
.intFormRow{
    margin: 0 0 20px;
    /*overflow: hidden;*/
}
.intFormRow .rowcol{
    margin: 0 15px 0 0;
    float: left;
}
.intFormRow div b{
    display: block;
    margin: 0 0 6px;
    font-family: Helvetica;
    font-size: 16px;
    /*color: #555;*/
    color: #000000;
}
.intFormRow div i{
    display: inline-block;
    margin: 0 5px 0 0;
    color: #f00;
}
.intFormRow input[type="text"],.intFormRow input[type="number"]{
    margin: 0;
    padding: 10px 5px;
    width: 200px;
    font-size: 18px;
    color: #000;
    border: 1px solid #777876;
    border-radius: 3px;
    background: #fdfcfd;
}
.topupMob .error{
    display: block;
    margin: 0 0 0 2px;
    height: 20px;
}
.topupMob .error span{
    margin: 0;
    color: #f00;
    line-height: 10px;
    font-size: 10px;
    font-weight: bold;
}
.looupBtn{
    padding: 32px 0 0;
}
.looupBtn input[type="button"]{
    margin: 0 15px 10px 0;
    vertical-align: middle;
}
.looupBtn span{
    display: inline-block;
}
.ddCnt{
    position: relative;
}
.dd-select{
    max-width: 288px !important;
    max-height: 50px !important;
    border: 1px solid #777876 !important;
    border-radius: 3px !important;
    background: #fff !important;
}
.dd-desc{
    display: none !important;
}
.dd-selected-text, .dd-option-text{
    display: inline-block;
    margin: 0;
}
.dd-selected label{
    line-height: 30px !important;
}
.dd-select img {
    margin-top: 3px !important;
    margin-right: 25px !important;
    width: auto !important;
    height: auto !important;
    max-width: 42px !important;
    max-height: 25px !important;
}
.dd-container, .dd-options{
    max-width: 290px !important;
}
.selectBig{
    padding: 10px;
    width: 290px;
    height: 42px;
    border: 1px solid #777876;
    border-radius: 3px;
}
.intFormRow input[type="submit"], .intFormRow .resetBtn{
    display: inline-block;
    margin: 0 10px 0 0;
    padding: 5px 10px;
    width: 100px;
    height: 30px;
    font-size: 16px;
    font-weight: bold;
    color: #fff;
    text-align: center;
    border: 1px solid #222;
    border-radius: 3px;
    background: #222;
    text-transform: uppercase; 
}
.intFormRow input[type="submit"]:active{
    background: red;
}

.dsInline{
    display: inline-block;
    vertical-align: middle;
}
.dsInline img{
    vertical-align: middle;
}
.intTableCnt{
    padding: 10px 0 0;
}
.intTableCnt p{
    font-size: 17px;
    font-weight: bold;
    color: #ff0000;
}
.intFormRow .topupPre{
    margin: 0 5px 0 0;
}
.topupPre input[type="text"]{
    width: 52px;
    text-align: right;
    border: none;
    background: none;
    overflow: visible;
}



/* Rates page */
.ui-widget-header {
    padding-left: 10px;
    font-size: 14px;
    font-weight: bold;
    color: #000000;
    border: 1px solid #E78F08;
    border-radius: 4px 4px 4px 4px;
    background: #ff0000;
}
.fancybox-skin{
    background: #fff;
}
.fancybox-wrap .ui-widget-header{
    height: 35px;
    line-height: 35px;
}
.fancybox-opened .fancybox-title{
    display: none;
}
.ui-datepicker .ui-widget-header{
    height: auto;
    font-size: 13px;
    color: #222;
    line-height: 18px;
    border: 1px solid #aaa;
    background: #ccc;
}
.ui-datepicker .ui-datepicker-prev, .ui-datepicker .ui-datepicker-next{
    cursor: pointer;
}
.ui-draggable .ui-dialog-titlebar{
    border: 1px solid #e78f08;
    background: #ff0000;
}
.ui-dialog .ui-dialog-title{
    font-weight: bold;
    color: #000;
}
.ui-dialog .ui-dialog-content{
    height: auto !important;
}
.ui-dialog .ui-dialog-buttonpane{
    padding: 0 12px 12px;
    border: none;
}
.ui-dialog .ui-dialog-buttonpane button{
    margin: 0;
    padding: 2px;
    border: 1px solid #d3d3d3;
}
.ui-dialog .ui-dialog-buttonpane button:first-child{
    margin-right: 10px;
}

.rateCntMain{
    padding: 15px;
}
.rateLinks{
    float: left;
    width: 60%;
    padding: 40px 0 0;
}
.rateLinks a{
    display: inline-block;
    margin: 0 5px 0 0;
    font-size: 15px;
    color: #f00;
    font-weight:bold; 
}
.rateLinks a:hover{
    color: #f00;
}
.rateFormTop{
    float: left;
    width: 40%;
}
.rateFormTop h5{
    font-size: 12px;
    font-weight: bold;
    color: #fff;
}
.rateFormRow{
    margin: 0 0 5px;
}
.rateFormTop span{
    display: inline-block;
    margin: 0 5px 0 0;
    vertical-align: middle;
}
.rateFormTop span b{
    display: block;
    margin: 0 0 15px;
    font-weight: normal;
}
.rateFormTop span i{
    display: block;
    margin: -10px 0 0;
    font-style: normal;
}
.rateFormTop input[type="text"]{
    padding: 1px;
    min-width: 45px;
    font-size: 12px;
    font-weight: normal;
    color: #000000;
    border: 1px solid #dee0da;
    border-radius: 5px;
    box-shadow: none;
}
.rateFormTop select{
    padding: 2px;
    height: 25px;
    line-height: 25px;
    border: 1px solid #ddd;
}
.spanLoading{
    text-align: center;
}

.rateList{
    padding: 10px;
    max-height: 300px;
    overflow: auto; 
}
.rateList table{
    margin: 0;
    padding: 0;
    width: 100%;
    border: none;    
}
.rateList tr{
    cursor: pointer;
}
.rateList td{
    margin: 0;
    padding: 8px 10px;
    border-right: 1px solid #ccc;
    border-bottom: 1px solid #ccc;
    vertical-align: middle;
}
.rateList tr td:first-child{
    border-left: 1px solid #ccc;
}
.rateList .heading{
    padding: 10px;
    font-size: 12px;
    font-weight: bold;
    color: #ff0000;
    background: #ccc;
}
.rateList .heading td{
    background: #ccc;
}

/* New Registration page */
.newRegPg, .instructionPg, .recieptPg{
    color: #000000;
    background: #fff;
}
.newRegCnt, .instCnt{
    padding: 10px;
}
.refRow{
    margin: 0 0 25px;
}
.newRegCnt label{
    font-size: 12px;
}
input[type="text"].vsmInput {
    margin: 0;
    padding: 2px;
    width: 62px;
    font-size: 14px;
    color: #000000;
    border: 1px solid #777876;
    border-radius: 0;
    background: #fdfcfd;
}
select.vsmSelect{
    margin: 0;
    padding: 2px;
    height: auto;
    line-height: normal;
    font-size: 14px;
    color: #000;
    border: 1px solid #777876;
    border-radius: 0;
    background: #fdfcfd;
}

/* Instruction page*/
.accnoCntTop{
    padding: 15px;
    overflow: hidden;
}
.accnoCntTop .accnoLft{
    float: left;
}
.accnoCntTop .accnoRht{
    float: right;
}
.accnoCntTop b{
    font-weight: normal;
}
.accnoCnt select{
    margin: 0;
    padding: 5px;
    font-size: 12px;
    color: #000000;
    height: auto;
    line-height: normal;
    border: 1px solid #777876;
    border-radius: 0;
    background: #fdfcfd;
    width: 150px;
    vertical-align: middle;
}
.accnoList{
    max-height: 450px;
}

/* Receipt page */
.recieptCnt{
    padding: 10px 0;
}
.recieptCntTop{
    margin: 0 0 15px;
}
.recieptCntTop img{
    max-width: 200px;
}
.tblNormal{
    margin: 0 0 15px;
    color: #000;
    max-width: 700px;
    font-size: 12px;
    line-height: 20px;
    border: 1px solid #000;
}
.tblNormal td {
    padding: 10px;
}
.tblNormal .trError{
    /*background:#FEA798;*/
    color: #ff0000;
    
}
.printFormat{
    margin: 0 0 25px;
}
.tblNarrow {
    color: #000000;
    width: 160px;
    font-size: 10px;
    line-height: 15px;
    border: none;
}
.tblNarrow td{
    padding: 5px 0 5px 2px;
}
.tblNarrow .trError{
    /*background:#FEA798;*/
    color: #ff0000;
    
}

/* cssPrepayCnt */
.cssPrepayCnt{
    margin: -25px 0 10px;
    padding: 3px;
    border: 1px solid #ccc; 
}
h2.cssHeading{
    margin: 0 0 10px;
    padding: 8px 10px;
    font-family: Helvetica;
    font-size: 16px;
    line-height: 22px;
    font-weight: bold;
    color: #fff;
    background: #000;
}
.ccCntMain{
    padding: 5px;
}
.ccRowLft{
    float: left;
    padding: 2px 0 0;
    width: 120px;
}
.ccRowLftWide{
    float: left;
    padding: 2px 0 0;
    width: 200px;
}
.ccRow{
    margin: 0 0 15px;
    overflow: hidden;
}
.ccRowRht{
    float: left
}
.ccRowRht input[type="text"],.ccRowRht input[type="number"], .ccRowRht input[type="password"]{
    margin: 0;
    padding: 2px;
    width: 170px;
    font-size: 14px;
    color: #000000;
    border: 1px solid #777876;
    border-radius: 0;
    background: #fdfcfd;
}
.ccRowRht select{
    margin: 0;
    padding: 2px;
    width: 100px;
    font-size: 14px;
    color: #000000;
    border: 1px solid #777876;
    border-radius: 0;
    background: #fdfcfd;
}
.ccRowRht .error{
    display: block;
    margin: 5px 0 0;
}
.ccRowRht input.error,.ccRowRht select.error{
    display: block;
    margin: 0;
}
.ccRowRht input[type="submit"].redBtn, .ccRowRht input[type="button"].redBtn,.ccRowRht input[type="reset"].redBtn{
    margin-right: 6px;
}

/* promoBanner page */
.promoHdr{
    padding: 15px 0;  
    overflow: hidden;
}
.promoHdr .mainLogo{
    margin: 0;
    float: left;
    width: 200px;
    height: 90px;
    background-size: 200px auto;
}
.promoHdr .ui-widget-header{
    float: right;
    min-width: 500px;
    height: 35px;
    line-height: 33px;
}
.actPromoCnt{
    margin: 0 0 20px;
    overflow: hidden;
}
.actPromoCnt a{
    float: right;
    font-size:16px; 
    font-weight:bold;
}
.bannerPopupLink{
    display: block;
    font-size: 20px;
    padding: 10px;
    text-align: center;
    border: 5px solid #f00;
    background-color: #eee;
    overflow: hidden;
}
.clickMsg{
    float: right; 
    font-size: 10px;
    color: #000;
    text-align: right; 
}
.promoBanCnt .showcase-content-wrapper{
    margin: 10px 0 0;
    overflow: hidden;
}
.promoBanCnt .showcase-content-wrapper:first-child{
    margin: 0;
}

.fancybox-close{
    background: url("../images/iconSprite.png") no-repeat 0 -330px;
}


input[type=number]::-webkit-outer-spin-button,
input[type=number]::-webkit-inner-spin-button {
    -webkit-appearance: none;
    margin: 0;
}

input[type=number] {
    -moz-appearance:textfield;
}

#divStoreDet .ccRowLft{
    float: left;
    padding: 2px 0 0;
    width: 140px;
}

.blueText {color:#0000ff;}

.highyellow {background-color:#FFFF66;}

/* Responsive css */
@-ms-viewport{
    width: device-width;
}

@media (min-width: 768px) and (max-width: 979px){
    .container{
        width: 724px;
    }
    .header{
        /*height: 150px;*/
        height:auto;
    }
    .mainLogo{
        margin: 15px 0 0;
        width: 250px;
        height: 110px;
        background-size: 250px auto;
    }
    .langSelCnt{
        width: 100px;
    }
    .centerHdr{
        margin: 10px 0 0;
        width: 335px;
    }
    .centerHdr .storeName{
        padding: 0;
        font-size: 20px;
        line-height: 20px; 
    }
    .logoutLink {
        top: 95px;
        right: 47px;
    }
    .navWrap{
        margin: 0 0 25px;
    }
    .rhtCol{
        width: 230px;
    }
    .lftCol{
        padding: 0 20px 0 0;
        width: 420px;
        font-size: 14px;
    }

    /* added by Kiran to fix design issue with contact us and about us links */
    .navMenu li a{
        font-size: 10px;
        padding: 11px 5px;
     }

    /* Report page start here */
    .reportList, .reportList li:first-child div{
        font-size: 13px;
    }
    .reportCnt div.transactionDate{
        margin-right: 0; 
    }
    .reportCnt div.transactionDate:first-child{
        margin-right: 15px; 
    }
    .reportCntRow div.leftCnt{
        width: 240px;
    }
    .reportCntRow div.rightCnt{
        width: auto;
    }
    .reportCnt input[type="text"], .reportCnt input[type="password"]{
        width: 90px;
        font-size: 13px;
    }
    .trHeading .action{
        font-size: 12px;
    }
    .trHeading .action span{
        margin-left: -100px;
    }
    /* Report page ends here */

    /* account page */
    .ordTotal b{
        font-size: 16px;
    }
    .ordTotal input[type="button"]{
        font-size: 12px;
        font-weight: normal;
        text-transform: capitalize;
    }
    .rechFormTop b, .rechFormTop i{
        font-size: 17px;
    }
    .sinpinTabsList li a{
        padding: 8px 18px;
        font-weight: normal;
    }
    .intFormRow .looupBtn{
        clear: both;
        float: none;
        padding: 0;
        margin: 0px 0px 15px 0px;     
    }
    #international .intFormRow .amnt{
        padding: 10px 0 0;
    }
    .hotlineFormCnt div{
        min-width: 145px;
    }
    .hotlineFormCnt .error{
        font-size: 11px;
    }
    .hotlineFormCnt .addCnt {
        min-width: 30px;
    }
    .promoHdr .ui-widget-header{
        min-width: 350px;
    }
}


/* for responsive menu */
@media (max-width: 767px) {
    body{
        padding: 0 20px;
    }
    .container {
        width: auto;
    }
    .header{
        margin: 0 -20px 10px;
        height: auto;
    }
    .hdrCnt{
        overflow: hidden;
        border-bottom: 1px solid #ccc;
    }
    .mainLogo {
        margin: 3px 0 0 50px;
        width: 135px;
        height: 29px;
        background: url("../images/logo-mbl.png") no-repeat;
        background-size: auto 28px;
    }
    .langSelCnt{
        margin: 0 35px 0 0;
        width: auto;
    }
    .langList{
        margin: 3px 10px 0 0;
        padding: 2px;
        height: 24px; 
        line-height: 24px;
    }
    .centerHdr{
        display: none;   
    }
    .homePage .centerHdr{
        display: block;   
    }
    .centerHdr{
        float: none;
        margin: 10px 0 0;
        width: auto;
        padding: 0;
    }
    .centerHdr .storeName{
        padding: 0;
        font-size: 20px;
        line-height: 20px;
    }
    .centerHdr p:nth-child(3){
        margin: 0;
    }
    .logoutLink{
        top: 5px;
        right: 10px;
        width: 22px;
        height: 20px;
        background: url("../images/iconSprite.png") no-repeat 0 -285px;
        text-indent: -9999px;
        overflow: hidden;
    }
    .navWrap{
        height: 0;
        margin: 0;
    }
    .rhtCol, .lftCol{
        float: none;
        width: auto;
    }
    .rhtCol{
        margin: 0 0 20px;
    }
    .lftCol{
        padding: 0;
        font-size: 13px;
    }
    .inputBox input[type="text"], .inputBox input[type="password"]{
        padding: 0 5px;
    }
    .lftCol .imgBox{
        display: none;
    }
    .navMenuBody {
        position: absolute
    }
    .respBtn {
        position: absolute;
        display: block;
        left: 0;
        top: 0;
        padding: 5px 12px;
        background: #d1d1d1;
        z-index: 1000;
    }
    .icon-bar {
        margin: 4px 0;
        display: block;
        width: 18px;
        height: 2px;
        border-radius: 1px;
        background: #999595 none;
        box-shadow: 0 1px 0 rgba(0, 0, 0, 0.25);
        -webkit-transform: rotate(0);
        -ms-transform: rotate(0);
        transform: rotate(0);
        -webkit-transition: -webkit-transform 80ms ease-out;
        transition: transform 80ms ease-out;
    }
    .actMenuBody .icon-bar {
        background: none;
        box-shadow: none;
    }
    .actMenuBody .icon-bar:first-child, 
    .actMenuBody .icon-bar:last-child {
        background: #999595;
        position: relative;
        z-index: 1;
    }
    .actMenuBody .icon-bar:first-child {
        top: 0.5em;
        -webkit-transform: rotate(-45deg);
        -ms-transform: rotate(-45deg);
        transform: rotate(-45deg);
    }
    .actMenuBody .icon-bar:last-child {
        top: -0.5em;
        -webkit-transform: rotate(45deg);
        -ms-transform: rotate(45deg);
        transform: rotate(45deg);
    }
    .navMenu {
        position: fixed;
        top: 0;
        left: -260px;
        height: 100%;
        width: 260px;
        color: #333;
        background: #f4f4f4;
        box-shadow: -12px 0 8px -8px rgba(0, 0, 0, 0.25) inset;
        overflow-y: auto;
        z-index: 999999;
    }
    .navMenu li {
        float: none;
        margin: 0;
    }
    .navMenu li a {
        display:block;
        padding: 10px;
        font-size: 15px;
        font-weight: normal;
        color: #333;
        text-transform: capitalize;
        border-bottom:1px solid #ccc;
    }
    .navMenu li a:hover {
        color: #000;
    }
    .navMenu li a.current {
        color: #900;
    }
    .subnav ul{
        display: block;
        position: static;
        width: auto;
        background: rgba(0, 0, 0, 0.075);
    }
    .subnav li, .navMenu li a{
        float: none;
        width: auto;
    }
    .subnav li:last-child a{
        border: none;
    }
    .subnav li a{
        border-color: #ccc;
    }

    /* menu */
    body{
        position: relative;
    }
    .actMenuBody{
        /*left: 260px;*/
        overflow: hidden;
    }
    .navMenuOpen{
        /*left: 0;*/
    }


    .mainCnt{
        margin-bottom: 30px;
    }
    .footer .ipCnt{
        margin-bottom: 15px;
        text-align: center;
    }

    /* Report page */
    .reportCnt{
        margin: 0 0 10px;
        padding: 10px 0;
        border: none;
    }
    .reportCnt div.button, .reportCntMain{
        /*display: none !important;*/   
    }
    .reportBtnCnt, .reportDateCnt{
        float: none;
        margin: 0;
        overflow: hidden;
    }
    .reportBtnCnt{
        margin: 0 0 15px;
    }
    .reportCnt div.button, .reportCnt div.button1{
        margin-top: 0;
    }
    .reportCnt div.transactionDate{
        margin: 0;
    }
    .reportCnt div.transactionDate:first-child{
        margin: 0 15px 0 0;
    }
    .reportCntRow{
        padding: 5px;
        overflow: hidden;
        border:1px solid #ccc;
    }
    .reportCntRow:nth-of-type(1) {
        background: #f1f1f1;
        border-bottom:0px;
    }
    .reportCntRow:nth-of-type(2) {
        background: #fff;
        border-bottom:0px;
    }
    .reportCntRow:nth-of-type(3) {
        background: #f1f1f1;
    }
    .reportCntRow div.leftCnt {
        width: 50%;
        float: left;
    }
    .reportCntRow div.rightCnt {
        width: 50%;
        float: left;
    }
    .reportCnt span{
        margin-bottom: 10px;
        width: 100%;
    }
    .reportCnt span:last-child{
        margin: 0;
        padding: 5px 0 0;
    }
    .reportFromList span{
        width: auto;
        margin: 17px 10px 0 0;
    }
    .reportFromList select{
        width: 160px;
    }
    .reportList{
        margin-top:20px;
        font-size: 12px;
        border: 1px solid #ccc;
        background: none;
    }
    .reportList li:first-child{
        display: none;
    }
    .reportList ul, .reportList li, .reportList li div{
        display: block;
    }
    .reportList li{
        border-bottom: 1px solid #ccc;
    }
    .reportList li:last-child{
        border: none;
    }
    .reportList li:nth-of-type(even){
        background: #f2f2f2;
    }
    .reportList li .date {
        width:100%;
        border-left: 0px solid #ccc; 
    }
    .reportList li div, 
    .reportList li .number,
    .reportList .retSale{
        width: 100%;
        text-align: left;
        position: relative;
        padding-left: 50%;
        box-sizing: border-box;
        border: none;
        border-bottom: 1px solid rgba(0,0,0,.075);
    }
    .reportList li .cost {
        width: auto; 
    }
    .reportList li div:last-child{
        border: none;
    }
    .reportList li div:before {
        position: absolute;
        top: 6px;
        left: 6px;
        padding-right: 10px;
        width: 45%;
        color: #222;
        white-space: nowrap;
    }


    .reportList li.trHeading .number,
    .reportList li.trHeading .date,
    .reportList li.trHeading .role,
    .reportList li.trHeading .active,
    .reportList li.trHeading .destination    
    {
        display: none;
    }
    .reportList li.trHeading .action{
        font-weight: bold;
    }
    .reportList li.trHeading div{
        font-weight: normal;
    }
    .reportList li.trHeading div:nth-of-type(5):before {
        content: "";
    }
    .reportCnt div.leftCnt{
        width:40%;
    }
    .reportCnt div.rightCnt{
        width:60%;
    }
    .reportList li{
        display: none;
    }
    .reportList li .number, 
    .reportList li .role, 
    .reportList li .cost,
    .reportList li .profit{
        display: none !important;
    }
    .reportList li:nth-child(2), 
    .reportList li:nth-last-of-type(2),
    .reportList li:nth-last-of-type(3),
    .reportList li:nth-last-of-type(4),
    .reportList li:nth-last-of-type(5),
    .reportList li:nth-last-of-type(6){
        display: block;
    }

    .reportList li:first-child{
        display: none;
    } 
    /* Report page ends here */


    /* user manage page */
    .userCnt{
        margin: 0 -20px;
        padding: 5px 10px 0;
        border: none;
    }
    .agentCnt{
        margin: 0 0 10px;
        border: none;
    }
    .agentCnt span{
        margin-bottom: 10px;
        width: 100%;
    }
    .agentCnt span:last-child{
        margin: 0;
        padding: 5px 0 0;
    }
    .agentCnt input[type="submit"]{
        margin: 0;
    }
    .agentCnt input[type="text"], .agentCnt input[type="password"], .agentCnt select{
        width: 60%;
        height: 25px;
        -webkit-box-sizing: border-box;
        -moz-box-sizing: border-box;
        box-sizing: border-box;
    }
    .agentCnt select{
        padding-top: 3px;
    }
    .agentList{
        border: 1px solid #ccc;
        background: none;
        font-size: 13px;
    }
    .agentList li:first-child{
        display: none;
    }
    .agentList ul, .agentList li, .agentList li div{
        display: block;
    }
    .agentList li{
        border-bottom: 1px solid #ccc;
    }
    .agentList li:last-child{
        border: none;
    }
    .agentList li:nth-of-type(even){
        background: #f4f4f4;
    }
    .agentList li div, .agentList li .login{
        width: 100%;
        text-align: left;
        position: relative;
        padding-left: 50%;
        box-sizing: border-box;
        border: none;
        border-bottom: 1px solid rgba(0,0,0,.075);
    }
    .agentList li div:last-child{
        border: none;
    }
    .agentList li div:before {
        position: absolute;
        top: 6px;
        left: 6px;
        padding-right: 10px;
        width: 45%;
        color: #000;
        white-space: nowrap;
    }

    .icon-edit{
        background-position: 0 -25px;
    }
    .pass input[type="password"], .role select{
        width: 100%;
    }

    /* Rates page */
    .fancybox-wrap{
        /*margin: 0 -10px;*/
    }
    .fancybox-close{
        margin: 5px 0 0;
    }
    .rateCntMain{
        padding: 10px 10px 0;
    }
    .rateLinks{
        float: none;
        margin: 0 0 15px;
        padding: 0;
        width: 100%;
    }
    .rateFormTop span b{
        margin: 0 0 10px;
    }
    .rateFormTop{
        float: none;
        width: 100%;
    }
    .rateList{
        max-height: none;
    }
    .rateFormTop span{
        margin: 0 5px 5px 0;
    }

    /* account page */
    .acountCnt{
        margin: 0 -10px;
    }
    .orderBox{
        margin: 0 0 10px;
        padding: 0;
    }
    .orderBox .mainHeading{
        position: relative;
        margin: 0;
        padding: 5px 5px 5px 10px;
        height: auto;
        font-family: Helvetica;
        font-size: 15px;
        line-height: 20px;
        font-weight: normal;
        color: #343434;
        border-bottom: 1px solid #d1d1d1;
        background: #f5f5f5;
        cursor: pointer;
    }
    .orderBox .mainHeading i{
        display: inline-block;
        font-size: 13px;
        font-style: normal;
    }
    .orderBox .mainHeading span{
        display: block;
        position: absolute;
        top: 9px;
        right: 15px;
    }
    .orderBox .actHeading{
        border-bottom: none;
    }
    .hideShowOrder{
        padding: 0;
        height: 0;
        border: none;
        overflow: hidden;
    }
    .ordleft, .ordRht{
        float: none;
        width: auto;
        overflow: hidden;
    }
    .ordleft{
        margin: 0 0 10px;
    }
    .ordTable{
        width: 70%;
    }
    .orderMain .ordleft span{
        width: auto;
        margin: 0 15px 0 0;
    }
    .orderMain .ordleft .del{
        min-width: 20px;
    }
    .ordleft b{
        text-transform: capitalize;
    }
    .ordRht{
        max-width: 320px;
    }
    .ordTotal input[type="button"]{
        font-size: 12px;
        text-transform: capitalize;
    }
    .ordAmnt b, .ordTotal b{
        font-size: 15px;
    }
    .sinpinCnt{
        padding: 0;
        border: none;
    }
    .rechForm{
        margin: 0;
        padding: 0;
        border: none;
    }
    .rechFormTop{
        border: 1px solid #d1d1d1;
        background: none;
    }
    .rechFormTop span{
        padding: 5px 0 2px;
        background: #f5f5f5;
    }
    .rechFormTop b, .rechFormTop i{
        padding: 0 0 5px;
        font-size: 12px;
        font-weight: normal;
        color: #333;
        text-align: center;
        border: none;
        border-left: 1px solid #ddd;
        background: none;
    }
    .rechFormTop b{
        font-size: 14px;
        color: #111;   
    }
    .rechFormTop span:first-child b, .rechFormTop span:first-child b+i {
        border-left: none;
    }
    .enterAmt{
        padding: 10px 0 15px;
    }
    .entAmtLft, .entAmtRht{
        float: none;
        width: auto;
    }
    .heading2{
        font-size: 20px;
        line-height: 24px;
    }
    .entAmtLft .heading2{
        font-size: 18px;
        line-height: 22px;
    }
    .entAmtLft .error{
        height: auto;
    }
    .entAmtLft .amtBox{
        padding-top: 5px;
    }
    .dollorSign {
        margin-top: 5px;
        font-size: 35px;
        line-height: 35px;
    }
    .entAmtRht{
        padding: 15px 0 0;
    }
    .amtBox input[type="text"], input.grayInputBig[type="text"]{
        margin: 0 10px 0 0;
        width: 80px;
        height: 30px;
        font-size: 25px;
    }
    .amtBox input[type="image"]{
        width: 30px;
        height: 30px;
    }
    .amtBox .icon-add, .amtBox .icon-closeBtn{
        margin: 4px 0 0 0;
        width: 30px;
        height: 30px;
        background-size: 30px auto;
        background-position: 0 -62px;
    }
    .amtBox .icon-closeBtn{
        background-position: 0 -93px;
    }
    .amtBox table{
      width:70%
    }
    .tableGray {
        margin: 0;
    }
    .tableGray td, .entAmtRht label{
        margin-bottom: 0;
        font-size: 12px;
        color: #333;
    }
    .sinpinTabsList{
        border: none;
    }
    .sinpinTabsList li{
        margin: 0;
        width: 50%;
        border-left: 1px solid #aaa;
        border-bottom: 1px solid #aaa;
        -webkit-box-sizing: border-box;
        -moz-box-sizing: border-box;
        box-sizing: border-box;
    }
    .sinpinTabsList li:nth-child(odd){
        border-left: none;
    }
    .sinpinTabsList li a{
        padding: 8px 5px;
    }
    .tableCntWrap{
        height: auto;
        overflow: visible;
    }
    .hotlinesTable .heading td{
        font-size: 12px;
        font-weight: normal;
    }
    .hotlineFormCnt div{
        margin: 0 0 10px;
        width: 50%;
        min-height: 10px;
        min-width: 0;
        -moz-box-sizing: border-box;
        -webkit-box-sizing: border-box;
        box-sizing: border-box;
    }
    .hotlineFormCnt .error{
        margin: 0;
    }
    .hotlineFormCnt .entName{
        margin: 0 0 10px;
    }
    .hotlineFormCnt input[type="text"]{
        width: 175px;
    }
    .hotlineFormCnt select.smSelect{
        width: 190px;
    }
    .hotlineFormCnt .addCnt{
        margin: 0;
        height: auto;
    }
    .hotlineFormCnt .addCnt b{
        display: none;
    }

    .hotlinesTable .tableCnt{
        border: 1px solid #d1d1d1;
    }
    .hotlinesTable tr.heading{
        display: none;
    }
    .hotlinesTable tr{
        border-bottom: 1px solid #ccc;
    }
    .hotlinesTable tr td{
        display: block;
    }
    .hotlinesTable tr:last-child td:last-child{
        border: none;
    }
    .hotlinesTable tr:nth-of-type(even){
        background: #f2f2f2;
    }
    .hotlinesTable tr td{
        width: 100%;
        text-align: left;
        position: relative;
        padding-left: 50%;
        box-sizing: border-box;
        border: none;
        border-bottom: 1px solid rgba(0,0,0,.075);
    }
    .hotlinesTable tr td:before {
        position: absolute;
        /*top: 6px;*/
        left: 6px;
        padding-right: 10px;
        width: 45%;
        color: #000;
        white-space: nowrap;
    }
    .hotlinesTable tr td:first-child{
        border-left: none;
    }

    .hotlinesTable select.smSelect,.hotlinesTable input.smInput{
        width: 100%;
        height: 24px;
        -webkit-box-sizing: border-box;
        -moz-box-sizing: border-box;
        box-sizing: border-box;
    }

    /*added by Kiran - for topup hostory nicknames*/
    .intTable .tableCnt{
        border: 1px solid #d1d1d1;
    }
    .intTable tr.heading{
        display: none;
    }
    .intTable tr{
        border-bottom: 1px solid #ccc;
    }
    .intTable tr td{
        display: block;
    }
    .intTable tr:last-child td:last-child{
        border: none;
    }
    .intTable tr:nth-of-type(even){
        background: #f2f2f2;
    }
    .intTable tr td{
        width: 100%;
        word-break: break-all; 
        text-align: left;
        position: relative;
        padding-left: 50%;
        box-sizing: border-box;
        border: none;
        border-bottom: 1px solid rgba(0,0,0,.075);
    }
    .intTable tr td:before {
        position: absolute;
        /*top: 6px;*/
        left: 6px;
        padding-right: 10px;
        width: 45%;
        color: #000;
        white-space: nowrap;
    }
    .intTable tr td:first-child{
        border-left: none;
    }
    .intTable tr td.logo{
        height:40px;
    }
    
    .intTable select.smSelect,.intTable input.smInput{
        width: 100%;
        height: 24px;
        -webkit-box-sizing: border-box;
        -moz-box-sizing: border-box;
        box-sizing: border-box;
    }
    
    .intTable .icon-close {margin-left:20px;} 
    /*end*/

    .speedDialTable .tableCnt{
        border: 1px solid #d1d1d1;
    }
    .speedDialTable tr.heading{
        display: none;
    }
    .speedDialTable tr{
        border-bottom: 1px solid #ccc;
    }
    .speedDialTable tr td{
        display: block;
    }
    .speedDialTable tr:last-child td:last-child{
        border: none;
    }
    .speedDialTable tr:nth-of-type(even){
        background: #f2f2f2;
    }
    .speedDialTable tr td{
        width: 100%;
        text-align: left;
        position: relative;
        padding-left: 50%;
        box-sizing: border-box;
        border: none;
        border-bottom: 1px solid rgba(0,0,0,.075);
    }
    .speedDialTable tr td:before {
        position: absolute;
        /*top: 6px;*/
        left: 6px;
        padding-right: 10px;
        width: 45%;
        color: #000;
        white-space: nowrap;
    }
    .speedDialTable tr td:first-child{
        border-left: none;
    }
    .speedDialTable input.smInput{
        width: 100%;
        height: 24px;
        -webkit-box-sizing: border-box;
        -moz-box-sizing: border-box;
        box-sizing: border-box;
    }
    .intPopupTop .errorBigFont{
        margin: 0 0 10px;
        font-size: 12px;
    }
    .intFormRow{
        margin: 0 0 10px;
    }
    .intFormRow .rowcol{
        float: none;
        margin: 0 0 5px;
    }
    .intFormRow .country{
        margin: 0 0 15px;
    }
    .intFormRow div b{
        font-size: 14px;
    }
    .intFormRow input[type="text"],.intFormRow input[type="number"]{
        padding: 5px;
        width: 250px;
        height: 20px;
        font-size: 14px;
    }
    .topupMob .error{
        height: auto;
    }
    .intFormRow .looupBtn{
        margin: 0;
        padding: 10px 0 0; 
    }
    .dd-select{
        max-width: 274px !important;
        max-height: 50px !important;
    }
    .dd-container, .dd-options{
        max-width: 274px !important;
    }
    .selectBig{
        margin: 0;
        padding: 5px 10px;
        width: 276px;
        height: 33px;
        line-height: 32px;
    }
    .intFormRow .amnt{
        /*margin: 0;*/
    }
    .intTableCnt p{
        font-family: Helvetica;
        font-size: 14px;
    }
    #usa .custPhoneNo, #usa .looupBtn{
        clear: both;
    }
    .intFormRow .topupPre, .topupMob{
        float: left;
    }
    .topupPre input[type="text"]{
		width: 52px;
		text-align: right;
		border: none;
		background: none;
		overflow: visible;
	}
    .topupMob  input[type="text"]{
        width: 200px;
    }
    #usa .country .dsInline{
        display: inline;
    }

    .receiptRow .grayBtn, .receiptRow input.grayBtn[type="button"]{
        padding: 5px 15px;
    }
    .cssPrepayCnt{
        margin: 0;
    }
    .promoHdr{
        margin: 0 -10px;
    }
    .promoHdr .mainLogo{
        width: 135px;
        height: 29px;
        background-size: auto 28px;
    }
    .promoHdr .ui-widget-header{
        padding: 0 10px;
        min-width: 100px;
        font-size: 12px;
        font-weight: normal;
    }
    .bannerPopupLink{
        padding: 6px;
        font-size: 15px;
        border-width: 3px;
    }
    .bannerPopupLink span{
        display: block;
    }
    .clickMsg{
        float: none;
        margin: 2px 0 0;
        text-align: center;
    }
    
    /* Report page */
    .reportList li div:nth-of-type(1):before, 
    .reportList li div:nth-of-type(2):before, 
    .reportList li div:nth-of-type(3):before, 
    .reportList li div:nth-of-type(4):before, 
    .reportList li div:nth-of-type(5):before, 
    .reportList li div:nth-of-type(6):before, 
    .reportList li div:nth-of-type(7):before, 
    .reportList li div:nth-of-type(8):before,

    /* User manage page (Agent List) */
    .agentList li div:nth-of-type(1):before,
    .agentList li div:nth-of-type(2):before,
    .agentList li div:nth-of-type(3):before, 
    .agentList li div:nth-of-type(4):before, 
    .agentList li div:nth-of-type(5):before,
    .agentList li div:nth-of-type(6):before,
   
    /* Account page : Hotline numbers */
    .hotlinesTable tr td:nth-of-type(1):before,
    .hotlinesTable tr td:nth-of-type(2):before,
    .hotlinesTable tr td:nth-of-type(3):before,
    .hotlinesTable tr td:nth-of-type(4):before,
    .hotlinesTable tr td:nth-of-type(5):before,
    .hotlinesTable tr td:nth-of-type(6):before,
    
    /* Account page: Speed dialing */
    .speedDialTable tr td:nth-of-type(1):before, 
    .speedDialTable tr td:nth-of-type(2):before, 
    .speedDialTable tr td:nth-of-type(3):before, 
    .speedDialTable tr td:nth-of-type(4):before{
        content: attr(data-content); 
    }

    /* International topups : topup history */
    .intTable tr td:nth-of-type(1):before,
    .intTable tr td:nth-of-type(2):before,
    .intTable tr td:nth-of-type(3):before,
    .intTable tr td:nth-of-type(4):before,
    .intTable tr td:nth-of-type(5):before{
    
        content: attr(data-content);
    }
}



@media (max-width: 600px){
    .reportCnt div.button1 {
        float: none;
        width: auto;
        overflow: hidden;
    }
    .reportCnt div.transactionDate {
        float: none;
        width: auto;
        margin: 20px 0 0;
    }
    .reportCnt .transactionDate:nth-child(2) span{
        margin-right: 28px;
    }
    .ordTable{
        width: 80%;
    }
}

@media (max-width: 480px){
    .agentCnt input[type="text"], .agentCnt input[type="password"], .agentCnt select{
        width: 100%;
    }

    /*Home Page CSS Start*/
    .Ph_num_Cnt {
        /*margin: 10px auto 0;*/
    }
    .mainTitle {
        height: 40px;
        padding: 10px 0 0 8px;
    }
    .phoneNoWrap{
        padding: 20px 12px;
    }
    .phoneNoWrap p.error{
        font-size: 14px;
    }
    input#txtPhoneNumber{
        height: 60px;
        font-size: 30px;
    }
    .phoneNoWrap .error{
        font-size: 14px;
    }
    /*Home Page CSS End*/

    /* account page */
    .tablist{
        border: none;
        border: 1px solid #d1d1d1;
    }
    .tablist li{
        margin: 0;
        width: 33.33%;
        border-left: 1px solid #d1d1d1;
        border-bottom: none;
        /*background: #f5f5f5;*/
        -webkit-box-sizing: border-box;
        -moz-box-sizing: border-box;
        box-sizing: border-box;
        vertical-align: middle;
    }
    .tablist li:nth-child(2){
        border-right: none;
    }
    .tablist li.active{
        border: none;
        background: #ec1824;
    }
    .tablist li a{
        padding: 5px;
        height: 40px;
        color: #333;
        line-height: 20px;
        font-size: 13px;
        font-weight: bold;
        text-align: center;
    }
    .tablist li.active a{
        color: #f4f4f4;
    }
    .sinpinTabsList li{
        width: 100%;
        border: none;
        border-bottom: 1px solid #aaa;
    }
    .histFormCnt span{
        display: block;
        margin: 0 0 10px;
    }
    .histFormCnt span:nth-child(2){
        margin: 0 0 15px 16px;
    }
    .histFormCnt input[type="text"]{
        width: 150px;
    }
    .histFormCnt input[type="button"]{
        margin: 0 0 0 42px;
    }
    .grayBtn, input.grayBtn[type="button"]{
        padding: 5px 20px;
        font-size: 12px;
    }
    .tableCnt td, .tableCnt .heading td{
        font-size: 11px;
    }
    .hotlineFormCnt div{
        width: 100%;
    }
    .speedDialForm .speedName{
        clear: left;
    }
    .speedDialForm .speedName, .speedDialForm .speedAdd{
        margin-top: 10px;
    }

    /* New registration page */
    .newRegCnt{
        padding-bottom: 0
    }
    .newRegCnt, .newRegCnt label{
        font-size: 11px;
    }
    .newRegPg .ui-widget-header{
        padding: 5px;
        height: auto;
        font-size: 13px;
        line-height: 20px;
    }
    .newRegPg select.vsmSelect{
        display: block;
        margin: 5px 0 0;
    }
    .accnoList{
        font-size: 11px;
    }
    .accnoCntTop b{
        display: block;
        margin: 0 0 3px;
    }
    .accnoCntTop .accnoRht{
        padding-top: 15px;
    }
    .receiptRow .grayBtn, .receiptRow input.grayBtn[type="button"]{
        margin-bottom: 10px;
    }
    .ordTable{
        width: 100%;
    }
    .orderMain .ordleft span {
        font-size: 11px;
    }
    .recieptCntTop img {
        max-width: 80px;
    }
    
    .tblNormal{
        font-size: 11px;
        line-height: 18px;
    }
    .tblNormal td{
        padding: 5px;
    }
    .receiptRow .grayBtn, .receiptRow input.grayBtn[type="button"]{
        margin: 0 0 10px 6px;
        padding: 5px 8px;
        width: auto;
        font-size: 11px;
    }
    .receiptRow .grayBtn:first-child{
        margin-left: 0;
    }


}

@media (min-width: 320px) and (max-width: 479px){
    /*Home Page CSS Start*/
    .mainTitle {
        font-size:15px;
        height: 39px;
        padding: 11px 0 0 8px;
    }
    /*Home Page CSS End*/
    
}

@media (min-width: 320px) and (max-width: 400px){
    .langSelCnt {
        margin: 0 24px 0 0;
    }
    .logoutLink{
        right: 5px;
    }
    /* account page */
    .orderMain .ordleft span{
        margin: 0 10px 0 0;
    }
    .orderMain .ordleft .product{
        max-width: 80px;
    }
    .ccRow{
        margin: 0 0 10px;
    }
    .ccRowLft, .ccRowRht,.ccRowLftWide{
        float: none;
        width: auto;
        display: block;
    }
    .ccRowLft,.ccRowLftWide{
        margin: 0 0 5px;
        padding: 0;
    }
    .ccRowRht input[type="text"], .ccRowRht input[type="number"], .ccRowRht input[type="password"]{
        width: 100%;
        height: 26px;
        -webkit-box-sizing: border-box;
        -moz-box-sizing: border-box;
        box-sizing: border-box;
    }
    .ccCntMain .ccRow:last-child .ccRowLft{
        display: none;
    }
    .csAfterSubmit .ccRowLft, .csAfterSubmit .ccRowRht{
        display: inline-block;
    }
    .csAfterSubmit .ccRowLft{
        margin-right: 15px;
        min-width: 80px;
    }
    .ccRowRht input.redBtn[type="submit"], .ccRowRht input.redBtn[type="button"] {
        margin-top: 5px;
    }

    .buttonContainer .buttonSubmit, .buttonContainer .buttonTopup{
        font-size: 12px;
        min-width: 60px; 
        padding:0;
        height:25px; 
        margin-right: 5px;
    }
    .centerHdr 
    {
        font-size:10px;
    }

    .centerHdr span.name{
        margin: 0 10px 0 0;
    }

}
@media (max-width: 320px){

    .buttonContainer .buttonSubmit, .buttonContainer .buttonTopup{
        font-size: 12px;
        min-width: 55px; 
        padding:0;
        height:25px;   
        margin-right: 0;
    }
    
    .centerHdr 
    {
        font-size:10px;
    }

    .centerHdr span.name{
        margin: 0 10px 0 0;
    }
}

@media  
only screen and (-webkit-min-device-pixel-ratio: 2),  
only screen and ( min--moz-device-pixel-ratio: 2),  
only screen and ( -o-min-device-pixel-ratio: 2/1),  
only screen and ( min-device-pixel-ratio: 2),  
only screen and ( min-resolution: 192dpi),  
only screen and ( min-resolution: 2dppx){


}  



/* browsers outline */
a, a:focus, *:focus{ 
    outline: 0; 
}
button::-moz-focus-inner, input[type="submit"]::-moz-focus-inner, input[type="button"]::-moz-focus-inner{ 
    border : 0px;
} 
input[type="submit"]:focus,input[type="button"]:focus{ 
    outline : 0;
}
input[type="text"]:focus, input[type="number"]:focus, a:focus, a:active{
    outline: 0;
    outline: thin dotted transparent \9;
}

/* placeholder */
input:-moz-placeholder, textarea:-moz-placeholder{
    color: #222;
}
input::-webkit-input-placeholder, textarea::-moz-placeholder{
    color: #222;
}
.placeholder{
    color: #333;
}

input::-webkit-outer-spin-button,
input::-webkit-inner-spin-button{
    -webkit-appearance: none;
}
.redTextHeader {
    color: #f00;
    font-size: 15px;
    text-transform: none;
}

/* 
* Added alert for unlimited prodict info on selection of drop down
*Author:  Ariel Jan 23rd 2020
*
* alert message box 
*/
.div4unlbg {
    background-color: #cccccc;
}
.alert {
  padding: 1px;
  background-color: white; 
  color: blue;
  margin-bottom: 1px;
  font-size: 10px;
}

.ccalert {
  padding: 10px;
  background-color: #b3d9ff; /* Red */
  color: black;
  margin-bottom: 10px;
}

/* The close button */
.closebtn {
  margin-left: 1px;
  color: blue;
  font-weight: bold;
  float: right;
  font-size: 2px;
  line-height: 10px;
  cursor: pointer;
  transition: 0.3s;
}

/* When moving the mouse over the close button */
.closebtn:hover {
  color: black;
}


mark {
  background: yellow;
  color: blue;
}

.textmoreinfo {
  color: white;
  font-size: 1em;
  font-family: "Arial Black", Gadget, sans-serif;
  font-style: normal;
  background-color: blue;
  letter-spacing: 5px;
  text-decoration: underline;
}

.underlineme {
  @include underline(1.15em, 0.04em, $uline, blue);
}

/* 
.pgWrapper {
    margin-left: 140px;
}
 */

.sidenav {
  height: 100%;
  width: 140px;
  margin-top: 80px;
  position: fixed;
  z-index: 1;
  top: 0;
  left: 0;
  /*background-color: #9b9b9b;*/
  overflow-x: hidden;
  transition: 0.5s;
  padding-top: 60px;
}


/*.sidenav a {*/
/*  padding: 8px 8px 8px 32px;*/
/*  text-decoration: none;*/
/*  font-size: 25px;*/
  /*color: #818181;*/
/*  display: block;*/
/*  transition: 0.3s;*/
/*}*/

/*.sidenav a:hover {*/
/*  color: #f1f1f1;*/
/*}*/

/*.sidenav .closebtn {*/
/*  position: absolute;*/
/*  top: 0;*/
/*  right: 25px;*/
/*  font-size: 36px;*/
/*  margin-left: 50px;*/
/*}*/

@media screen and (max-height: 450px) {
  .sidenav {padding-top: 15px;}
  .sidenav a {font-size: 18px;}
}

/*Menu*/
/**{*/
    /*margin: 0;*/
    /*padding: 0;*/
    /*font-family: 'lato';*/
    /*list-style: none;*/
    /*text-decoration: none;*/
/*}*/
/*body{*/
/*    background-color: #fcdc29;*/
/*}*/

.mwrapper{
    position: absolute;
    /*top: 50%;*/
    /*left: 50%;*/
    /*transform: translate(-50%, -50%);*/
    /*background-color: #1111;*/
  
    margin: 0;
    padding: 0;
    font-family: 'lato';
    list-style: none;
    text-decoration: none;
    
     width: 140px;
    
}
.mmainMenu{
    width: 140px;
    display: block;
    border-radius: 10px;
    overflow: hidden;
    
    margin: 0;
    padding: 0;
    font-family: 'lato';
    list-style: none;
    text-decoration: none;
    

    

}
.mitem{
    /*border-top: 1px solid #ef584a;*/
    overflow: hidden;
    
    /*margin: 0;*/
    /*padding: 0;*/
    /*font-family: 'lato';*/
    /*list-style: none;*/
    /*text-decoration: none;*/
    
             font-size: 16px;   

    
}
.mbtn{
    display: block;
    padding: 15px 20px;
    background-color: #b4b4b4;
    color: #fff;
    position: relative;
    


}
.mbtn:before{
    content: '';
    position: absolute;
    width: 0;
    height: 0;
    border-left: 8px solid transparent;
    border-right:8px solid transparent;
    border-top:10px solid #ff1d1d;
    right: 15px;
    bottom: -10px;
    z-index: 9;
    
    /*    margin: 0;*/
    /*padding: 0;*/
    /*font-family: 'lato';*/
    /*list-style: none;*/
    /*text-decoration: none;*/

    
}
.mbtn i {
    margin-right: 10px;
        margin: 0;
    padding: 0;
    font-family: 'lato';
    list-style: none;
    text-decoration: none;

}
.msubMenu{
    background: #8e8e8e;
    overflow: hidden;
    transition: max-height 0.7s;
    max-height: 0;
       
    /*    margin: 0;*/
    /*padding: 0;*/
    /*font-family: 'lato';*/
    /*list-style: none;*/
    /*text-decoration: none;*/

}
.msubMenu a{
    display: block;
    padding: 15px 20px;
    color: #fff;
    font-size: 14px;
    border-bottom: 1px solid #394c7f;
    position: relative;
    
    
    
}
.msubMenu a:before{
    content: '';
    opacity: 0;
    transition: opacity 0.3s;

}
.msubMenu a:hover:before{
    content: '';
    position: absolute;
    height: 0;
    width: 6px;
    left: 0;
    top:0;
    opacity: 1;
    /* background-color: #d8d824; */
    border-top: 24px solid transparent;
    border-left: 11px solid #ff1d1d;
    border-bottom: 24px solid transparent;
}
.msubMenu a:after{
    content: '';
    opacity: 0;
    transition: opacity 0.3s;

}
.msubMenu a:hover:after{
    content: '';
    position: absolute;
    height: 0;
    width: 6px;
    right: 0px;
    top:0;
    opacity: 1;
    /* background-color: #d8d824; */
    border-top: 24px solid transparent;
    border-right: 11px solid #ff1d1d;
    border-bottom: 24px solid transparent;
}
.msubMenu a:hover{
    background: #171d34;
    background: -moz-linear-gradient(top, #273057 0%, #273057 50%, #394c7f 51%, #394c7f 100%);
    background: -webkit-linear-gradient(top, #273057 0%,#273057 50%,#394c7f 51%,#394c7f 100%);
    background: linear-gradient(to bottom, #273057 0%,#273057 50%,#394c7f 51%,#394c7f 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#273057', endColorstr='#394c7f',GradientType=0 );
    transition: all 0.3s;
    border-bottom: 1px solid ##1f2746;
    /*#394c7f;*/
}
.msubMenu a:last-child{
    border:none;
}
.mitem:target .msubMenu{
    max-height: 50em;
}

.selectBigNew{
/*     padding: 5px 5px; */
    width: 	200px;
    height: 42px;
/* 
    border: 1px solid #777876;
    border-radius: 3px;
 */
}

input[id="txtGlobalTopEmail"] {
/*   min-height: 27px;  */
/*   height: 39px; */
  width: 250px  !important;
}