/* here you can put your own css to customize and override the theme */
/* MARGINS & PADDINGS */
.p-xxs {
    padding: 5px;
}

.p-xs {
    padding: 10px;
}

.p-sm {
    padding: 15px;
}

.p-m {
    padding: 20px;
}

.p-md {
    padding: 25px;
}

.p-lg {
    padding: 30px;
}

.p-xl {
    padding: 40px;
}

.p-w-xs {
    padding: 0 10px;
}

.p-w-sm {
    padding: 0 15px;
}

.p-w-m {
    padding: 0 20px;
}

.p-w-md {
    padding: 0 25px;
}

.p-w-lg {
    padding: 0 30px;
}

.p-w-xl {
    padding: 0 40px;
}

.m-xxs {
    margin: 2px 4px;
}

.m-xs {
    margin: 5px;
}

.m-sm {
    margin: 10px;
}

.m {
    margin: 15px;
}

.m-md {
    margin: 20px;
}

.m-lg {
    margin: 30px;
}

.m-xl {
    margin: 50px;
}

.m-n {
    margin: 0 !important;
}

.m-l-none {
    margin-left: 0;
}

.m-l-xs {
    margin-left: 5px;
}

.m-l-sm {
    margin-left: 10px;
}

.m-l {
    margin-left: 15px;
}

.m-l-md {
    margin-left: 20px;
}

.m-l-lg {
    margin-left: 30px;
}

.m-l-xl {
    margin-left: 40px;
}

.m-l-n-xxs {
    margin-left: -1px;
}

.m-l-n-xs {
    margin-left: -5px;
}

.m-l-n-sm {
    margin-left: -10px;
}

.m-l-n {
    margin-left: -15px;
}

.m-l-n-md {
    margin-left: -20px;
}

.m-l-n-lg {
    margin-left: -30px;
}

.m-l-n-xl {
    margin-left: -40px;
}

.m-t-none {
    margin-top: 0;
}

.m-t-xxs {
    margin-top: 1px;
}

.m-t-xs {
    margin-top: 5px;
}

.m-t-sm {
    margin-top: 10px;
}

.m-t {
    margin-top: 15px;
}

.m-t-md {
    margin-top: 20px;
}

.m-t-lg {
    margin-top: 30px;
}

.m-t-xl {
    margin-top: 40px;
}

.m-t-n-xxs {
    margin-top: -1px;
}

.m-t-n-xs {
    margin-top: -5px;
}

.m-t-n-sm {
    margin-top: -10px;
}

.m-t-n {
    margin-top: -15px;
}

.m-t-n-md {
    margin-top: -20px;
}

.m-t-n-lg {
    margin-top: -30px;
}

.m-t-n-xl {
    margin-top: -40px;
}

.m-r-none {
    margin-right: 0;
}

.m-r-xxs {
    margin-right: 1px;
}

.m-r-xs {
    margin-right: 5px;
}

.m-r-sm {
    margin-right: 10px;
}

.m-r {
    margin-right: 15px;
}

.m-r-md {
    margin-right: 20px;
}

.m-r-lg {
    margin-right: 30px;
}

.m-r-xl {
    margin-right: 40px;
}

.m-r-n-xxs {
    margin-right: -1px;
}

.m-r-n-xs {
    margin-right: -5px;
}

.m-r-n-sm {
    margin-right: -10px;
}

.m-r-n {
    margin-right: -15px;
}

.m-r-n-md {
    margin-right: -20px;
}

.m-r-n-lg {
    margin-right: -30px;
}

.m-r-n-xl {
    margin-right: -40px;
}

.m-b-none {
    margin-bottom: 0;
}

.m-b-xxs {
    margin-bottom: 1px;
}

.m-b-xs {
    margin-bottom: 5px;
}

.m-b-sm {
    margin-bottom: 10px;
}

.m-b {
    margin-bottom: 15px;
}

.m-b-md {
    margin-bottom: 20px;
}

.m-b-lg {
    margin-bottom: 30px;
}

.m-b-xl {
    margin-bottom: 40px;
}

.m-b-n-xxs {
    margin-bottom: -1px;
}

.m-b-n-xs {
    margin-bottom: -5px;
}

.m-b-n-sm {
    margin-bottom: -10px;
}

.m-b-n {
    margin-bottom: -15px;
}

.m-b-n-md {
    margin-bottom: -20px;
}

