@font-face {font-family:'jura';src: url('Jura.ttf');}
@font-face {font-family:'rupee';src: url('Rupee_Foradian.ttf');}

body{font-family:'Calibri', sans-serif;font-size:12px;height:100%;padding:0 0 35px;margin:0;background:#f6f6ff url('../images/bg.png') repeat-y left top;}
body.login{background:#f60;color:#fff;text-align:center;border-top:solid 10px rgba(0,0,0,0.3);}
body.index{background-position:left top}
input,select,textarea{font-family:'calibri', sans-serif;font-size:1.2em;padding:4px 1%;border:solid 1px #fff;background:rgba(255,255,255,0.8);}
input[type=submit]{width:auto;cursor:pointer;}
input,select,textarea,input[readonly]{box-sizing:content-box;-ms-box-sizing:content-box;-moz-box-sizing:content-box;-webkit-box-sizing:content-box;}
img.logo{width:100px}
/*select optgroup{background-color:#140;color:#fff}
select option{background:rgba(90,120,50,1);color:#fff}
select option:hover {background-color:#333;}*/
a{text-decoration:none;transition: color .5s ease;color:#fff;cursor:pointer}
a.swLogo{display:block;float:left;margin-right:20px;width:180px;height:70px;background-color:#fff;text-align:center;}
a.swLogo img{max-height:70px;width:auto;}
.fl{float:left}.fr{float:right}.clr{clear:both}
.rs{font-family:'rupee'}.rel{position:relative}
.tac,.tabular th.tac{text-align:center}.tar,.tabular th.tar{text-align:right}
.red{color:#e00;}.green{color:#0c3}.orange,.tabular h2 > span.orange{color:#f60}
.tabular h2 > span.grpNum{color:#f60;font-family:verdana;font-size:0.9em}

header{background-color:#f60;color:#fff;min-height:70px;}
footer{background-color:#000;clear:both;text-align:center;padding:10px 0;color:#888;position:fixed;bottom:0;width:100%;z-index:10}


.login header{height:70px;}
.login header img{margin-top: 40px;  padding: 10px 20px 20px 26px;  background-color: rgb(255, 255, 255);  width: 150px;border-radius: 6px;}
.login header h1{color:#000;text-transform:uppercase;font-weight:normal;font-size:1.2em;margin:-25px 0 20px;}
.login #loginSec{margin:150px auto 0;border:solid 2px rgba(255,255,255,0.3);width:300px;padding:30px;border-radius:3px;box-shadow:0 0 1000px rgba(0,0,0,0.5)}
.login #loginSec form{margin-top:20px}
.login #loginSec h2{margin:-54px auto 0;border:solid 2px rgba(255,255,255,0.3);width:35%;text-transform:uppercase;padding:10px 0;background-color:#f60;border-radius:3px}
.login #loginSec input{display:block;margin:15px 0;width:96%;background-color:rgba(255,255,255,0.3);border:solid 1px rgba(255,255,255,0.5);padding:6px 2%}
.login #loginSec .button{color:#fff;margin-bottom:0;background:#e00;text-transform:uppercase;}

#loginInfo{float:right;margin:10px 50px 0 0;text-align:right}
#loginInfo .name,#loginInfo .role{font-size:1.2em;line-height:1em;text-transform:capitalize}
#loginInfo .role{font-style:italic;color:#333}
#loginInfo .btns{position:absolute;top:0;right:0}
#loginInfo .btns a{width:35px;height:35px;display:block;margin-left:5px;}
#loginInfo .logout{background:#e00 url('../images/log_out.png') no-repeat center center;}
#loginInfo .settings{background:#333 url('../images/settings.png') no-repeat 7px 6px;}
.lastLogin{background-color:rgba(255,255,255,0.5);border-radius:5px;padding:2px 6px;color:#666;display:block;margin-top:5px;}

.settingsMenu{position:absolute;right:0;padding:10px;margin-top:8px;background-color:#333;display:none}

nav{position:absolute;left:0;width:180px;margin-top:20px}
nav ul{list-style:none;padding:0;margin:0}
nav ul li{margin-bottom:2px;font-family:'jura';font-size:1.4em}
nav ul li a{display:block;padding:10px;color:#fff;background-color:rgba(255,255,255,0.1);text-transform:uppercase;transition: all .20s ease;border-left:5px solid #36f}
nav ul li a.on{background-color:#f6f6ff;color:#000;}
nav ul li a.on:hover{background-color:#f6f6ff;}
nav ul li a:hover{background-color:rgba(0,0,0,0.5);}
nav ul li a.dashboard{border-color:#fa3}
nav ul li a.loans{border-color:#0c0}
nav ul li a.clients{border-color:#0cf}
nav ul li a.transactions{border-color:#63f}
nav ul li a.staffs{border-color:#bc3}
nav ul li a.centres{border-color:#f70}
nav ul li a.db{border-color:#96c}
nav ul li a.investors{border-color:#c39}

.yesNo{position:relative;display:inline-block;width:60px;height:34px;}
.yesNo input{display:none}
.yesNo .slider{position:absolute;cursor:pointer;top:0;left:0;right:0;background-color:#f00;-webkit-transotopm:.4s;transition:.4s;border-radius:34px;}
.yesNo .slider:before{position:absolute;content:"";height:26px;width:26px;left:4px;bottom:4px;background-color:#fff;-webkit-transotopm:.4s;transition:.4s;border-radius:50%}
input:checked + .slider{background-color:#06f;}
input:focus + .slider{box-shadow:0 0 1px;background-color:#06f;}
input:checked + .slider:before{-webkit-transform:translateX(36px);-ms-transform:translateX(36px);transform:translateX(36px)}


.tabular{margin:0 auto;min-height:400px}
.tabular table{width:100%;background-color:#f6f6f6;margin-top:6px;border-bottom:solid 2px #ccc;}
.tabular table.activitiesTbl{border:solid 2px #9c9}
.tabular th{padding:5px 4px;background-color:#f6fcff;text-align:left;border-top:solid 3px #fff;border-bottom:solid 3px #f6f6ff;font-weight:normal;text-transform:uppercase}
.tabular td{padding:4px;background-color:#fff;vertical-align:top;color:#666;}
.tabular tr:nth-child(even) td{background-color:#f6f6f6;}
.tabular h2>strong{text-transform:uppercase;color:#000;font-size:1.2em}
.tabular h2>span{color:#666}
.tabular h3{font-weight:bold;margin:0 0 8px;font-size:1.2em;text-transform:uppercase}
.tabular h3 .addBtn,.tabular h3 .import{padding:4px 10px;font-size:0.8em;font-weight:normal}
.tabular .deleteBtn,.tabular .editBtn,.tabular .set,.tabular .assign,.tabular .assignLoan,.tabular .editLoan,.tabular .approve,.tabular .verify,.tabular .disapprove,.tabular .dispurse,.tabular .deleteRepay,.tabular .deleteSalary,.addAddiLoan,.deleteLoan,.tabular .repayLoan,.tabular .addFund,.tabular .resetPass,.tabular .lockCentre,.closeLoan,.printCollectable,.printClient,.download,.giveOut,.receive,.logs,.addTrans,.editTrans,.deleteTrans,.viewTrans,.closeAcc,.addInvTrans,.editInvTrans,.deleteInvTrans,.closeInv,.grpCollect{margin:0 4px 4px 0;padding:2px 5px;display:inline-block}
.tabular .editBtn,.tabular .editLoan,.editTrans,.editInvTrans{background-color:#069;}
.addAddiLoan,.tabular .addFund,.receive,.addTrans,.addInvTrans,.grpCollect,.tabular .verify{background-color:#0c6;}
.tabular .deleteBtn,.tabular .deleteRepay,.tabular .deleteSalary,.deleteLoan,.tabular .lockCentre,.deleteTrans,.closeAcc,.deleteInvTrans,.closeInv{background-color:#f40;}
.tabular .assign,.tabular .assignLoan,.giveOut,.viewTrans{background-color:#0cf;}
.tabular .dispurse,.tabular .resetPass,.download, .logs{background-color:#0dc;}
.tabular .set,.closeLoan,.disapprove{background-color:#e90;}
.tabular .approve,.tabular .repayLoan{background-color:#0aa}
.tabular .dispurse{text-transform: uppercase;font-weight: bold;text-shadow: 0 0 2px #060;}
.printCollectable,.printClient{background-color:#08c}
.tabular table tr.default td{background-color:#fe9;}
th.repay{background-color:#beb;border-bottom:solid 3px #7d7;width:180px;}td.repay{background-color:#efe;}
th.paidOut{background-color:#fc8;border-bottom:solid 3px #f90}td.paidOut{background-color:#fff3dd}
th.balance{background-color:#8ef;border-bottom:solid 3px #0cf}td.balance{background-color:#ddf9ff}
th.yellow{background-color:#fe9;border-bottom:solid 3px #fd0}td.yellow{background-color:#fffddd}
th.total{background-color:#bff;border-bottom:solid 3px #66f6f6}td.total{background-color:#f9ffff}
.tabular tr:nth-child(even) td.repay{background-color:#beb;}
.tabular tr:nth-child(even) td.paidOut{background-color:#fc8;}
.tabular tr:nth-child(even) td.balance{background-color:#8ef;}
.tabular tr:nth-child(even) td.yellow{background-color:#fe8;}
.tabular tr:nth-child(even) td.total{background-color:#bff;}
.tabular .installment .repay,.tabular .installment .paidOut,.tabular .installment .balance,.tabular .installment .yellow,.tabular .installment .total{width:80px}
.tabular tr.subhead th{border-top:0;padding-bottom:1px}
.tabular tr th.subheadParent{border-bottom:0;background-color:#f9ffff}
.tabular tr.additionalRow>td{background-color:#fff9cc;position:relative;padding:2px}
.tabular .additionalRow a.expand{background-color:#fff9cc;color:#000;padding:2px;text-align:center;width:65px;height:16px;line-height:14px;position:absolute;right:5px;top:-18px}
.tabular .additionalRow a.expand:after{content:'+ Expand'}
.tabular .additionalRow a.expanded.expand:after{content:'- Collapse'}
.tabular .additionalRow>td>table{border:solid 1px #fff;display:none;margin:5px auto;width:99%;background-color:rgba(200,200,200,0.1)}
.tabular .additionalRow>td>table td{background-color:#ffe}
.tabular .additionalRow>td>table tr:nth-child(even) td{background-color:#fff9cc}
.totPayable,.instDt,.weekNo{font-size:1.2em}
.paid .totPayable, .paid .instDt, .paid .weekNo{color:#093}
.notpaid .totPayable, .notpaid .instDt, .notpaid .weekNo{color:#e30;}
.tabular tr.Closed>td,.tabular tr.removed>td{background-color:#ddc}
.tabular tr.inactive>td{background-color:#fed}
.tabular tr.pending td{border-bottom:solid 1px #fb6}
.tabular tr.pending .balance{font-weight:bold;color:#3c0;display:inline-block}
.tabular tr.pending .repayLoan{margin-bottom:0}
.intRList {font-size:0.9em;text-transform:lowercase;padding:0;}

h4.closed{margin:0 0 10px;background-color:#fec;padding:4px 10px;text-transform:uppercase;font-size:1.4em;font-weight:normal;text-align:center}

.mainCont{padding:20px 20px 20px 210px}
a.back{position:absolute;background-color:#ff9;color:#f60;padding:1px 5px;margin:-16px -26px;box-shadow:0 0 2px 0}
.pintAOR,.printIH,.printLOR{font-size:0.8em;margin-left:10px;display:inline-block;background-color:#fff;color:#000;padding:2px 8px;box-shadow:0 0 2px 0 #ccc}
.printLOR{margin:0 4px 4px 0;font-size:1em;padding:2px 5px;color:#09c}
.addBtn,#slideCont .saveBtn,.newLoan{padding:4px 10px;background-color:#090;border:solid 1px rgba(255,255,255,0.9);border-bottom-color:rgba(0,0,0,0.5);border-right-color:rgba(0,0,0,0.5);border-radius:1px;}
.addBtn:before,.newLoan:before{content:'+';font-family:'calibri';font-weight:bold;padding-right:4px;font-size:1.2em;}
.newLoan:before{font-size:1em;}
.newLoan{float:left;margin-top:25px;font-family:'jura';font-size:1.3em;text-transform:uppercase}
.headerSearchForm{float:left;margin:25px 0 0 1%;width:35%}
.headerSearchForm input[name=searchKey]{width:85%;border:0;background-color:rgba(255,255,255,0.5);padding:5px 1%;float:left}
input.searchBtn{background:#0cf url('../images/magnifier.png') no-repeat scroll center center;width:20px;height:19px;border:0;}
.headerSearchForm input.searchBtn{float:left}
.Dispursed .feesCont{display:none}

#overlay{position:fixed;top:0;left:0;width:100%;height:100%;background-color:rgba(0,0,0,0.7);z-index:1000}
#loading{background:url(../images/loader.gif) no-repeat center center rgba(0,0,0,0.8);width:100%;height:100%;position:fixed;left:0;top:0;z-index:10000}
.popFormCont{color:#333;display:none;width:550px;position:fixed;top:60px;border:solid 3px #f60;background-color:#f6f6ff;z-index:1001;box-shadow:0 0 5px #000;}
.popFormCont h3{text-transform:uppercase;padding:5px 2px 6px 0px;font-size:1.6em;font-weight:bold;margin:0;background-color:#f60;color:#fff;text-align:center}
.popFormCont .close{background-color:#e00;float:right;color:#fff;font-size:0.5em;font-family:'verdana';width:18px;height:18px;line-height:18px;cursor:pointer;text-align:center;border-radius:20px;border:solid 2px #fff;margin-top:-3px;text-indent:1px}
.popFormCont form{padding:1% 2%;overflow:hidden}
.popFormCont .field{width:48%;float:left;padding:0 1%;min-height:50px;}
.popFormCont .field.colspanTwo{width:98%}
.popFormCont .fourCols .field{width:23%}
.popFormCont .fiveCols .field{width:18%}
.popFormCont label{display:block;text-align:left;margin:5px 0 2px;font-size:1.3em;color:#666;}
.popFormCont label.check{display:inline-block;width:45%;font-size:1em;margin-right:2%}
.popFormCont label.check input{float:left;margin:0 5px 0 0;}
.popFormCont label.chkbox{position:absolute;right:0;width:auto;cursor:pointer}
.popFormCont input[type=text],.popFormCont input[type=password],.popFormCont input[type=file],.popFormCont textarea{padding:2px 1%;width:98%}
.popFormCont select{padding:1px 1%;width:98%}
.popFormCont select optgroup option,.popFormCont select optgroup{font-size:0.9em}
.popFormCont input[type=file],#customerLogin input[type=file]{font-family: calibri, arial;font-size:0.85em;border-radius:2px;width:98%p;padding:1px 1%;}
.popFormCont input[type=button],.popFormCont input[type=submit]{margin:8px 2px;border:none}
.popFormCont input[readonly]{background-color:#fec;border-color:#fda}
.popFormCont .buttons{clear:both;width:100%;text-align:center;padding-top:5px;}
.popFormCont .buttons input{padding:4px 20px;background-color:#f60;color:#fff;border:solid 1px #fff;border-bottom-color:rgba(0,0,0,0.3);border-right-color:rgba(0,0,0,0.3);text-transform:uppercase}
.popFormCont .content{text-align:center;padding:20px;}
#registerCont fieldset{border:solid 1px #ccc;border-radius:3px;}
#registerCont fieldset label{width:55px}
#registerCont fieldset .addr{width:190px}
#registerCont label{width:180px}
.popFormCont .radioCont{display:inline-block;}
.popFormCont .radioCont .radioLbl{width:auto;display:inline;margin:0 15px 0 0;}
.popFormCont .radioCont .radioLbl input{margin:0}
.popFormCont{top:50%;left:50%;width:580px;margin-left:-290px; }
#addDoctorCont{height:390px;margin-top:-200px;}
#registerCont{height:430px;margin-top:-220px;}
#addDoctorCont .button,#registerCont .button{width:30%}
.patientId{position:absolute;right:18px;top:35px}
.importCont{display:none;position:absolute;background-color:rgba(0,0,0,0.9);font-size:0.6em;color:#fff;right:0;top:4px;width:300px;padding:20px;}
.importCont input{color:#000;padding:0;width:80%}
.importCont input[type=submit]{color:#fff;background-color:#4eb1f6;font-size:1.4em;border:0;width:15%}
a.import.selected{background:rgba(0,0,0,0.9)}
span.fld{background-color:rgba(255,255,255,0.3);padding:5px 4px;display:inline-block;color:#000;margin-left:5px;}
.popFormCont span.fld{padding:3px 2%;margin:0;width:96%;font-size:1.2em;min-height:15px;}
.lType span{display:inline-block;padding:3px 2%;font-size:1.2em;background-color:#ffd;width:96%}
.popFormCont fieldset.client{margin-top:5px;border:solid 1px #ddd;border-radius:3px;padding:4px 4px 8px;font-size:0.9em;}
.popFormCont fieldset.client>legend{font-size:1.2em;}
.popFormCont fieldset.client .field{width:25%;min-height:auto}
.popFormCont fieldset.client .field label{float:left;margin:2px 4px 0 0}
.popFormCont fieldset.client .field input{width:50px}
.popFormCont fieldset.client .totFee{color:#e60;font-size:1.3em;width:12%;text-align:right;padding-top:2px;}
.popFormCont fieldset.Weekly .field{width:40%;margin-bottom:2px}
.popFormCont fieldset.Weekly .field label{width:60%;text-align:right}


#slideCont{background-color:#eee;height:100%;width:100%;position:fixed;z-index:10;top:0;left:100%}
#slideCont h2{float:left;margin:0;color:#fff;padding:2px 20px 0 0;font-size:1.6em;font-family:'jura';text-transform:uppercase;font-weight:normal}
#slideCont .close{width:35px;height:35px;display:block;margin-left:5px;position:absolute;background-color:#e00;font-weight:normal;font-size:20px;font-family:'verdana';line-height:27px;top:0px;right:0px;text-align:center}
#slideCont input,#slideCont select{padding:4px 5px;margin:0 2px;background-color:rgba(255,255,255,0.5);border:none}
#slideCont select{padding:3px 5px;}
#slideCont select[name='loanType']{font-size:1em}
#slideCont input[name='loanId']{width:80px}#slideCont input[name='amount']{width:60px}
#slideCont input[name='repayCapital'],#slideCont input[name='encash']{width:40px}
#slideCont input[name='tenure'],#slideCont input[name='intDuration']{width:30px}
#slideCont input.fee{width:40px}
#slideCont input[name='interest'],#slideCont input[name='saving'],#slideCont input[name='riskFund'],#slideCont input[name='groupFund'],#slideCont input[name='increament'],#slideCont input[name='maxInt']{width:25px}
#slideCont header .lbl{display:inline-block;margin-left:5px;}
#slideCont header .lbl small{text-transform:uppercase;display:block}
#datafields ul{list-style:none;margin:10px;padding:0;}
#datafields li{float:left;padding:5px 10px 5px 28px;margin:2px;border:solid 1px #ccc;background-color:#fff;position:relative}
#datafields li.checked{background-color:#9f9}
#datafields li input[type='checkbox']{position:absolute;left:0;top:0}
#datafields li input[type='text']{display:none;width:12px;position:absolute;left:4px;top:19px;font-size:1em;padding:0 2px}
#datafields li.checked input{display:block}
#datafields li span{color:#999}
#slideCont .saveBtn{position:absolute;bottom:10px;right:10px;padding:5px 20px;text-transform:uppercase;font-size:1.4em}
.loanType{text-transform:uppercase;height:34px;line-height:30px;}
#loanTypePresetData input,#loanTypePresetData select,#loanTypePresetData .lbl,#loanTypePresetData .fld{float:left}
#loanTypePresetData .lbl{line-height:1em;padding:6px 3px 0 0;text-align:right}
#loanTypePresetData .lbl.twol{padding-top:0;width:65px;}

#slideCont #clientFieldsCont input,#slideCont #clientFieldsCont select{box-shadow:0 0 1px #999;width:98%;padding:4px 1%}
#slideCont #clientFieldsCont select{padding:3px 1%}
#slideCont #clientFieldsCont select[name='centreId'],#slideCont #clientFieldsCont h3 select[name='groupNumber']{margin-left:15px;width:auto;padding:2px;font-size:0.7em}
#slideCont .clientListCont{background-color:#ddd;padding:5px;}
#slideCont .clientListCont label{width:165px;text-align:right;display:inline-block;padding-right:10px;text-transform:uppercase}
#slideCont .clientListCont select[name='clId']{width:auto;font-size:1em;font-family:'calibri';margin:0}
#slideCont #clientFieldsCont h3{margin:5px 0;font-family:'jura';text-transform:uppercase;font-weight:normal;font-size:1.6em}
#slideCont #clientFieldsCont label{display:block}
#slideCont #clientFieldsCont label.sameAs{display:inline-block;text-transform:capitalize;font-size:0.7em;position:relative;top:-1px;padding-left:35px;cursor:pointer}
#slideCont #clientFieldsCont label.sameAs input{position:absolute;left:15px;top:1px;width:auto}
#slideCont #clientFieldsCont .field,#clientDetails .field{float:left;}
#slideCont h3.mapping{background-color:#f60;text-transform:uppercase;font-weight:normal;font-size:1.4em;font-family:'jura';padding:8px 10px 7px;color:#fff;margin:0 0 10px}
#slideCont h3.mapping a{font-size:1em}
.basicInfo{overflow:hidden;}
.basicInfo .photo{width:11%;height:160px;overflow:hidden;float:left;background-color:#f6f6f6;margin-right:1%;position:relative;font-size:0.8em}
.basicInfo .photo>img{width:100%}
#slideCont #clientFieldsCont .basicInfo .photo>input,#clientDetails .basicInfo .photo>input{position:absolute;bottom:0;left:0;margin:0;background:rgba(255,255,255,0.8);font-size:1em;}
.basicInfo .field{width:14%;min-height:50px;margin-right:0.5%}
.basicInfo .field.colspanThree{width:43%}
.fieldsCont{clear:both;overflow:hidden;margin-top:10px;padding:1px 0.5% 1px 0}
.fieldsCont .field{width:24%;min-height:35px;margin-right:1%}
.fieldsCont .field.colspanTwo{width:49%}
#slideCont .fieldsCont .field input[type=checkbox]{margin-right:10px;}
#slideCont #clientFieldsCont .documentsCont .field input[type=file]{font-size:0.8em;padding: 3px 1%}
#loanSection h2 .clientName{font-size:1.4em;color:#f60;font-family:'jura'}
#clientDetails{padding-top:10px}
#clientDetails .field{overflow:hidden;width:100%;margin:5px 0;}
#clientDetails label{float:left;width:25%;color:#999;padding-right:1%}
#clientDetails .fldVal{float:left;width:74%;}
#clientDetails .basicInfo .photo{background-color:#fcfcfc;width:20%}
#clientDetails .basicInfo .field{width:78%;min-height:auto}
#clientDetails .basicInfo .field label{text-align:right;}
#clientDetails fieldset{margin:0 2% 0 0;border:solid 1px #ccc;}
#clientDetails fieldset legend{text-transform:uppercase;font-size:1.2em;}
.sectionList{list-style:none;column-count:2;margin:20px 0 0;padding:0}
.sectionList li{margin:0 0 15px 0}
#profileSecs{float:left;width:70%}
#profileSecs .sectionList{column-count:1}
#loans{float:right;width:28%}
.documentsCont .delete,.documentsCont .clear{padding:2px 0;display:inline-block;background-color:#66f;width:50px;text-align:center;margin:2px}
.documentsCont .delete{background-color:#e30}

#slideCont #clientFieldsCont .field.radio label{float:left;width:auto;margin-right:10px;margin-top:4px;}
#slideCont #clientFieldsCont .field.radio label>input{float:left;width:auto;}

#slideCont .addMore,#backupDb{padding:2px 5px;background-color:#242;border-radius:3px;display:inline-block}
#slideCont .addMore:before{content:'+';font-size:1.2em;padding:0 5px 0 2px;display:inline-block}
#slideCont .fees{display:none;background-color:#f60;position:absolute;padding:10px;border:solid 1px rgba(255,255,255,0.5);margin:-4px 0 0 10px;z-index:10}
#slideCont .fees div{margin:4px 0}
#slideCont .fees .lbl{width:100px;padding-top:3px}
#slideCont .fees .fee{padding:2px;float:none;font-size:1em}
#slideCont #expandFees{display:inline-block;margin:4px 10px;background-color:#09c;padding:1px 6px;}

.loanId,.clName{color:#09c;font-size:1.2em}
.loanId{font-size:1.4em;text-transform:uppercase;}
.otherInfo{font-size:1em;color:#666}
.date{font-size:1.2em;color:#666;}
.date small{color:#999}
.tabs .tabCont{display:none;background-color:#fcfcfc;border:solid 2px #ddd;overflow:hidden;margin-top:10px;padding:10px;}
.tabs #loanCont.tabCont{display:block}
.tabs .tab{background-color:#666;font-family:'jura';padding:5px 15px;margin-right:5px;text-transform:uppercase;font-size:1.3em}
.tabs .tab.on{background-color:#fcfcfc;color:#000;padding:5px 15px 12px;border:solid 2px #ddd;border-bottom:0;}
.tabs .tabCont form,.loanFilter{background-color:#ffee99;padding:10px;}
.tabCont .field,.loanFilter .field{float:left;min-width:75px;margin-right:5px;}
.tabCont .field label,.loanFilter .field label{display:block;}
.tabCont .field input,.loanFilter .field input{font-size:1em;padding:2px;}
.tabCont .field select,.loanFilter .field select{font-size:1em;padding:1px 2px;width:95%}
.tabCont .tabular .loanId{font-size:1em}
.tabCont input[type='submit'],.loanFilter input[type='submit']{float:right;background-color:#0cf;border:0;color:#fff;margin-top:4px;}
.tabCont form,.loanFilter{overflow:hidden}
.loanFilter{margin-bottom:10px}
#lStartDt,#lEndDt,#sStartDt,#sEndDt,.sdPicker,.edPicker{width:70px;}
.centreInfo{font-family:'jura';}

#loanSection h2,#loanSection h3{font-weight:normal;margin:0;color:#333}
#loanSection h2{font-size:1.2em}
#loanSection h2 .loanId,#loanSection h2 .color{color:#f60;font-size:1.4em;display:inline-block}
#loanSection h2 .loanId{margin-right:10px;text-transform:uppercase}
#loanSection h2 .loanId>small{font-size:0.6em;color:#999}
#loanSection h2 .frequency{display:inline-block;margin-left:20px;}
#loanSection h3{font-family:'jura';font-size:1.4em;text-transform:uppercase;overflow:hidden}
#loanSection h3 a{font-family:'calibri';display:inline-block;margin-left:4px;padding:2px 8px;background-color:#39f;font-size:0.8em}
#loanSection .loanInfo{background-color:rgba(255,255,255,0.4);border:solid 1px rgba(255,255,255,0.6);overflow:hidden;margin:10px 0;font-size:1.2em;color:#666;}
#loanSection .dispursedAmt{font-family:'calibri';font-size:0.8em}
#loanSection .dispursedAmt .amount{color:#f60;font-size:1.2em}
.loanInfo .paymentDue{padding:10px 2%;background-color:#fff}
.loanInfo small{color:#999;display:inline-block;padding-right:10px;}
.loanInfo #capitalPaid, .loanInfo #interestPaid, .loanInfo #capitalDue, .loanInfo #interestDue{font-size:1.2em}
.loanInfo #capitalPaid, .loanInfo #interestPaid{color:#3b0;}
.loanInfo #capitalDue, .loanInfo #interestDue{color:red;}
.loanInfo .leftCol,.loanInfo .rightCol{margin:10px 0;min-height:70px;display:flex;flex-wrap:wrap}
.loanInfo .leftCol{padding:0 1.5%;border-right:solid 1px #fff;width:40%;}
.loanInfo .rightCol{padding:0 0 0 1.5%;border-left:solid 1px #ccc;width:52%;}
.loanInfo .ritem{width:50%;display:flex}
.loanInfo .ritem.full{width:100%;}
.loanInfo label{color:#666;display:inline-block;}
.loanInfo label.lbl{width:50%;padding-right:10px;box-sizing:border-box;text-align:right}
.loanInfo .ritem.full label.lbl{width:25%;}
.loanInfo .short{display:inline-block}
.repay .amount,.repay .pfor{float:left;width:54%;margin:0 1%}
.repay .amount{text-align:right;width:42%}
#centreList td ol{margin:0;padding-left:20px;}
#centreList td ol li{margin:4px 0;}
#centreList td a.loanId{font-size:1em}
#centreList .subhead th{width:150px}
.totGrp1,.totGrp2 {table-layout:fixed}
.totGrp1 .grp ol{column-count:4;column-gap:35px}
.totGrp2 .grp ol{column-count:2;column-gap:35px}
.totGrp1 .grp ol li,.totGrp2 .grp ol li{min-height:35px;page-break-inside:avoid;break-inside:avoid-column;-webkit-column-break-inside:avoid}

#collectionChart{background-color:rgba(255,255,255,0.7);width:47%;float:left}
.chart{position:relative;}
.chart h2{text-align:center;position:absolute;color:#666;text-transform:uppercase;font-weight:normal}
#collectionChart svg{width:220px;height:220px}
#collectionChart .legend{width:50%;float:right}
#collectionChart .chart h2{width:100px;top:60px;left:60px;}
#collectionChart .chart .tot{margin:10px;text-align:center;font-size:1.2em;text-transform:uppercase;color:#666}
#collectionChart .chart .tot .rs{font-size:1.4em}
#collectionChart .chart .tot .amt{font-size:2em;color:#333;}
.chart .label{overflow:hidden;margin:3px 0;font-size:1.2em}
.chart .label span,.chart .label label{float:left}
.chart .label span{text-align:right}
.chart .label span.amt{width:75px;line-height:1.4em}
.chart .label span.pc{color:#666;width:50px;font-size:0.8em;line-height:1.8em}
.chart .label label{margin-left:5px;padding:1px 0 1px 5px;border-left-style:solid;border-left-width:5px;color:#666;}

#overview{width:45%;margin-right:5%;float:right}
.box{overflow:hidden;border:solid 1px #ddd;border-bottom-width:3px;background-color:rgba(255,255,255,0.7);}
.box h2{background-color:#ddd;padding:5px 10px;text-transform:uppercase;font-weight:normal;margin:0}
.box .lb{padding:2%;width:46%}
.box .val,.box label{margin:2px 0}
.box .val{width:50%;text-align:right;display:inline-block;font-size:1.2em}
.box .val .rs{color:#f90;font-size:0.8em}
.box label{width:49%;display:inline-block;margin-left:1%;color:#666}

.totTransAmt{position:absolute;text-transform:uppercase;right:20px;text-align:right;line-height:1.2em}
#totTransAmt{top:90px;}
#totTransCD{top:80px;}
#totTransAmt .amt{color:#f60;font-size:1.4em;}
#totTransCD .green,#totTransCD .red{font-size:1.4em;}
.thumbs .thumb{width:40px;height:40px;display:inline-block;overflow:hidden;margin:4px 5px 0 0}
.thumbs .thumb img{width:100%;height:auto;}
.docSection{min-height:auto;}
.docSection td img{float:left;margin:0 5px;}

.loanBox{background-color:#fff;margin-bottom:20px;font-size:1.2em}
.loanBox h2{background-color:#ccc;text-transform:uppercase;padding:4px 10px;text-align:center}
.loanBox h2 a{color:#09f;font-weight:bold}
.loanBox hr{border:solid 1px #ccc;border-width:1px 0 0;margin:2px 10px;}
.loanBox #loanDetails{padding:10px}
.loanBox #loanDetails table{width:100%}
.loanBox #loanDetails .lbl{text-align:right;width:49%;color:#999}
.loanBox #recoveryDetails{padding:0 10px 10px;}
.loanBox #recoveryDetails h4{font-size:1.2em;font-weight:normal;margin:0;text-align:center;padding:5px 0;text-transform:uppercase}
.loanBox #recoveryDetails .val{width:45%;display:inline-block;text-align:right;padding:2px 4px}
.loanBox #recoveryDetails .val .rs{color:#f90;font-size:0.9em}
.loanBox #recoveryDetails .lbl{color:#999;padding:2px 0;display:inline-block}

.printResult,.printAccResult,.printInvTrans{border:none;margin:4px;float:right;cursor:pointer}
.accType{font-style:italic;display:block;color:#690}
#receipt{display:none}
.wBtn{background-color:#fff;color:#06c;font-size:0.8em;font-weight:normal;margin-right:10px;padding:5px 10px}
.wBtn:hover{box-shadow:0 0 1px 1px #ddd}
.popFormCont input.partial,.popFormCont input.lateFee{width:50px;margin-left:5px;padding:0 4px;border-left-color:#ddd}

.clearDt{position:absolute;padding:2px 4px 3px;font-size:10px;background:#f30;color:#fff;border-radius:2px}
/*.ui-timepicker-div dt{float:left;margin:2px 0 0;float:left;width:22%;clear:both}
.ui-timepicker-div dd {margin:2px 0 0;float:left;width:75%}
.ui-timepicker-div .ui_tpicker_hour,.ui-timepicker-div .ui_tpicker_minute{margin:7px 0 5px}
.ui_tpicker_second,.ui_tpicker_millisec{display:none}
.ui-timepicker-div .ui-slider-horizontal{height:6px}
.ui-timepicker-div .ui-slider-handle{height:12px;width:8px;margin-left:-4px;top:-4px}
.ui-timepicker-div .ui-corner-all{border-radius:2px;}
*/
.ui-datepicker select.ui-datepicker-month, .ui-datepicker select.ui-datepicker-year{padding:0;box-sizing:border-box}

.nano {position :relative;overflow:hidden;}
.nano .content {position: absolute;overflow: scroll;overflow-x:hidden;top:0;right:2px;bottom:0;left:20px;border:none;}
.nano .content:focus {outline:thin dotted;}
.nano .content::-webkit-scrollbar {visibility: hidden;}
.has-scrollbar .content::-webkit-scrollbar {visibility: visible;}
.nano > .pane {background : rgba(0, 50, 90, 0.2);position:absolute;width:10px;right: 0;top: 0;bottom: 0;
  visibility: hidden\9; /* Target only IE7 and IE8 with this hack */
  opacity: .01; 
  -webkit-transition    : .2s;
  -moz-transition       : .2s;
  -o-transition         : .2s;
  transition            : .2s;
  border-radius         : 5px;
}
.nano > .pane > .slider {background: rgba(0,0,0,.5);position: relative;margin: 0 1px;border-radius: 3px;}
.moreInfo .nano > .pane > .slider{background:rgba(0, 50, 90, 0.8);}
.nano:hover > .pane, .pane.active, .pane.flashed {visibility : visible\9; /* Target only IE7 and IE8 with this hack */opacity: 0.99;}
.pagination{padding:5px 0}
.pages a, .pagination a{background-color:#69f; padding: 1px 5px;}
.pages a.on, .pagination a.on{background-color:#fff; color:#000; box-shadow:0 0 1px #666;}
.loanees{background-color:#fff;padding:5px 0 5px 20px;margin:0;}
.loanees li{margin:4px 0;}
.loanees a.remove{display:inline-block;padding:1px 5px 2px;background-color:#d00;margin-left:10px;border-radius:2px}

@supports (-webkit-appearance:none) {.tabs .tab.on{padding-bottom:13px}}