@font-face {font-family:'jura';src: url('Jura.ttf');}
@font-face {font-family:'voltaire';src: url('Voltaire-Regular.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-color:#eee}
body.login{color:#fff;text-align:center;border-top:solid 10px #000;background-color:#222}
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;}
/*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;position:absolute;margin:0 30px 0 20px}
a.swLogo img{height:52px;width:auto;display:inline-block;margin:8px 0}
.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{color:#fff;background-color:#000;height:71px;position:relative;z-index:100;}
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{background:transparent;height:auto}
.login header img{margin-top:80px;width:140px;}
.login #loginSec{margin:10px auto 0;width:280px;padding:20px 30px 30px;background-color:rgba(0,0,0,0.2);border:solid 1px rgba(255,255,255,0.2)}
.login #loginSec h2{margin:-54px auto 0;width:35%;text-transform:uppercase;padding:10px 0;}
.login #loginSec input{color:#000;display:block;margin:15px 0;width:96%;background-color:rgba(255,255,230,0.6);border:solid 1px rgba(255,255,255,0.7);padding:6px 2%;text-align:center}
.login #loginSec .button{margin-bottom:0;background:#fc0;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:#999}
#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;background-size:54%}
#loginInfo .settings{background:#222 url('../images/settings.png') no-repeat 7px 7px;background-size:65%}
.lastLogin{background-color:rgba(255,255,255,0.5);border-radius:5px;padding:2px 6px;color:#333;display:block;margin-top:5px;}

.settingsMenu{position:absolute;right:0;padding:5px;margin-top:3px;background-color:#333;display:none}
.settingsMenu a{display:block;padding:2px 6px;margin:2px;background-color:rgba(100,150,255,0.2)}
.settingsMenu a:hover{background-color:rgba(80,120,255,0.7)}

nav.main{float:left;margin:34px 0 0 180px;}
nav ul{list-style:none;padding:0;margin:0 0 0 20px}
nav ul li{margin-left:2px;font-family:'jura';font-size:1.2em;text-align:center;float:left}
nav ul li a{display:block;padding:10px;color:#bcf;background-color:rgba(255,255,255,0.15);text-transform:uppercase;transition: all .20s ease;}
nav ul li a.on{background-color:#eee;color:#000;}
nav ul li a:hover{color:#fff}
nav ul li a.on:hover{color:#000}
/*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}*/
.sideNav{position:fixed;background-color:#222;height:100%;width:180px;padding:70px 0 25px;top:0}
.sideNav ul{list-style:none;margin:0}
.sideNav ul li{float:none;margin:0}
.sideNav a{display:block;text-transform:uppercase;padding:10px 20px;text-align:right;background-color:transparent;border-bottom:solid 1px #333}
.sideNav a.on{background-color:#eee;color:#000}

.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;color:#ccc}
.tabular table{width:100%;border-bottom:solid 2px #000;border-collapse:collapse}
.tabular th,.tabular td{border:solid 1px #000}
.tabular th{padding:5px 4px;background-color:rgba(0,0,0,0.8);text-align:left;border-top:solid 3px #000;border-bottom:solid 3px #000;font-weight:normal;text-transform:uppercase}
.tabular td{padding:4px;background-color:rgba(0,0,0,0.6);vertical-align:top;}
.tabular tr:nth-child(even) td{background-color:rgba(0,0,0,0.7);}
.tabular h2>strong{text-transform:uppercase;color:#000;font-size:1.2em}
.tabular h2>span{color:#666}
.tabular h3,.calView h3{margin:0;font-size:1.2em;text-transform:uppercase;background-color:rgba(0,0,0,0.5);padding:6px 10px;color:#fff;font-family:'jura';font-weight:normal;}
.tabular h3 .addBtn,.tabular h3 .addFY,.tabular h3 .import{padding:4px 10px;font-size:0.8em;font-weight:normal}
.tabular .deleteBtn,.tabular .editBtn, .edit,.tabular .resetPass,.view,.publish{margin:0 4px 4px 0;padding:2px 5px;display:inline-block}
.tabular .addReport,.return{background-color:#090;}
.tabular .editBtn,.editTrans,.editFY, .edit,.editReport{background-color:#06c;}
.tabular .deleteBtn,.tabular .deleteRepay,.deleteFY,.deleteLoan,.deleteTrans,.closeAcc,.deleteInvTrans{background-color:#f40;}
.tabular .resetPass,.download, .logs,.view,.verifyReport,.download{background-color:#0ac;}
.publish{background-color:#08c}
.tabular table tr.default td{background-color:#fe9;}
.tabular .name{text-transform:uppercase;color:#fff;display:block}
th.yellow{background-color:#fe9;border-bottom:solid 3px #fd0}td.yellow{background-color:#fffddd}
.tabular tr:nth-child(even) td.yellow{background-color:#fe8;}
a.report{color:#0de;}
a.report.view{background-color:#000;padding:2px 5px;border:solid 1px rgba(200,255,250,0.3);text-transform:uppercase;}

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;clear:both}
.myAccount .mainCont{padding-left:210px}
.index .mainCont{overflow:hidden}
.myAccount a.swLogo{position:fixed}
a.back{position:absolute;background-color:#ff9;color:#f60;padding:1px 5px;margin:-16px -26px;box-shadow:0 0 2px 0}
.addBtn,.addFY,#slideCont .saveBtn,.newLoan{padding:2px 8px;background-color:#090;border:solid 1px rgba(255,255,255,0.4);border-bottom-color:rgba(0,0,0,0.5);border-right-color:rgba(0,0,0,0.5);border-radius:1px;}
.addBtn:before,.addFY:before,.newLoan:before{content:'+';font-family:'calibri';font-weight:bold;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:#f90 url('../images/magnifier.png') no-repeat scroll center center;width:20px;height:21px;border:0;background-size:68%;cursor:pointer;position:absolute}
.headerSearchForm input.searchBtn{float:left}
.filter{background-color:rgba(0,0,0,0.5);padding:10px;}
.searchForm .field{float:left;min-width:75px;margin-right:5px;}
.searchForm .field label{display:block;}
.searchForm .field input{font-size:1em;padding:2px;}
.searchForm .field select{font-size:1em;padding:1px 2px;width:95%}
.searchForm{background-color:#fff;margin-bottom:10px;padding:10px 10px 5px}
.qset .searchForm{max-width:765px;box-sizing:border-box;margin:auto}
.searchForm select, .searchForm input[type='text']{background-color:#eee;border:solid 1px #ddd;padding:2px;box-sizing:border-box;font-size:1em;margin:0 5px 5px 0;}
.searchForm input[type='text'],.filter input[type='text']{padding:3px 4px;}
.searchForm input[type='submit'],.filter input[type='submit']{margin:0;text-transform:uppercase;background-color:#fc0;padding:2px 10px 2px;border:solid 1px #f90;border-width:0 1px 1px 0}
.searchForm input[name='searchKey']{width:250px}

#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 #69f;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:#69f;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 input[type=text],.popFormCont input[type=password],.popFormCont input[type=file],.popFormCont textarea,.popFormCont input[type=email]{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[type=submit]:disabled{background-color:#ccc;cursor:default}
.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:#69f;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;}
.popFormCont .radioCont{display:inline-block;}
.popFormCont .radioCont .radioLbl{width:auto;display:inline;margin:0 15px 0 0;font-size:1.1em;cursor:pointer}
.popFormCont .radioCont .radioLbl input{margin:0}
.popFormCont{top:50px;left:0;right:0;margin:auto;width:580px;}
.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;}

#slideCont{background-color:#444;height:100%;width:100%;position:fixed;z-index:101;top:0;left:100%;overflow-y:auto}
#slideCont form{margin:20px;color:#fff;}
#slideCont > h2{margin:0;color:#fff;padding:10px 20px 10px 10px;font-size:1.6em;font-family:'jura';text-transform:uppercase;font-weight:normal;background-color:rgba(0,0,0,0.7)}
#slideCont .close{width:42px;height:42px;display:block;margin-left:5px;position:absolute;background-color:#e00;font-weight:normal;font-size:20px;font-family:'verdana';line-height:38px;top:0px;right:0px;text-align:center}
#slideCont .field{width:10%;margin-right:15px;box-sizing:border-box;float:left;margin-bottom:20px}
#slideCont .field.colspanTwo{width:20%;}
#slideCont .trumbowyg-box{margin-top:10px}
#slideCont .trumbowyg-box.trumbowyg-editor-visible .trumbowyg-textarea{float:left}
#slideCont .trumbowyg-editor{background-color:#fff;color:#000}
#slideCont .field.full,#slideCont .field input,#slideCont .field select{width:100%}
#slideCont .field label{text-transform:uppercase;margin-top:20px;}
#slideCont input,#slideCont select{padding:2px;margin:5px 2px 0 0;background-color:rgba(255,255,255,0.5);border:none;font-size:1em;box-sizing:border-box}
#slideCont select{padding:1px 2px}
#slideCont input.fee{width:40px}
#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:fixed;bottom:15px;right:15px;padding:5px 20px;text-transform:uppercase;font-size:1.4em;background-color:#0f9;}
#slideCont .tabular{margin-top:20px;border-collapse:collapse}
#slideCont .chkLbl{margin-left:10px;display:inline-block;padding:0;cursor:pointer}
#slideCont h2 .radioLbl{font-family:'calibri';font-size:0.7em;display:inline-block;cursor:pointer;margin-left:10px}
#slideCont h2 .radioLbl input{float:left;margin-top:1px}

.patForm{clear:both;padding:50px 20px;}
.patForm:after{clear:both;content:'';display:block}
.patForm .field{width:19%;margin:2px 1% 2px 0;float:left;box-sizing:border-box}
.patForm .field label,.patForm .field .lbl{display:block;text-transform:uppercase;padding:4px 0 2px}
.patForm .field input,.patForm .field select{width:100%;}
.patForm .field.colspanTwo{width:39%}
.patForm .field input[type=checkbox]{margin-right:10px;}
.patForm .field label.radioLbl{float:left;width:auto;margin-right:10px;margin-top:4px;display:inline-block;padding:0;cursor:pointer}
.patForm .field label>input{float:left;width:auto;}
.patForm .field .lbl label.radioLbl{margin-top:0;float:none}
.patForm .field .datePicker{width:46%}
.patForm .field .photoCont{text-align:center;background-color:rgba(255,255,255,0.3);}
.studInfo, .facultyInfo{width:39%;box-sizing:border-box;margin:5px 1% 0 0;border:solid 1px #fff}
.facultyInfo{display:none}
.studInfo legend,.facultyInfo legend{text-transform:uppercase;padding:0 10px}
.studInfo .field.colspanTwo,.facultyInfo .field{width:49%}
.studInfo .field{width:24%}

.addQ{background-color:#690;padding:4px 10px;text-transform:uppercase;font-weight:normal}
/*.editQ{background:url('../images/edit-icon.png') center center no-repeat;position:absolute;width:16px;height:16px;left:-10px;top:8px}*/
.editQ,.deleteQ,.publishQ{padding:2px 4px;margin:4px 4px 0 0;display:inline-block}
.editQ{background-color:#06C}
.deleteQ{background-color:#e30}
.publishQ{background-color:#08C}
/*.qcont{position:relative;padding:5px 0 10px 40px;background-color:#fff;margin:10px 0}
.qcont .sl{position:absolute;background-color:#333;color:#fff;font-size:1.3em;height:100%;width:30px;padding-top:5px;text-align:center;box-sizing:border-box;left:0;top:0}*/
.qcont{position:relative;padding:5px 0 10px 40px;margin:10px 0}
.qcont .sl{position:absolute;font-size:1.3em;height:100%;width:35px;padding-top:6px;box-sizing:border-box;left:0;top:0;text-align:right}
.qcont .sl:after{content:"."}
.qcont .question{font-size:1.3em;color:#000}
.qcont .question p{margin:0}
/*.qcont .question img{background:transparent url('../images/loader.gif') center center no-repeat;vertical-align:middle}*/
.qcont .question img{vertical-align:middle}
.qcont .question iframe{background-color:#fff;border:solid 1px #eaeaea}
.qcont .prop{color:#999}
.qcont .prop span{font-style:italic;color:#333}
.mainCont h2{text-transform:uppercase;font-family:'jura';font-weight:normal;border-bottom:solid 2px #ccc;padding-bottom:5px;}
h2 .addQ{font-size:0.8em;}
h2 .filters{display:inline-block;font-size:0.6em;padding:0 20px;}
h2 .filters input,h2 .filters select{padding:2px 5px;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:2px 7px;display:inline-block;margin-right:5px;font-size:1.2em}
.pages a.on, .pagination a.on{background-color:#fff; color:#000; box-shadow:0 0 1px #666;}

@supports (-webkit-appearance:none) {
.tabs .tab.on{padding-bottom:13px}
.searchForm input[type='submit']{position:absolute;margin-left:4px;margin-top:-1px}
}


#mobileMenu{position: fixed;top: 0;left: 0;width: 100%;display: none;font-family:'jura'}
#mobileMenu ul {margin:0;padding:0}
#mobileMenu ul li{display:block;background-color:#046;color: #fff;letter-spacing: 0.1em;text-align: center;text-transform: uppercase;border-bottom: 1px solid #258;}
#mobileMenu ul li a{padding: 10px 0;display:block;color:#fff;font-size:1.4em}
.toggleMobile{display: none;}

.calendarTbl{width:100%}
.renew{padding:2px 6px;background-color:#073;text-transform:uppercase;font-size:0.8em;display:inline-block;line-height:12px}

.dbox{background-color:rgba(255,255,255,0.5);padding:10px 15px;float:left;width:31%;margin:1%;box-sizing:border-box;border:solid 2px rgba(255,255,255,0.5);min-height:150px;border-radius:5px;font-size:1.2em}
.dbox.colspanTwo{width:65%}
.dbox.full{width:98%}
.dbox label{width:49%;display:inline-block;text-align:right}
.dbox h2{margin:0 0 8px 0;padding-bottom:8px;border-bottom:solid 1px #eee;text-transform:uppercase;font-weight:normal;font-size:1.2em}
.dbox h2 small{color:#666;float:right}
.dbox ol{padding:0 10px 0 25px;margin:0}
.dbox ol li{margin:5px 15px 5px 0;}
.dbox h2 .addBtn{float:right;font-size:0.8em;font-weight:normal;padding:0 7px}
.dbox .edit,.dbox .delete{font-size:0.6em;text-transform:uppercase;letter-spacing:1px;margin:0 0 0 5px}
.dbox .delete{background-color:#e30;padding:2px 5px}
.dbox.colspanTwo ol{column-count:2}
.dbox.full ol{column-count:3}
.dbox select{font-size:0.8em;font-weight:normal;margin-left:5px;padding:1px;}

.mathMlContainer {position: relative; }
.mathMlContainer[inline="false"] {display: block;width: 100%; }
.mathMlContainer:hover {pointer-events: none; }
.mathMlContainer:hover::after {content:'\270E';position:absolute;top: 0;right: 0;bottom: 0;left: 0;background-color: rgba(255,255,255,0.8);box-shadow: 0 0 5px 5px rgba(255,255,255,0.8);cursor: pointer;pointer-events: auto; }

.qsetCont{max-width:765px;background-color:#fff;box-sizing:border-box;padding:20px;margin:30px auto}
.qhead{text-align:center;font-style:italic}
.qhead strong{display:block;font-size:1.2em;font-style:normal;text-transform:uppercase}
.qsetCont .qcont{padding-left:10px}
.qsetCont section{background-color:#eee;padding:5px 10px;margin-top:20px;}
.secnote a{display:inline-block;padding:2px 5px;background-color:#390;text-transform:uppercase}
.qsetCont input,.qsetCont select{margin:5px 5px 5px 0;padding:2px 5px;box-sizing:border-box;font-size:1em}
.qform{border:solid 1px #ccc;margin:5px 0;position:relative;padding:0 10px 10px}
.qform legend{text-transform:uppercase;padding:5px}
.qform input[type="text"]{width:90%;}
.qform input[name="mark"]{width:8%}
#qList{position:absolute;background-color:#fff;border:solid 1px #ccc;padding:0;margin:0;list-style:none;max-height:200px;overflow-y:scroll;z-index:101}
#qList li{background-color:#eee;margin:0 0 1px 0;cursor:pointer}
#qList li:nth-child(even){background-color:#f9f9f9}
.more{padding:1px 5px;display:inline-block;background-color:#099}
.qfield label{margin-right:10px;display:inline-block;cursor:pointer}
.qfield label input{float:left;margin:0 5px 0 0;cursor:pointer}
.addQset{padding:2px 5px;text-transform:uppercase;position:absolute;right:5px;background-color:#390;top:-22px}
.secCont{text-align:center;margin-top:10px}
.secCont strong{display:block}
.secCont .note{margin:5px 0;font-style:italic}
.setqCont{position:relative;padding:5px 0 10px 40px;margin:10px 0;text-align:left}
.setqCont .sl{position:absolute;height:100%;width:35px;padding-top:5px;box-sizing:border-box;left:0;top:0;text-align:right}
.setqCont .sl:after{content:"."}
.setqCont .mark{float:right}
.setqCont .remove{background-color:rgba(220,0,0,0.3);padding:1px 4px;font-size:0.8em;text-transform:uppercase;position:absolute;right:0;top:18px;}
.setqCont .remove:hover{background-color:rgba(220,0,0,1);}
.setqCont .or{text-align:center;font-size:1.1em;padding-right:8%}
.setqCont .question p{margin:0}
.setqCont ol{padding-left:20px;list-style:none;counter-reset:alpha;position:relative}
.setqCont li{margin:5px 0;position:relative}
.setqCont li:before{position:absolute;top:0;left:-18px;counter-increment:alpha;content:"(" counter(alpha, lower-alpha)") ";}
.appendQ{padding:2px 5px;background-color:#390;}
.deleteQset{padding:2px 5px;background-color:#c30;margin:0 4px}
.complete{position:fixed;bottom:50px;right:10px;background-color:#099;text-transform:uppercase;font-size:1.2em;padding:10px 20px;background-color:rgba(0,150,150,0.3)}
.complete:hover{background-color:rgba(0,150,150,1)}

#flashMsg{position:fixed;background-color:rgba(0,0,0,0.8);height:100%;width:100%;z-index:90000;top:0;box-sizing:border-box;display:none;transition: visibility 0s, opacity 0.5s linear;}
#flashMsg .msg{background-color:#fff;padding:10px 20px;border:solid 2px #999;border-radius:2px;color:#000;position: fixed;min-width:180px;top: 50%;left: 50%;transform: translate(-50%, -50%);}
form label a{text-transform:none;color:#0df;margin-left:10px}
.trumbowyg-editor table {width: 100%; }
.trumbowyg-editor table td {border: 1px dotted #ddd;padding: 8px; }
.trumbowyg-dropdown-table table {margin: 10px;display: inline-block; }
.trumbowyg-dropdown-table table td {display: inline-block;height: 20px;width: 20px;margin: 1px;padding: 0;background-color: #fff;box-shadow: 0 0 0 1px #cecece inset; }
.trumbowyg-dropdown-table table td.active {background-color: #00b393;box-shadow: none;cursor: pointer; }
.trumbowyg-dropdown-table .trumbowyg-table-size {text-align: center; }

.qcont .question iframe{width:640px;height:360px}
.pagename{display:none;margin: 0;color: #999;position: absolute;z-index: 11;top: 50px;text-transform: uppercase;padding-left:5px}
.readonly{background-color:#fffcf6;border:solid 1px #f3f3f3;display:inline-block;padding:3px 5px;margin-right:5px}
.econtent .qcont{padding-left:30px}
.econtent .qcont .sl{width:25px}
.flexQ{display:flex;flex-wrap:wrap;justify-content: space-between;}
.flexQ .qcont{padding:20px;width:640px}
.flexQ .register{background-color:transparent;color:#03f;padding:0;margin:0;font-style:italic;}
/* responsive layout */

@media (max-width: 960px)
{
	#formSection, #contentTop{width:auto}
	.box{width:29%;padding:2%;float:left;min-height:250px;}
}

/*@media (max-width: 820px)
{
	#formSection, #contentTop{width:100%}
	.box{width:29%;padding:2%;float:left;min-height:250px;}
}
*/
@media (max-width: 765px)
{

	#formSection, #contentTop{width:100%}
	.box{width:44%;padding:3%}
	.dbox,.dbox.colspanTwo{width:98%;display:block;margin-top:10px}
	.dbox.full ol{column-count:2}
	#formSection .box{border-bottom:solid 1px #ccc;}
	#formSection section:nth-child(2){background-color:rgba(150, 180, 100, 1);border:none;}
	#formSection section:nth-child(4){border:none}
    .popFormCont{position:absolute;}
	header nav{right: auto;bottom: auto;left: 50%;top:100px;margin-left: -184px;}
	footer{height: auto;font-size:0.9em}

	.calendarTbl .leaveList{list-style:decimal;column-count:1;cursor:default}
	
	.calView, .tabular{padding:0 5px;}
	table {border: 0;}
	/*table thead {display: none;}*/
    .tabular table th {display:block;}
	.tabular table tr {margin-bottom: 10px; display: block; border:1px solid #9cf}
    .tabular table tr:after {content: "";display: table;clear: both;}
    .tabular table tr:before { display: block;}
    .tabular table td {box-sizing: border-box; display: block; float: left; clear: left; width: 100%;text-align: left; font-size: 13px;}
	.tabular table td.sl{position:absolute;border-radius:10px;width:20px;height:20px;text-align:center;margin:-6px;color:#000;background-color:#cdf;line-height:16px;padding:0;border:solid 1px #9cf;border-width:1px 0 0 1px}
	.tabular table td.hd{background-color:#cdf;color:#000;padding-left:12px}
    .tabular table td:last-child {border-bottom: 0;}
    .tabular table td:before {content: attr(data-label); font-style: italic; text-transform: initial; font-weight: bold;}
	.tabBtn {display:block; padding: 7px 10px; text-align: center;}
	.tabBtn.on { background-color: #9c9; color: #000; padding: 7px 10px; Text-transform:uppercase;}
	.calendarTbl td.onLeave a{display:none}
	.calendarTbl .staffNm,.calendarTbl .staffNm small{display:block}
	.settingsMenu{top:65px}
	.tabular h3, .calView h3{margin:8px 0}

	#slideCont #clientFieldsCont .field, #clientDetails .field,.basicInfo .photo{float:none;width:92%}
	.basicInfo .photo{margin-bottom:10px}
	#slideCont .saveBtn{right:8%}

	.searchForm{text-align:center;padding:10px}
	.searchForm input[type='submit']{position:static}
	.searchForm select[name="subject"]{width:55%}
	.searchForm input[name="searchKey"],.searchForm select[name="topic"]{width:100%}
	.qcont .question iframe{width:426px;height:240px}
}

@media (max-width: 500px)
{
	.myAccount .mainCont{padding-left:20px;}
	a.swLogo{top:0;left:0;width:100%;text-align:center;margin:0px}
	/*.myAccount a.swLogo{position:absolute}*/
	a.swLogo{position:fixed;background-color:#000;z-index:10}
	.login #loginSec{width:auto}
	header{height:140px;background:transparent}
	#loginInfo{float:none;margin:0px;text-align:center;padding:10px;background-color:#333;position:absolute;top:70px;width:100%;box-sizing:border-box}
	#loginInfo .btns{position:fixed;z-index:10}
	#formSection, #contentTop, footer{width:100%}
	.box{float:none;display:block;width:auto;padding:20px;min-height:auto}
	#formSection .box{border-bottom:solid 1px #ccc;}
	#formSection .box:last-child{border:none}
	.popFormCont{position:fixed;width:95%;top:8px;height:95%;overflow:auto} 
	.popFormCont .field{width:98%}
	.popFormCont label,.popFormCont input,.popFormCont select,.popFormCont textarea{text-align:center}
	.tabular{padding:0 5px;}
	.tabular .hide{display:none}

    #mobileMenu{display: block;z-index: 99;}
	.toggleMobile{position: fixed;top:8px;left:5px;display: block;width:30px;height:28px;cursor: pointer;z-index: 999;}
	.toggleMobile span.menu1, .toggleMobile span.menu2, .toggleMobile span.menu3{display: block;position: absolute;width:30px;height:4px;left: 0;background: #996;border-radius:3px;
			-webkit-transition: all 0.35s cubic-bezier(0.75, 0.25, 0.10, 0.95);
			transition: all 0.35s cubic-bezier(0.75, 0.25, 0.10, 0.95);
	}
	.toggleMobile span.menu1{top: 0;}
	.toggleMobile span.menu2{top: 10px;}
	.toggleMobile span.menu3{top: 20px;}
	.toggleMobile.active span.menu1{top: 10px;-webkit-transform: rotate(45deg);-moz-transform: rotate(45deg);-o-transform: rotate(45deg);-ms-transform: rotate(45deg);transform: rotate(45deg);-webkit-transition: all 0.35s cubic-bezier(0.75, 0.25, 0.10, 0.95);transition: all 0.5s cubic-bezier(0.75, 0.25, 0.10, 0.95);}
	.toggleMobile.active span.menu2{-webkit-transform: rotate(-45deg);-moz-transform: rotate(-45deg);-o-transform: rotate(-45deg);-ms-transform: rotate(-45deg);transform: rotate(-45deg);-webkit-transition: all 0.35s cubic-bezier(0.75, 0.25, 0.10, 0.95);transition: all 0.5s cubic-bezier(0.75, 0.25, 0.10, 0.95);}
	.toggleMobile.active span.menu3{opacity: 0;-webkit-transition: opacity 0.35s cubic-bezier(0.75, 0.25, 0.10, 0.95);transition: opacity 0.35s cubic-bezier(0.75, 0.25, 0.10, 0.95);}
	nav.main{display:none;}

	.tblTop {background-color: #f6f6f6; margin-top: 20px; padding: 5px;}
	 /*RESPONSIVE FOR TABLE IN MOBILE VIEW*/

	table {border: 0;}
	.tabular table thead{display:none}
    .tabular table tr {margin-bottom: 10px; display: block;}
    .tabular table tr:after {content: "";display: table;clear: both;width:100%}
    .tabular table tr:before { display: block;   border-bottom: none;}
    .tabular table td {box-sizing: border-box; display: block; float: left; clear: left; width: 100%; text-align: left; font-size: 13px;border-bottom: 1px dotted #ccc:}
	.tabular table td.sl{position:absolute;border-radius:10px;width:20px;height:20px;text-align:center;margin:-6px;color:#000;background-color:#cdf;line-height:16px;padding:0;border:solid 1px #9cf;border-width:1px 0 0 1px}
	.tabular table td.hd{background-color:#cdf;color:#000;padding-left:12px}
	.tabular table td:last-child {border-bottom: 0;}
    .tabular table td:before {content: attr(data-label); font-style: italic; text-transform: initial; font-weight: bold;}

	.sideNav{position:relative;padding:0;width:100%;height:35px;z-index:10}
	#sideNav:before{content:'Class';position:absolute;padding:10px;font-family:'jura';font-size:1.2em;text-transform:uppercase;z-index:101;}
	/*.sideNav:after{content:' ';position:absolute;right:10px;bottom:0;border:solid 5px #000;border-left-color:transparent;border-right-color:transparent;border-bottom:none;z-index:101}*/
	.sideNav .after:after{content:'\25BC';position:absolute;right:10px;bottom:0;padding:10px;background-color:rgba(255,255,255,0.2);z-index:101;cursor:pointer}
	.sideNav .after.on:after{content:'\25B2';}
	.sideNav .after:hover:after{background-color:rgba(0,0,0,0.8);color:#fff}
	.sideNav ul{position:absolute;background-color:#333;width:100%;z-index:100}
	.sideNav li a{display:none;text-align:center}
	.sideNav li a.on,.sideNav li a.vis{display:block}
	.sideNav li a.on{background-color:#fff;}

	#slideCont .field{width:50%;margin-right:0;padding:0 5px}
	#slideCont .field.colspanTwo,#slideCont .field.full,#slideCont .field input,#slideCont .field select{width:100%}
	.qcont .question img{max-width:100%}
	.dbox.colspanTwo ol{column-count:1}
	.dbox.full ol{column-count:1}
	.qcont .question iframe{width:100%;height:auto}
	.flexQ{display:block}.flexQ .qcont{width:100%;box-sizing:border-box}
	.pagename{display:block}
}