.m-b-n-lg {
    margin-bottom: -30px;
}

.m-b-n-xl {
    margin-bottom: -40px;
}

.space-15 {
    margin: 15px 0;
}

.space-20 {
    margin: 20px 0;
}

.space-25 {
    margin: 25px 0;
}

.space-30 {
    margin: 30px 0;
}

.login .content .forget-form, .login .content .register-form {
    display: block
}

.dashboard-stat2-no-padding {
    padding: 0;
}

.checkbox-style {
    padding-left: 20px !important;
}

.page-spinner-bar {
    margin-left: 0;
    position: inherit;
}

.ic-element-list .list-default.ic-list-container {
    border-left: 1px solid;
    border-right: 1px solid;
    border-bottom: 1px solid;
    border-color: #e7ecf1;
    padding: 0;
}
.ic-element-list .list-default.ic-list-head {
    padding: 10px 15px;
    border-bottom: 1px solid;
    border-color: #e7ecf1;
    background: #eee;
}
.ic-element-list .list-default.ic-list-container ul {
    margin-bottom: 0;
    padding: 0;
}

.ic-element-list .list-default.ic-list-container ul > .ic-list-item {
    list-style: none;
    border-bottom: 1px solid;
    border-color: #e7ecf1;
    padding: 15px;
    position: relative;
}

.ic-element-list .list-default.ic-list-container ul > .ic-list-item:last-child {
    border: none;
}

.ic-element-list .list-default.ic-list-container ul > .ic-list-item:hover {
    background-color: #f9fafb;
    cursor: pointer;
}

.ic-element-list .list-default.ic-list-container ul > .ic-list-item.active {
    background-color: #f3f4f6;
}
.ic-element-list .list-default.ic-list-container ul > .ic-list-item > .list-icon-container {
    font-size: 14px;
    float: left;
    width: 75px;
}
.ic-element-list .list-default.ic-list-container ul > .ic-list-item > .list-icon-container a {
    color: #34495e;
    text-decoration: none;
}

.ic-element-list .list-default.ic-list-container ul > .ic-list-item > .list-icon-container a:hover {
    color: #26C281;
    text-decoration: none;
}
.ic-element-list .list-default.ic-list-container ul > .ic-list-item > .list-item-content {
    padding: 0 75px 0 60px;
}
.ic-element-list .list-default.ic-list-container ul > .ic-list-item > .list-item-content > h3 {
    margin: 0;
    font-size: 14px;
}
.ic-element-list .list-default.ic-list-container ul > .ic-list-item > .list-item-content > a {
    color: #34495e;
    text-decoration: none;
}

.ic-element-list .list-default.ic-list-container ul > .ic-list-item > .list-item-content > a:hover {
    color: #26C281;
    text-decoration: none;
}

.ic-element-list .list-default.ic-list-container ul > .ic-list-item > .list-right-col {
    text-align: right;
    float: right;
    width: 60px;
}
/*  list tickets */
.ic-element-list .list-default.list-tickets.ic-list-container ul > .ic-list-item:first-child {
    border-top: 1px solid;
    border-color: #e7ecf1;
}

.ic-element-list .list-default.list-tickets.ic-list-container ul > .ic-list-item > .list-right-col {
    font-size: 20px;
    position: absolute;
    right: 5px;
    top: 50%;
    margin-top: -15px;
}

.ic-element-list .list-default.list-tickets.ic-list-container ul > .ic-list-item > .list-item-content {
    padding: 0 25px 10px 0;
}
.ic-element-list .list-tickets.list-tickets.ic-list-container ul > .ic-list-item > .list-icon-container {
    font-size: 20px;
    position: absolute;
    right: 5px;
    top: 50%;
    margin-top: -15px;
    width: 30px;
}
.ic-element-list .list-default.list-tickets.ic-list-container ul > .ic-list-item > .list-item-footer {
    padding-bottom: 15px;
}
/*  list orders */
.ic-element-list .list-default.list-orders.ic-list-head {
    padding: 10px 15px;
    border-bottom: 1px solid;
    border-color: #e7ecf1;
    color: #327ad5;
    background-color: #e0ebf9;
}
.ic-element-list .list-default.list-orders.ic-list-container ul > .ic-list-item {
    min-height: 110px;
}
.ic-element-list .list-default.list-orders.ic-list-container ul > .ic-list-item > .list-icon-container {
    float: left;
    width: 80px;
    height: 80px;
}
.ic-element-list .list-default.list-orders.ic-list-container ul > .ic-list-item > .list-icon-container > .list-icon {
    display: block;
    max-height: 100%;
    max-width: 100%;
    margin: 0 auto;;
}
.ic-element-list .list-default.list-orders.ic-list-container ul > .ic-list-item > .list-item-content {
    padding: 0 110px 0 95px;
}
.ic-element-list .list-default.list-orders.ic-list-container ul > .ic-list-item > .list-item-content .product-price {
    margin: 5px 0;
}
.ic-element-list .list-default.list-orders.ic-list-container ul > .ic-list-item > .list-right-col {
    font-size: 12px;
    width: 110px;
}
/* ticket detail */
.ic-ticket-caption, .ic-ticket-rating {
    border-bottom: 1px solid;
    border-color: #e7ecf1;
}

