html,
body {
height: 100%;
padding: 0;
}
::selection {
background: #333333; /* WebKit/Blink Browsers */
color: white;
}
::-moz-selection {
background: #333333; /* Gecko Browsers */
color: white;
}
.container-fluid,.maincontainer{
height: 100vh;
}
ul{
list-style-type: none;
}
input.parsley-success,
select.parsley-success,
textarea.parsley-success {
color: #468847;
background-color: #DFF0D8;
border: 1px solid #D6E9C6;
display: block;
}
input.parsley-error,
select.parsley-error,
.parsley-type,
textarea.parsley-error {
color: #B94A48;
background-color: #F2DEDE;
border: 1px solid #EED3D7;
display: inline-block;
}
.parsley-errors-list {
margin: 2px 0 3px;
padding: 0;
list-style-type: none;
font-size: 9px;
line-height: 0.9em;
opacity: 0;
transition: all .3s ease-in;
-o-transition: all .3s ease-in;
-moz-transition: all .3s ease-in;
-webkit-transition: all .3s ease-in;
display: block;
}
.parsley-errors-list.filled {
opacity: 1;
}
input.parsley-type, .parsley-required, .parsley-equalto, .parsley-pattern, .parsley-length{
color:#ff0000;
display: block;
list-style: none;
font-size: 12px;
}
ul.parsley-errors-list{
display: block;
}
.card {
border: 1px solid #ccc;
}
/* .card-login {
padding: 18px;
max-width: 30rem;
}*/
.card-header {
color: #fff;
background: #fff;
font-family: sans-serif;
font-size: 20px;
font-weight: 600 !important;
margin-top: 10px;
border-bottom: 0;
}
.input-group-prepend span{
width: 50px;
background-color: #ff0000;
color: #fff;
border:0 !important;
}
input:focus{
outline: 0 0 0 0 !important;
box-shadow: 0 0 0 0 !important;
}
input{
display: inline;
}
.login_btn{
width: 130px;
}
.login_btn:hover{
color: #fff;
background-color: #ff0000;
}
.btn-outline-danger {
color: #fff;
font-size: 18px;
background-color: #28a745;
background-image: none;
border-color: #28a745;
}
.formlabel{
display: inline;
font-family: Open Sans;
color: #464649;
font-size: 16px;
text-align: left;
}
.form-control {
display: inline;
width: 100%;
height: calc(2.25rem + 2px);
padding: 0.375rem 0.75rem;
font-size: 12px;
font-family: Open Sans;
/*line-height: 1.1;*/
color:#464649;
background-color: transparent;
background-clip: padding-box;
border: 1px solid #ccc;
border-radius: 8px;
transition: border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
}
.input-group-text {
display: -ms-flexbox;
display: flex;
-ms-flex-align: center;
align-items: center;
padding: 0.375rem 0.70rem;
margin-bottom: 0;
font-size: 1.5rem;
font-weight: 700;
line-height: 1.2;
color: #fff;
text-align: center;
white-space: nowrap;
background-color: #336bff;
border: 1px solid #ced4da;
border-radius: 0;
}
#loginemail,#loginpword{
height: 45px;
}
.vh-100{
height: 100vh;
}
.logindiv{
margin-left: 50px;
}
.bgdiv{
/*width: 105%;*/
height: 100vh !important;
box-shadow: 5px 0px 5px #888888;
background-image: url('http://support.symphony.co.ke/assets/images/techsupport2.png');
background-repeat: no-repeat;
background-size: cover;
background-position: center center;
/*background-size: 400px 500px;*/
/* background-color: gray;*/
}
.sidemenubardiv{
background-color:inherit;
height: auto;
min-height:620px;
width:225px;
border-right:1px solid #dddddf;
padding-left: 1px;
}
@media screen and (max-width: 600px) {
.welcomediv{
background-image: url('http://support.symphony.co.ke/assets/images/bgimage-min.jpg');
background-repeat: no-repeat;
background-size: 400px 500px;
visibility: hidden;
clear: both;
float: left;
margin: 10px auto 5px 20px;
/*width: 28%;*/
display: none;
}
}
.welcomediv{
background-color: black;
}
.guidetext{
font-family: Open Sans;
font-size: 60px;
text-align: center;
/*color: #900C3F;*/
color: #fff;
margin-top: 100px;
}
.statusmsg{
display: none;
margin-top: 10px;
margin-right: auto;
margin-left: auto;
max-width: 600px;
}
.overlay{
width: 100%;
height: 100%;
/*background-color: #fff;*/
background-color: #949494;
opacity: 0.8;
position: absolute;
z-index: 200;
display: none;
}
.masteroverlay{
width: 100%;
height: 100%;
background-color: #fff;
opacity: 0.6;
position: absolute;
z-index: 500;
display: none;
}
#productstabl,#inventorytabl{
width: 1150px;
margin-right: auto;
margin-left: auto;
}
table tbody tr td
{
max-width: 100px;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
table#productstable tbody tr,
table#supplylisttable tbody tr,
table#supplylisttable thead tr,
table#quoteitemstable thead tr,
table#quoteitemstable tbody tr
table#generalsalestable tbody tr,
table#generalsalestable thead tr
table#productstable thead tr,
table#inventorytable thead tr,
table#inventorytable tbody tr
{
height: 15px;
}
table#userstable tbody tr td
{
line-height: 15px;
height: 15px;
}
table#userstable thead tr th{
height: 20px;
line-height: 20px;
text-align: left;
font-family: Open Sans;
}
.sorting{
border-bottom: 1px solid #ccc;
}
table#productstable tbody tr td ,
table#productstable thead tr th,
table#generalsalestable tbody tr td,
table#generalsalestable thead tr th,
table#inventorytable tbody tr td,
table#inventorytable thead tr th,
table#userstable thead tr th
table#userstable tbody tr td{
line-height: 30px;
font-size:13px;
font-family: Open Sans;
}
table#productstable tbody tr:hover,
table#generalsalestable tbody tr:hover,
table#inventorytable tbody tr:hover,
table#userstable tbody tr:hover{
/* background-color: #3383ff;*/
color: #fff;
font-weight: bold;
}
#userstable{
/*width: 800px;*/
}
.userstatus{
float: right;
font-size: 12px;
}
.menucontainer{
width: auto;
min-width: 600px;
height: auto;
min-height: 100px;
background-color: #fff;
border: 1px solid #ccc;
border-radius: 8px;
position: fixed;
z-index: 250;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
display: none;
background-color: #fff;
box-shadow:
0 2.8px 2.2px rgba(0, 0, 0, 0.034),
0 6.7px 5.3px rgba(0, 0, 0, 0.048),
0 12.5px 10px rgba(0, 0, 0, 0.06),
0 22.3px 17.9px rgba(0, 0, 0, 0.072),
0 41.8px 33.4px rgba(0, 0, 0, 0.086),
0 100px 80px rgba(0, 0, 0, 0.12);
}
.newproductcontainer, .newusercontainer,.newcallcontainer,.servicecontainer,.servicelist,.newcontractcontainer, .newquotecontainer{
width: 80%;
height: auto;
min-height: 400px;
border-radius: 8px;
position: fixed;
z-index: 250;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
display: none;
background-color: #fff;
box-shadow:
0 2.8px 2.2px rgba(0, 0, 0, 0.034),
0 6.7px 5.3px rgba(0, 0, 0, 0.048),
0 12.5px 10px rgba(0, 0, 0, 0.06),
0 22.3px 17.9px rgba(0, 0, 0, 0.072),
0 41.8px 33.4px rgba(0, 0, 0, 0.086),
0 100px 80px rgba(0, 0, 0, 0.12);
}
.newclientcontainer,.claimscontainer{
width: 800px;
height: auto;
min-height: 300px;
border-radius: 8px;
position: fixed;
z-index: 250;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
display: none;
background-color: #fff;
box-shadow:
0 2.8px 2.2px rgba(0, 0, 0, 0.034),
0 6.7px 5.3px rgba(0, 0, 0, 0.048),
0 12.5px 10px rgba(0, 0, 0, 0.06),
0 22.3px 17.9px rgba(0, 0, 0, 0.072),
0 41.8px 33.4px rgba(0, 0, 0, 0.086),
0 100px 80px rgba(0, 0, 0, 0.12);
}
.form-row{
margin-top: 10px;
}
.btn{
margin-left: 10px;
margin-right: auto;
/* float: right;*/
}
.fa-ban,.fa-floppy-o{
font-size: 5px;
}
.form-control{
display: inline;
}
button.btn{
font-size: 12px;
/* float: right;*/
}
#addproducts{
float: left;
}
fieldset {
border: 1px groove #ddd !important;
padding: 0 1.4em 1.4em 1.4em !important;
margin: 0 1.5em 1.5em 1.5em !important;
border-radius: 8px;
-webkit-box-shadow: 0px 0px 0px 0px #000;
box-shadow: 0px 0px 0px 0px #000;
}
legend {
width:80%; /* Or auto */
padding:10px 10px;
margin:10px 10px 10px 10px;
font-family: Open Sans;
font-size: 16px;
color: #494646 ;
text-align: left !important;
}
.fa-database,.fa-file-text{
font-size: 12px;
margin-left: 3px;
}
.addproductstock{
width: 100px;
min-height: 100px;
height: auto;
}
.divider{
width: auto;
max-width: 1000px;
height: 2px;
background-color: #ccc;
border-radius: 4px;
}
.tablecard{
width: 1200px;
margin-left: auto;
margin-right: auto;
border-radius: 8px;
background-color: #fff;
height: auto;
min-height: 550px;
}
.table tbody tr:hover td{
background-color: #0a18a4; /* Dark grey background on mouse-over */
color: white;
}
.dataTables_filter{
margin-top: 10px;
}
.dataTables_filter input{
border-radius: 8px;
border:1px solid #ccc;
line-height: 10px;
margin-right: 10px;
height: 40px;
}
.dataTables_filter label{
font-family: Open Sans;
}
.formrow{
margin-bottom: 10px;
margin-top: 6px;
}
.contentrow{
background-color: #fff;
width: auto;
height: auto;
min-height: 60px;
line-height: 50px;
vertical-align: middle;
border-radius: 8px;
margin-top: 20px;
}
#adduserbtn,#manageuserbtn{
margin-top: 5px;
}
#cancelbtn,#addstockbtn{
float: right;
margin-top: 20px;
}
#Cancelproductbtn,#saveitemBtn,#savecsrBtn,#printcsrBtn, #deletecsrBtn{
/*float: right;*/
margin-top: 20px;
}
.buttons-csv{
/*
background-image: url('assets/images/bgimage-min.jpg');
background-repeat: no-repeat;
background-size: 10px 10px;
border-radius: 4px;*/
}
#searchbox{
background-color: #fff;
border-radius:8px;
height: 50px;
line-height: 10px;
font-weight: bold;
font-size: 20px;
text-align: left;
font-family: Open Sans;
}
.searchicon{
float: right;
margin-right: 6px;
margin-top: -40px;
position: relative;
z-index: 2;
color: #ccc;
}
#salelist{
width: 1250px;
margin-left: auto;
margin-right: auto;
}
table#salelist thead tr th, table#salelist tbody tr td{
font-size: 20px;
}
table#salelist tbody tr td{
height: 10px;
/*line-height: 5px;*/
}
.salelistcard{
height: 450px;
overflow-y: scroll;
}
#totalsale{
font-weight: bolder;
font-family: Open Sans;
font-size: 40px;
line-height: 15px;
height: 70px;
background-color: #fff;
}
.paymentbtn{
height: 70px;
font-size: 200px;
font-weight: bold;
}
#mpesabtn{
background-image: url('assets/images/mpesa.png');
background-repeat: no-repeat;
/* background-size: 250px 100px;*/
background-size: contain;
background-position: 150px 5px;
border:3px solid #3ad54a;
}
.td-productname{
max-width: 100px;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.fa-times{
color: red;
font-size: 15px;
}
.fa-times:hover{
color: red;
}
.del-item{
font-size: 10px;
text-align: left;
border:none;
background-color: inherit;
}
.del-item:hover{
cursor: pointer;
}
.td-remove{
width: 15px;
font-size: 10px;
}
.td-code{
width: 200px;
}
.td-num{
width: 50px;
}
#totalsaletext,#cashtext,#changetext{
font-family: Open Sans;
font-size: 50px;
font-weight: bolder;
height: 80px;
line-height: 20px;
}
#executesalebtn{
font-family: Open Sans;
font-size: 40px;
line-height: 20px;
padding: 20px 20px 20px 20px;
}
.execlabel{
font-size: 40px;
font-weight: bolder;
font-family: Open Sans;
}
.btnaction{
background-color: #fff;
height: auto;
min-height: 60px;
align-items: center;
line-height: 60px;
/*vertical-align: middle;*/
/*padding-left: 5px;*/
border-radius: 8px;
}
.date{
align-items: center;
line-height: 60px;
vertical-align: middle;
}
.input-group-addon{
border:1px solid #ccc;
border-top-right-radius:8px;
border-bottom-right-radius:8px;
height: 38px;
width: 50px;
align-items: center;
line-height: 38px;
}
.reportactionbtn{
margin-left: 0;
margin-right: 0;
width: 110px;
}
.fa-calendar{
text-align: center;
padding-top: 2px;
padding-left: 5px;
color: #787575;
}
.table-condensed tbody tr:hover{
background-color: unset;
}
.table-condensed tbody tr td:hover{
/*background-color: #ccc;*/
cursor: pointer;
}
#employees{
width: 180px;
margin-top: 10px;
}
.header{
border-right: 1px solid #ccc;
text-align: center;
}
.reportscard{
border-right: none;
margin-top: 10px;
}
.searchbar{
background-color: #fff;
width:102%;
}
.rightsidecontainer{
width:90%;
height:90%;
}
.list-group-item{
}
.list-group{
margin-left:auto;
margin-right:auto;
width:100%;
height:100%;
}
.list-group-item:hover{
background-color: #ccc;
color:#fff;
}
.revenuediv{
width:90%;
height:70%;
min-width: 50%;
min-height: 40%px;
border-radius: 8px;
box-shadow: 2px 2px 3px #ccc;
background-color: #fff;
margin-bottom: 15px;
}
.card-title{
width: 100%;
height: 40px;
background-color: #5b69b6;
opacity: 0.8;
color: #fff;
text-indent: 10px;
border-top-right-radius: 8px;
border-top-left-radius: 8px;
}
.charttext{
text-indent: 10px;
font-weight: bold;
font-family: Open Sans;
}
.heading-text{
font-weight: bolder;
font-family: Open Sans;
text-align: center;
margin-top: 100px;
}
.tablediv{
width: 100%;
height: auto;
max-height: 250px;
overflow-y: scroll;
overflow-x: hidden;
}
#supplylisttable{
width: 100%;
}
.closedialog{
width: 40px;
height: 40PX;
position: absolute;
top: 0;
right: 0;
color: #fff;
background-color: #f6040f;
text-align: center;
border-top-right-radius:8px;
font-weight: bolder;
}
.closedialog:hover{
background-color: #fff;
border: 1px solid #f6040f;
color: #f6040f;
cursor: pointer;
}
table#supplylisttable tbody tr,table#supplylisttable tbody tr td, table#quoteitemstable tbody tr td
{
border: 1px solid #ccc;
height: 30px;
}
table#supplylisttable thead tr, table#quoteitemstable thead tr{
border-radius: 8px;
border: 1px solid #ccc;
height: 40px;
background-color: #ccc;
}
table#supplylisttable thead tr th, table#quoteitemstable thead tr th{
border: 1px solid #8e8989;
text-align: center;
}
table#supplylisttable tbody tr:hover, table#quoteitemstable thead tr:hover{
/* background-color: #ccc;*/
color: #000;
}
.deleterow:hover{
cursor: pointer;
}
.fa-trash-o{
font-size: 10px;
color: #f2190b;
}
.fa-plus-square{
font-size: 16px;
color: #1ca748;
}
#grandtotal{
font-size: 20px;
font-weight: bolder;
text-indent: 2px;
}
.liner{
width: 100%;
height: 3px;
border-radius: 8px;
background-color: #000;
margin-top: 3px;
margin-bottom: 5px;
}
table tbody tr td{
line-height: 40px;
}
table thead tr{
font-family: Open Sans;
}
table thead tr th{
line-height: 40px;
}
table tbody tr:hover{
background-color: #000;
color: #fff;
font-weight: bold;
}
.logospan2{
width: 400px;
height: 100px;
background-image: url('http://support.symphony.co.ke/assets/images/primepos.png');
background-repeat: no-repeat;
background-size: cover;
background-position: center center;
border-radius: 20px;
background-color: #fff;
margin-left: auto;
margin-right: auto;
}
.letterheadlogo{
width: 200px;
height: 80px;
background-image: url('assets/images/primepos.png');
background-repeat: no-repeat;
background-size: contain;
background-position: center center;
background-color: #fff;
float: right;
margin-top: 3px;
background-color: red;
}
.ui-autocomplete, .ui-timepicker-container{
z-index: 1000 !important;
}
.ui-datepicker{ z-index:99999 !important; }
.h1{
font-weight: bolder;
font-family: Open Sans;
color: #ac33ff;
font-size: 25px;
text-align: justify-all;
}
.var_text2{
font-size: 25px;
}
.csrprintout{
margin-left: auto;
margin-right: auto;
width: 700px;
height: 800px;
border:2px solid #000;
background-color: #fff;
}
.maintext{
font-family: Open Sans;
font-weight: bolder;
font-size: 12px;
}
.var_text{
font-family: Open Sans;
font-weight: lighter;
font-size: 12px;
}
table#csritemstable thead tr th{
height: 40px;
font-weight: bold;
line-height: 40px;
text-align: center;
border:1px solid #000;
}
table#csritemstable tbody tr td{
height: 4px;
line-height: 40px;
}
tr.bg-info td{
color: #fff;
}
#attachmentstable, #quoteattachmentstable{
width: 100%;
border-spacing: 5px 8px;
}
#attachmentstable thead tr th{
/* min-width:50px;*/
font-family: Open Sans;
font-weight: bold;
font-size: 12px;
border-bottom: 1px solid #ccc;
text-align: center;
}
#attachmentstable tbody tr{
border-bottom: 1px solid #ccc;
}
#attachmentstable tbody tr:hover{
background-color: #fff;
color: #000;
}
#attachmentstable tbody tr td{
padding-top: 5px;
text-align: center;
}
.downloadbtn{
border:none;
text-align: center;
width: 30px;
height: 30px;
border-radius: 4px;
background-color: #fff;
}
.fa-download{
font-size: 8px;
}
.fa-download:hover{
color: #335fff;
}
#menutable{
float: right;
}
#menutable tr td{
height: 30px;
width: 100px;
}
#menutable tr:hover{
/*background-color: unset;*/
color: black;
}
.menutitle{
font-weight: bolder;
}
.deletebtn{
background-color: #fff;
border:none;
}
.deletefile{
color: #000;
}
.deletefile:hover{
color: red;
}
.deletebtn:hover{
color: red;
}
.pageheader{
font-weight: bolder;
font-family: Open Sans;
color: #947aef;
text-align: center;
font-size: 30px;
margin-left: auto;
margin-right: auto;
}
#faultreported,#optionalmsg,#findings,#recommendations,#actiontaken{
height: 80px;
}
table#techlisttable{
width: 100%;
}
table#techlisttable thead tr th{
background-color: #ccc;
color: #000;
font-family: Open Sans;
font-weight: bold;
height: 8px;
line-height: 8px;
}
table#techlisttable tbody tr td{
height: 8px;
line-height: 8px;
font-size: 12px;
border:1px solid #ccc;
}
table#ticketstable tbody tr td, table#clientstable tbody tr td{
height: 25px;
line-height: 25px;
padding-top: 5px;
}
table#ticketstable thead tr th, table#clientstable thead tr th{
text-align: left;
font-family: Open Sans;
height: 25px;
line-height: 25px;
}
table#servicelisttable thead tr th, table#servicelisttable tbody tr td{
text-align: left;
font-family: Open Sans;
height: 8px;
line-height: 8px;
}
table#servicelisttable tbody tr:hover{
cursor: pointer;
}
#notification{
margin-left: 4px;
}
.ticketstablecontainer{
margin-top: auto;
margin-right: auto;
width: 1200px;
}
.fa{
font-size: 3px;
}
.paginate_button{
border-radius: 8px;
}
.userstablecontainer{
margin-left: auto;
margin-right: auto;
width: 600px;
border-radius: 8px;
height: auto;
}
#updateticketBtn{
float: right;
}
table#jobcardattachmentstable tbody tr:hover{
background-color: inherit;
cursor: pointer;
}
#savecontractBtn, #cancelcontractbtn{
float: right;
}
textarea#comment{
min-height: 80px;
}
table#contractstable thead tr th{
text-align: left;
font-family: Open Sans;
font-size: 12px;
border: 1px solid #ccc;
height: 15px;
line-height: 15px;
}
table#maintenance_scheduletable{
width: 100%;
margin-top: 10px;
margin-bottom: 10px;
}
#maintenance_scheduletable thead tr th{
text-align: left;
font-family: Open Sans;
font-size: 12px;
border: 1px solid #ccc;
height: 15px;
line-height: 15px;
}
table#recipientslist{
width: 100%;
height: auto;
}
table#recipientslist tbody tr td{
height: 8px;
line-height: 8px;
font-size: 9px;
text-align: center;
}
#recipientslist thead th{
height: 5px;
line-height: 5px;
font-size: 9px;
text-align: center;
font-weight: bold;
border:1px solid #ccc;
}
#printquoteBtn,#savequoteBtn,#cancelquotebtn,#quoteupgradeBtn{
margin-top: 10px;
}
#quoteupgradeBtn{
margin-left: 50px;
}
#quotegrandtotal{
font-family: Open Sans;
font-weight: bolder;
font-size: 30px;
text-align: center;
}
#quotationstable thead tr th{
text-align: left;
font-family: Open Sans;
}
.pagelayout{
width: auto;
margin-left: auto;
margin-right: auto;
margin-top: 5px;
margin-bottom: 5px;
max-width: 800px;
height:auto;
min-height: 900px;
background-color: #fff;
border:1px solid #000;
border-radius: 4px;
}
.tableholder{
margin-left: auto;
margin-right: auto;
border-radius: 8px;
}
#quotetableitems tbody tr td{
border:1px solid #ccc;
font-size: 12px;
text-align: left;
height: 8px;
line-height: 8px;
}
#printcsritemstable thead tr th{
font-size: 15px;
text-align: left;
}
#printcsritemstable tbody tr td.data-cell0{
text-align: center;
}
#printcsritemstable tbody tr td.data-cell1{
text-align: left;
}
#printcsritemstable tbody tr td.data-cell{
text-align: right;
}
.logoholder{
width: 200px;
height: 100px;
float: right;
}
.text-center{
text-align: center;
}