.ic-ticket-rating {
    border-bottom: 1px solid;
    border-color: #e7ecf1;
    padding-bottom: 10px;
}

.ic-message {
    position: relative;
}

.ic-message p {
    margin: 10px 0;
}

.ic-message-status {
    padding-top: 3px;
}

.ic-message-body p {
    margin: 0;
    font-size: 13px;
}

.ic-message-body p:last-child {
    margin-bottom: 0;
}

.ic-message-body {
    padding: 15px 30px 15px 15px;
    border-left: 4px solid #eee;
    border-radius: 0 4px 4px 0;
}

.ic-message-body.message-success {
    background-color: #c0edf1;
    border-color: #58d0da;
    color: #000;
}

.ic-message-body.message-info {
    background-color: #f5f8fd;
    border-color: #8bb4e7;
    color: #010407;
}

.ic-message-body.message-warning {
    background-color: #faeaa9;
    border-color: #f3cc31;
    color: #000;
}

.fileinput-button {
    position: relative;
    overflow: hidden;
    display: inline-block;
}

.fileinput-button input {
    position: absolute;
    top: 0;
    right: 0;
    margin: 0;
    opacity: 0;
    -ms-filter: 'alpha(opacity=0)';
    font-size: 200px;
    direction: ltr;
    cursor: pointer;
}

.ic-tasklist-date {
    color: #637b89 !important;
    margin-right: 12px;
}

.ic-comment-username {
    font-size: 14px;
    color: #2b4a5c;
    font-weight: 600;
}

.ic-comment-date, .ic-comment-file {
    font-size: 12px;
    color: #2b4a5c;
    font-weight: 400;
}

#notification-list_container li ul li a {
    padding-bottom: 25px;
}

#notification-list_container li ul li a:hover {
    text-decoration: none;
}

#notification-list_container li ul li a .time {
    float: left;
    max-width:200px;
    background: none;
}
/*.date-picker > div {*/
    /*display: block !important;*/
/*}*/

/*.react-datepicker {*/
    /*font-size: 1.3rem !important;*/
/*}*/

/*.react-datepicker__current-month {*/
    /*font-size: 1.5rem !important;*/
/*}*/

/*.react-datepicker__header {*/
    /*padding-top: 6px !important;*/
/*}*/

/*.react-datepicker__navigation {*/
    /*top: 13px !important;*/
/*}*/

/*.react-datepicker__day-name, .react-datepicker__day {*/
    /*margin: 0.5rem !important;*/
/*}*/

#switch-language {
    height: 30px;
    margin-top: -4px;
}

.ic-repayment {
    font-size: 14px;
}
.ic-repayment .ic-repayment-title {
}
.ic-repayment .ic-repayment-body .ic-repayment-row {
    position: relative;
    padding-top: 5px;
    padding-bottom: 5px;
    display: table;
    width: 100%;
}

.ic-repayment .ic-repayment-body .ic-repayment-row > .ic-repayment-period {
    display: table-cell;
    width: 20%;
}
.ic-repayment .ic-repayment-body .ic-repayment-row > .ic-repayment-content {
    display: table-cell;
    width: 50%;
}
.ic-repayment .ic-repayment-body .ic-repayment-row.ic-row-header {
    font-weight: 600;
}
.ic-repayment .ic-repayment-body .ic-repayment-row.ic-row-item > .ic-repayment-content:before {
    content: '';
    position: absolute;
    display: block;
    width: 2px;
    background-color: #333;
    top: 0;
    bottom: 0;
    margin-left: 5px;
}
.ic-repayment .ic-repayment-body .ic-repayment-row.ic-row-item.complete > .ic-repayment-content:before {
    background-color: #26C281;
}
.ic-repayment .ic-repayment-body .ic-repayment-row.ic-row-item.partial > .ic-repayment-content:before {
    background-color: #f9e491;
}
.ic-repayment .ic-repayment-body .ic-repayment-row.ic-row-item.delay > .ic-repayment-content:before {
    background-color: #ed6b75;
}
.ic-repayment .ic-repayment-body .ic-repayment-row.ic-row-item:nth-child(2) > .ic-repayment-content:before {
    margin-top: 15px;
}
.ic-repayment .ic-repayment-body .ic-repayment-row.ic-row-item:last-child > .ic-repayment-content:before {
    margin-bottom: 15px;
}
.ic-repayment .ic-repayment-body .ic-repayment-row > .ic-repayment-content > .ic-repayment-icon {
    display: inline-block;
    position: absolute;
    width: 20px;
}
.ic-repayment .ic-repayment-body .ic-repayment-row > .ic-repayment-content > .ic-repayment-principle {
    display: inline-block;
    padding-left: 20px;
}
.ic-repayment .ic-repayment-body .ic-repayment-row > .ic-repayment-paid {
    display: table-cell;
    width: 30%;
}
@media (max-width: 767px) {
    .ic-ticket-devider {
        display: block;
        height: 20px;
        margin: 20px -10px;
        background: #F1F3FA;
    }
    .ic-orders-devider {
        display: block;
        height: 2px;
        margin: 20px -10px;
        background: #F1F3FA;
    }
}

.portlet.light.bordered {
    border: 1px solid #e7ecf1;
}
.ui.radio.checkbox {
    margin-top: 0px;
    margin-bottom: 0px;
}
.ui.checkbox label::before, .ui.checkbox label::after {
    margin-left: 0px;
}
.ui.checkbox input[type="checkbox"]:checked + label::after,
.ui.checkbox input[type="radio"]:checked + label::after {
    font-family: "Checkbox";
}
.page-header.navbar.navbar-fixed-top {
    z-index: 3;
}
.react-datepicker__input-container {
    display: block;
}
/*!
 * https://github.com/YouCanBookMe/react-datetime
 */

.rdt {
    position: relative;
}
.rdtPicker {
    display: none;
    position: absolute;
    width: 250px;
    padding: 4px;
    margin-top: 1px;
    z-index: 99999 !important;
    background: #fff;
    box-shadow: 0 1px 3px rgba(0,0,0,.1);
    border: 1px solid #f9f9f9;
}
.rdtOpen .rdtPicker {
    display: block;
}
.rdtStatic .rdtPicker {
    box-shadow: none;
    position: static;
}

.rdtPicker .rdtTimeToggle {
    text-align: center;
}

.rdtPicker table {
    width: 100%;
    margin: 0;
}
.rdtPicker td,
.rdtPicker th {
    text-align: center;
    height: 28px;
}
.rdtPicker td {
    cursor: pointer;
}
.rdtPicker td.rdtDay:hover,
.rdtPicker td.rdtHour:hover,
.rdtPicker td.rdtMinute:hover,
.rdtPicker td.rdtSecond:hover,
.rdtPicker .rdtTimeToggle:hover {
    background: #eeeeee;
    cursor: pointer;
}
.rdtPicker td.rdtOld,
.rdtPicker td.rdtNew {
    color: #999999;
}
.rdtPicker td.rdtToday {
    position: relative;
}
.rdtPicker td.rdtToday:before {
    content: '';
    display: inline-block;
    border-left: 7px solid transparent;
    border-bottom: 7px solid #428bca;
    border-top-color: rgba(0, 0, 0, 0.2);
    position: absolute;
    bottom: 4px;
    right: 4px;
}
.rdtPicker td.rdtActive,
.rdtPicker td.rdtActive:hover {
    background-color: #428bca;
    color: #fff;
    text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.25);
}
.rdtPicker td.rdtActive.rdtToday:before {
    border-bottom-color: #fff;
}
.rdtPicker td.rdtDisabled,
.rdtPicker td.rdtDisabled:hover {
    background: none;
    color: #999999;
    cursor: not-allowed;
}

.rdtPicker td span.rdtOld {
    color: #999999;
}
.rdtPicker td span.rdtDisabled,
.rdtPicker td span.rdtDisabled:hover {
    background: none;
    color: #999999;
    cursor: not-allowed;
}
.rdtPicker th {
    border-bottom: 1px solid #f9f9f9;
}
.rdtPicker .dow {
    width: 14.2857%;
    border-bottom: none;
}
.rdtPicker th.rdtSwitch {
    width: 100px;
}
.rdtPicker th.rdtNext,
.rdtPicker th.rdtPrev {
    font-size: 21px;
    vertical-align: top;
}

.rdtPrev span,
.rdtNext span {
    display: block;
    -webkit-touch-callout: none; /* iOS Safari */
    -webkit-user-select: none;   /* Chrome/Safari/Opera */
    -khtml-user-select: none;    /* Konqueror */
    -moz-user-select: none;      /* Firefox */
    -ms-user-select: none;       /* Internet Explorer/Edge */
    user-select: none;
}

.rdtPicker th.rdtDisabled,
.rdtPicker th.rdtDisabled:hover {
    background: none;
    color: #999999;
    cursor: not-allowed;
}
.rdtPicker thead tr:first-child th {
    cursor: pointer;
}
.rdtPicker thead tr:first-child th:hover {
    background: #eeeeee;
}

.rdtPicker tfoot {
    border-top: 1px solid #f9f9f9;
}

.rdtPicker button {
    border: none;
    background: none;
    cursor: pointer;
}
.rdtPicker button:hover {
    background-color: #eee;
}

.rdtPicker thead button {
    width: 100%;
    height: 100%;
}

td.rdtMonth,
td.rdtYear {
    height: 50px;
    width: 25%;
    cursor: pointer;
}
td.rdtMonth:hover,
td.rdtYear:hover {
    background: #eee;
}

.rdtCounters {
    display: inline-block;
}

.rdtCounters > div {
    float: left;
}

.rdtCounter {
    height: 100px;
}

.rdtCounter {
    width: 40px;
}

.rdtCounterSeparator {
    line-height: 100px;
}

.rdtCounter .rdtBtn {
    height: 40%;
    line-height: 40px;
    cursor: pointer;
    display: block;

    -webkit-touch-callout: none; /* iOS Safari */
    -webkit-user-select: none;   /* Chrome/Safari/Opera */
    -khtml-user-select: none;    /* Konqueror */
    -moz-user-select: none;      /* Firefox */
    -ms-user-select: none;       /* Internet Explorer/Edge */
    user-select: none;
}
.rdtCounter .rdtBtn:hover {
    background: #eee;
}
.rdtCounter .rdtCount {
    height: 20%;
    font-size: 1.2em;
}

.rdtMilli {
    vertical-align: middle;
    padding-left: 8px;
    width: 48px;
}

.rdtMilli input {
    width: 100%;
    font-size: 1.2em;
    margin-top: 37px;
}


#notification-call-reminder ul.call-reminder {
    min-width: 350px;
    max-height: 450px;
    overflow-y: auto
}
.call-reminder li.remind-item {
    border-bottom: 1px solid #a7abb2;
    padding: 5px;
}
.call-reminder li.remind-item:hover{
    background-color: #fdfdfd;
}
.remind-item .cr-left h3 {
    margin-top: 10px;
}
.remind-item .cr-item {
    display: block;
    clear: both;
}
.remind-item .cr-item:after {
    clear: both;
}
.remind-item .cr-left {
    width: 35%;
    float: left;
    text-align: center;
}
.remind-item .cr-left a {
    font-size: xx-large;
    text-align: center;
}
.remind-item .cr-right {
    width: 65%;
    float: left;
    margin-top: 0px !important;
}

.btn-edit {
    line-height: 1 !important;
    margin-left: 20px;
    background-color: #4183c5;
    border-color: #4183c5;
    border-radius: 5px !important;
}

.no-pdl {
    padding-left: 0 !important;
}

.no-pdr {
    padding-right: 0 !important;
}
.display-in-flex {
    display: inline-flex !important;
}
.min-height-200 {
    min-height: 200px !important;
}

.m-r-lg-important {
    margin-right: 30px !important;
}

.has-error .form-control {
    border-color: #e73d4a !important;
}

.col-half-offset.col-md-2 {
    margin-right: 3.3%;
}

.select-grace-period {
    width: 40% !important;
}