/*Invioce Details*/
.pe-canvas-container {
    max-width: 110rem;
    height: auto;
    width: 100%;
    min-width: 99.1rem;
    margin: 4rem auto;
    padding: 0rem 1rem;
}

.shadow-box {
    /*box-shadow: 0 0.3rem 1rem 0.3rem rgb(0, 0, 0, 0.1);*/
    border-radius: 0.5rem;
    height: 76%;
    background: #FFF;
}

.box-padding {
    padding: 3rem 0 2rem 1rem !important;
    margin-top: 30px;
}

.detail-label {
    font-size: 1.8rem;
    text-align: left;
    margin-bottom: 0;
    margin-top: -3px;
    color: #212121;
}

.size-25p {
    font-size: 2.5rem !important;
}

.weight-400 {
    font-weight: 400;
}

.weight-600 {
    font-weight: 600;
}

.ml-30 {
    margin-left: 3rem !important;
}

.ml-10 {
    margin-left: 1rem !important;
}

.mt-20 {
    margin-top: 2rem !important;
}

.margin-top-bottom-20 {
    margin-top: 20px;
    margin-bottom: 40px;
}

.size-20p {
    font-size: 2rem;
}

.flex-switch {
    flex-direction: row;
}

.flex-column {
    -ms-flex-direction: column !important;
    flex-direction: column !important;
}

.justify-content-start {
    justify-content: flex-start !important;
}

.justify-content-center {
    -ms-flex-pack: center !important;
    justify-content: center !important;
}

.align-items-center {
    -ms-flex-align: center !important;
    align-items: center !important;
}

.align-items-start {
    -ms-flex-align: start !important;
    align-items: flex-start !important;
}

.align-self-center {
    -ms-flex-item-align: center !important;
    align-self: center !important;
}

.align-items-baseline {
    -ms-flex-align: baseline !important;
    align-items: baseline !important;
}

.justify-content-around {
    -ms-flex-pack: distribute !important;
    justify-content: space-around !important;
}

.justify-content-between {
    -ms-flex-pack: justify !important;
    justify-content: space-between !important;
}

.d-flex {
    display: -ms-flexbox !important;
    display: flex !important;
}

.bill-desc:first-of-type {
    font-weight: 600;
    font-size: 1.6rem;
}

.price-box {
    width: 130px;
    height: 70px;
    display: flex;
    justify-content: center;
    align-items: center;
    background-color: #f5f6f7;
    position: relative;
    border-radius: 1rem;
}

    .price-box.plus {
        background-color: #001e74;
    }

    .price-box.epay {
        background-color: #7d8eb1;
    }

.price-label {
    width: 100px;
    text-align: center;
    word-wrap: break-word;
    font-size: 17px;
    color: #FFFFFF;
    line-height: 1.6;
}

.form-placeholder {
    width: inherit;
    margin-top: 3rem;
    position: relative;
    z-index: 1;
}

.type-box-lg {
    min-width: 5.5rem;
    width: 15.5rem;
    height: 15rem;
    border: 2px solid #ACB7C1;
    border-radius: 0.5rem;
    font-size: 4rem;
    color: #ACB7C1;
}

.pill-label {
    margin-left: 1rem;
    color: #212121;
}

.primary {
    color: #2285D0 !important;
}

.invoice-status {
    width: auto;
    min-width: 300px;
    margin-top: -3rem;
    margin-left: 15rem;
}

.detail-label {
    font-size: 1.8rem;
    text-align: left;
    margin-bottom: 0;
    margin-top: -3px;
    color: #212121;
}

.badge-success {
    color: #fff;
    background-color: #28a745;
}

.shadow-box-grid {
    padding: 10px !important;
    /*box-shadow: 0 0.3rem 1rem 0.3rem rgb(0, 0, 0, 0.1);*/
    border-radius: 0.5rem;
    height: 80%;
    background: #fff;
}

#DeductionGridSummarry table thead.k-grid-header tr th, #PayrunInvoiceGridSummarry table thead.k-grid-header tr th {
    font-weight: 700 !important;
}

#DeductionGridSummarry.k-grid th, #PayrunInvoiceGridSummarry.k-grid th {
    padding: 16px 24px !important;
    direction: ltr !important;
}

#DeductionGridSummarry.k-grid td, #PayrunInvoiceGridSummarry.k-grid td, #DeductionGridSummarry.k-grid th, #PayrunInvoiceGridSummarry.k-grid th {
    padding: 10px 24px;
    border-style: solid;
    outline: 0;
    font-weight: inherit;
    text-align: inherit;
    overflow: hidden;
    text-overflow: ellipsis;
    border-width: 0 0 1px 1px;
}

@media (min-width: 992px) and (max-width: 1200px) {
    .pe-canvas-container {
        width: 100%;
        max-width: 99.1rem;
        min-width: inherit;
        margin: 4rem auto;
    }

    .pe-form-group {
        text-align: right;
    }

    .invoice-status {
        width: min-content;
        min-width: 300px;
        margin-top: -3rem;
        margin-left: 10rem;
    }
}

@media (min-width: 769px) and (max-width: 991px) {
    .pe-canvas-container {
        width: 100%;
        max-width: 99.1rem;
        min-width: inherit;
        margin: 4rem auto;
        overflow-x: visible;
    }


    .invoice-status {
        width: min-content;
        min-width: 300px;
        margin-top: -3rem;
        margin-left: 10rem;
    }
}

@media (min-width: 576px) and (max-width: 768px) {
    .pe-canvas-container {
        width: 100%;
        max-width: 99.1rem;
        min-width: inherit;
        margin: 4rem auto;
        overflow-x: visible;
    }

    .invoice-status {
        width: min-content;
        min-width: 200px;
        margin-top: 0rem;
        margin-left: 0rem;
    }

    .pe-form-group {
        text-align: right;
    }

    .mobile-row-mt {
        border-left: 0 !important;
        flex-direction: column;
        margin-top: 10rem;
    }
}

@media (max-width: 575px) {
    .portlet-title {
        flex-direction: column
    }

        .portlet-title div:last-child {
            padding-right: 0px !important
        }

    .pe-canvas-container {
        width: 100%;
        max-width: 99.1rem;
        min-width: inherit;
        margin: 4rem auto;
        overflow-x: visible;
    }

    .invoice-status {
        width: min-content;
        min-width: 200px;
        margin-top: 0rem;
        margin-left: 0rem;
    }

    .pe-form-group {
        text-align: right;
    }

    .mobile-row-mt {
        border-left: 0 !important;
        flex-direction: column;
        margin-top: 10rem;
    }
}

@media (min-width: 100px) and (max-width: 768px) {
    .contanier-card-ye-mobile {
        flex-direction: column;
        width: auto;
    }

    .contanier-ye-text {
        margin-top: 3rem !important;
        width: 100%;
        padding: 0rem 1rem 1rem 1rem;
    }
}

/***/
.companyname, .elipsis-accordian, .elipsis-username {
    white-space: nowrap;
    text-overflow: ellipsis
}


.refresh-button:hover, .tab-btn:hover {
  cursor: pointer
}

.isDisabled, .point-events {
  pointer-events: none;
}

.k-loading-image, .spinningi, .spinningi2 {
  -webkit-animation: rotation .5s infinite linear
}

body {
  padding-top: 50px;
  padding-bottom: 20px;
  background-color: none !important
}

* {
  font-family: Lato, sans-serif
}

a {
  color: #0A2463
}

a:hover {
  opacity: .7
}

.header-thin {
  font-weight: 300 !important;
  color: #68696b !important;
  font-size: 25px !important
}

.data-mobile-font, .item-font {
  font-size: 12px
}

.header-underline {
  border-bottom: 1px solid #eef1f5
}

#sidebarCollapse, #sidebarCollapsemobile {
  width: 40px;
  height: 40px;
  background: 0 0;
  margin-top: 6px;
  border: none;
  outline-color: #fff !important;
  display: inline-block
}

#sidebarCollapsemobile {
  float: left
}

#treelist .k-tooltip, .k-widget.k-tooltip {
  color: #fff !important
}

.k-widgit {
  line-height: 1.6
}

.padding0 {
  padding-top: 0 !important;
  padding-bottom: 0 !important
}

.padding-top10 {
  padding-top: 10px !important
}

.rotated-state {
  transform: rotate(-180deg);
  -ms-transform: rotate(180deg);
  -moz-transform: rotate(-180deg);
  -webkit-transform: rotate(-180deg);
  -o-transform: rotate(-180deg);
  -webkit-transition: all .1s ease-out;
  -moz-transition: all .1s ease-out;
  -o-transition: all .1s ease-out;
  transition: all .1s ease-out
}

.chevron-rotate, .transition-ease {
  -webkit-transition: all .1s ease-out;
  -moz-transition: all .1s ease-out;
  -o-transition: all .1s ease-out;
  transition: all .1s ease-out
}

#sidebarCollapse span, #sidebarCollapsemobile span {
  width: 80%;
  height: 2px;
  display: block;
  background: #555;
  transition: all .3s cubic-bezier(.81, -.33, .345, 1.375)
}

#sidebarCollapse span {
  margin: 0 auto
}

#sidebarCollapse span:first-of-type {
  transform: rotate(45deg) translate(2px, 2px)
}

#sidebarCollapse span:nth-of-type(2) {
  opacity: 0
}

#sidebarCollapse span:last-of-type {
  transform: rotate(-45deg) translate(1px, -1px)
}

#sidebarCollapse.active span {
  transform: none;
  opacity: 1;
  margin: 5px auto
}

#sidebarCollapsemobile span {
  margin: 0 auto
}

#sidebarCollapsemobile span:first-of-type {
  transform: rotate(45deg) translate(2px, 2px)
}

#sidebarCollapsemobile span:nth-of-type(2) {
  opacity: 0
}

#sidebarCollapsemobile span:last-of-type {
  transform: rotate(-45deg) translate(1px, -1px)
}

#sidebarCollapsemobile.active span {
  transform: none;
  opacity: 1;
  margin: 5px auto
}

.listscroll {
  overflow: hidden
}

:root .scroller, _:-ms-fullscreen {
  overflow-y: scroll
}

.scroller, _:-ms-lang(x), _:-webkit-full-screen {
  overflow-y: scroll
}

.scroller:hover {
  overflow-y: overlay
}

.listscroll:hover, .scroll-y {
  overflow-y: scroll
}

.listscroll::-webkit-scrollbar {
  width: 8px !important
}

::-webkit-scrollbar {
  width: 10px !important
}

::-webkit-scrollbar-track {
  background: #f1f1f1
}

::-webkit-scrollbar-thumb {
  background: rgba(136, 136, 136, .35);
  border-radius: 8px
}

.listscroll::-webkit-scrollbar-thumb:hover {
  background: #555
}

.scroller::-webkit-scrollbar-thumb:hover {
  background: #555
}

.scroll-y {
  -ms-overflow-style: scrollbar
}

.body-content {
  padding-left: 15px;
  padding-right: 15px
}

.billing-column, .height70 {
  height: 70px
}

.lineheight3 {
  line-height: 3 !important
}

.background-red {
  background: rgba(251, 143, 148, .1) !important
}

.background-green {
  background: rgba(76, 175, 80, .1) !important
}

.red-font {
  color: #f8333c !important
}

.green-font {
  color: #4caf50
}

.money-in-icon {
  display: inline-block;
  margin-right: 10px;
  margin-left: 10px;
  color: #4caf50;
  line-height: .9 !important
}

.item-for-billing {
  display: inline-block;
  line-height: 2 !important
}

.navbar {
  margin-bottom: 0 !important
}

.page-header.navbar .top-menu .navbar-nav>li.dropdown-user .dropdown-toggle {
  background: 0 0 !important
}

@media screen and (max-width:991px) {
    .tablet-padding-top {
        padding-top: 50px !important;
    }
  #sidebarCollapse, #sidebarnav {
    display: none
  }

  .dropdown-tasks {
    display: none !important
  }

  .mobile-hide-menu {
    display: none;
    position: fixed !important;
    top: 50px;
    left: 0;
    transition: all .1s ease-out
  }

    #prof_con, #prof_con_cli {
        margin-top: 50px !important;
    }
}

@media screen and (min-width:991px) {
  .page-logo {
    width: 270px !important
  }

  #navmobilebutton {
    display: none !important
  }
}

@media screen and (max-width:991px) {
  #navmobilebutton {
    display: inline-block !important;
    float: left
  }
}
.badge {

  border-radius: 5px!important;
}
.Danger-status, .Expired-status, .New-status, .Processed-status, .Success-status, .Warning-status, .expired-status, .new-status, .null-status, .processed-status, .Pending-status {
    border-radius: 5px !important;
    font-size: 11px;
    width: fit-content;
    padding: 2px 5px 2px 5px !important;
    display: inline-flex;
    text-transform: uppercase;
}

.New-status, .new-status {
  background-color: #7CB7E3!important;

}

.Expired-status, .null-status {
  background: #eef7ff;
  color: rgba(0, 0, 0, .87)
}

.New-status, .Processed-status, .new-status, .processed-status {
  color: #fff
}

.Expired-status {
  color: rgba(0, 0, 0, .87)
}

.Danger-status, .Success-status, .Warning-status, .expired-status {
  color: #fff
}

.Warning-status, .expired-status {
  background: #F75C03
}

.Danger-status {
  background: #f8333c
}

.Processed-status, .Success-status, .processed-status {
  background: #4caf50
}

.avitarbackground0, .avitarbackground1, .avitarbackground2, .avitarbackground3, .avitarbackground4, .avitarbackground5, .avitarbackground6, .avitarbackground7, .avitarbackground8, .avitarbackground9 {
  opacity: .5
}

.avitarbackground1 {
  background: #F75C03
}

.avitarbackground2 {
  background: #2285D0
}

.avitarbackground3 {
  background: #4CAF50
}

.avitarbackground4 {
  background: #F8333C
}

.avitarbackground5 {
  background: #DC0073
}

.avitarbackground6 {
  background: #0A2463
}

.avitarbackground7 {
  background: #317033
}

.avitarbackground8 {
  background: #48525C
}

.avitarbackground9 {
  background: #F5B700
}

.avitarbackground0 {
  background: #78003F
}

.span-spacing {
  margin-right: 3px
}

.profile-buttons, .profile-cancel {
  width: 100%;
  margin-bottom: 3px
}

.payroll-actions {
  margin-left: auto;
  margin-right: auto
}

.btn.btn-outline.blue:active, .btn.btn-outline.blue:active:hover, .btn.btn-outline.blue:focus {
  background-color: #F75C03;
  opacity: .8
}

.k-grouping-header .k-link, .k-grouping-header .k-link:link {
  color: #0A2463 !important
}

#Grid3.k-grid .k-header > a:hover, #Grid3.k-grid .k-header > span:hover, #Grid4.k-grid .k-header > a:hover, #Grid4.k-grid .k-header > span:hover, #client_kendo.k-grid .k-header > a:hover, #InvoiceListGrid.k-grid .k-header > a:hover, #epayClient.k-grid .k-header > a:hover, .item-font {
    color: #737A77 !important
}

.k-group-indicator {
  border-radius: 5px
}

.k-grouping-row td, td.k-group-cell {
  background-color: #FFF !important
}

#Grid3.k-grid .k-header > a:hover, #Grid3.k-grid .k-header > span:hover, #Grid4.k-grid .k-header > a:hover, #Grid4.k-grid .k-header > span:hover, #client_kendo.k-grid .k-header > a:hover, #InvoiceListGrid.k-grid .k-header > a:hover, #epayClient.k-grid .k-header > a:hover, #epayClient.k-grid .k-header > span:hover {
    opacity: 1 !important;
    transition: all .7s ease-out
}

.btn-primary {
  background: #061436 !important
}


#epayClient.k-grid .k-header>span:hover {
  color: #737A77 !important;
  transition: all .7s ease-out
}


.headerheight {
  height: 10px !important
}

#Grid1.k-grid td, #Grid3.k-grid td, #Grid4.k-grid td, #client_fs.k-grid td, #client_kendo.k-grid td, #InvoiceListGrid.k-grid td, #epayClient.k-grid td, #grid-fullscreen.k-grid td, .border-bottom {
    border-bottom: 1px solid #edf1f5 !important;

}

.responsive-actions {
  min-width: 463px
}

.inline-block {
  display: inline-block !important
}

.Danger-stripe, .Processed-stripe, .Success-stripe, .Warning-stripe {
  height: 97px;
  position: absolute;
  width: 3px;
  display: inline-block;
  margin-left: -7px;
  margin-top: -5px
}

.Processed-stripe, .Success-stripe {
  background-color: #4caf50
}

.Danger-stripe {
  background-color: #f8333c
}

.Warning-stripe {
  background-color: #F75C03
}

.danger-stripe, .success-stripe, .warning-stripe {
  height: 100%;
  padding-top: 17px;
  padding-bottom: 6px;
  width: 3px;
  display: inline-block;
  margin-left: -7px
}

.success-stripe {
  background-color: #4caf50
}

.danger-stripe {
  background-color: #f8333c
}

.warning-stripe {
  background-color: #F75C03
}

.danger-icon, .success-icon, .warning-icon {
  display: inline-block;
  margin-right: 10px;
  margin-left: 15px
}

.danger-icon {
  color: #f8333c
}

.warning-icon {
  color: #F75C03
}

.success-icon {
  color: #4caf50
}

.danger-background {
  background: rgba(251, 143, 148, .2) !important
}

.warning-background {
  background: rgba(249, 215, 116, .2) !important
}

.success-background, .success-background1 {
  background: rgba(119, 255, 123, .2) !important
}

.payroll-amount-font {
  text-align: right;
  font-weight: 700;
  font-size: 16px;
  color: #737A77
}

.k-grid {
  -moz-border-radius: 5px;
  -webkit-border-radius: 5px;
  border-radius: 5px;
  overflow: hidden
}

.k-grouping-header {
  -moz-border-radius: 5px 5px 0 0;
  -webkit-border-radius: 5px 5px 0 0;
  border-radius: 5px 5px 0 0;
  overflow: hidden
}

.k-grid-pager {
  -moz-border-radius: 0 0 5px 5px;
  -webkit-border-radius: 0 0 5px 5px;
  border-radius: 0 0 5px 5px;
  overflow: hidden
}

.page-sidebar-closed .page-sidebar .sidebar-search.open .remove>i {
  margin-left: 12px;
  color: #fff !important
}

#magnifier {
  color: #fff
}

#searchClients::placeholder {
  color: #d0d0d0;
  opacity: 1
}

.heightchange {
  max-height: 46px !important
}

@media screen and (max-width:320px) {
  .custom_padding {
    padding: 1px
  }
}

.tab-btn, .tag {
  padding-top: 2px !important
}

@media screen and (max-width:767px) {
  .textcentered-mobile {
    text-align: center !important
  }
}

@media screen and (max-width:799px) {
  .k-grouping-header {
    display: none !important
  }
}

.tab-buttons {
  margin-top: 6px
}

.filter-buttons {
  background-color: #fff;
  border: 1px solid #e0e0e0;
  color: #333;
  border-radius: 23px !important
}

.tag {
  padding-bottom: 2px !important;
  border-radius: 20px !important;
  border: 1px solid #e0e0e0
}

.active-tag {
  background-color: #eef7ff;
  box-shadow: 0 2px 2px 0 rgba(0, 0, 0, .16), 0 0 0 1px rgba(0, 0, 0, .08) !important;
  border: none
}

.filter-buttons:hover, .panel {
  box-shadow: none !important
}

.active>a {
  background-color: #F75C03 !important;
  color: #fff !important
}


.active>.tab-btn, .tab-btn {
  background-color: rgba(0, 0, 0, 0) !important
}

.tab-btn {
  padding-bottom: 11px !important;
  margin-right: 20px
}

.padding-tab-fix {
  padding-bottom: 21px !important
}

.tab-btn:hover {
  opacity: .8
}

.active>.tab-btn {
  color: #0A2463 !important;
  font-weight: 700 !important;
  border-bottom: 3px solid #0A2463
}

.desc, .feeds li {
  font-weight: 400
}

.elipsis-accordian {
  overflow: hidden;
  max-width: 400px
}

@media (min-width:991px) and (max-width:1350px) {
  .elipsis-accordian {
    max-width: 100px !important
  }
}

@media (min-width:431px) and (max-width:610px) {
  .elipsis-accordian {
    max-width: 200px !important
  }
}

@media (max-width:430px) {
  .elipsis-accordian {
    max-width: 100px !important
  }
}

.elipsis-username {
  overflow: hidden;
  max-width: 204px
}

.elipsis-toptile {

  line-height: 1.8
}

@media (max-width:430px) {
  .elipsis-username {
    max-width: 100px !important
  }
}

.filter-buttons:hover {
  background-color: #F75C03;
  border: 1px solid #F75C03;
  color: #fff
}

.refresh-date {
  display: inline;
  margin-left: -15px
}

.refresh-button {
  margin-left: 10px;
  margin-right: 0px;
}



.run-pay {
  background: 0 0 !important;
  border: 1px solid #e0e0e0 !important;
  color: #061436 !important
}

.run-pay:hover {
  background: #0A2463 !important;
  color: #fff !important;
  border: 1px solid rgba(255, 0, 0, 0) !important
}

.warning-button {
  border: 1px solid #F75C03 !important;
  color: #F75C03 !important
}

.warning-button:hover {
  background: #F75C03 !important;
  color: #fff !important;
  border: 1px solid rgba(255, 0, 0, 0) !important
}

.danger-button {
  border: 1px solid #f8333c !important
}

.danger-button:hover {
  border: 1px solid rgba(255, 0, 0, 0) !important
}

.fs_txtbx {
  max-width: 150px !important
}

.desc, .txt_clr {
  font-size: 14px !important
}

.font-xl {
  font-size: 12px !important
}

.morrischart {
  bottom: 10px;
  width: 33%
}

.morris-position {
  position: absolute;
  left: -152px
}

.mt-font {
  font-size: 10px
}

.mt-stats {
  bottom: 26px;
  position: relative
}

@media (min-width:320.5px) and (max-width:575.98px) {
  .addheight {
    height: 500px !important
  }

  .fs_txtbx {
    max-width: 100px !important
  }

  .tile_txtbx {
    max-width: 200px !important
  }

  .desc {
    width: 250px;
    max-height: inherit;
    font-size: 12px !important
  }

  .tstcls {
    display: none !important
  }

  .font-xl {
    font-size: 14px !important
  }

  .emp_pos {
    position: inherit;
    top: 30px;
    right: 220px
  }

  .mt-font {
    font-size: 12px
  }

  .mt-stats {
    bottom: 26px;
    position: relative
  }
}

.desc, .ticket_description {
  display: flex;
  -ms-word-break: break-all;
  -ms-hyphens: auto;
  -moz-hyphens: auto;
  -webkit-hyphens: auto;
  overflow-wrap: break-word;
  word-wrap: break-word
}

#formsubmit_loader, #mouse_over, #mouse_over1 {
  display: none
}

.date, .desc, .pos_desc {
  position: relative
}

@media (min-width:576px) and (max-width:767.98px) {
  .addheight {
    height: 600px !important
  }

  .desc {
    width: 450px
  }

  .fs_txtbx {
    max-width: 150px !important
  }

  .font-xl {
    font-size: 14px !important
  }

  .mt-stats {
    bottom: 26px;
    position: relative
  }

  .page-content-wrapper .page-content {
    margin-left: 570px
  }

  .page-sidebar.collapse {
    width: 570px
  }
}

@media (max-width:766px) {
  .page-content-wrapper .page-content {
    padding: 20px 10px 10px !important
  }

  .page-container {
    margin: 0 !important
  }
    .tablet-padding-top {
        padding-top: 50px !important;
    }
}

@media (min-width:991px) and (max-width:1600px) {
  .general-item-list>.item>.item-body {
    margin-left: 55px !important;
    margin-right: 100px;
    color: #444 !important
  }
}

@media (min-width:768px) and (max-width:991.98px) {
  .desc {
    font-size: 13px !important
  }

  .addheight {
    height: 600px !important
  }

  .fontsize {
    font-size: 14px;
    line-height: 1.8 !important
  }

  .emp_pos {
    right: 270px
  }

  .morrischart {
    z-index: 10000
  }

  .font-xl {
    font-size: 18px !important
  }

  .mt-stats {
    bottom: 26px;
    position: relative
  }
}

@media (min-width:992px) {
  .profile-sidebar-portlet {
    margin-right: 20px !important
  }
}

.marginbottom5 {
  margin-bottom: 5px !important
}

@media (min-width:992px) and (max-width:1199.98px) {
  .desc, .txt_clr {
    font-size: 14px !important
  }

  .fs_txtbx {
    max-width: 480px !important
  }

  .addheight {
    height: 600px !important
  }

  .fontsize {
    font-size: 14px
  }

  .emp_pos {
    right: 225px !important
  }

  .custom_padding {
    padding: 1px
  }

  .morrischart {
    bottom: 10px
  }

  .font-xl {
    font-size: 12px !important
  }

  #morris_chart_0, #morris_chart_1, #morris_chart_2, #morris_chart_3, #morris_chart_4 {
    height: 150px !important
  }

  .mt-font {
    font-size: 9px
  }

  .mt-stats {
    bottom: 26px;
    position: relative
  }
}

@media (min-width:1200px)and (max-width:1600px) {
  .desc, .txt_clr, body {
    font-size: 14px !important
  }

  .addheight {
    height: 600px !important
  }

  .chat-form .input-cont .form-control {
    max-width: 250px
  }

  .fontsize {
    margin-left: 10px
  }

  .font-xl {
    font-size: 18px
  }

  .emp_pos {
    right: 220px !important
  }

  .heightchange {
    max-height: 55px !important
  }

  .morrischart {
    top: 16px
  }

  #morris_chart_0, #morris_chart_1, #morris_chart_2, #morris_chart_3, #morris_chart_4 {
    height: 210px !important
  }

  .mt-font {
    font-size: 11px
  }

  .mt-stats {
    bottom: 28px;
    position: relative
  }

  .fs_txtbx {
    max-width: 600px !important
  }

  .tile_txtbx {
    max-width: 1200px
  }
}

@media (min-width:1601px) and (max-width:1921px) {
  .addheight {
    height: 785px !important
  }

  .fontsize {
    font-size: 14px
  }

  .font-xl {
    font-size: 22px
  }

  .morrischart {
  }


  .mt-stats {
    bottom: 28px;
    position: relative
  }

  .mt-font {
    font-size: 14px
  }

  .fs_txtbx {
    max-width: 600px !important
  }
}

.profile-usermenu {
  margin-top: 32px !important
}

.desc {
  max-width: 80%;
  left: 60px;
  top: -40px;
  word-break: break-all;
  word-break: break-word;
  hyphens: auto;
  margin-left: 10px;
  margin-right: 10px;
  line-height: 1.5;
  color: #aaa
}

.date {
  float: right;
  bottom: 25px
}

.pos_desc {
  float: right;
  bottom: 40px
}

#chatform_close, .arrow_option {
  position: relative !important
}

.txt_clr {
  color: #32c5d2 !important
}

.feeds li {
  background-color: #fff !important;
  min-height: 70px;
  color: #444 !important
}

.feeds {
  margin-top: 10px
}

.margin-5 {
  margin-left: 5px
}

.arrow_option {
  float: right;
  top: -41px
}

.font-size {
  font-size: 14px !important
}

/*.setmargin {
  padding: 6px 0 !important
}*/

.marginbottom20 {
  margin-bottom: 20px
}

#position_tooltip {
  position: relative
}

#position_tooltip_fs {
  float: right;
  position: relative;
  padding-right: 5%
}

#position_tooltip #tooltip_text {
  visibility: hidden;
  width: 150px;
  height: 340px;
  background-color: #555;
  color: #fff;
  text-align: center;
  border-radius: 6px;
  padding: 5px 0;
  position: absolute;
  z-index: 100;
  top: 150%;
  left: 20%;
  margin-left: -60px;
  opacity: 1;
  transition: opacity .3s;
  overflow-y: auto
}

#position_tooltip:hover #tooltip_text {
  visibility: visible;
  opacity: 1
}

.cd-horizontal-timeline, .errorclass {
  opacity: 1 !important
}

.chat-form {
  height: 55px !important
}

.tkt_form_style {
  top: 50px !important;
  left: 50% !important;
  position: fixed !important;
  height: 937px !important;
  overflow-y: hidden !important
}

.dialog-style {
  height: 937px;
  width: 960px;
  margin: 0 !important
}

.ticket_description {
  max-width: 100%;
  word-break: break-all;
  word-break: break-word;
  hyphens: auto
}

.ticket_description_fs {
  overflow-wrap: break-word;
  word-wrap: break-word;
  -ms-word-break: break-all;
  word-break: break-all;
  word-break: break-word;
  -ms-hyphens: auto;
  -moz-hyphens: auto;
  -webkit-hyphens: auto;
  hyphens: auto;
  margin-left: 10px !important;
  margin-top: 10px;
  padding-bottom: 10px
}

.marginleft25 {
  margin-left: 25px !important
}

.marginleft5 {
  margin-left: 5px !important
}

.marginright5 {
  margin-right: 5px !important
}

.padding-top-15 {
  padding-top: 15px !important
}

.reply_btn {
  color: #F1F4F7 !important
}

.font_color {
  color: #555
}

#payrun-tile {
  max-height: 550px !important
}

#treelist .k-icon {
  margin-left: 0 !important;
  display: none
}

#sidenavbar.hovered #treelist .k-icon, #sidenavbar:hover #treelist .k-icon {
  display: inline-block
}

#treelist {
  border-radius: 0
}

tr.k-state-selected>td>.company-name {
  color: #FFF !important
}

.width {
  padding-right: 1px
}

.centered {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  height: 90px;
  width: 90px
}

.cd-horizontal-timeline .events, .emp_pos {
  top: 30px
}

.tablefont {
  font-size: 12px
}

#table_info {
  position: absolute;
  left: 250px;
  bottom: 40px;
  display: none
}

#comp_name, #page_title {
  font-variant-caps: titling-caps;
  font-weight: 400
}

.cd-horizontal-timeline .events-wrapper, .cd-horizontal-timeline .timeline {
  height: 60px
}

.emp_pos {
  position: inherit;
  right: 220px
}

.emp_pos .fa-money {
  position: absolute;
  left: 227px;
  width: auto
}

.calpos {
  position: absolute !important;
  left: 227px !important;
  width: auto !important
}

.emp_pos .icon-users {
  position: absolute;
  left: 228px;
  top: 75px
}

.custom_border {
  border: 1px solid #dcdcdc
}

.mt-widget-1 {
  height: 240px
}

.divider {
    border-bottom: 1px solid #d2cfcf;
}

.portlet-sortable-empty {
  height: 0 !important
}

.profile-sidebar-portlet {
  padding: 10px 0 0 !important
}

.profile-sidebar {
  margin-right: 0 !important
}

.profile-usermenu {
  padding-bottom: 5px !important
}

.m-grid.m-grid-demo .m-grid-col {
  background: #fff !important
}

.error {
  color: #e73d4a !important
}

.floatright {
  float: right !important
}

.floatleft {
  float: left !important
}

.applyBtn {
  float: right !important
}

.hovered-support-accordion {
  background-color: #eef7ff !important;
  border-radius: 5px
}

.accordion-toggle.chevron-rotate {
  display: block;
  width: 100%;
  height: 40px;
  line-height: 2.5
}

.mt-element-list .list-todo .list-todo-item.dark .list-toggle {
  background: #0A2463 !important;
  border-radius: 5px 5px 0 0
}

.time {
  border-radius: 5px
}

.white {
  color: #FFF !important
}

.badge-list-fix {
  margin-left: 0;
  margin-top: 3px
}

.badge-faded {
  background-color: rgba(34, 133, 208, .5) !important
}

.mt-element-list .list-todo.mt-list-container ul>.mt-list-item>.list-todo-item {
  width: 100% !important
}

.mt-element-list .list-todo.mt-list-container {
  border: none !important
}

.mt-element-list .list-todo.mt-list-container ul>.mt-list-item>.list-todo-item:after {
  display: none !important
}

.feeds li .col1>.cont>.cont-col1>.label>i {
  font-size: 12px !important
}

.dashboard-stat, .dashboard-stat2, .page-md .widget-bg-color-white, .page-md .widget-blog, .page-md .widget-carousel, .page-md .widget-map, .page-md .widget-progress-element, .page-md .widget-socials {
  box-shadow: 0 1px 1px 1px rgba(0, 0, 0, .03) !important
}

.nav-tabs>li.active>a {
  border-radius: 5px 5px 0 0
}

.feeds li, .general-item-list>.item>.item-body, .k-block, .k-content, .k-dropdown .k-input, .k-popup, .k-widget, .k-widget.feeds li, .k-widget.k-block, .ticket_description, body {
  color: rgba(0, 0, 0, .87) !important
}

.accordion-toggle, .k-block, .k-draghandle, .k-grid-header, .k-grouping-header, .k-header, .k-link, .k-pager-wrap, .k-treemap-tile, .primary-link, h1, h2, h3, h4, h5, h6, html .km-pane-wrapper {
  color: #0A2463 !important
}

h4 {
  font-weight: 600 !important;
  font-size: 15px !important
}

.daterangepicker td.active, .daterangepicker td.active:hover {
  background-color: #2285D0 !important
}

button.k-button-icontext.k-grid-excel, button.k-button-icontext.k-grid-pdf {
  background: 0 0 !important;
  border: 1px solid #e0e0e0 !important;
  color: #061436 !important
}

button.k-button-icontext.k-grid-excel:hover, button.k-button-icontext.k-grid-pdf:hover {
  background: #0A2463 !important;
  border: 1px solid #0A2463 !important;
  color: #FFF !important
}

.k-pager-numbers .k-state-selected {
    color: #2285D0 !important;
    border-color: #2285D0 transparent transparent
}

div.k-grid-header>div>table>thead>tr.k-filter-row>th:nth-child(4)>span>span>span.k-widget.k-datepicker.k-header>span>span {
  background: #fff !important
}

.k-datepicker .k-input, .k-datepicker.k-input, .k-picker-wrap.k-state-default {
  background-color: #FFF !important
}

div.k-grid-header>div>table>thead>tr.k-filter-row {
  background: #eef7ff !important
}

.k-dropdown-wrap.k-state-active, .k-dropdown-wrap.k-state-focused, .k-dropdown-wrap.k-state-hover {
  background-color: #FFF !important;
  box-shadow: none !important
}

.k-item.k-state-hover, .k-list-optionlabel.k-state-hover:hover {
  background-color: #2285D0 !important;
  color: #fff !important
}

.blog-content-2 .blog-single-content .blog-comments .c-comment-list .media-heading>a, .k-list>.k-state-selected.k-state-focused {
  color: #0A2463 !important
}

.k-popup.k-list-container {
  padding: 0 !important
}

.k-widget.k-dropdown.k-header.form-control {
  border-bottom: 1px solid #c2cad8 !important
}

.k-dropdown .k-state-default {
  background-color: #fff !important
}

.blog-content-2 .blog-single-content .blog-comments .c-comment-list .media-heading>.c-date {
  color: #9aa5b2 !important;
  font-size: 10px !important
}

.panel-default>.panel-heading+.panel-collapse>.panel-body, .panel-group .panel-heading+.panel-collapse>.list-group, .panel-group .panel-heading+.panel-collapse>.panel-body {
  border-top-color: none !important;
  border-top: none !important
}

.btn:not(.md-skip):not(.bs-select-all):not(.bs-deselect-all):not(.btn-circle) {
  text-transform: none !important;
  border-radius: 5px
}

.btn:not(.md-skip):not(.bs-select-all):not(.bs-deselect-all).btn-lg {
  padding: 12px 26px 14px 12px!important
}

.btn-success {
  color: #fff;
  background-color: #4CAF50 !important;
  border-color: none !important
}

.btn-circle {
  border-radius: 25px !important;
  box-shadow: none !important;
  border-color: #FFF !important
}

@media (min-width:992px) {
  .page-content-wrapper .page-content {
    margin-left: 235px;
    margin-top: 0;
    min-height: 600px;
    padding: 25px 45px 10px !important
  }
}

.page-content-white .page-title {
  margin-left: -15px !important
}

.dashboard-stat2, .portlet {
  margin-bottom: 30px !important;
  border-radius: 5px !important
}

.nav-tabs>li.active>a, .nav-tabs>li.active>a:focus, .nav-tabs>li.active>a:hover {
  border-top: none !important;
  border-left: none !important;
  border-right: none !important;
  border-bottom-color: #0085c7 !important
}

.dashboard-stat2, .portlet.light.bordered {
  border: none !important;
  box-shadow: none !important
}

.margin55 {
  margin-left: 55px !important
}

.margin-top11 {
  margin-top: 11px
}

.tools {
  margin-right: 30px !important;
  margin-top: 20px !important
}

.blog-content-2 .blog-single-content .blog-comments input:focus, .blog-content-2 .blog-single-content .blog-comments textarea:focus, .blog-content-2 .blog-single-sidebar>.blog-single-sidebar-search input:focus {
  border: none !important
}

.badgestyle {
  border-radius: 50% !important;
  line-height: 1.5;
  height: 100%;
  width: 27px;
  font-size: 12px !important;
  margin-bottom: 3px
}

.badge {
  padding: 4px 6px 15px
}

.null-button, .null-button:hover, .success-button {
  padding-left: 8px !important;
  padding-right: 8px !important
}

.replay-btn {
  border: 1px solid #e0e0e0 !important;
  background: #FFF !important;
  color: #0A2463 !important
}

.audit-badge, .avatar-mask {
  border-radius: 50% !important
}

.replay-btn:hover {
  background: #0A2463 !important;
  color: #FFF !important
}

#grid_company_class>.k-button {
  background-color: #0A2463 !important
}

.k-button:hover {
  color: #000 !important
}

.success-button:hover {
  background: #4CAF50 !important;
  color: #fff !important
}

.null-button:hover {
  background: #70808F !important;
  color: #fff !important
}

.padding-right3 {
  padding-right: 3px
}

.padding-right0 {
  padding-right: 0
}

.padding0 {
  padding: 0
}

.paddingtop0 {
  padding-top: 0 !important
}

.paragraph-fix {
  margin-left: 46px !important
}

.paragraph-fix-audit {
  margin-left: 40px !important
}

.list-height-fix {
  margin-bottom: -11px !important
}





    @media (min-width:1600px) {
        .list-height-fix {
    margin-bottom: -18px !important
  }



}

@media (max-width:539px) {
  .active>.tab-btn, .active>.tab-btn:hover {
    border-bottom: none !important
  }
}

@media (min-width:801px) and (max-width:991px) {
  .list-height-fix {
    margin-bottom: -16px !important
  }
}

@media (min-width:768px) and (max-width:799px) {
  .list-height-fix {
    margin-bottom: -16px !important
  }
}

@media (max-width:767px) {
  .list-height-fix {
    margin-bottom: -17px !important
  }
}

@media (min-width:1200px) and (max-width:1599px) {
  .paragraph-fix-audit {
    margin-left: 49px !important
  }
}

.margin-left-fix {
  margin-left: 10px !important
}

.margin-left-47 {
  margin-left: 47px !important
}

.iconstyle {
  color: #fff;
  position: relative;
  bottom: 1.75px
}

.btn.btn-outline.blue {
  color: #0A2463
}

.btn.btn-outline.blue:hover {
  background-color: #F75C03
}

.badge-default {
  background-color: #F75C03 !important
}

.badge-basic {
  background-color: #bac3d0 !important
}

.badge-red {
  background-color: #F8333C !important
}

.badge-teal {
  background-color: #36c6d3 !important
}

.badge-forest {
  background-color: #317033 !important
}

.badge-yellow {
  background-color: #F5B700 !important
}

.badge-success {
  background-color: #4CAF50 !important
}

.badge-warning {
  background-color: #F75C03 !important
}

.badge-primary {
  background-color: rgba(34, 133, 208, .5) !important
}

.badge-Done, .badge-solved {
  background-color: rgba(76, 175, 80, .5) !important
}

.badge-Accepted, .badge-accepted {
  background-color: rgba(34, 133, 208, .5) !important
}

.badge-In, .badge-inprogress {
  background-color: rgba(220, 0, 115, .5) !important
}

.width20 {
  width: 20px
}

.audit-badge {
  padding: 0 !important;
  line-height: 2.3;
  width: 28px !important;
  height: 28px !important
}

@media screen and (max-width:450px) {
  .testcls1 {
    display: block !important
  }
}

.labelstyle {
  background-color: #FFF;
  color: #666;
  margin-left: 10px
}

.label:not(.md-skip).label-icon {
  padding: 4px !important
}

@media (max-width:450px) {
  .testcls1 {
    display: block !important
  }

  .tstcls {
    display: none !important
  }
}

.labelreview {
  font-weight: 700
}

.empty-grid::before {
  font-size: 20px;
  font-family: lato;
  color: #0A2463;
  padding: 1em;
  line-height: 3em;
  content: "No data available. "
}


.tstcls {
  display: none !important
}

.k-icon.k-i-excel, .k-icon.k-i-pdf, .k-pdf-export .k-filter-row, .k-pdf-export .k-grid-toolbar, .k-pdf-export .k-grouping-header, .k-pdf-export .k-pager-wrap {
  display: none
}

@media (max-width:766px) {
  .page-content-white .page-title {
    margin-left: 0 !important;
    margin-top: 20px !important
  }
}

@media (min-width:766px) and (max-width:991px) {
  .page-content-white .page-title {
    margin-top: 50px !important;
    margin-left: -2px !important
  }
}

.errorclass {
  color: red;
  font-weight: 500
}

.labelreview, .pay-year {
  font-weight: 700
}

.Align {
  text-align: right
}

.k-auto-scrollable {
  height: auto !important
}

.col-template-val {
  margin: 0 0 1em .5em
}

@media screen and (min-width:800px) {
  .billing-column3 {
    display: none !important
  }
}
.height10 {
  height: 10px !important
}

.hideheader {
  display: none !important
}

.enMoney::before {
  content: "$"
}

.form-group.form-md-line-input.success-state .form-control.edited:not([readonly])~.form-control-focus:after, .form-group.form-md-line-input.success-state .form-control.edited:not([readonly])~label:after, .form-group.form-md-line-input.success-state .form-control:focus:not([readonly])~.form-control-focus:after, .form-group.form-md-line-input.success-state .form-control:focus:not([readonly])~label:after {
  background: #4CAF50 !important
}

.form-group.form-md-line-input .form-control.edited:not([readonly])~.form-control-focus:after, .form-group.form-md-line-input .form-control.edited:not([readonly])~label:after, .form-group.form-md-line-input .form-control:focus:not([readonly])~.form-control-focus:after, .form-group.form-md-line-input .form-control:focus:not([readonly])~label:after {
  background: #061436 !important
}

.Expired-status, .New-status, .Processed-status, .expired-status, .new-status, .processed-status {
  margin-top: 0px
}

.date-created-format {
  font-size: 12px !important;
  color: #747A77 !important
}

.k-loading-image {
  background-image: none;
  overflow: hidden;
  text-align: center;
  position: static
}

.k-loading-image:before, .spinningi {
  background: -webkit-gradient(linear, left top, left bottom, from(#3598dc), to(#fff));
  -webkit-text-fill-color: transparent
}

.k-loading-image:before {
  font-family: FontAwesome !important;
  content: "\f10c" !important;
  -webkit-background-clip: text;
  font-size: 40px
}

    .k-loading-image:before, .spinningi {
        background: -webkit-gradient(linear, left top, left bottom, from(#3598dc), to(#fff));
        -webkit-text-fill-color: transparent
    }

    .k-loading-image:before {
        font-family: FontAwesome !important;
        content: "\f10c" !important;
        -webkit-background-clip: text;
        font-size: 40px
    }

.fontawesome-Addons::after, .fontawesome-Employee::after, .fontawesome-Payments::after, .fontawesome-Payroll::after, .fontawesome-Reports::after, .fontawesome-Rules::after, .fontawesome-Security::after, .fontawesome-Settings::after, .fontawesome-System::after, .fontawesome-YearEnd::after, .fontawesome-null::after {
  font-family: FontAwesome;
  font-style: normal;
  font-weight: 400
}

.k-loading-color, .k-loading-text {
  display: none
}

.k-loading-mask {
  position: static !important
}

.spinningi {
  font-size: 18px !important;
  -webkit-background-clip: text
}

.spinningi2 {
  background: -webkit-gradient(linear, left top, left bottom, from(#3598dc), to(#fff));
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent
}

@-webkit-keyframes rotation {
  from {
    -webkit-transform: rotate(0)
  }

  to {
    -webkit-transform: rotate(359deg)
  }
}

@media (max-width:580px) {
  .page-header.navbar .top-menu .navbar-nav>li.dropdown-user .dropdown-toggle .username.username-hide-on-mobile {
    display: inline-block
  }
}

.txt-center {
  text-align: center !important
}

.card-button-bottom {
  width: 100% !important;
  min-width: 260px !important;
  max-width: 350px !important;
  padding: 10px 0 !important
}

.jira-accordion-fix {
  border-bottom: 1px solid #edf1f5;
  padding-top: 19px;
  border-radius: 0 !important
}

.shine {
    height: 220px;
    width: 100%;
    background: #ebebeb;
    z-index: 0;
    position: relative
}

    .shine:after {
        content: '';
        top: 0;
        transform: translateX(100%);
        width: 100%;
        height: 20px;
        position: absolute;
        z-index: 1;
        animation: slide 1s infinite 3s;
        background: -moz-linear-gradient(left, rgba(255, 255, 255, 0) 0, rgba(255, 255, 255, .8) 50%, rgba(128, 186, 232, 0) 99%, rgba(125, 185, 232, 0) 100%);
        background: -webkit-gradient(linear, left top, right top, color-stop(0, rgba(255, 255, 255, 0)), color-stop(50%, rgba(255, 255, 255, .8)), color-stop(99%, rgba(128, 186, 232, 0)), color-stop(100%, rgba(125, 185, 232, 0)));
        background: -webkit-linear-gradient(left, rgba(255, 255, 255, 0) 0, rgba(255, 255, 255, .8) 50%, rgba(128, 186, 232, 0) 99%, rgba(125, 185, 232, 0) 100%);
        background: -o-linear-gradient(left, rgba(255, 255, 255, 0) 0, rgba(255, 255, 255, .8) 50%, rgba(128, 186, 232, 0) 99%, rgba(125, 185, 232, 0) 100%);
        background: -ms-linear-gradient(left, rgba(255, 255, 255, 0) 0, rgba(255, 255, 255, .8) 50%, rgba(128, 186, 232, 0) 99%, rgba(125, 185, 232, 0) 100%);
        background: linear-gradient(to right, rgba(255, 255, 255, 0) 0, rgba(255, 255, 255, .8) 50%, rgba(128, 186, 232, 0) 99%, rgba(125, 185, 232, 0) 100%);
        filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#00ffffff', endColorstr='#007db9e8', GradientType=1)
    }

@keyframes slide {
  0% {
    transform: translateX(-100%)
  }

  100% {
    transform: translateX(100%)
  }
}

.badge .badge-empty1 {
  margin-right: 3px;
  border-radius: 10px;
  width: fit-content;
  padding-left: 10px;
  padding-right: 10px
}

.uicard, .uicardimage {
  padding: 0;
  position: relative
}

.nodisplay {
  display: none !important
}

.closed-margin {
  margin-right: 46px;
  margin-bottom: 8px
}

.blog-content-2 .blog-single-content .blog-comments i {
  top: 0 !important
}

.panel-group {
  margin-bottom: 0 !important
}



.mt-element-step .step-line .done .mt-step-number, .mt-element-step .step-no-background-thin .done .mt-step-number {
  background: #4CAF50 !important;
  color: #fff !important;
  border-color: #4CAF50 !important
}

.mt-element-step .step-line .active .mt-step-content, .mt-element-step .step-line .active .mt-step-title, .mt-element-step .step-no-background-thin .active .mt-step-content, .mt-element-step .step-no-background-thin .active .mt-step-title {
  color: #2285D0 !important
}

.mt-element-step .step-line .done .mt-step-content, .mt-element-step .step-line .done .mt-step-title, .mt-element-step .step-no-background-thin .done .mt-step-content, .mt-element-step .step-no-background-thin .done .mt-step-title {
  color: #4CAF50 !important
}

.md-checkbox label>.check {
  border: 2px solid #2285D0 !important;
  border-left: none !important;
  border-top: none !important
}

.widthfix {
  width: 28px !important;
  height: 28px !important
}

.nmarg4 {
  margin-left: -4px
}

@media screen and (max-width:480px) {
  .mobile-margin-top {
    margin-top: 30px !important
  }
}

.line-height-fix {
  line-height: 100% !important
}

@media screen and (min-width:992px) {
  .widthfix {
    min-width: 60px !important
  }

  .mobile-portlet-fix, .nmarg4 {
    margin-left: 0 !important
  }
}

.btn-success, .btn-success:hover {
  border: none !important
}

.success-state {
  border-bottom: 1px solid #4CAF50
}

.textright {
  text-align: right !important
}

.textleft {
  text-align: left !important
}



.btn-default:hover {
  background: #eef7ff;
  box-shadow:none!important;
}

.danger-button {
  background: #fff !important;
  color: #F8333C !important
}

    .danger-button:hover {
        background: #F8333C !important;
        color: #FFF !important;
        /*margin-left: 10px !important;*/
        border: 1px solid #f8333c !important
    }
     


.btn-primary:hover, .btn-success:hover {
  opacity: .9
}

.marginleft0 {
  margin-left: 0 !important
}

.uicard {
  max-width: 100%;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  width: 100%;
  min-width: 280px;
  min-height: 0;
  background: #fff;
  border: none;
  border-radius: 5px;
  -webkit-box-shadow: 0 1px 3px 0 #d4d4d5, 0 0 0 1px #d4d4d5;
  box-shadow: 0 1px 3px 0 #d4d4d5, 0 0 0 1px #d4d4d5;
  -webkit-transition: -webkit-box-shadow .1s ease, -webkit-transform .1s ease;
  transition: all .7s ease-out;
  margin: 50px auto
}

.uicardimage {
  display: block;
  -webkit-box-flex: 0;
  -ms-flex: 0 0 auto;
  flex: 0 0 auto;
  background: rgba(0, 0, 0, .05);
  border-radius: 5px 5px 0 0;
  top: -1px
}

.uicardimage>img {
  display: block;
  width: 100%;
  height: auto;
  border-radius: inherit
}

.uicardcontent {
  -webkit-box-flex: 1;
  -ms-flex-positive: 1;
  flex-grow: 1;
  border: none;
  border-top: 1px solid rgba(34, 36, 38, .1);
  background: 0 0;
  margin: 0;
  padding: 1em;
  -webkit-box-shadow: none;
  box-shadow: none;
  font-size: 1em;
  border-radius: 0
}

.my-dashbutton, .my-dashbutton:hover {
  border: 1px solid #0A2463 !important
}

.capitalize {
  text-transform: capitalize !important
}

.cardview, .tableview {
  width: 38px
}

.company-header {
  text-align: center;
  position: relative;
  top: -153px;
  color: #fff !important
}

.margin-top10 {
  margin-top: 10px !important
}

.margin-bottom20 {
  margin-bottom: 20px
}

.margin-bottom50 {
  margin-bottom: 50px
}

.contact-email, .contact-invite {
  display: inline;
  margin-bottom: 0
}

.my-dashbutton {
  color: #0A2463 !important;
  width: 147px !important;
  height: 47px !important;
  font-size: 15px !important;
  margin-right: 15px !important
}

.company-photomask {
  background: #fff;
  box-shadow: 0 10px 10px 0 rgba(0, 0, 0, .2);
  width: fit-content;
  margin-left: auto;
  margin-right: auto;
  border-radius: 50%;
  position: absolute;
  top: 124px;
  left: 38%;
  right: auto
}

@media screen and (max-width:768px) {
  .text-center-mobile {
    text-align: center !important;
    margin-top: 10px
  }
}

.company-subheader {
  top: -130px !important;
  font-size: 11px;
  color: #fff !important;
  position: relative;
  text-align: right
}

.card-address, .jcrop-holder {
  text-align: center
}

.pay-style, .pay-year {
  position: absolute;
  color: #fff
}

.company-content {
  margin-top: 55px !important
}

.contact-name {
  display: inline
}

.contact-email {
  font-size: 14px
}

.contact-invite {
  float: right;
  font-size: 12px
}

.pay-style {
  top: 6px
}

.pay-year {
  top: 0;
  right: 10px;
  font-size: 21px
}

.contact-name-font, .contact-phone {
  font-size: 14px
}

.contact-phone {
  margin-bottom: 10px
}

.content-height {
  height: 150px;
  margin-top: -2px
}

.card-address {
  border-top: 1px solid rgba(34, 36, 38, .1);
  padding-bottom: 10px;
  color: #8e8e8e;
  font-size: 13px
}

.address-next-line {
  margin-top: -15px
}

.invitedcheck {
  color: #2285D0 !important;
  margin-left: 2px
}

.client_growth_month, .company-photomask a, .jcrop-holder {
  margin-left: auto;
  margin-right: auto
}

.hoverup:hover {
  bottom: 2px
}

@media (min-width:1200px) {
  .list-column-fix {
    width: 30% !important
  }
}

.padding-bottom-fix {
  padding-top: 30px;
  padding-bottom: 30px;
  border-radius: 0 !important
}

.fontawesome-Employee::after {
  content: "\f007"
}

.fontawesome-Reports::after {
  content: "\f080"
}

.fontawesome-Payroll::after {
  content: "\f0d6"
}

.fontawesome-Security::after {
  content: "\f023"
}

.fontawesome-Payments::after {
  content: "\f09d"
}

.fontawesome-Rules::after {
  content: "\f24e"
}

.fontawesome-Addons::after {
  content: "\f12e"
}

.fontawesome-Settings::after {
  content: "\f013"
}

.fontawesome-YearEnd::after {
  content: "\f274 "
}

.fontawesome-System::after {
  content: "\f0ad"
}

.fontawesome-null::after {
  content: "\f013"
}

.total-border {
  border-bottom: 1px solid #0A2463
}

.final-total-border {
  border-bottom: double #0A2463
}

.font-weight-normal {
  font-weight: 400 !important
}

.companyname {
    float: right;
    word-break: break-all;
    max-width: 100px;
    overflow: hidden;
    margin-top: 2px;
}

.company-photomask:hover img {
  display: none
}

.company-photomask:hover a {
  display: block
}

.company-photomask a {
  display: none;
  width: 80px;
  text-align: center;
  border-radius: 50%;
  height: 80px;
  line-height: 5.8
}


.lastpay-font, .nextpay-font {
  display: inline-block;
  font-weight: 700;
  font-size: 16px
}

.height-mobile-payrun, .payrun-mobile-height-fix {
  height: 550px
}

@media (max-width:767px) {
  .payrun-mobile-height-fix {
    height: 430px !important
  }

  .mobile-fullscreen-margin {
    margin-top: 20px !important
  }
}

.payrun-hist-mobile-fix {
  padding-bottom: 5px !important
}

@media (max-width:1200px) and (min-width:767px) {
  .payrun-mobile-height-fix {
    height: 723px !important
  }
}

.payrun-history-margin {
  margin-bottom: 46px !important
}

@media (min-width:991px) and (max-width:1200px) {
  .payrun-history-margin {
    margin-bottom: 85px !important
  }
}

.lastpay-font, .marginbottom0, .nextpay-font {
  margin-bottom: 0
}

.portlet-height-fix-profile {
  height: 565px
}

.lastpay-font {
  float: left;
  color: #737A77 !important;
  text-align: left
}

.nextpay-font {
  float: right;
  color: #2285D0;
  text-align: right
}

#tooltip, .client_growth_month, .cp-action-card, .fname, .stat-percent, .stat-text {
  text-align: center
}

@media (max-width:1200px) {
  .payrun-hist-mobile-fix {
    padding-bottom: 4px !important
  }

  .portlet-height-fix-profile {
    height: auto !important
  }
}

.scroller-height-portlet-fix {
  max-height: 406px
}

.leftcalc {
  left: calc(100% - 186px)
}

.uparrow {
  display: inline;
  font-size: 20px;
  vertical-align: super
}

.client_growth {
  display: inline;
  font-size: 50px
}

.client_growth_month {
  color: #68696B;
  border-top: 1px solid rgba(104, 105, 107, .22);
  max-width: 43px
}

.percentsuper {
  display: inline;
  vertical-align: text-top;
  font-size: 20px;
  margin-left: -10px
}

.stat-text {
  color: #68696B;
  font-size: 16px;
  margin-top: 63px
}

.statiles {
  max-width: 320px
}

.top-load-height, .top-load-height-mobile {
  min-height: 157px
}

@media (max-width:767px) {
  .top-load-height-mobile {
    min-height: 0
  }
}

.statbackground {
  background: #f6f8fa;
  border-radius: 5px 5px 0 0;
  min-height: 186px
}

.stat-bottom {
  width: 100%;
  margin: 0 !important;
  position: unset;
  bottom: 0;
  padding-top: 4px !important;
  padding-bottom: 4px !important;
  border-radius: 0 0 5px 5px !important
}

.stat-percent {
  width: 100%;
  height: 100%;
  font-size: 50px;
  color: #4caf50;
  margin-top: 29px;
  margin-bottom: 38px
}

.no-data-style {
  font-size: 20px;
  font-family: lato;
  color: #0a2463;
  padding-left: 40%
}

.font15 {
  font-size: 15px !important
}

.earningfont {
  font-weight: 600 !important;
  font-size: 20px !important
}

.greyfont {
  color: #747A77 !important
}

.greenfont {
  color: #4caf50 !important
}

.payrun-history-container {
  max-width: 350px
}

@media (max-width:440px) {
  .payrun-history-container {
    max-width: 229px
  }
}

.tooltip-inner {
  max-width: 350px
}


#sortable1, #sortable10, #sortable11, #sortable2, #sortable3, #sortable4, #sortable5, #sortable6, #sortable7, #sortable8, #sortable9 {
  padding: 0
}

.portlet-title {
  padding-left: 0 !important;
  padding-right: 0 !important
}

@media screen and (max-width:767px) {
  .tooltip {
    display: none !important
  }
}

.k-dirty, .k-list-optionlabel {
  display: none
}

.client-profile-pic {
  min-height: 80px;
  min-width: 80px;
  max-width: 80px;
  max-height: 80px
}

.pe-secondary {
  color: #2285D0;
  background-color: #FFF !important;
  border: 1px solid #2285D0 !important
}

.pe-secondary:hover {
  color: #2285D0 !important
}

.fname {
  border: none;
  background: bottom;
  color: #708090;
  text-overflow: ellipsis
}

.bg-danger {
  background-color: #fbe1e3 !important
}

.page-header.navbar .top-menu .navbar-nav>li.dropdown-user .dropdown-toggle>i {
  position: inherit;
  bottom: 4px
}

.isDisabled {
  color: currentColor;
  cursor: not-allowed;
  opacity: .5;
  text-decoration: none
}

#tooltip, .btn-benefit {
  color: #fff
}

a.dropdown.btn.blue.btn-outline.btn-circle.dropdown-toggle[aria-expanded=true] {
  background-color: #F60;
  opacity: .6;
  color: #fff
}

#company_name-error, #company_name_fs-error {
  margin-top: 10px
}

#tooltip {
    font-size: 12px;
    background: #111;
    position: absolute;
    z-index: 100;
    padding: 15px;
    border-radius: 6px;
    width: auto
}

    #tooltip:after {
        width: 0;
        height: 0;
        border-left: 10px solid transparent;
        border-right: 10px solid transparent;
        border-top: 10px solid #111;
        content: '';
        position: absolute;
        left: 50%;
        bottom: -10px;
        margin-left: -10px
    }

    #tooltip.top:after {
        border-top-color: transparent;
        border-bottom: 10px solid #111;
        top: -20px;
        bottom: auto
    }

    #tooltip.left:after {
        left: 10px;
        margin: 0
    }

    #tooltip.right:after {
        right: 10px;
        left: auto;
        margin: 0
    }

.mr-icon {
  margin-right: 3px
}

.trash-button {
  background-color: #fff !important;
  border: 1px solid #f8333c !important;
  color: #f8333c !important
}

.trash-button:hover {
  background-color: #f8333c !important;
  color: #fff !important;
  border: 1px solid rgba(255, 0, 0, 0) !important
}

.ui-datepicker {
  z-index: 9999 !important
}

.k-widget.k-tooltip-validation {
  background-color: rgba(100, 100, 100, .9)
}

.k-tooltip-validation .k-callout-n {
  border-bottom-color: rgba(100, 100, 100, .9)
}

.init-state {
  border-bottom: 1px solid #c2cad8
}

.k-calendar .k-header .k-state-hover {
  background-color: #c2cad8
}

.popup-bradius {
  border-radius: 5px !important
}

#grid_product_rules>.k-grid td {
  overflow: inherit
}

#testkendoview1 {
  cursor: default;
  max-height: 600px
}

.client-profile-uicardimage {
  display: block;
  -webkit-box-flex: 0;
  -ms-flex: 0 0 auto;
  flex: 0 0 auto;
  border-radius: 5px 5px 0 0;
  top: -3px;
  height: 150px;
  overflow: hidden;
  padding: 0;
  position: relative
}

.client-profile-cardcontent {
  -webkit-box-flex: 1;
  -ms-flex-positive: 1;
  flex-grow: 1;
  border: none;
  background: 0 0;
  margin: 0;
  padding: 1em;
  -webkit-box-shadow: none;
  box-shadow: none;
  font-size: 1em;
  border-radius: 0
}

.cp-company-photomask, .cp-company-photomask a {
  margin-left: auto;
  margin-right: auto;
  border-radius: 50%
}

.cp-content-height {
  height: 350px;
  margin-top: -2px
}

.cp-company-photomask {
  background: #fff;
  box-shadow: 0 10px 10px 0 rgba(0, 0, 0, .2);
  width: fit-content;
  position: relative;
  /* top: 110px;
  left: 42%; */
  right: auto
}

.cp-company-photomask:hover img {
  display: inline-block;
  position: inherit;
  opacity: 1;
}

.cp-company-photomask:hover a {
  display: inline-block;
  position: inherit;
  opacity: 1;
}

.cp-company-photomask a {
  display: inline-block;
  width: 80px;
  text-align: center;
  height: 80px;
  line-height: 5.8;
  opacity: 0;
}

.cp-action-card {
  display: block;
  font-size: 12px;
  margin-top: 15px;
  color: #0A2463;
  cursor: pointer
}

.cp-action-card:hover {
  color: #7987A9
}

.cp-action-card>p {
  margin-top: 15px !important
}

.cp-row-margin {
  margin-left: 20px
}

.cp-contact {
  color: #8e8e8e;
  font-size: 13px
}

.cp-contact-mtop {
  margin-top: 325px
}

@media screen and (max-width:450px) {
  .cp-contact {
    color: #8e8e8e;
    font-size: 12px
  }

  .card-address {
    color: #fff
  }
}


@media screen and (min-width:768px) {
  .cp-content-height {
    height: 250px;
    margin-top: -2px
  }

  .cp-contact-mtop {
    margin-top: 225px
  }
}

.card-header .fa {
  transition: .3s transform ease-in-out
}

.card-header .collapsed .fa {
  transform: rotate(90deg)
}

#Client_tile, #T4Rl_tile, T4Rl_tiles, #T4Rl_fs, #Edit_benefit_plan, #Edit_prof_tile, #_auditfs, #_billingfs, #_clientfs, #_statusclientfs, #audit_tile, #billing_tile, #changereport, #changereport_fs, #classesFs, #clibilling_fullscreen, #clibilling_tile, #clientProfileCard, #companyPolicy, #companyPolicy_fs, #companybenefit_class, #jira_fullscreen, #jira_tile, #payrun_fullscreen, #payrun_tile, #payruntile, #tester2, #ticket_fullscreen, #ticket_tile {
    box-shadow: 8px 14px 38px rgba(39, 44, 49, .2), 1px 3px 8px rgba(39, 44, 49, .2) !important;
    transition: box-shadow .3s ease-in-out;
    background: #fff !important;
    border-radius: 5px;
    margin: 25px 10px
}

    #Client_tile:hover, #T4Rl_tile:hover, T4Rl_tiles:hover, #T4Rl_fs:hover, #Edit_benefit_plan:hover, #Edit_prof_tile:hover, #_auditfs:hover, #_billingfs:hover, #_clientfs:hover, #_statusclientfs:hover, #audit_tile:hover, #billing_tile:hover, #changereport:hover, #changereport_fs:hover, #classesFs:hover, #clibilling_fullscreen:hover, #clibilling_tile:hover, #clientProfileCard:hover, #companyPolicy:hover, #companyPolicy_fs:hover, #companybenefit_class:hover, #jira_fullscreen:hover, #jira_tile:hover, #payrun_fullscreen:hover, #payrun_tile:hover, #payruntile:hover, #tester2:hover, #ticket_fullscreen:hover, #ticket_tile:hover {
        box-shadow: 8px 14px 38px rgba(39, 44, 49, .4), 1px 3px 8px rgba(39, 44, 49, .4) !important;
        transition: box-shadow .3s ease-in-out
    }

#Client_tile, #T4Rl_tile, T4Rl_tiles, #audit_tile, #billing_tile, #clientProfileCard, #jira_tile, #payrun_tile, #ticket_tile {
    min-height: 150px
}

#epayClient {
  margin-top: -4px
}

.full-height-content-scrollable>.portlet-title {
  margin-left: 20px !important;
  margin-right: 20px !important
}

.full-height-content-scrollable>.portlet-refresher {
  margin-right: 15px;
  margin-left: 15px
}

.topfullscreen>.portlet-title {
  margin-left: 20px !important;
  margin-right: 20px !important
}

.topfullscreen>.portlet-refresher {
  margin-right: 15px;
  margin-left: 15px
}

#cust_prof {
  max-height: 600px;
  margin-top: -20px !important;
  margin-bottom: 0 !important;
  -webkit-box-shadow: 0 0 0 0 #fff, 0 0 0 0 #fff !important;
  box-shadow: 0 0 0 0 #fff, 0 0 0 0 #fff !important
}

.page-content {
  background: #f4f8fb
}

.k-loading-image, .spinningi, .spinningi2 {
  -webkit-animation: rotation .5s infinite linear
}

.companyname, .elipsis-accordian {
  white-space: nowrap;
  text-overflow: ellipsis
}

body {
  padding-top: 50px;
  padding-bottom: 20px;
  background-color: none !important
}

.large.tooltip-inner {
  max-width: 350px;
  width: 350px;
}

* {
  font-family: Lato, sans-serif
}

a {
  color: #0A2463
}

a:hover {
  opacity: .7
}

.header-thin {
  font-weight: 300 !important;
  color: #68696b !important;
  font-size: 25px !important
}

.data-mobile-font, .item-font {
  font-size: 12px
}

.header-underline {
  border-bottom: 1px solid #eef1f5
}

#sidebarCollapse, #sidebarCollapsemobile {
  width: 40px;
  height: 40px;
  background: 0 0;
  margin-top: 6px;
  border: none;
  outline-color: #fff !important;
  display: inline-block
}

#sidebarCollapsemobile {
  float: left
}

#treelist .k-tooltip, .k-widget.k-tooltip {
  color: #fff !important
}

.k-widgit {
  line-height: 1.6
}

.padding0 {
  padding-top: 0 !important;
  padding-bottom: 0 !important
}

.padding-top10 {
  padding-top: 10px !important
}

.rotated-state {
  transform: rotate(-180deg);
  -ms-transform: rotate(180deg);
  -moz-transform: rotate(-180deg);
  -webkit-transform: rotate(-180deg);
  -o-transform: rotate(-180deg);
  -webkit-transition: all .1s ease-out;
  -moz-transition: all .1s ease-out;
  -o-transition: all .1s ease-out;
  transition: all .1s ease-out
}

.chevron-rotate, .transition-ease {
  -webkit-transition: all .1s ease-out;
  -moz-transition: all .1s ease-out;
  -o-transition: all .1s ease-out;
  transition: all .1s ease-out
}

#sidebarCollapse span, #sidebarCollapsemobile span {
  width: 80%;
  height: 2px;
  display: block;
  background: #555;
  transition: all .3s cubic-bezier(.81, -.33, .345, 1.375)
}

#sidebarCollapse span {
  margin: 0 auto
}

#sidebarCollapse span:first-of-type {
  transform: rotate(45deg) translate(2px, 2px)
}

#sidebarCollapse span:nth-of-type(2) {
  opacity: 0
}

#sidebarCollapse span:last-of-type {
  transform: rotate(-45deg) translate(1px, -1px)
}

#sidebarCollapse.active span {
  transform: none;
  opacity: 1;
  margin: 5px auto
}

#sidebarCollapsemobile span {
  margin: 0 auto
}

#sidebarCollapsemobile span:first-of-type {
  transform: rotate(45deg) translate(2px, 2px)
}

#sidebarCollapsemobile span:nth-of-type(2) {
  opacity: 0
}

#sidebarCollapsemobile span:last-of-type {
  transform: rotate(-45deg) translate(1px, -1px)
}

#sidebarCollapsemobile.active span {
  transform: none;
  opacity: 1;
  margin: 5px auto
}

.listscroll {
  overflow: hidden
}

:root .scroller, _:-ms-fullscreen {
  overflow-y: scroll
}

.scroller, _:-ms-lang(x), _:-webkit-full-screen {
  overflow-y: scroll
}

.scroller:hover {
  overflow-y: overlay
}

.listscroll:hover, .scroll-y {
  overflow-y: scroll
}

.listscroll::-webkit-scrollbar {
  width: 8px !important
}

::-webkit-scrollbar {
  width: 10px !important
}

::-webkit-scrollbar-track {
  background: #f1f1f1
}

::-webkit-scrollbar-thumb {
  background: rgba(136, 136, 136, .35);
  border-radius: 8px
}

.listscroll::-webkit-scrollbar-thumb:hover {
  background: #555
}

.scroller::-webkit-scrollbar-thumb:hover {
  background: #555
}

.scroll-y {
  -ms-overflow-style: scrollbar
}

.body-content {
  padding-left: 15px;
  padding-right: 15px
}

.billing-column {
  height: 70px
}

.height70 {
  height: 70px;
}

.lineheight3 {
  line-height: 3 !important;
}

.background-red {
  background: rgba(251, 143, 148, .1) !important
}

.background-green {
  background: rgba(76, 175, 80, .1) !important
}

.red-font {
  color: #f8333c !important
}

.green-font {
  color: #4caf50
}

.money-in-icon {
  display: inline-block;
  margin-right: 10px;
  margin-left: 10px;
  color: #4caf50;
  line-height: .9 !important
}

.item-for-billing {
  display: inline-block;
  line-height: 2 !important
}

.navbar {
  margin-bottom: 0 !important
}

.page-header.navbar .top-menu .navbar-nav>li.dropdown-user .dropdown-toggle {
  background: 0 0 !important
}

@media screen and (max-width:991px) {

    .tablet-padding-top {
        padding-top: 50px !important;
    }

    #sidebarCollapse, #sidebarnav {
        display: none
    }

    .dropdown-tasks {
        display: none !important
    }

  .mobile-hide-menu {
    display: none;
    position: fixed !important;
    top: 50px;
    left: 0;
    transition: all .1s ease-out
  }

    /*#prof_con, #prof_con_cli {
        margin-top: 135px !important
    }*/
}

@media screen and (min-width:991px) {
  .page-logo {
    width: 270px !important
  }

  #navmobilebutton {
    display: none !important
  }
}

@media screen and (max-width:991px) {
  #navmobilebutton {
    display: inline-block !important;
    float: left
  }
}

.Expired-status, .New-status, .Processed-status, .new-status, .null-status, .processed-status {
  border-radius: 10px;
  width: fit-content;
  padding-left: 10px;
  padding-right: 10px;
  display: inline-flex
}

.New-status, .new-status {
  background: #2285D0
}

.Expired-status, .null-status {
  background: #eef7ff;
  color: rgba(0, 0, 0, .87)
}

.New-status, .Processed-status, .new-status, .processed-status {
  color: #fff
}

.Expired-status {
  color: rgba(0, 0, 0, .87);
  border-radius: 10px;
  width: fit-content;
  padding-left: 10px;
  padding-right: 10px;
  display: inline-flex
}

.Danger-status, .Success-status, .Warning-status, .expired-status,.Pending-status {
    border-radius: 10px;
    width: fit-content;
    padding-left: 10px;
    padding-right: 10px;
    color: #fff;
    display: inline-flex
}

.Warning-status, .expired-status {
  background: #F75C03;
}

.Danger-status {
  background: #f8333c;
}
.Pending-status {
    background: #bac705;
}

.Processed-status, .Success-status, .processed-status {
  background: #4caf50
}

.avitarbackground0, .avitarbackground1, .avitarbackground2, .avitarbackground3, .avitarbackground4, .avitarbackground5, .avitarbackground6, .avitarbackground7, .avitarbackground8, .avitarbackground9 {
  opacity: .5
}

.avitarbackground1 {
  background: #F75C03
}

.avitarbackground2 {
  background: #2285D0
}

.avitarbackground3 {
  background: #4CAF50
}

.avitarbackground4 {
  background: #F8333C
}

.avitarbackground5 {
  background: #DC0073
}

.avitarbackground6 {
  background: #0A2463
}

.avitarbackground7 {
  background: #317033
}

.avitarbackground8 {
  background: #48525C
}

.avitarbackground9 {
  background: #F5B700
}

.avitarbackground0 {
  background: #78003F
}

.span-spacing {
  margin-right: 3px
}

.profile-buttons {
  width: 100%;
  margin-bottom: 3px
}

.profile-cancel {
  width: 100%;
  margin-bottom: 3px
}

.payroll-actions {
  margin-left: auto;
  margin-right: auto
}

.btn.btn-outline.blue:active, .btn.btn-outline.blue:active:hover, .btn.btn-outline.blue:focus {
  background-color: #F75C03;
  opacity: .8
}

.k-grouping-header .k-link, .k-grouping-header .k-link:link {
  color: #0A2463 !important;
}

.k-group-indicator {
  border-radius: 5px;
}

.k-grouping-row td, td.k-group-cell {
  background-color: #FFF !important;
}

#Grid3.k-grid .k-header > a:hover, #Grid3.k-grid .k-header > span:hover, #epayClient.k-grid .k-header > a:hover, #epayClient.k-grid .k-header > span:hover, #InvoiceListGrid.k-grid .k-header > a:hover, #Grid4.k-grid .k-header > a:hover, #Grid4.k-grid .k-header > span:hover, #client_kendo.k-grid .k-header > a:hover {
  opacity: 1 !important;
  transition: all .7s ease-out
}

.btn-primary {
  background: #061436 !important
}

/* #Grid4.k-grid .k-header>a {
  color: #fff !important;
  transition: all .7s ease-out
} */
#Grid4.k-grid .k-header>a:hover {
  color: #737A77 !important
}

/* #Grid4.k-grid .k-header>span {
  color: #fff !important;
  transition: all .7s ease-out
} */
#Grid4.k-grid .k-header>span:hover {
  color: #737A77 !important
}

/*
#Grid3.k-grid .k-header>span {
  color: #fff !important;
  transition: all .7s ease-out
} */
#Grid3.k-grid .k-header>span:hover {
  color: #737A77 !important
}

/* #Grid3.k-grid .k-header>a {
  color: #fff !important;
  transition: all .7s ease-out
} */
#Grid3.k-grid .k-header>a:hover {
  color: #737A77 !important
}

/* #client_kendo.k-grid .k-header>a {
  color: #fff !important;
  transition: all .7s ease-out
} */
#client_kendo.k-grid .k-header>a:hover {
  color: #737A77 !important
}

/* #epayClient.k-grid .k-header>span {
  color: #fff !important;
  transition: all .7s ease-out
} */
#epayClient.k-grid .k-header>span:hover {
  color: #737A77 !important;
  transition: all .7s ease-out
}

/* #epayClient.k-grid .k-header>a {
  color: #fff !important;
  transition: all .7s ease-out
} */
#epayClient.k-grid .k-header>a:hover {
  color: #737A77 !important
}

.headerheight {
  height: 10px !important
}

#Grid1.k-grid td, #epayClient.k-grid td, #Grid3.k-grid td, #Grid4.k-grid td, #client_fs.k-grid td, #client_kendo.k-grid td, #InvoiceListGrid.k-grid td, #grid-fullscreen.k-grid td, #ClientUsage_fs.k-grid td, .border-bottom {
    border-bottom: 1px solid #edf1f5 !important
}

.responsive-actions {
  min-width: 463px
}

.inline-block {
  display: inline-block !important
}

.item-font {
  color: #737A77 !important
}

.Danger-stripe, .Processed-stripe, .Success-stripe, .Warning-stripe {
  height: 97px;
  position: absolute;
  width: 3px;
  display: inline-block;
  margin-left: -7px;
  margin-top: -5px
}

.Processed-stripe, .Success-stripe {
  background-color: #4caf50
}

.Danger-stripe {
  background-color: #f8333c
}

.Warning-stripe {
  background-color: #F75C03
}

.danger-stripe, .success-stripe, .warning-stripe {
  height: 100%;
  padding-top: 17px;
  padding-bottom: 6px;
  width: 3px;
  display: inline-block;
  margin-left: -7px
}

.success-stripe {
  background-color: #4caf50
}

.danger-stripe {
  background-color: #f8333c
}

.warning-stripe {
  background-color: #F75C03
}

.danger-icon, .success-icon, .warning-icon {
  display: inline-block;
  margin-right: 10px;
  margin-left: 15px
}

.danger-icon {
  color: #f8333c
}

.warning-icon {
  color: #F75C03
}

.success-icon {
  color: #4caf50
}

.danger-background {
  background: rgba(251, 143, 148, .2) !important;
}

.warning-background {
  background: rgba(249, 215, 116, .2) !important;
}

.success-background, .success-background1 {
  background: rgba(119, 255, 123, .2) !important;
}

.payroll-amount-font {
  text-align: right;
  font-weight: 700;
  font-size: 16px;
  color: #737A77
}

.k-grid {
  -moz-border-radius: 5px;
  -webkit-border-radius: 5px;
  border-radius: 5px;
  overflow: hidden
}

.k-grouping-header {
  -moz-border-radius: 5px 5px 0 0;
  -webkit-border-radius: 5px 5px 0 0;
  border-radius: 5px 5px 0 0;
  overflow: hidden
}

.k-grid-pager {
  -moz-border-radius: 0 0 5px 5px;
  -webkit-border-radius: 0 0 5px 5px;
  border-radius: 0 0 5px 5px;
  overflow: hidden
}

.page-sidebar-closed .page-sidebar .sidebar-search.open .remove>i {
  margin-left: 12px;
  color: #fff !important
}

#magnifier {
  color: #fff
}

#searchClients::placeholder {
  color: #d0d0d0;
  opacity: 1
}

.heightchange {
  max-height: 46px !important
}

@media screen and (max-width:320px) {
  .custom_padding {
    padding: 1px
  }
}

.tab-btn, .tag {
  padding-top: 2px !important
}

@media screen and (max-width:767px) {
  .textcentered-mobile {
    text-align: center !important
  }
}

@media screen and (max-width:799px) {
  .k-grouping-header {
    display: none !important
  }
}

.tab-buttons {
  margin-top: 6px
}

.filter-buttons {
  background-color: #fff;
  border: 1px solid #e0e0e0;
  color: #333;
  border-radius: 23px !important
}

.tag {
  padding-bottom: 2px !important;
  border-radius: 20px !important;
  border: 1px solid #e0e0e0
}

.active-tag {
  background-color: #eef7ff;
  box-shadow: 0 2px 2px 0 rgba(0, 0, 0, .16), 0 0 0 1px rgba(0, 0, 0, .08) !important;
  border: none
}

.filter-buttons:hover, .panel {
  box-shadow: none !important
}

.active>a {
  background-color: #F75C03 !important;
  color: #fff !important
}

/*.active>.tab-btn, .tab-btn {
  background-color: #FFF !important
}*/
.tab-btn {
  padding-bottom: 11px !important;
  margin-right: 20px
}

.padding-tab-fix {
  padding-bottom: 21px !important
}

.tab-btn:hover {
  cursor: pointer;
  opacity: .8
}

.active>.tab-btn {
  color: #0A2463 !important;
  font-weight: 700 !important;
  border-bottom: 3px solid #0A2463
}

.desc, .feeds li {
  font-weight: 400
}

.elipsis-accordian {
  overflow: hidden;
  max-width: 400px
}

@media (min-width:991px) and (max-width:1350px) {
  .elipsis-accordian {
    max-width: 100px !important
  }
}

@media (min-width:431px) and (max-width:610px) {
  .elipsis-accordian {
    max-width: 200px !important
  }
}

@media (max-width:430px) {
  .elipsis-accordian {
    max-width: 100px !important
  }
}

.elipsis-username {
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
  max-width: 204px;
}

.elipsis-toptile {
  /* overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
  max-width: 564px; */
  line-height: 1.8;
}

/* @media (max-width:500px) {
  .elipsis-toptile {
    max-width: 278px !important
  }
} */
@media (max-width:430px) {
  .elipsis-username {
    max-width: 100px !important
  }
}

.filter-buttons:hover {
  background-color: #F75C03;
  border: 1px solid #F75C03;
  color: #fff
}

.refresh-date {
  display: inline;
  margin-left: 5px;
}

.refresh-button {
  margin-left: 10px;
  margin-right: 0px;
}

.refresh-button:hover {
  cursor: pointer;
}

.portlet-refresher {
  margin-top: 0px;
  float: left;
  margin-bottom: 12px;
  min-width: 235px;
}

.run-pay {
  background: 0 0 !important;
  border: 1px solid #e0e0e0 !important;
  color: #061436 !important
}

.run-pay:hover {
  background: #0A2463 !important;
  color: #fff !important;
  border: 1px solid rgba(255, 0, 0, 0) !important
}

.warning-button {
  border: 1px solid #F75C03 !important;
  color: #F75C03 !important
}

.warning-button:hover {
  background: #F75C03 !important;
  color: #fff !important;
  border: 1px solid rgba(255, 0, 0, 0) !important
}

.danger-button {
  border: 1px solid #f8333c !important;
  color: #f8333c !important
}

.danger-button:hover {
  background: #f8333c !important;
  color: #fff !important;
        /*margin-left:10px!important;*/
        border: 1px solid #f8333c !important
}

.fs_txtbx {
  max-width: 150px !important
}

.desc, .txt_clr {
  font-size: 14px !important
}

.font-xl {
  font-size: 12px !important
}

.morrischart {
  bottom: 10px;
  width: 33%
}

.morris-position {
  position: absolute;
  left: -152px;
}

.mt-font {
  font-size: 10px
}

.mt-stats {
  bottom: 26px;
  position: relative
}

@media (min-width:320.5px) and (max-width:575.98px) {
    .addheight {
        height: 500px !important
    }

    .fs_txtbx {
        max-width: 100px !important
    }

    .tile_txtbx {
        max-width: 200px !important
    }

    .desc {
        width: 250px;
        max-height: inherit;
        font-size: 12px !important
    }

    .tstcls {
        display: none !important
    }

    .font-xl {
        font-size: 14px !important
    }

    .emp_pos {
        position: inherit;
        top: 30px;
        right: 220px
    }

    .mt-font {
        font-size: 12px
    }

    .mt-stats {
        bottom: 26px;
        position: relative
    }

    .large-heading {
        height: 30px;
        white-space: nowrap;
        width: 185px;
        overflow: hidden;
        text-overflow: ellipsis;
        display: inline-block;
    }
}

.desc, .ticket_description {
    display: flex;
    -ms-word-break: break-all;
    -ms-hyphens: auto;
    -moz-hyphens: auto;
    -webkit-hyphens: auto;
    overflow-wrap: break-word;
    word-wrap: break-word
}

.date, .desc, .pos_desc {
    position: relative
}

@media (min-width:576px) and (max-width:767.98px) {
  .addheight {
    height: 600px !important
  }

  .desc {
    width: 450px
  }

  .fs_txtbx {
    max-width: 150px !important
  }

  .font-xl {
    font-size: 14px !important
  }

  .mt-stats {
    bottom: 26px;
    position: relative
  }

  .page-content-wrapper .page-content {
    margin-left: 570px
  }

  .page-sidebar.collapse {
    width: 570px
  }
}

@media (max-width:766px) {
  .page-content-wrapper .page-content {
    padding: 20px 10px 10px !important
  }

  .page-container {
    margin: 0 !important
  }
}

@media (min-width:991px) and (max-width:1600px) {
  .general-item-list>.item>.item-body {
    margin-left: 55px !important;
    margin-right: 100px;
    color: #444 !important
  }
}

@media (min-width:768px) and (max-width:991.98px) {
  .desc {
    font-size: 13px !important
  }

  .addheight {
    height: 600px !important
  }

  .fontsize {
    font-size: 14px;
    line-height: 1.8 !important
  }

  .emp_pos {
    right: 270px
  }

  .morrischart {
    z-index: 10000
  }

  .font-xl {
    font-size: 18px !important
  }

  .mt-stats {
    bottom: 26px;
    position: relative
  }
}

@media (min-width:992px) {
  .profile-sidebar-portlet {
    margin-right: 20px !important
  }
}

.marginbottom5 {
  margin-bottom: 5px !important
}

@media (min-width:992px) and (max-width:1199.98px) {
  .desc, .txt_clr {
    font-size: 14px !important
  }

  .fs_txtbx {
    max-width: 480px !important
  }

  .addheight {
    height: 600px !important
  }

  .fontsize {
    font-size: 14px
  }

  .emp_pos {
    right: 225px !important
  }

  .custom_padding {
    padding: 1px
  }

  .morrischart {
    bottom: 10px
  }

  .font-xl {
    font-size: 12px !important
  }

  #morris_chart_0, #morris_chart_1, #morris_chart_2, #morris_chart_3, #morris_chart_4 {
    height: 150px !important
  }

  .mt-font {
    font-size: 9px
  }

  .mt-stats {
    bottom: 26px;
    position: relative
  }
}

@media (min-width:1200px)and (max-width:1600px) {
  .desc, .txt_clr, body {
    font-size: 14px !important
  }

  .addheight {
    height: 600px !important
  }

  .chat-form .input-cont .form-control {
    max-width: 250px
  }

  .fontsize {
    margin-left: 10px
  }

  .font-xl {
    font-size: 18px
  }

  .emp_pos {
    right: 220px !important
  }

  .heightchange {
    max-height: 55px !important
  }

  .morrischart {
    top: 16px
  }

  #morris_chart_0, #morris_chart_1, #morris_chart_2, #morris_chart_3, #morris_chart_4 {
    height: 210px !important
  }

  .mt-font {
    font-size: 11px
  }

  .mt-stats {
    bottom: 28px;
    position: relative
  }

  .fs_txtbx {
    max-width: 600px !important
  }

  .tile_txtbx {
    max-width: 1200px
  }
}

@media (min-width:1601px) and (max-width:1921px) {
  .addheight {
    height: 785px !important
  }

  .fontsize {
    font-size: 14px
  }

  .font-xl {
    font-size: 22px
  }

  .morrischart {
    /* top: 12px */
  }

  .mt-stats {
    bottom: 28px;
    position: relative
  }

  .mt-font {
    font-size: 14px
  }

  .fs_txtbx {
    max-width: 600px !important
  }
}

.profile-usermenu {
  margin-top: 32px !important
}

.desc {
    max-width: 80%;
    left: 30px;
    top: -45px;
    word-break: break-all;
    word-break: break-word;
    hyphens: auto;
    margin-left: 40px;
    margin-right: 10px;
    line-height: 1.5;
    color: #aaa
}

.date {
  float: right;
  bottom: 25px
}

.pos_desc {
  float: right;
  bottom: 40px
}

#chatform_close, .arrow_option {
  position: relative !important
}

.txt_clr {
  color: #32c5d2 !important
}

.feeds li {
  background-color: #fff !important;
  min-height: 70px;
  color: #444 !important
}

.feeds {
  margin-top: 10px
}

.margin-5 {
  margin-left: 5px
}

.arrow_option {
  float: right;
  top: -41px
}

.font-size {
  font-size: 14px !important;
}

.setmargin {
  padding: 6px 0px 10px 10px !important;
}

.marginbottom20 {
  margin-bottom: 20px;
}

#mouse_over, #mouse_over1 {
  display: none
}

#position_tooltip {
  position: relative
}

#position_tooltip_fs {
  float: right;
  position: relative;
  padding-right: 5%
}

#position_tooltip #tooltip_text {
  visibility: hidden;
  width: 150px;
  height: 340px;
  background-color: #555;
  color: #fff;
  text-align: center;
  border-radius: 6px;
  padding: 5px 0;
  position: absolute;
  z-index: 100;
  top: 150%;
  left: 20%;
  margin-left: -60px;
  opacity: 1;
  transition: opacity .3s;
  overflow-y: auto
}

#position_tooltip:hover #tooltip_text {
  visibility: visible;
  opacity: 1
}

.cd-horizontal-timeline, .errorclass {
  opacity: 1 !important
}

.chat-form {
  height: 55px !important
}

.tkt_form_style {
  top: 50px !important;
  left: 50% !important;
  position: fixed !important;
  height: 937px !important;
  overflow-y: hidden !important
}

.dialog-style {
  height: 937px;
  width: 960px;
  margin: 0 !important
}

.ticket_description {
  max-width: 100%;
  word-break: break-all;
  word-break: break-word;
  hyphens: auto
}

.ticket_description_jira_fs {
    max-width: 100%;
    word-break: break-all;
    word-break: break-word;
    hyphens: auto;
    text-align: justify;
    color: #8a8a8a !important;
}

.ticket_description_fs {
  overflow-wrap: break-word;
  word-wrap: break-word;
  -ms-word-break: break-all;
  word-break: break-all;
  word-break: break-word;
  -ms-hyphens: auto;
  -moz-hyphens: auto;
  -webkit-hyphens: auto;
  hyphens: auto;
  margin-left: 10px !important;
  margin-top: 10px;
  padding-bottom: 10px
}

.marginleft25 {
  margin-left: 25px !important
}

.marginleft5 {
  margin-left: 5px !important
}

.marginright5 {
  margin-right: 5px !important
}

.padding-top-15 {
  padding-top: 15px !important
}

.reply_btn {
  color: #F1F4F7 !important
}

.font_color {
  color: #555
}

#formsubmit_loader {
  display: none
}

#payrun-tile {
  max-height: 550px !important;
}

#treelist .k-icon {
  margin-left: 0 !important;
  display: none
}

#sidenavbar.hovered #treelist .k-icon, #sidenavbar:hover #treelist .k-icon {
  display: inline-block
}

#treelist {
  border-radius: 0;
}

tr.k-state-selected>td>.company-name {
  color: #FFF !important
}

.width {
  padding-right: 1px
}

.centered {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  height: 90px;
  width: 90px
}

.cd-horizontal-timeline .events, .emp_pos {
  top: 30px
}

.tablefont {
  font-size: 12px
}

#table_info {
  position: absolute;
  left: 250px;
  bottom: 40px;
  display: none
}

#comp_name, #page_title {
  font-variant-caps: titling-caps;
  font-weight: 400
}

.cd-horizontal-timeline .events-wrapper, .cd-horizontal-timeline .timeline {
  height: 60px
}

.emp_pos {
  position: inherit;
  right: 220px
}

.emp_pos .fa-money {
  position: absolute;
  left: 227px;
  width: auto
}

.calpos {
  position: absolute !important;
  left: 227px !important;
  width: auto !important
}

.emp_pos .icon-users {
  position: absolute;
  left: 228px;
  top: 75px
}

.custom_border {
  border: 1px solid #dcdcdc
}

.mt-widget-1 {
  height: 240px
}

.divider {
    border-bottom: 1px solid #edf1f5 !important;
    margin-top: 17px;
}

.portlet-sortable-empty {
  height: 0 !important
}

.profile-sidebar-portlet {
  padding: 10px 0 0 !important
}

.profile-sidebar {
  margin-right: 0 !important
}

.profile-usermenu {
  padding-bottom: 5px !important
}

.m-grid.m-grid-demo .m-grid-col {
  background: #fff !important
}

.error {
  color: #e73d4a !important
}

.floatright {
  float: right !important
}

.floatleft {
  float: left !important
}

.applyBtn {
  float: right !important
}

.hovered-support-accordion {
  background-color: #eef7ff !important;
  border-radius: 5px
}

.accordion-toggle.chevron-rotate {
  display: block;
  width: 100%;
  height: 40px;
  line-height: 2.5
}

.mt-element-list .list-todo .list-todo-item.dark .list-toggle {
  background: #0A2463 !important;
  border-radius: 5px 5px 0 0
}

.time {
  border-radius: 5px
}

.white {
  color: #FFF !important
}

.badge-list-fix {
  margin-left: 0;
  margin-top: 3px
}

.badge-faded {
  background-color: rgba(34, 133, 208, 0.5) !important;
}

.mt-element-list .list-todo.mt-list-container ul>.mt-list-item>.list-todo-item {
  width: 100% !important
}

.mt-element-list .list-todo.mt-list-container {
  border: none !important
}

.mt-element-list .list-todo.mt-list-container ul>.mt-list-item>.list-todo-item:after {
  display: none !important
}

.feeds li .col1>.cont>.cont-col1>.label>i {
  font-size: 12px !important
}

.dashboard-stat, .dashboard-stat2, .page-md .widget-bg-color-white, .page-md .widget-blog, .page-md .widget-carousel, .page-md .widget-map, .page-md .widget-progress-element, .page-md .widget-socials {
  box-shadow: 0 1px 1px 1px rgba(0, 0, 0, .03) !important
}

.nav-tabs>li.active>a {
  border-radius: 5px 5px 0 0
}

.feeds li, .general-item-list>.item>.item-body, .k-block, .k-content, .k-dropdown .k-input, .k-popup, .k-widget, .k-widget.feeds li, .k-widget.k-block, .ticket_description, body {
  color: rgba(0, 0, 0, .87) !important
}

.accordion-toggle, .k-block, .k-draghandle, .k-grid-header, .k-grouping-header, .k-header, .k-link, .k-pager-wrap, .k-treemap-tile, .primary-link, h1, h2, h3, h4, h5, h6, html .km-pane-wrapper {
  color: #0A2463 !important
}

h4 {
  font-weight: 600 !important;
  font-size: 15px !important
}

.daterangepicker td.active, .daterangepicker td.active:hover {
  background-color: #2285D0 !important
}

button.k-button-icontext.k-grid-excel, button.k-button-icontext.k-grid-pdf {
  background: 0 0 !important;
  border: 1px solid #e0e0e0 !important;
  color: #061436 !important
}

button.k-button-icontext.k-grid-excel:hover, button.k-button-icontext.k-grid-pdf:hover {
  background: #0A2463 !important;
  border: 1px solid #0A2463 !important;
  color: #FFF !important
}

.k-pager-numbers .k-state-selected
{
    color: #2285D0 !important;
    border-color: #2285D0 transparent transparent!important;
}

.k-pager-numbers .k-link.k-state-selected {
    color: #2285D0 !important;
    border-top: 1px solid #2285D0 !important;
    border-color: #2285D0 transparent transparent !important;
}
   div .k-grid-header>div>table>thead>tr.k-filter-row>th:nth-child(4)>span>span>span.k-widget.k-datepicker.k-header>span>span {
  background: #fff !important
}

.k-datepicker .k-input, .k-datepicker.k-input, .k-picker-wrap.k-state-default {
  background-color: #FFF !important
}

div.k-grid-header>div>table>thead>tr.k-filter-row {
  background: #eef7ff !important
}

.k-dropdown-wrap.k-state-active, .k-dropdown-wrap.k-state-focused, .k-dropdown-wrap.k-state-hover {
  background-color: #FFF !important;
  box-shadow: none !important
}

.k-item.k-state-hover, .k-list-optionlabel.k-state-hover:hover {
  background-color: #2285D0 !important;
  color: #fff !important
}

.blog-content-2 .blog-single-content .blog-comments .c-comment-list .media-heading>a, .k-list>.k-state-selected.k-state-focused {
  color: #0A2463 !important
}

.k-popup.k-list-container {
  padding: 0 !important
}

.k-widget.k-dropdown.k-header.form-control {
  border-bottom: 1px solid #c2cad8 !important
}

.k-dropdown .k-state-default {
  background-color: #fff !important
}

.blog-content-2 .blog-single-content .blog-comments .c-comment-list .media-heading>.c-date {
  color: #9aa5b2 !important;
  font-size: 10px !important
}

.panel-default>.panel-heading+.panel-collapse>.panel-body, .panel-group .panel-heading+.panel-collapse>.list-group, .panel-group .panel-heading+.panel-collapse>.panel-body {
  border-top-color: none !important;
  border-top: none !important
}

.btn:not(.md-skip):not(.bs-select-all):not(.bs-deselect-all):not(.btn-circle) {
  text-transform: none !important;
  border-radius: 5px
}

.btn:not(.md-skip):not(.bs-select-all):not(.bs-deselect-all).btn-lg {
  padding: 12px 26px 14px 12px!important
}

.btn-success {
  color: #fff;
  background-color: #4CAF50 !important;
  border-color: none !important
}

.btn-circle {
  border-radius: 25px !important;
  box-shadow: none !important;
  border-color: #FFF !important
}

@media (min-width:992px) {
  .page-content-wrapper .page-content {
    margin-left: 235px;
    margin-top: 0;
    min-height: 600px;
    padding: 25px 45px 10px !important
  }
}

.page-content-white .page-title {
  margin-left: -15px !important
}

.dashboard-stat2, .portlet {
  margin-bottom: 30px !important;
  border-radius: 5px !important
}

.nav-tabs>li.active>a, .nav-tabs>li.active>a:focus, .nav-tabs>li.active>a:hover {
  border-top: none !important;
  border-left: none !important;
  border-right: none !important;
  border-bottom-color: #0085c7 !important
}

.dashboard-stat2, .portlet.light.bordered {
  border: none !important;
  box-shadow: none !important
}

.margin55 {
  margin-left: 55px !important
}

.margin-top11 {
  margin-top: 11px
}

.tools {
  margin-right: 30px !important;
  margin-top: 20px !important
}

.blog-content-2 .blog-single-content .blog-comments input:focus, .blog-content-2 .blog-single-content .blog-comments textarea:focus, .blog-content-2 .blog-single-sidebar>.blog-single-sidebar-search input:focus {
  border: none !important
}

.badgestyle {
  border-radius: 50% !important;
  line-height: 1.5;
  height: 100%;
  width: 27px;
  font-size: 12px !important;
  margin-bottom: 3px
}

.badge {
  padding: 4px 6px 15px
}

.null-button, .null-button:hover, .success-button {
  padding-left: 8px !important;
  padding-right: 8px !important
}

.replay-btn {
  border: 1px solid #e0e0e0 !important;
  background: #FFF !important;
  color: #0A2463 !important
}

.replay-btn:hover {
  background: #0A2463 !important;
  color: #FFF !important
}

#grid_company_class>.k-button {
  background-color: #0A2463 !important;
}

.k-button:hover {
  color: black !important;
}

.success-button:hover {
  background: #4CAF50 !important;
  color: #fff !important
}

.null-button:hover {
  background: #70808F !important;
  color: #fff !important
}

.padding-right3 {
  padding-right: 3px
}

.padding-right0 {
  padding-right: 0px;
}

.padding0 {
  padding: 0px;
}

.paddingtop0 {
  padding-top: 0 !important
}

.paragraph-fix {
  margin-left: 46px !important
}

.paragraph-fix-audit {
  margin-left: 40px !important
}

.list-height-fix {
  margin-bottom: -11px !important
}

@media (min-width:1600px) {
  .list-height-fix {
    margin-bottom: -18px !important
  }
}

@media (max-width:539px) {
  .active>.tab-btn, .active>.tab-btn:hover {
    border-bottom: none !important
  }
}

@media (min-width:801px) and (max-width:991px) {
  .list-height-fix {
    margin-bottom: -16px !important
  }
}

@media (min-width:768px) and (max-width:799px) {
  .list-height-fix {
    margin-bottom: -16px !important
  }
}

@media (max-width:767px) {
  .list-height-fix {
    margin-bottom: -17px !important
  }
}

@media (min-width:1200px) and (max-width:1599px) {
  .paragraph-fix-audit {
    margin-left: 49px !important
  }
}

.avatar-mask {
  border-radius: 50% !important
}

.margin-left-fix {
  margin-left: 10px !important
}

.margin-left-47 {
  margin-left: 47px !important
}

.iconstyle {
  color: #fff;
  position: relative;
  bottom: 1.75px
}

.btn.btn-outline.blue {
  color: #0A2463
}

.btn.btn-outline.blue:hover {
  background-color: #F75C03
}

.badge-default {
  background-color: #F75C03 !important
}

.badge-basic {
  background-color: #bac3d0 !important
}

.badge-red {
  background-color: #F8333C !important
}

.badge-teal {
  background-color: #36c6d3 !important
}

.badge-forest {
  background-color: #317033 !important
}

.badge-yellow {
  background-color: #F5B700 !important
}

.badge-success {
  background-color: #4CAF50 !important
}

.badge-warning {
  background-color: #F75C03 !important
}

.badge-primary {
  background-color: rgba(34, 133, 208, 0.5) !important;
}

.badge-Done, .badge-solved {
  background-color: rgba(76, 175, 80, 0.5) !important;
}

.badge-Accepted, .badge-accepted {
  background-color: #A9B2BB !important;
}



.badge-In, .badge-inprogress {
  background-color: #7CB7E3 !important;
}

.width20 {
  width: 20px
}

.audit-badge {
  border-radius: 50% !important;
  padding: 0px !important;
  line-height: 2.3;
  width: 28px !important;
  height: 28px !important;
}

.labelstyle {
  background-color: #FFF;
  color: #666;
  margin-left: 10px
}

.label:not(.md-skip).label-icon {
  padding: 4px !important
}

@media screen and (max-width:450px) {
  .testcls1 {
    display: block !important;
  }
}

.labelstyle {
  background-color: #FFF;
  color: #666;
  margin-left: 10px;
}

.label:not(.md-skip).label-icon {
  padding: 4px !important;
}

@media (max-width:450px) {
  .testcls1 {
    display: block !important;
  }
}

@media (max-width:450px) {
  .tstcls {
    display: none !important;
  }
}

@media (max-width: 766px) {
  .page-content-white .page-title {
    margin-left: 0px !important;
    margin-top: 20px !important;
  }
}

@media (min-width: 766px) and (max-width: 991px) {
  .page-content-white .page-title {
    margin-top: 50px !important;
    margin-left: -2px !important;
  }
}

.errorclass {
  opacity: 1 !important;
  color: red;
  font-weight: 500;
}

.k-auto-scrollable {
  height: auto !important;
}

.col-template-val {
  margin: 0 0 1em .5em;
}

.labelreview {
  font-weight: bold;
}

.k-pdf-export .k-grid-toolbar,
.k-pdf-export .k-pager-wrap, .k-pdf-export .k-filter-row, .k-pdf-export .k-grouping-header {
  display: none;
}

/*Branding tile style*/
/*Epaybilling tile*/
.Align {
  text-align: right
}

.k-auto-scrollable {
  height: auto !important;
}

.col-template-val {
  margin: 0 0 1em .5em;
}

.empty-grid::before {
  padding: 1em;
  line-height: 3em;
  content: "No data available. ";
  font-size: 20px;
  font-family: lato;
  color: #0A2463;
}

.k-icon.k-i-pdf, .k-icon.k-i-excel {
  display: none;
}

.k-pdf-export .k-grid-toolbar,
.k-pdf-export .k-pager-wrap, .k-pdf-export .k-filter-row {
  display: none;
}

@media screen and (min-width: 800px) {
  .billing-column3 {
    display: none !important;
  }
}

@media screen and (min-width: 0px) and (max-width: 800px) {
  .billing-column2 {
    display: none !important;
  }
}

/*@media screen and (min-width: 0px) and (max-width: 800px)  {
        .k-grid-header {
            display:none!important;
        }
      }*/
.tstcls {
  display: none !important
}

.k-icon.k-i-excel, .k-icon.k-i-pdf, .k-pdf-export .k-filter-row, .k-pdf-export .k-grid-toolbar, .k-pdf-export .k-grouping-header, .k-pdf-export .k-pager-wrap {
  display: none
}

@media (max-width:766px) {
  .page-content-white .page-title {
    margin-left: 0 !important;
    margin-top: 20px !important
  }
}

@media (min-width:766px) and (max-width:991px) {
  .page-content-white .page-title {
    margin-top: 50px !important;
    margin-left: -2px !important
  }
}

.errorclass {
  color: red;
  font-weight: 500
}

.labelreview, .pay-year {
  font-weight: 700
}

.Align {
  text-align: right
}

.k-auto-scrollable {
  height: auto !important
}

.col-template-val {
  margin: 0 0 1em .5em
}

.empty-grid::before {
  padding: 1em;
  line-height: 3em;
  content: "No data available. "
}

@media screen and (min-width:800px) {
  .billing-column3 {
    display: none !important
  }
}

/* .k-grid-header*/
@media screen and (min-width:0px) and (max-width:800px) {
  .billing-column2 {
    display: none !important
  }
}

.height10 {
  height: 10px !important
}

.hideheader {
  display: none !important
}

.enMoney::before {
  content: "$"
}

.form-group.form-md-line-input.success-state .form-control.edited:not([readonly])~.form-control-focus:after, .form-group.form-md-line-input.success-state .form-control.edited:not([readonly])~label:after, .form-group.form-md-line-input.success-state .form-control:focus:not([readonly])~.form-control-focus:after, .form-group.form-md-line-input.success-state .form-control:focus:not([readonly])~label:after {
  background: #4CAF50 !important
}

.form-group.form-md-line-input .form-control.edited:not([readonly])~.form-control-focus:after, .form-group.form-md-line-input .form-control.edited:not([readonly])~label:after, .form-group.form-md-line-input .form-control:focus:not([readonly])~.form-control-focus:after, .form-group.form-md-line-input .form-control:focus:not([readonly])~label:after {
  background: #061436 !important
}

.Expired-status, .New-status, .Processed-status, .expired-status, .new-status, .processed-status, .Pending-status {
    margin-top: 8px
}

.date-created-format {
  font-size: 12px !important;
  color: #747A77 !important
}

.k-loading-image {
  /*background: #FFF !important;*/
  background-image: none;
  overflow: hidden;
  text-align: center;
  position: static
}

.k-loading-image:before, .spinningi {
  background: -webkit-gradient(linear, left top, left bottom, from(#3598dc), to(#fff));
  -webkit-text-fill-color: transparent
}

.k-loading-image:before {
  font-family: FontAwesome !important;
  content: "\f10c" !important;
  -webkit-background-clip: text;
  font-size: 40px
}

.k-loading-color, .k-loading-text {
  display: none
}

.k-loading-mask {
  position: static !important;
}

.spinningi {
  font-size: 18px !important;
  -webkit-background-clip: text;
}

.spinningi2 {
  background: -webkit-gradient(linear, left top, left bottom, from(#3598dc), to(#fff));
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}

@-webkit-keyframes rotation {
  from {
    -webkit-transform: rotate(0)
  }

  to {
    -webkit-transform: rotate(359deg)
  }
}

@media (max-width:580px) {
  .page-header.navbar .top-menu .navbar-nav>li.dropdown-user .dropdown-toggle .username.username-hide-on-mobile {
    display: inline-block
  }
}

.txt-center {
  text-align: center !important
}

.card-button-bottom {
  width: 100% !important;
  min-width: 260px !important;
  max-width: 350px !important;
  padding: 10px 0 !important
}

.jira-accordion-fix {
  border-bottom: 1px solid #edf1f5;
  padding-top: 19px;
  border-radius: 0 !important
}

.shine {
  height: 220px;
  width: 100%;
  background: #ebebeb;
  z-index: 0;
  position: relative
}

.shine:after {
  content: '';
  top: 0;
  transform: translateX(100%);
  width: 100%;
  height: 20px;
  position: absolute;
  z-index: 1;
  animation: slide 1s infinite 3s;
  background: -moz-linear-gradient(left, rgba(255, 255, 255, 0) 0, rgba(255, 255, 255, .8) 50%, rgba(128, 186, 232, 0) 99%, rgba(125, 185, 232, 0) 100%);
  background: -webkit-gradient(linear, left top, right top, color-stop(0, rgba(255, 255, 255, 0)), color-stop(50%, rgba(255, 255, 255, .8)), color-stop(99%, rgba(128, 186, 232, 0)), color-stop(100%, rgba(125, 185, 232, 0)));
  background: -webkit-linear-gradient(left, rgba(255, 255, 255, 0) 0, rgba(255, 255, 255, .8) 50%, rgba(128, 186, 232, 0) 99%, rgba(125, 185, 232, 0) 100%);
  background: -o-linear-gradient(left, rgba(255, 255, 255, 0) 0, rgba(255, 255, 255, .8) 50%, rgba(128, 186, 232, 0) 99%, rgba(125, 185, 232, 0) 100%);
  background: -ms-linear-gradient(left, rgba(255, 255, 255, 0) 0, rgba(255, 255, 255, .8) 50%, rgba(128, 186, 232, 0) 99%, rgba(125, 185, 232, 0) 100%);
  background: linear-gradient(to right, rgba(255, 255, 255, 0) 0, rgba(255, 255, 255, .8) 50%, rgba(128, 186, 232, 0) 99%, rgba(125, 185, 232, 0) 100%);
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#00ffffff', endColorstr='#007db9e8', GradientType=1)
}

@keyframes slide {
  0% {
    transform: translateX(-100%)
  }

  100% {
    transform: translateX(100%)
  }
}

.badge .badge-empty1 {
  margin-right: 3px;
  border-radius: 10px;
  width: fit-content;
  padding-left: 10px;
  padding-right: 10px
}

.uicard, .uicardimage {
  padding: 0;
  position: relative
}

.nodisplay {
  display: none !important
}

.closed-margin {
  margin-right: 46px;
  margin-bottom: 8px
}

.blog-content-2 .blog-single-content .blog-comments i {
  top: 0 !important
}

.panel-group {
  margin-bottom: 0 !important
}

.mt-element-step .step-line .done .mt-step-number, .mt-element-step .step-no-background-thin .done .mt-step-number {
  background: #4CAF50 !important;
  color: #fff !important;
  border-color: #4CAF50 !important
}

.mt-element-step .step-line .active .mt-step-content, .mt-element-step .step-line .active .mt-step-title, .mt-element-step .step-no-background-thin .active .mt-step-content, .mt-element-step .step-no-background-thin .active .mt-step-title {
  color: #2285D0 !important
}

.mt-element-step .step-line .done .mt-step-content, .mt-element-step .step-line .done .mt-step-title, .mt-element-step .step-no-background-thin .done .mt-step-content, .mt-element-step .step-no-background-thin .done .mt-step-title {
  color: #4CAF50 !important
}

.md-checkbox label>.check {
  border: 2px solid #2285D0 !important;
  border-left: none !important;
  border-top: none !important
}

.widthfix {
  width: 28px !important;
  height: 28px !important;
}

.nmarg4 {
  margin-left: -4px
}

@media screen and (max-width:480px) {
  .mobile-margin-top {
    margin-top: 30px !important
  }
}

.line-height-fix {
  line-height: 100% !important
}

@media screen and (min-width:992px) {
  .widthfix {
    min-width: 60px !important
  }

  .mobile-portlet-fix, .nmarg4 {
    margin-left: 0 !important
  }
}

.btn-success, .btn-success:hover {
  border: none !important
}

.success-state {
  border-bottom: 0px solid #4CAF50!important;
}

.textright {
  text-align: right !important
}

.textleft {
  text-align: left !important
}




.danger-button {
  background: #fff !important;
  color: #F8333C !important;
}

.danger-button:hover {
  background: #F8333C !important;
  color: #FFF !important;
}

.btn-primary:hover, .btn-success:hover {
  opacity: .9
}

.marginleft0 {
  margin-left: 0 !important
}

.uicard {

  max-width: 100%;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  width: 100%;
  min-width: 280px;
  min-height: 0;
  background: #fff;
  border: none;
  border-radius: 5px;
  -webkit-box-shadow: 0 1px 3px 0 #d4d4d5, 0 0 0 1px #d4d4d5;
  box-shadow: 0 1px 3px 0 #d4d4d5, 0 0 0 1px #d4d4d5;
  -webkit-transition: -webkit-box-shadow .1s ease, -webkit-transform .1s ease;
  transition: all .7s ease-out;
  margin: 50px auto
}

.uicardimage {
  display: block;
  -webkit-box-flex: 0;
  -ms-flex: 0 0 auto;
  flex: 0 0 auto;
  background: rgba(0, 0, 0, .05);
  border-radius: 5px 5px 0 0;
  top: -1px
}

.uicardimage>img {
  display: block;
  width: 100%;
  height: auto;
  border-radius: inherit
}

.uicardcontent {
  -webkit-box-flex: 1;
  -ms-flex-positive: 1;
  flex-grow: 1;
  border: none;
  border-top: 1px solid rgba(34, 36, 38, .1);
  background: 0 0;
  margin: 0;
  padding: 1em;
  -webkit-box-shadow: none;
  box-shadow: none;
  font-size: 1em;
  border-radius: 0
}

.capitalize {
  text-transform: capitalize !important
}

.cardview, .tableview {
  width: 38px
}

.company-header {
  text-align: center;
  position: relative;
  top: -153px;
  color: #fff !important;
  height: 38px;
  overflow: inherit;
}

.margin-top10 {
  margin-top: 10px !important
}

.margin-bottom20 {
  margin-bottom: 20px
}

.margin-bottom50 {
  margin-bottom: 50px
}

.contact-email, .contact-invite {
  display: inline;
  margin-bottom: 0
}

.my-dashbutton {
  border: 1px solid #0A2463 !important;
  color: #0A2463 !important;
  width: 147px !important;
  height: 47px !important;
  font-size: 15px !important;
  margin-right: 15px !important;
}

.my-dashbutton:hover {
  border: 1px solid #0A2463 !important;
}

.company-photomask {
    background: #fff;
    box-shadow: 0 10px 10px 0 rgba(0, 0, 0, .2);
    width: fit-content;
    margin-left: auto;
    margin-right: auto;
    border-radius: 50%;
    position: absolute;
    top: 111px;
    left: 38%;
    right: auto
}

.point-events {
  pointer-events: none
}

@media screen and (max-width:768px) {
  .text-center-mobile {
    text-align: center !important;
    margin-top: 10px
  }
}

.company-subheader {
  top: -130px !important;
  font-size: 11px;
  color: #fff !important;
  position: relative;
  text-align: right
}

.pay-style, .pay-year {
  position: absolute;
  color: #fff
}

.company-content {
  margin-top: 55px !important
}

.contact-name {
  display: inline
}

.contact-email {
  font-size: 14px
}

.contact-invite {
  float: right;
  font-size: 12px
}

.pay-style {
  top: 6px
}

.pay-year {
  top: 0;
  right: 10px;
  font-size: 21px
}

.fontawesome-Addons::after, .fontawesome-Employee::after, .fontawesome-Payments::after, .fontawesome-Payroll::after, .fontawesome-Reports::after, .fontawesome-Security::after, .fontawesome-Settings::after, .fontawesome-System::after, .fontawesome-YearEnd::after, .fontawesome-null::after {
  font-family: FontAwesome;
  font-style: normal;
  font-weight: 400
}

.contact-name-font, .contact-phone {
  font-size: 14px
}

.contact-phone {
  margin-bottom: 10px
}

.content-height {
  height: 195px;
  margin-top: -2px
}

.card-address {
  text-align: center;
  border-top: 1px solid rgba(34, 36, 38, .1);
  padding-bottom: 10px;
  color: #8e8e8e;
  font-size: 13px
}

.address-next-line {
  margin-top: -15px
}

.invitedcheck {
  color: #2285D0 !important;
  margin-left: 2px
}

.hoverup:hover {
  bottom: 2px
}

@media (min-width:1200px) {
  .list-column-fix {
    width: 30% !important
  }
}

.padding-bottom-fix {
  padding-top: 30px;
  padding-bottom: 30px;
  border-radius: 0 !important
}

.fontawesome-Employee::after {
  content: "\f007"
}

.fontawesome-Reports::after {
  content: "\f080"
}

.fontawesome-Payroll::after {
  content: "\f0d6"
}

.fontawesome-Security::after {
  content: "\f023"
}

.fontawesome-Payments::after {
  content: "\f09d"
}

.fontawesome-Rules::after {
  content: "\f24e";
  font-family: FontAwesome;
  font-style: normal;
  font-weight: 400
}

.fontawesome-Addons::after {
  content: "\f12e"
}

.fontawesome-Settings::after {
  content: "\f013"
}

.fontawesome-YearEnd::after {
  content: "\f274 "
}

.fontawesome-System::after {
  content: "\f0ad"
}

.fontawesome-null::after {
  content: "\f013"
}

.fontawesome-Improvement::after {
  content: "\f188";
  font-family: FontAwesome;
  font-style: normal;
  font-weight: 400
}

.fontawesome-Feature::after {
  content: "\f06b";
  font-family: FontAwesome;
  font-style: normal;
  font-weight: 400
}

.fontawesome-B2B::after {
  content: "\f09d";
  font-family: FontAwesome;
  font-style: normal;
  font-weight: 400
}

.total-border {
  border-bottom: 1px solid #0A2463
}

.final-total-border {
  border-bottom: double #0A2463
}

.font-weight-normal {
  font-weight: 400 !important
}

.companyname {
  float: right;
  word-break: break-all;
  max-width: 100px;
  overflow: hidden
}

.company-photomask:hover img {
  display: none
}

.company-photomask:hover a {
  display: block
}

.company-photomask a {
  display: none;
  width: 80px;
  margin-left: auto;
  margin-right: auto;
  text-align: center;
  border-radius: 50%;
  height: 80px;
  line-height: 5.8
}

/* @media (max-width:991px) {
  .margin-bottom-mobile-payrun {
    margin-bottom: 200px !important
  }
}

@media (min-width:992px) {
  .margin-bottom-mobile-payrun {
    margin-bottom: 170px !important
  }
} */
.height-mobile-payrun, .payrun-mobile-height-fix {
  height: 550px;
}

@media (max-width:767px) {
    .payrun-mobile-height-fix {
        height: 500px !important;
    }
}

@media (max-width:767px) {
    .mobile-fullscreen-margin {
        margin-top: -30px !important
    }
}

.payrun-hist-mobile-fix {
  padding-bottom: 5px !important;
}

@media (max-width:1200px) {
  .payrun-hist-mobile-fix {
    padding-bottom: 4px !important;
  }
}

@media (max-width:1200px) and (min-width: 767px) {
  .payrun-mobile-height-fix {
    height: 723px !important;
  }
}

.payrun-history-margin {
  margin-bottom: 46px !important;
}

@media (min-width:991px) and (max-width:1200px) {
  .payrun-history-margin {
    margin-bottom: 85px !important;
  }
}

.portlet-height-fix-profile {
  height: 565px;
}

.jcrop-holder {
  text-align: center;
  margin-left: auto;
  margin-right: auto;
}

.lastpay-font {
  float: left;
  display: inline-block;
  margin-bottom: 0px;
  color: #737A77 !important;
  font-weight: bold;
  font-size: 16px;
  text-align: left;
}

.nextpay-font {
  float: right;
  display: inline-block;
  margin-bottom: 0px;
  color: #2285D0;
  font-weight: bold;
  font-size: 16px;
  text-align: right;
}

.marginbottom0 {
  margin-bottom: 0px;
}

@media (max-width:1200px) {
  .portlet-height-fix-profile {
    height: auto !important
  }
}

.scroller-height-portlet-fix {
  max-height: 406px;
}

.leftcalc {
  left: calc(100% - 186px);
}

.uparrow {
  display: inline;
  font-size: 20px;
  vertical-align: super;
}

.client_growth {
  display: inline;
  font-size: 50px;
}

.client_growth_month {
  color: #68696B;
  text-align: center;
  border-top: 1px solid rgba(104, 105, 107, 0.22);
  max-width: 43px;
  margin-left: auto;
  margin-right: auto;
}

.percentsuper {
  display: inline;
  vertical-align: text-top;
  font-size: 20px;
  margin-left: -10px;
}

.stat-text {
  color: #68696B;
  font-size: 16px;
  margin-top: 63px;
  text-align: center;
}

.statiles {
  max-width: 320px
}

.top-load-height, .top-load-height-mobile {
  min-height: 157px;
}

@media (max-width: 767px) {
  .top-load-height-mobile {
    min-height: 0px;
  }
}

.statbackground {
  background: #f6f8fa;
  border-radius: 5px 5px 0px 0px;
  min-height: 186px;
}

.stat-bottom {
  width: 100%;
  margin: 0px !important;
  position: unset;
  bottom: 0;
  padding-top: 4px !important;
  padding-bottom: 4px !important;
  border-radius: 0px 0px 5px 5px !important;
}

.stat-percent {
  width: 100%;
  height: 100%;
  text-align: center;
  font-size: 50px;
  color: #4caf50;
  margin-top: 29px;
  margin-bottom: 38px;
}

.no-data-style {
  font-size: 20px;
  font-family: lato;
  color: rgb(10, 36, 99);
  padding-left: 40%;
}

.font15 {
  font-size: 15px !important;
}

.earningfont {
  font-weight: 600 !important;
  font-size: 20px !important;
}

.greyfont {
  color: #747A77 !important;
}

.greenfont {
  color: #4caf50 !important;
}

.payrun-history-container {
  max-width: 350px;
}

@media (max-width: 440px) {
  .payrun-history-container {
    max-width: 229px;
  }
}

.tooltip-inner {
  max-width: 350px;
  /* If max-width does not work, try using width instead */
  /* width: 350px; */
}

#sortable1, #sortable2, #sortable3, #sortable4, #sortable5, #sortable6, #sortable7, #sortable8, #sortable9, #sortable10 {
  padding: 0px
}

.portlet-title {
  padding-left: 0px !important;
  padding-right: 0px !important;
}

@media screen and (max-width:767px) {
  .tooltip {
    display: none !important;
  }
}

.client-profile-pic {
  min-height: 80px;
  min-width: 80px;
  max-width: 80px;
  max-height: 80px;
}

.pe-secondary {
  color: #2285D0;
  background-color: #FFF !important;
  border: 1px solid #2285D0 !important;
  border-width: 1px !important;
}

.pe-secondary:hover {
  color: #2285D0 !important;
}

.fname {
  border: none;
  text-align: center;
  background: bottom;
  color: slategray;
  /*margin-left:25px;
    width:300px;*/
  text-overflow: ellipsis;
}

.bg-danger {
  background-color: #fbe1e3 !important;
}

.page-header.navbar .top-menu .navbar-nav>li.dropdown-user .dropdown-toggle>i {
  position: inherit;
  bottom: 4px;
}

.isDisabled {
  color: currentColor;
  cursor: not-allowed;
  opacity: 0.5;
  text-decoration: none;
  pointer-events: none;
}

.k-list-optionlabel {
  display: none;
}

#company_name-error, #company_name_fs-error {
  margin-top: 10px;
}

a.dropdown.btn.blue.btn-outline.btn-circle.dropdown-toggle[aria-expanded="true"] {
  background-color: #FF6600;
  opacity: 0.6;
  color: white;
}

#company_name-error, #company_name_fs-error {
  margin-top: 10px;
}

/* .tooltip {
    position: absolute;
    display: inline-block;
  }

  .tooltip .tooltiptext {
    visibility: hidden;
    width: 120px;
    background-color: black;
    color: #fff;
    text-align: center;
    border-radius: 6px;
    padding: 5px 0;
    position: absolute;
    z-index: 1;
    bottom: 100%;
    left: 50%;
    margin-left: -60px;
    opacity: 0;
    transition: opacity 1s;
  }
  .tooltip:hover .tooltiptext {
    visibility: visible;
    opacity: 1;
  }
  .tooltip-arrow{
    display: none;
  } */
/* tooltip styling class */
#tooltip {
    text-align: center;
    font-size: 12px;
    color: #fff;
    background: #111;
    position: absolute;
    z-index: 100;
    padding: 15px;
    border-radius: 6px;
    width: auto;
}

    #tooltip:after
    /* triangle decoration */ {
        width: 0;
        height: 0;
        border-left: 10px solid transparent;
        border-right: 10px solid transparent;
        border-top: 10px solid #111;
        content: '';
        position: absolute;
        left: 50%;
        bottom: -10px;
        margin-left: -10px;
    }

    #tooltip.top:after {
        border-top-color: transparent;
        border-bottom: 10px solid #111;
        top: -20px;
        bottom: auto;
    }

    #tooltip.left:after {
        left: 10px;
        margin: 0;
    }

    #tooltip.right:after {
        right: 10px;
        left: auto;
        margin: 0;
    }

/*****edit-add-grid-buttons*****/
.btn-benefit {
  color: white;
}

.mr-icon {
  margin-right: 3px;
}

.trash-button {
  background-color: #fff !important;
  border: 1px solid #f8333c !important;
  color: #f8333c !important
}

.trash-button:hover {
  background-color: #f8333c !important;
  color: #fff !important;
  border: 1px solid rgba(255, 0, 0, 0) !important
}

/*****edit-add-grid-buttons*****/
/******Date Picker customization for showing on the top of form*/
.ui-datepicker {
  z-index: 9999 !important;
}

/*****end*****/
/****Disable Red Dirty flag****/
.k-dirty {
  display: none;
}

/*****end*****/
/*******TooTip Fix for Classes Grid*******/
.k-widget.k-tooltip-validation {
  background-color: rgba(100, 100, 100, .9);
}

.k-tooltip-validation .k-callout-n {
  border-bottom-color: rgba(100, 100, 100, .9);
}

/*#companybenefit_class {

    overflow-y:scroll;
}*/
/****End****/
/****Class for kendo calender input box****/
.init-state {
  border-bottom: 1px solid #c2cad8;
}

/****End****/
/*****Fix for kendo calender hover*****/
.k-calendar .k-header .k-state-hover {
  background-color: #c2cad8
}

/****End****/
/****** Styling for user manger grid ********/
#UserManager.k-grid td {
    font-size: 12px;
    word-break: break-all;
}

#UserManager.k-grid {
    font-size: 11px;
}

#UserManager .k-grid-header th.k-header {
    font-size: 12px !important;
}

    #UserManager.k-grid-header th.k-header > .k-link {
        font-size: 12px !important;
    }
/*******End Styling for usermanger grid**********/
/****Raduis for delete custom pop up****/
.popup-bradius {
  border-radius: 5px !important;
}

/******End*******/
/****fix to get the valiation message out of the rule grid *****/
#grid_product_rules > .k-grid td {
    overflow: inherit;
}

/******End******/
/******Client profile card*******/
#cust_prof {
    max-height: 600px
}

#testkendoview1 {
    cursor: default;
    max-height: 600px;
}

.client-profile-uicardimage {
    display: block;
    -webkit-box-flex: 0;
    -ms-flex: 0 0 auto;
    flex: 0 0 auto;
    /*background: rgba(0, 0, 0, .05);*/
    border-radius: 5px 9px 5px 5px;

    top: -3px;
    height: 150px;
    overflow: hidden;
    padding: 0;
    position: relative;
}

.client-profile-cardcontent {
  -webkit-box-flex: 1;
  -ms-flex-positive: 1;
  flex-grow: 1;
  border: none;
  /*border-top: 1px solid rgba(34, 36, 38, .1);*/
  background: 0 0;
  margin: 0;
  padding: 1em;
  -webkit-box-shadow: none;
  box-shadow: none;
  font-size: 1em;
  border-radius: 0
}

.cp-content-height {
  height: 350px;
  margin-top: -2px;
}

.cp-company-photomask {
  background: #fff;
  box-shadow: 0 10px 10px 0 rgba(0, 0, 0, .2);
  width: 80px;
  margin-left: auto;
  margin-right: auto;
  border-radius: 50%;

  right: auto;
  margin-top: -37px;
}

.cp-company-photomask:hover img {
  display: none
}

.cp-company-photomask:hover a {
  display: block
}

.cp-company-photomask a {
  display: none;
  width: 80px;
  margin-left: auto;
  margin-right: auto;
  text-align: center;
  border-radius: 50%;
  height: 80px;
  line-height: 5.8
}

.cp-action-card {
  display: block;
  font-size: 12px;
  text-align: center;
  margin-top: 15px;
  color: #0A2463;
  cursor: pointer;
}

.cp-action-card:hover {
  color: #7987A9;
}

.cp-action-card>p {
  margin-top: 15px !important;
}

.cp-row-margin {
  margin-left: 20px;
}

.cp-contact {
  color: #8e8e8e;
  font-size: 13px;
}

.cp-contact-mtop {
  margin-top: 325px;
}

.jira_actions {
    width: 252px;
    float: right;
    margin-right: 17px !important;
    margin-left: -20px;
    margin-top: -38px;
}

/*****************User Management Profile Page**********/
.circle {
    height: 6px;
    width: 6px;
    background-color: #4CAF50;
    border-radius: 50% !important;
    display: inline-block;
    margin: 2px;
}

.info-label {
    margin-top: 20px;
    display: flex;
    flex-direction: row;
    justify-content: flex-start;
    align-items: center;
    font-size: 16px;
}

.user-info-labels {
    color: #212121;
    font-family: Lato;
    font-size: 14px!important;
    font-weight: bold;
    letter-spacing: -0.17px;
    line-height: 17px;
    margin-left: 16px;
}

#UserManagementProfile {
    box-shadow: 8px 14px 38px rgba(39, 44, 49, .2), 1px 3px 8px rgba(39, 44, 49, .2) !important;
    transition: box-shadow .3s ease-in-out;
}

.um-profile-avatar {
    width: 100px;
    height: 100px;
    border-radius: 50%;
    background: #8592B2;
    color: white;
    font-size: 30px;
    text-align: center;
    padding: 20px;
}

.um-profile-card {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    /*box-shadow: 8px 14px 38px rgba(39, 44, 49, .2), 1px 3px 8px rgba(39, 44, 49, .2) !important;*/
    transition: box-shadow .3s ease-in-out;
    border-radius: 5px;
    /*margin-bottom: 40px;*/
}

.um-profile-complbl {
    color: #808080;
    font-family: Lato;
    font-size: 13px;
    font-weight: bold;
    letter-spacing: -0.16px;
    line-height: 16px;
}


/*****************End User Management Profile Page**********/
@media (min-width:450px) and (max-width:900px) {
    .jira_actions {
        width: 100px;
        float: right;
        margin-right: 17px !important;
        margin-left: -20px;
        margin-top: -38px;
    }
}


.jira-filter-left {

    left:0!important;

}

.floating-navbar {
    position: fixed;
    width: 95%;
    z-index: 1111;
    margin-left: -20px;
    background-color: #F4F8FB;
    top: 50px;
}

.tile-footer {
    margin-top: 40px;
}

.item-status {
    float: right !important;
    min-width: 118px;
    text-align: right;
    margin-top: 0px;
}

.epay-tile {
    min-height: 20px;
    padding-bottom:40px;
}
.top-mr {
    margin-top:15px;
}

.mobile-refresher {
    position: relative;
    z-index: 111;
}

/*********padding for tiles*/
.adjust-padding {

    padding-bottom:1px!important;

}

.adjust-padding-benefits {
    padding-bottom: 20px !important;
}

.adjust-padding-epay {
    padding-bottom: 20px !important;
}

.adjust-padding-client {
    padding-bottom: 20px !important;
}

.adjust-padding-client-fs {
    padding-bottom: 0px !important;
}

/*********padding for tiles ends*/
.mobile-top-padding {
    padding-top: 0px;
}

.mobile-dp-fix {
    margin-right:0px;
    margin-top:0px;

}
.mobile-status-fix {
    margin-right: 10px;
    margin-top: 0px !important;
}
.time-stamp-fs {
    position: relative;
    margin-top: -32px;
}

.time-stamp-fs-ur {
    position: relative;
    margin-top: -50px;
}

.time-stamp-fs-ur-com {
    position: relative;
    margin-top: -86px;
}


.time-stamp-fs-al {
    position: relative;
    margin-top: -32px;

}


.toggle-full-screen-dashboard {
    margin-top: 80px !important;
}

.client-added {
   display:inline-block!important;
}

.client-added-prof-btn {
    float: right;
    margin-left: 0px;
}

.support-sub-fs {
    float: left;
    font-size: 13px !important;
    font-weight: 400 !important;
    color: #212121 !important;
    width: 100%;
    text-overflow: ellipsis;
    overflow: hidden;
    white-space: nowrap;
}

.status-read {
    font-weight:normal!important;
}

.status-unread {
    font-weight: bold!important;
}

.support-mobile-filter {
    left: 0px;
}
.close-jira {
    margin-top: -3px;
    margin-right: -9px;
}

.company-address-position {
    position: relative;
    top: -195px;
    color: #FFF;
}
.audit_actions_mb {
    margin-top: 3px;
    padding: 0px !important;
    max-width: 400px;
}

.audit-search {
    display: inline-block;
    min-width: 321px;
    margin-top: 0px;
    float: left;
}

.use_repo_action_mb {
    padding: 0px !important;
    max-width: 500px;
    margin-top: 0px;
}

.truncate {
    max-width: 250px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}



/*end of the styles 2019*/
@media screen and (max-width:450px) {

    .truncate {
        max-width: 200px;
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
    }

    .use_repo_action_mb {
        padding: 0px !important;
        max-width: 323px;
        margin-top: -3px;
    }


    .audit-search {
        display: inline-block;
        min-width: 321px;
        margin-top: 15px;
        float: right;
    }

    .audit_actions_mb {
        margin-top: -24px;
        padding: 0px !important;
        max-width: 327px;
    }
        .close-jira {
        margin-top: -57px;
        margin-right: -9px;
    }

    .company-address-position {
        position: relative;
        top: -170px;
        color: #FFF;
    }

    .support-mobile-filter {
        left: -120px;
    }
    .client-added-prof-btn {
        float: right;
        margin-left: -15px;
    }

    .client-added {
        display: grid!important;
    }

    .time-stamp-fs {
        position: relative;
        margin-top: -15px;
    }
    .time-stamp-fs-ur {
        position: relative;
        margin-top: -36px;
    }

    .mobile-status-fix {
        margin-right: 10px;
        margin-top: -12px !important;
    }

    .mobile-dp-fix {
        margin-right: 13px;
        margin-top: 10px;
    }

    .adjust-padding-benefits {
        padding-bottom: 45px !important;
    }

    .adjust-padding-client {
        padding-bottom: 45px !important;
    }

    .adjust-padding-epay {
        padding-bottom: 45px!important;
    }

    .adjust-padding {
        padding-bottom: 45px!important;
    }

    .adjust-padding-client-fs {
        padding-bottom: 20px !important;
    }

    .cp-contact {
        color: #8e8e8e;
        font-size: 12px;
    }

    .card-address {
        color: #ffffff;
    }

    #cust_prof {
        margin-left: -12px;
    }

    #treelist > .k-tooltip.k-popup {
        visibility: hidden;
    }

    .pager-responsive {
        width: auto !important;
        float: right !important;
        min-width: 100px !important;
    }

    .last-refresh {
        float: left !important;
        margin-top: 5px !important;
    }

    .fullscreen-container {
        width: 150px !important;
        height: 40px !important;
    }

    #treelist > .k-tooltip.k-popup {
        visibility: hidden;
    }

    .jira_actions {
        width: 200px;
        float: left;
        margin-right: 5px !important;
        margin-left: -32px;
        margin-top: 10px;
    }

    .jira-filter-left {
        left: -150px !important;
    }

    .floating-navbar {
        position: fixed;
        width: 100%;
        z-index: 1111;
        margin-left: -9px;
        background-color: #F4F8FB;
        top: 49px;
    }

    .tile-footer {
        margin-top: -15px;
    }

     .k-grid-pager {
        display: none!important;
    }

    .item-status {
        float: right !important;
        min-width: 118px;
        text-align: right;
        margin-top: -30px;
    }

    .epay-tile {
        min-height: 20px;
        padding-bottom: 0px;
        margin-top: -18px;
    }

    .top-mr {
        margin-top: 20px;
    }

    .mobile-top-padding {
        padding-top: 100px !important;
    }
}

@media screen and (min-width:768px) {
  .cp-content-height {
    height: 250px;
    margin-top: -2px;
  }

  .cp-contact-mtop {
    margin-top: 225px;
  }
}

.card-header .fa {
  transition: .3s transform ease-in-out;
}

.card-header .collapsed .fa {
  transform: rotate(90deg);
}

.jira-footer-pf {
    text-align: right;
    color: #9D9999;
    font-size: 14px;
    font-weight: bold !important;

}

#grid_company_policy>.k-grid-header {
  display: block !important;
}

.k-pdf-export .k-filterable .k-grid-filter {
  display: none;
}

.epay-status {
    margin-top: -20px !important;
    margin-right: 10px;
}



.k-grid .k-pager-wrap {
    display: flex;
}


    .k-grid .k-pager-wrap .k-pager-info {
        order: 8;
    }

@media screen and (max-width:700px) {
  .epay-status {
    margin-top: 10px !important;
  }

  .k-grid-toolbar {
    display: none;
  }

    .k-grid-pager {
        display: none !important;
    }
}

@media (max-width:991px) {
    .floating-navbar {
        position: fixed;
        width: 100%;
        z-index: 1111;
        margin-left: -20px;
        background-color: #F4F8FB;
        top: 50px;
    }
}

@media screen and (max-width:767px) {

    .time-stamp-fs {
        position: relative;
        margin-top: -36px;
    }

    .floating-navbar {
        position: fixed;
        width: 100%;
        z-index: 1111;
        margin-left: -10px;
        background-color: #F4F8FB;
        top: 49px;
    }

    .adjust-padding-benefits {
        padding-bottom: 45px !important;
    }
    .k-grid-pager {
        display: none !important;
    }

    .adjust-padding {
        padding-bottom: 45px!important;
    }

    .adjust-padding-epay {
        padding-bottom: 45px !important;
    }

    .adjust-padding-client {
        padding-bottom: 45px !important;
    }

    .adjust-padding-client-fs {
        padding-bottom: 20px !important;
    }
    .modal-dialog {
        height: 100%;
        position: relative;
        width: auto!important;
        margin: 0px;
        overflow-y: scroll!important;
    }

    .modal-body {
        max-height: 667px;
        padding: 18px;
        overflow-y: auto;
        -webkit-overflow-scrolling: touch;
    }

    body.modal-open {
        overflow: hidden!important;
    }

    .last-refresh {
        float: left !important;
        margin-top: 5px !important;
    }
}

.audit-footer-text {
  color: #20273A;
  cursor: pointer;
  margin-right: 10px;
  margin-left: 10px
}

.card-header .fa {
  transition: .3s transform ease-in-out;

}
.card-header .collapsed .fa {
  transform: rotate(90deg);
}


#grid_company_Policy_parent tbody .k-button {
  min-width: 40px;
}

.padding-card-fix {
  padding-top: 20px!important;
    padding-bottom: 20px!important;
}
.content-height-client-cards {
  height:150px;
}
.actions-cards {

margin-top:-65px;

}


@media (max-width: 767px) {

  /* .actions-cards {
  margin-top:0px;

  } */

  .content-height-client-cards {
    height:177px;
  }

}
/* .cardBackgroundFormat {

  transform: rotate(180deg) scaleX(-1);
} */
.company-header {font-weight: 500;}

.company-name-size {
    font-size: 18px;
    top: -165px;
}

.company-address-format {

    top: -185px;
position: relative;
text-align: center;
color: #fff;

}
.margin-5-top-bottom {
  margin-top: 5px;
  margin-bottom: 10px;
}


.margintop-5 {
  margin-top:5px;
}

.paddingright-0 {

  padding-right:0px;
}

.linkcolor {

  color: #0A2463;
}

.negative-50-margin {

  margin-left: -50px;
}

.client-card-links {

  max-width: 50px;
  max-height:44px;
}

.action-max-height {

  max-height: 44px;
}

.hover-client:hover {
opacity:  0.8;
}


.dollar-icon-special {
  position: absolute;
  top: 10px;
  right: 20px;
  width: 20PX;

}

.dollar-icon-client-special {

  position: relative;
top: -10px;
right: 0px;
width: 20PX;
}

.card-button-width {

      box-sizing: border-box!important;
}
.border-box-fix {
      box-sizing: border-box!important;
}



.address-font-size {

  font-size: 14px;
}

.company-header-margin-top {
  margin-top: -30px;
}

@media (max-width:767px) {
  .company-header-margin-top {
    margin-top: 50px;
  }

    .time-stamp-fs {
        position: relative;
        margin-top: -10px;
    }

}

#client_fs > .k-grouping-header > .k-group-indicator > .k-link {
    color: white !important;
}

    #treelist:hover {
        width:256px !important;
    }
.k-i-filter:before {
    content: "\e129";
    color: #0a2463;
}



.panel-group .panel:hover {
    overflow: visible;
    background-color: #eef7ff !important;
}


/*/#eef7ff !important /*/


.badge-Accepted, .badge-accepted :hover {
    background-color: #A9B2BB !important;
}


.panel-custom {
    padding-top: 19px;
    border-radius: 0px !important;
    background-color: #f9f9f9 !important;
}

.panel-custom:hover {
    padding-top: 19px;
    border-radius: 0px !important;
    background-color: #eef7ff !important;
}



#Label_value1-error {
    margin-top: 8px;
    color: red !important;
}

#app_name1-error {
    margin-top: 10px;
    color: red !important;
}


.k-multiselect {

    margin-top:10px;
}

#Label_value1_taglist > .k-button {
    background-color: gray;
    border-radius:10px;
}

#Label_value1_taglist > .k-state-hover {
    background-color: gray!important;
}

#Label_value1_taglist > .k-button:hover {
    background-color: gray;
}


#Label_value1_taglist > .k-button > span {
    color: white;
}

#Label_value_fs-error {
    margin-top: 8px;
    color: red !important;
}

#app_name_fs-error {
    margin-top: 10px;
    color: red !important;
}

.k-multiselect {
    margin-top: 10px;
}

#Label_value_fs_taglist > .k-button {
    background-color: gray;
    border-radius: 10px;
}

#Label_value_fs_taglist > .k-state-hover {
    background-color: gray !important;
}

#Label_value_fs_taglist > .k-button:hover {
    background-color: gray;
}

#Label_value_fs_taglist > .k-button > span {
    color: white;
}



#grid_company_class_child, #grid_company_class_child_fs, #grid_company_policy, #grid_company_policy_fs, #Grid_Change_Reports, #Grid_Change_Reports_fs > .k-grid-content > table > tbody > tr {
    cursor: default !important;
}

::-webkit-file-upload-button {
    cursor: pointer;
}

.filter-icon {
    width: 15px;
    height: 15px;
}


.k-multiselect-wrap {
    border:none!important;
}


.accordion-toggle {
    font-weight:400!important;
}

.form-group.form-md-line-input.has-error .form-control {
    border-bottom: 2px solid #e73d4a;
}

.heading-font {
    font-size: 12px !important;
    margin-top: 2px;
}

.mt-element-step .step-line .mt-step-title:after, .mt-element-step .step-line .mt-step-title:before {
    content: '';
    height: 1px;
    width: 47%;
    position: absolute;
    background-color: #e5e5e5;
    top: 12px!important;
    z-index: 4;
    transform: translateY(-100%);
    left: -31%;
}

.k-grid-pager {
    margin-top: 30px;
    float: right !important;
}

.k-grid-pager > .k-pager-info {
        float: none;
 }

/*styles to highlight if a filter is active*/
.k-grid-filter.k-state-active {
    background-color: #e2e0e0;
    border-radius: 50%;
}

.k-grid-filter.k-state-active .k-icon {
    width: 1.5em;
}
/*end styles to highlight if a filter is active*/

@media screen and (max-width:1024px) {
    .k-grid-pager > .k-pager-info {
        display: none;
    }
    .time-stamp-fs {
        position: relative;
        margin-top: -36px;
    }

    .time-stamp-fs-ur {
        position: relative;
        margin-top: -56px;
    }

    .time-stamp-fs-al {
        position: relative;
        margin-top: -38px;
    }

    .time-stamp-fs-ur-com {
        position: relative;
        margin-top: -86px;
    }

}

@media (max-width:767px) {
    .time-stamp-fs {
        position: relative;
        margin-top: -10px;
    }

    .time-stamp-fs-ur {
        position: relative;
        margin-top: -37px;
    }

    .time-stamp-fs-al {
        position: relative;
        margin-top: 15px;
    }

    .time-stamp-fs-ur-com {
        position: relative;
        margin-top: -32px;
    }

    #header_notification_bar .dropdown-menu {
        margin-right: 0px;
    }

    #header_notification_bar .page-header.navbar .top-menu .navbar-nav > li.dropdown-notification .dropdown-menu:after, .page-header.navbar .top-menu .navbar-nav > li.dropdown-notification .dropdown-menu:before {
        margin-right: 11px !important;
    }

    #header_notification_bar .dropdown-menu > li > a {
        padding: 6px 10px 6px 13px!important;
        
    }
    #header_notification_bar .dropdown-menu > li > a {
        padding: 6px 10px 6px 13px !important;
    }

    #avatarEvolv .dropdown-menu > li > a {
        padding: 6px 10px 6px 13px !important;
    }
}

@media screen and (max-width:450px) {

    .mobile-status-fix {
        margin-right: 10px !important;
        margin-top: -12px !important;
    }

    .mobile-dp-fix {
        margin-right: 13px !important;
        margin-top: 10px !important;
    }
}



/*** Support Ticket Tile Classes ***/

.support-avatar {
    margin-top: -7px;
    margin-right: 5px;
}

.ticket-title-span {
    font-size: 14px;
    color: #747A77;
}

.ticket-number-font {
    font-weight: bold;
    color: #212121;
}

.ticket-support-business {
    color: #212121;
    font-size: 20px !important;
}

.ticket-number-row {
    border-bottom: 1px solid #d1d7E2;
    padding-bottom: 30px;
}

.margintop-10 {
    margin-top: 10px;
}

.resolved-badge {
    font-size: 14px;
    color: #fff;
    background-color: #4CAF50;
    border-radius: 5px;
    padding: 5px;
}

.chat-message {
    padding-top: 30px;
    padding-bottom: 10px;
    padding-right: 15px;
    padding-left: 15px;
}

.chat-avatar {
    margin-top: -7px;
    margin-right: 5px;
    background: #165585 !important;
    opacity: 1 !important;
}

.avatar-width-chat {
    width: 14px;
}


.paymentevolution-chat-name {
    color: #212121;
    font-size: 13px;
}

.chat-days {
    color: #747a77;
    margin-left: 5px;
}

.darkblue-chat-bubble {
    background: #dbddde;
    padding: 10px;
    border-radius: 0px 5px 5px 5px;
    color: #1f0808;
    width: fit-content;
    float: left;
    margin-left: 15px;
}
    .darkblue-chat-bubble a {
        color: blue !important;
        text-decoration: none;
    }

        .darkblue-chat-bubble a:hover {
            text-decoration: underline!important;
        }

.right-side-chat {
    margin-top: -7px;
    margin-left: 5px;
    opacity: 1 !important;
    float: right;
}

.chat-days-right {
    color: #747a77;
    margin-right: 5px;
    margin-left: 5px;
}

.lightblue-chat-bubble {
    background: #EBF6FF;
    padding: 10px;
    border-radius: 5px 0px 5px 5px;
    color: #2d0707;
    width: fit-content;
    margin-right: 15px;
    float: right;
}

    .lightblue-chat-bubble a {
        color: blue !important;
        text-decoration: none;
    }

        .lightblue-chat-bubble a:hover {
            text-decoration: underline !important;
        }


.marginbottom50 {
    margin-bottom: 50px;
}

.ticket-subject-format {
    width: 60%;
    display: inline-block;
    margin-top: 5px;
    font-size: 13px !important;
    font-weight: 600 !important;
    margin-top: -10px;
}

.reply-button-format {
    float: right;
    color: #F1F4F7 !important;
}

.unread-status {
    height: 5px;
    width: 5px;
    background-color: red;
    border-radius: 50%;
    width: 5px;
}

.read-status {
    height: 5px;
    width: 5px;

    border-radius: 50%;
    width: 5px;
}


/*@media screen and (max-width:1396px) {
.hidden-grid-under-xl {

display:none;
}

}

@media screen and (max-width:1500px) {
.hidden-grid-under-xxl {

display:none;
}

}*/
.checkmark {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100px;
    height: 100px;
    border-radius: 50%;
    /*display: block;*/
    stroke-width: 2;
    stroke: #fff;
    stroke-miterlimit: 10;
    box-shadow: inset 0px 0px 0px #4CAF50;
    animation: fill .4s ease-in-out .4s forwards, scale .3s ease-in-out .9s both;
    margin-bottom: 20px
}

.checkmark__circle {
    stroke-dasharray: 166;
    stroke-dashoffset: 166;
    stroke-width: 50;
    stroke-miterlimit: 10;
    stroke: #4CAF50;
    fill: none;
    animation: stroke .6s cubic-bezier(0.650, 0.000, 0.450, 1.000) forwards;
}

.checkmark__check {
    transform-origin: 50% 50%;
    stroke-dasharray: 48;
    stroke-dashoffset: 48;
    animation: stroke .3s cubic-bezier(0.650, 0.000, 0.450, 1.000) .8s forwards;
}

@keyframes stroke {
    100% {
        stroke-dashoffset: 0;
    }
}

@keyframes scale {
    0%, 100% {
        transform: none;
    }

    50% {
        transform: scale3d(1.1, 1.1, 1);
    }
}

@keyframes fill {
    100% {
        box-shadow: inset 0px 0px 0px 30px #4CAF50;
    }
}


.ticketbackground_hover {
    background-color:white;
}

.ticketbackground_hover:hover {
    background-color: #EEF7FF;
}

.selected-ticket {
    background-color: #efefef;
}

.hover-toggle-common {
    background-color: white!important;
}
    .hover-toggle-common:hover {
        background-color: #EEF7FF!important;
    }

@media (max-width: 767px ) {

    .time-clock-fix {
        max-width: 100px;
    }
}
    .k-grouping-header .k-link, .k-grouping-header .k-link:link {
        color: #fff !important;
}


.k-grouping-header .k-link, .k-grouping-header .k-link:link {
    color: #fff!important;
}



#grid-fullscreen .k-grid-pager {
    display: inline-flex !important;
}
#Grid1 .k-grid-pager {
    display: inline-flex !important;
}

#ClientUsage_fs .k-grid-pager {
    display: inline-flex !important;
}

#client_fs .k-grid-pager {
    display: inline-flex ;
}

#grid_company_class_child_fs .k-grid-pager {
    display: inline-flex;
}

#Grid_Change_Reports_fs .k-grid-pager {
    display: inline-flex ;
}

#grid_company_policy_fs .k-grid-pager {
    display: inline-flex;
}


.k-grid .k-grid-header th {
    direction: rtl;
  }


  .k-grid .k-grid-header th .k-grid-filter {
    display: inline-flex;
    position: relative;
    right: unset;
    bottom: unset;
    float: unset;
  }
  .k-grid .k-grid-header th > .k-link {
    display: inline;
  }
  .k-grid-header th.k-with-icon .k-link {
    margin-right:0px;
  }



/** Client View Title**/

.client-dash-title {
  display: inline-block;
  white-space: nowrap;
  max-width: 200px;
  overflow: hidden;
  text-overflow: ellipsis;
  padding-right: 10px;
}

  /* Small devices (tablets, 768px and up) */
@media (min-width: 768px) {
  .client-dash-title {
    max-width: 300px;
  }
}

/* Medium devices (desktops, 992px and up) */
@media (min-width: 992px) {
  .client-dash-title {
    max-width: 400px;
  }
 }

/* Large devices (large desktops, 1200px and up) */
@media (min-width: 1200px ) {
    .client-dash-title {
        max-width: 500px;
    }
.toggle-full-screen{
    margin-top: 150px !important;
}
/* Small-middle devices (tablets, 768px and up) */
@media (min-width: 550px) {
    .toggle-full-screen {
        margin-top: 100px !important;
    }
}

/* Small devices (tablets, 768px and up) */
@media (min-width: 768px) {
    .toggle-full-screen {
        margin-top: 100px !important;
    }
}

/* Medium devices (desktops, 992px and up) */
@media (min-width: 992px) {
    .toggle-full-screen {
        margin-top: 100px !important;
    }
}

/* Large devices (large desktops, 1200px and up) */
@media (min-width: 1200px ) {
    .toggle-full-screen {
        margin-top: 100px !important;
    }

    .benefit-top {
        margin-top: 150px !important;
    }
}



 /** Margin Full Screen Top**/

.margin-top-fullscreen-portlet {
    margin-top: 60px !important;
}
/* Small-middle devices (tablets, 768px and up) */
/* @media (min-width: 550px) {
  .margin-top-fullscreen-portlet {
     margin-top:100px!important;
  }
 } */

/* Small devices (tablets, 768px and up) */
@media (min-width: 768px) {
    .margin-top-fullscreen-portlet {
        margin-top: 25px !important;
    }
}

/* Medium devices (desktops, 992px and up) */
/* @media (min-width: 992px) {
    .margin-top-fullscreen-portlet {
       margin-top:100px!important;
    }
   } */

/* Large devices (large desktops, 1200px and up) */
/* @media (min-width: 1200px ) {
    .margin-top-fullscreen-portletn {

       margin-top:100px!important;

    }
   } */

.accepted-tooltip {
    width: auto;
    text-align: left !important;
    border-radius: 5px !important;
    font-family: lato;
    padding-top: 1px !important;
    padding-bottom: 1px !important;
}

.inprogress-tooltip {
  width: auto;
text-align: left!important;
border-radius: 5px!important;
font-family: lato;
padding-top: 1px!important;
padding-bottom: 1px!important;
background-color:#7CB7E3 !important;

}

.done-tooltip {
  width: auto;
text-align: left!important;
border-radius: 5px!important;
font-family: lato;
padding-top: 1px!important;
padding-bottom: 1px!important;
background-color:#a5d6a7 !important;

}


.xls-icon, .pdf-icon {
  font-size: 25px;
      padding: 5px;

}

#Grid1 {
  width:100%
}

.mobile-close-fix {
    margin-top: -5px;
}


.checkmark_sp {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 35px;
    height: 35px;
    border-radius: 50%;
    /* display: block; */
    stroke-width: 2;
    stroke: #fff;
    stroke-miterlimit: 10;
    box-shadow: inset 0px 0px 0px #4CAF50;
    animation: fill .4s ease-in-out .4s forwards, scale .3s ease-in-out .9s both;
    margin-bottom: 20px;
}

.ticket-success-sp {
    width: 100%;
    height: 80px;
    background-color: white;
    position: absolute;
    /*border: 1px solid black;*/
    text-align: center;
    float: right;
    margin-left: 40px;
    margin-top: -10px;
    padding-right: 60px;
    z-index: 1;
    display: none;
}

    .ticket-success-sp:hover {
        width: 100%;
        height: 80px;
        background-color: #EEF7FF !important;
        position: absolute;
        /*border: 1px solid black;*/
        text-align: center;
        float: right;
        margin-left: 40px;
        margin-top: -10px;
        padding-right: 60px;
        z-index: 1;
        display: none;
    }
@media only screen and (min-width: 1401px){

    .ticket-subject-format {
        width: 50%;
        display: inline-block;
        margin-top: 5px;
        font-size: 13px !important;
        font-weight: 600 !important;
        margin-top: -10px;
    }
}
@media only screen and (max-width: 1400px) {
  
    .ticket-subject-format {
        width: 40%;
        display: inline-block;
        margin-top: 5px;
        font-size: 13px !important;
        font-weight: 600 !important;
        margin-top: -10px;
    }
}

@media only screen and (max-width: 450px) {
    .ticket-success-sp {
        background-color: #EEF7FF !important;
    }
    .ticket-subject-format {
        width: 40%;
        display: inline-block;
        margin-top: 5px;
        font-size: 13px !important;
        font-weight: 600 !important;
        margin-top: -10px;
    }

    .benefit-top {
        margin-top: 215px !important;
    }
}

.topNavCompanyName {
    display: inline;
    position: relative;
    top: 12px;
    float: left;
    margin-right: 13px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    width: 250px;
    text-align: right;
  }
.Success-status-background {
    background-color: #F1FFF2 !important;
}
.Error-status-background {
    background-color: #FFECED !important;
}

.k-pager-wrap {
    display: inline-flex;
}

.k-pager-numbers {
    list-style: none;
}

.k-pager-numbers-wrap .k-dropdown
{
    display:none!important;
}

.flex-container {
    display: flex;
    align-items:center;
}

.flex-container > div {
    margin:0 10px 0 0;
}
#UserManager .k-grid-content table tbody tr.k-master-row:last-child td .dropdown ul {
    top: -130px !important;
}
#UserManager .k-grid-content table tbody tr.k-detail-row .k-master-row {
    height: 115px;
}
#UserManager .k-grid-content table tbody tr.k-detail-row .k-master-row:last-child td .dropdown ul {
    top:30px!important;
}
    /*.k-pager-input, .k-pager-numbers li {
    float: left;
    list-style: none;
}*/
    /*Spinner Loader style fot clients tile*/
#cover-spin-Status {
    position: relative;
    width: 100%;
    left: 0;
    right: 0;
    top: 155px;
    bottom: 0;
    background-color: rgba(255,255,255,0.7);
    z-index: 9999;
    display: none;
}

@-webkit-keyframes spin {
    from {
        -webkit-transform: rotate(0deg);
    }

    to {
        -webkit-transform: rotate(360deg);
    }
}

@keyframes spin {
    from {
        transform: rotate(0deg);
    }

    to {
        transform: rotate(360deg);
    }
}

#cover-spin-Status::after {
    content: '';
    display: block;
    position: absolute;
    left: 48%;
    top: 40%;
    width: 40px;
    height: 40px;
    border-style: solid;
    border-color: #3598dc;
    border-top-color: transparent;
    border-width: 4px;
    border-radius: 50%;
    -webkit-animation: spin .8s linear infinite;
    animation: spin .8s linear infinite;
}


/*Style for T4 command RL1 Status*/
.duedate-badge {
    width: 33%;
    float: right;
    border-radius: 5px;
    text-align: center;
    margin-bottom: 10px;
    display: none;
}

.telegram_color {
    color: #F5B700;
}

.bold-number {
    font-weight: bolder;
    font-size: 40px;
}

.navlinks a:hover {
    cursor: pointer;
}

.border {
    /* border-radius: 10px 10px 10px 10px;
            background-color: #fff;
            color: white;*/
}

.dropdown_links {
    /*border:1px solid #000;
             border-radius: 2px 2px 2px 2px;
            background-color: red;
            color: white;*/
}

    .dropdown_links:hover {
        /* border: 1px solid #000;
            border-radius: 2px 2px 2px 2px;
            background-color: red;
            color: white;*/
    }

.active_created {
    border: 0px;
    border-bottom: 3px solid #0B2463;
    background-color: #2285d0;
    color: #fff;
}

.active_cra_m {
    border: 0px;
    /*border-bottom: 3px solid #0B2463;*/
    /*background-color: #4CAF50;
            color: #fff;*/
}

.active_ready {
    border: 0px;
    border-bottom: 3px solid #0B2463;
    background-color: #0b2463;
    color: #fff;
}

.linknew {
    position: absolute;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    min-width: 200px;
    /* bottom: 5%;*/
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    z-index: 2;
    opacity: .8;
    /*        background-color:red;
    */ padding-top: 10px;
}

    .linknew span {
        margin: 0 3px
    }

    .linknew:nth-child(1) {
        /*border: 1px solid #4CAF50;*/
        margin-right: 10px;
        /* border-radius: 8px 8px 8px 8px;*/
        color: #4CAF50;
        /*transform: translateY(100%);*/
    }

    .linknew:nth-child(2) {
        transform: translateX(100%);
        border: 1px solid #0b2463;
        border-radius: 8px 8px 8px 8px;
        margin-left: 10px;
        margin-right: 10px;
        color: #0b2463;
        /*transform: translateY(100%);*/
    }

    .linknew:nth-child(3) {
        transform: translateX(200%);
        border: 1px solid #2285D0;
        border-radius: 8px 8px 8px 8px;
        color: #2285D0;
        margin-left: 20px;
        /*transform: translateY(100%);*/
    }

.m_tocra {
    color: #4CAF50;
}

.manually_cra {
    /*color: #4CAF50;*/
    color: #2285D0;
}

.publish {
    color: #0b2463;
    /* background-color:red;*/
}

.color_white {
    color: #fff;
}

.color_grey {
    color: grey;
}

.parent {
    position: relative;
}

.right_total {
    position: absolute;
    right: 8px;
    margin-top: -50px;
    color: grey;
}

.icon_display {
    position: absolute;
    left: 10px;
    top: 10px;
}

#T4RlGridnew {
    padding-bottom: 20px;
    /*min-height:500px !important;*/
}

.companyrow {
    /* background-color: orange;*/
    display: none !important;
    height: 0px !important;
}

#T4RlGridnew .k-alt {
    /* background-color: green;*/
    display: none;
}

.k-pager-wrap {
    display: block;
}


@media screen and (max-width: 1137px) {

    /*#client_kendo .k-grid-header {
        display: none;
    }*/
    #deadline-Date {
        display: none;
    }

    #T4RlGridnew .k-grid-header {
        /*display: none;*/
    }

    #nav_linksnew {
        display: none;
    }

    #T4RlGridnew {
        padding-bottom: 55px;
        margin-bottom: -30px;
    }

    #tFour-tile-gridnew .k-pager-wrap {
        display: block;
    }
}

.k-chart {
    height: 150px;
    width: 150px;
    /*        background-color: yellow;
    */ /*margin-top:-40px;*/
}

#example1aa {
    top: 95px;
    right: 45px;
    position: absolute;
}
/*#example1aa svg g path:first-child {

                fill: black;
            }*/

.forTooltips {
    width: 100%;
    height: 100%;
    padding: .929em 1.286em;
}

.T4StausTooltip {
    font-size: 1.2em;
    color: yellow;
    background: blue;
}


    .T4StausTooltip .k-callout {
        background-color: transparent;
        color: blue;
    }

#T4StausTooltip .k-tooltip-content {
    text-align: left;
}

td.overridePadding {
    /*padding: 0;*/
}

.k-loading-image {
    display: block;
    z-index: 3; /* must be larger than the z-index:2 of #container */
    background-image: url('http://i.forbesimg.com/assets/img/loading_spinners/43px_on_transparent.gif');
}

#myProgress {
    width: 100%;
    height: 30px;
    background-color: #F2F2F2;
    z-index: 0;
    border-radius: 5px;
}

#autoSubmission {
    /*width: 5%;*/
    height: 30px;
    /*background-color: #67AC5B;*/
    background-color: #4CAF50;
    /*position: absolute;*/
    z-index: 3;
    border-radius: 5px;
    position: relative;
    /*border-top-right-radius: 5px;
            border-bottom-right-radius: 5px;*/
}

#onlineSubmission {
    /*width: 20%;*/
    height: 30px;
    /*background-color: #C3E4BE;*/
    background-color: #DBEFDC;
    /*position: absolute;*/
    position: relative;
    margin-top: -30px;
    z-index: 2;
    border-top-right-radius: 5px;
    border-bottom-right-radius: 5px;
}

#manualSubmission {
    /*width: 20%;*/
    height: 30px;
    margin-top: -30px;
    /*background-color: #D7E4D5;*/
    background-color: #D4D4D4;
    /*background-color: red;*/
    /*position: absolute;*/
    z-index: 1;
    border-top-right-radius: 5px;
    border-bottom-right-radius: 5px;
}


/* T4 Tile Styles */

#T4RlGridnew .k-filter-row th, #T4RlGridnew .k-grid-header th.k-header {
    direction: ltr;
    text-align: left;
}

#T4RlGridnew .k-grid-header table thead th:nth-child(1) {
    width: 280px !important;
    display: table-cell;
}

#T4RlGridnew .k-grid-header table thead th:nth-child(2) {
    /*width: 100px !important;*/
    display: table-cell;
}

#T4RlGridnew .k-grid-header table thead th:nth-child(3) {
    /*width: 100px !important;*/
    display: table-cell
}

#T4RlGridnew .k-grid-header table thead th:nth-child(4) {
    /*width: 100px !important;*/
    display: table-cell
}

#T4RlGridnew .k-grid-header table thead th:nth-child(5) {
    /*width: auto !important;*/
    display: table-cell
}

#T4RlGridnew table tbody tr td:nth-child(1) {
    width: 280px !important;
    display: table-cell;
}

#T4RlGridnew .k-grid-content table tbody tr:last-child td:last-child > div ul.menu-item {
    position: absolute;
    top: 88px !important;
}

#T4RlGridnew .k-grid-content table tbody tr:last-child td:last-child > div ul.menu-item3 {
    position: absolute;
    top: 410px !important;
}

#T4RlGridnew .k-grid-content table tbody tr:last-child td:last-child > div ul.menu-item4 {
    position: absolute;
    top: 550px !important;
}

#T4RlGridnew .k-grid-content table tbody tr:last-child td:last-child > div ul {
    position: absolute;
    top: 230px !important;
}

    #T4RlGridnew .k-grid-content table tbody tr:last-child td:last-child > div ul.no-top {
        position: absolute !important;
        top: inherit !important;
    }

#T4RlGridnew .k-grid-content table tbody tr:only-child td:last-child > div ul {
    top: 35px !important;
}

#T4RlGridnew .k-grid-content table tbody tr:nth-last-child(2) td:last-child > div ul.menu-item2 {
    position: absolute;
    top: 0px !important;
}
/*#T4RlGridnew table tbody tr td:nth-child(2) {
    width: 100px !important;
    display: table-cell;
}
#T4RlGridnew table tbody tr td:nth-child(3) {
    width: 100px !important;
    display: table-cell;
}
#T4RlGridnew table tbody tr td:nth-child(4) {
    width: 100px !important;
    display: table-cell;
}*/

/* end of T4 Tile Styles */

.companyName_Client {
    width: 280px;
    /*background-color:orange;*/
}

.companyAddress_Client {
    width: 270px;
}

.autosubmission-check-icon {
    top: -17px;
    position: relative;
    left: 1px;
}

.autosubmission-bolt-icon {
    left: 13px;
    position: relative;
}

.Number_of-submission {
    width: 33.33%;
    float: left;
    margin-bottom: 10px;
}


@media screen and (max-width: 1920px) and (min-width: 1520px) {
}

@media screen and (min-width: 1720px) {
    .duedate-badge {
        width: 35%;
    }
}

@media screen and (max-width: 1719px) and (min-width: 1520px) {
    .duedate-badge {
        width: 44%;
    }
}

@media screen and (max-width: 1519px) and (min-width: 1220px) {
    .duedate-badge {
        width: 55%;
    }

    #deadline-Date {
        display: block;
    }

    #T4RlGridnew .k-grid-header table thead th:nth-child(1) {
        width: 230px !important;
        display: table-cell;
    }

    #T4RlGridnew table tbody tr td:nth-child(1) {
        width: 230px !important;
        display: table-cell;
    }


    .companyName_Client {
        width: 230px;
        /* background-color: yellow;*/
    }

    .companyAddress_Client {
        width: 220px;
    }

    .Number_of-submission {
        width: 50%;
        float: left;
        margin-bottom: 10px;
    }
}

@media screen and (max-width: 1219px) and (min-width: 1160px) {
    .duedate-badge {
        width: 65%;
    }

    #deadline-Date {
        display: block;
    }

    #T4RlGridnew .k-grid-header table thead th:nth-child(1) {
        width: 200px !important;
        display: table-cell;
    }

    #T4RlGridnew table tbody tr td:nth-child(1) {
        width: 200px !important;
        display: table-cell;
    }


    .companyName_Client {
        width: 200px;
        /* background-color: lightblue;*/
    }

    .companyAddress_Client {
        width: 190px;
    }

    .autosubmission-check-icon {
        top: -17px;
        position: relative;
        left: 0px;
    }

    .autosubmission-bolt-icon {
        left: 11px;
        position: relative;
    }

    .Number_of-submission {
        width: 50%;
        float: left;
        margin-bottom: 10px;
    }
}

@media screen and (max-width: 1159px) and (min-width: 1137px) {
    .duedate-badge {
        width: 70%;
    }

    #deadline-Date {
        display: block;
    }

    #T4RlGridnew .k-grid-header table thead th:nth-child(1) {
        width: 190px !important;
        display: table-cell;
    }

    #T4RlGridnew table tbody tr td:nth-child(1) {
        width: 190px !important;
        display: table-cell;
    }


    .companyName_Client {
        width: 190px;
        /*   background-color: lightgreen;*/
    }

    .companyAddress_Client {
        width: 180px;
    }

    .autosubmission-check-icon {
        top: -17px;
        position: relative;
        left: 0px;
    }

    .autosubmission-bolt-icon {
        left: 11px;
        position: relative;
    }

    .Number_of-submission {
        width: 50%;
        float: left;
        margin-bottom: 10px;
    }
}

.fa-secondary_clock {
    opacity: .4
}

.fa-secondary_bolt {
    opacity: .4
}



/*Style form refresh loading spinner*/
.grid_refresh_spinner {
    z-index: 9999;
    display: none;
}


    .grid_refresh_spinner::after {
        content: '';
        /* display: block;*/
        position: absolute;
        /*left: 48%;
            top: 40%;*/
        width: 14px;
        height: 14px;
        margin-top: 6px;
        border-style: solid;
        border-color: #3598dc;
        border-top-color: transparent;
        border-width: 2px;
        border-radius: 50%;
        -webkit-animation: spin .8s linear infinite;
        animation: spin .8s linear infinite;
    }


/*STYLE for loading spinner*/

.hide_Column {
    display: none !important;
}

#cover-spin {
    position: fixed;
    width: 100%;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    background-color: rgba(255,255,255,0.7);
    z-index: 9999;
    display: none;
}

@-webkit-keyframes spin {
    from {
        -webkit-transform: rotate(0deg);
    }

    to {
        -webkit-transform: rotate(360deg);
    }
}

@keyframes spin {
    from {
        transform: rotate(0deg);
    }

    to {
        transform: rotate(360deg);
    }
}

#cover-spin::after {
    content: '';
    display: block;
    position: absolute;
    left: 48%;
    top: 40%;
    width: 40px;
    height: 40px;
    border-style: solid;
    border-color: #3598dc;
    border-top-color: transparent;
    border-width: 4px;
    border-radius: 50%;
    -webkit-animation: spin .8s linear infinite;
    animation: spin .8s linear infinite;
}


/*Style For Filter Badges*/
@media screen and (max-width: 550px) {
    .filter_badge {
        display: none !important;
        float: left;
    }
}

@media screen and (min-width: 551px) {

    .filter_badge {
        display: block !important;
        float: left;
    }
}

@media screen and (max-width: 1137px) {
    .filter_badge_jira {
        display: none !important;
        float: left;
    }
}

@media screen and (min-width: 1138px) {

    .filter_badge_jira {
        display: block !important;
        float: left;
    }
}

.um-menu {
    position: absolute;
    top: inherit;
}

#RelationshipGrid .k-grid-content table tbody tr:last-child td:last-child > div ul.um-menu {
    top: -100px;
}

#RelationshipGrid .k-pager-wrap {
        display: flex;
    }

        #RelationshipGrid .k-pager-wrap .k-pager-first {
            order: 1;
        }

            #RelationshipGrid .k-pager-wrap .k-pager-first + .k-link.k-pager-nav {
                order: 2;
            }

        #RelationshipGrid .k-pager-wrap .k-pager-numbers.k-reset {
            display: none !important;
            order: 3;
        }

        #RelationshipGrid .k-pager-wrap .k-pager-numbers-wrap {
            order: 4;
        }

    #RelationshipGrid .k-pager-numbers.k-reset + .k-link.k-pager-nav {
        order: 5;
    }

    #RelationshipGrid .k-pager-wrap .k-pager-last {
        order: 6;
    }

    #RelationshipGrid .k-pager-wrap .k-pager-sizes {
        order: 7;
    }

    #RelationshipGrid .k-pager-wrap .k-pager-info {
        order: 8;
    }

/*EpayBilling tile style for grid header*/
@media screen and (max-width: 799px) {
    #Grid3 .k-grid-header {
        display: none;
    }
}

@media screen and (min-width: 800px) {
    #Grid3 .k-grid-header {
        display: block;
    }
}

@media screen and (max-width: 1137px) {
    #billing-grid-gradient_m {
        display: block;
    }

    #billing-grid-gradient {
        display: none;
    }
}

@media screen and (min-width: 1138px) {
    #billing-grid-gradient_m {
        display: none;
    }

    #billing-grid-gradient {
        display: block;
    }
}

.k-loading-mask .k-loading-image {
    z-index: 3;
    background-image: none;
}

.k-loading-mask {
    display: none;
}

#billing-tile > .k-grid .k-header {
    display: none;
}





/*epaybilling fullscreen grid custom style*/
@media screen and (max-width: 599px) {
    #Grid1 .k-grid-header {
        /* display: none !important;*/
    }
        /* #Grid1 .k-grid-header table thead tr th:nth-child(1) {

            display: none !important;
        }*/
        #Grid1 .k-grid-header table thead tr th:nth-last-child(n+2) {
            display: none !important;
        }
}

@media screen and (min-width: 600px) {
    #Grid1 .k-grid-header {
        /* display: block;*/
    }

        #Grid1 .k-grid-header table thead tr th:nth-last-child(n+1) {
            display: none !important;
        }

        #Grid1 .k-grid-header table thead tr th:nth-child(1) {
            display: table-cell !important;
        }

        #Grid1 .k-grid-header table thead tr th:nth-child(2) {
            display: table-cell !important;
        }

        #Grid1 .k-grid-header table thead tr th:nth-child(3) {
            display: table-cell !important;
        }

        #Grid1 .k-grid-header table thead tr th:nth-child(7) {
            display: table-cell !important;
        }
        /*#Grid1 .k-grid-header table thead tr th:nth-last-child(n+2) {
                display: none !important;
            }*/
        #Grid1 .k-grid-header table thead tr th:last-child {
            display: none !important;
        }
}


.search-container {
    margin-right: 10px;
    width: auto;
    max-width: 600px;
    display: flex;
    justify-content: flex-end;
    padding-left: 15px;
}

.btn-container {
    width: auto;
    max-width: 250px;
    min-width: 150px;
}

.ml-10 {
    margin-left: 10px;
}

.complete {
    background-color: #4CAF50;
}

.mr-10 {
    margin-left: 10px;
}

@media screen and (max-width:700px) {
    /*.epay-status {
            margin-top: 10px !important;
        }*/
    #Grid1 .k-grid-toolbar {
        display: none !important;
    }


    .search-container {
        margin-right: 10px;
        width: auto;
        max-width: 600px;
        display: flex;
        flex-wrap: wrap;
        justify-content: flex-end;
    }
}

@media screen and (min-width:991px) {
    /*#Grid1 .k-grid-header {
             display: block;
        }*/
    #Grid1 .k-grid-header table thead tr th:nth-child(1) {
        display: table-cell !important;
    }

    #Grid1 .k-grid-header table thead tr th:nth-child(2) {
        display: table-cell !important;
    }

    #Grid1 .k-grid-header table thead tr th:nth-child(3) {
        display: table-cell !important;
    }

    #Grid1 .k-grid-header table thead tr th:nth-child(4) {
        display: table-cell !important;
    }

    #Grid1 .k-grid-header table thead tr th:nth-child(5) {
        display: table-cell !important;
    }

    #Grid1 .k-grid-header table thead tr th:nth-child(6) {
        display: table-cell !important;
    }

    #Grid1 .k-grid-header table thead tr th:nth-child(7) {
        display: table-cell !important;
    }

    #Grid1 .k-grid-header table thead tr th:last-child {
        display: none !important;
    }
}

/*CSS changes form InviteUser*/
.clientNames {
    white-space: nowrap;
    /*        width: 150px;
*/ overflow: hidden;
    direction: initial;
    text-overflow: ellipsis;
}

#permissionsGrid table tr td {
    background-color: #f9fcfe;
    border-top: 1px solid #EEF2F5 !important;
}

#permissionsGrid table tbody tr:last-child td {
    border-bottom: 1px solid #EEF2F5 !important;
}

#permissionsGrid table tbody tr:hover td {
    background-color: #f7f7f7 !important;
}

#permissionsGrid table tr td:first-child {
    font-weight: bold;
    border-right: solid 1px #eaeaea !important;
    background-color: #f9fcfe;
}

#permissionsGrid table tr th:first-child {
    border-right: solid 1px #eaeaea !important;
}

#permissionsGrid .k-pager-wrap.k-grid-pager.k-widget.k-floatwrap {
    /*display: block !important;*/
}

#permissionsGrid .k-grid-header-wrap table thead tr th {
    direction: ltr;
}

#permissionsGrid_tt_active, #ManagerHelp_tt_active, #MasterHelp_tt_active {
    border-radius: 10px;
}

#permissionsGrid_tt_active .k-tooltip-button, #ManagerHelp_tt_active .k-tooltip-button, #MasterHelp_tt_active .k-tooltip-button {
    position: absolute !important;
    top: 2px !important;
    right: 4px !important;
}


/*EditUserProfile Permission grid styles*/

#Grid11 {
    z-index: 3;
    position: inherit;
    display: contents;
    background-color:transparent !important;
}

#Grid11 .k-alt
{
    background-color:transparent !important;
}
#Grid11 .k-header {
    background-color: #fff !important;
}

#Grid11 tfoot {
    display: none;
}

#Grid11 .k-pager-wrap {
    display: block !important;
    margin-top: -7px;
    background-color:transparent !important;
}

#Companies_9 {
    z-index: 3;
    position: absolute;
    display: contents;
}

#Companies_10 {
    z-index: 3;
    position: absolute;
    display: contents;
}

#Companies_5 {
    z-index: 3;
    position: absolute;
    display: contents;
}

#Companies_7 {
    z-index: 3;
    position: absolute;
    display: contents;
}

#Companies_5 .k-grid-footer {
    display: none;
}

#Companies_7 .k-grid-footer {
    display: none;
}

#Companies_9 .k-grid-footer {
    display: none;
}

#Companies_10 .k-grid-footer {
    display: none;
}

.val-error-box {
    margin-top: -2rem;
    margin-bottom: 1.2rem;
    padding: 1px;
    border-radius: 5px;
    background-color: #FFECED;
    border: 1px #F8333C solid;
    color: #F8333C;
}


/*to show scroller in Firefox, overflow can't be hidden*/
.tile-scroller {
    padding: 0px;
    margin: 0px;
    padding-right: 12px;
    overflow-x: hidden;
    overflow-y: auto;
}

.btn-mw150 {
    min-width: 150px;
}

/*Audit Tile styles*/
@media (max-width: 768px) {
    .float-right-xs {
        float: none;
        padding-left: 15px !important;
    }

    .ipblock {
        float: right;
        display: block !important;
        padding-left: 15px;
    }

    .userblock {
        padding-left: 20px !important;
        margin-left: 27px !important;
    }

    .descblock {
        padding-left: 32px !important;
    }

    .filter-text-right{
        right:80px !important;
    }
}

@media (min-width: 768px) {
    .float-right-lg {
        float: right;
    }
    .filter-text-right {
        right: 130px !important;
    }
}

@media (max-width: 1550px) and (min-width: 992px) {
    .dateblock {
        display: block !important;
    }

    .ipblock {
        float: right;
    }
}


/*User Managent styles*/
@media screen and (max-width:767px) {
    .close-xs {
        padding-right: 0px !important;
        padding-left: 0px !important;
        margin-left: 0px !important;
    }
    .username-xs {
        padding-top: 45px;
    }
    #changeRoleConfirm {
        margin-left: 0px !important;
    }
}

/*PE Admin styles added*/
.icon-title {
    color: #2285D0;
    text-align: center;
    padding: 0 0 20px 0;
    font: 1.8rem/1.25 Lato, sans-serif;
}

.sub-heading {
    font-size: 18px;
    font-weight: 600;
}

.admin-img {
    padding: 10px;
}

.icon-title-disable {
    pointer-events: none;
    /* color: #E4E4E4;*/
    color: #D2D2D2;
    text-align: center;
    padding: 0 0 20px 0;
    font: 1.8rem/1.25 Lato, sans-serif;
}

.icon-text {
    padding: 0.5rem;
    line-height: 1.25;
}

.width100 {
    width:100%;
}

.mt-10 {
    margin-top:10px;

}

.margintop20 {
    margin-top:20px;
}

.plr-15 {
    padding:0 15px;
}
/*end PE Admin Styles*/
/*User invite permission grid styles for green color(EV-1255)*/
#permissionsGrid table tr td .k-checkbox:checked + .k-checkbox-label:before {
    background-color: #4caf50;
}

#permissionsGrid table tr th .k-checkbox:checked + .k-checkbox-label:before {
    background-color: #4caf50;
}

#permissionsGrid table tr td .k-checkbox:checked + .k-checkbox-label:active:after,
#permissionsGrid table tr td .k-checkbox:checked + .k-checkbox-label:focus:after,
#permissionsGrid table tr td .k-checkbox:checked:active + .k-checkbox-label:after,
#permissionsGrid table tr td .k-checkbox:checked:focus + .k-checkbox-label:after,
#permissionsGrid table tr td .k-checkbox + .k-checkbox-label:active:after,
#permissionsGrid table tr td .k-checkbox:active + .k-checkbox-label:after {
    -webkit-box-shadow: none !important;
    box-shadow: none !important;
    background: none !important;
}

#permissionsGrid table tr th .k-checkbox:checked + .k-checkbox-label:active:after,
#permissionsGrid table tr th .k-checkbox:checked + .k-checkbox-label:focus:after,
#permissionsGrid table tr th .k-checkbox:checked:active + .k-checkbox-label:after,
#permissionsGrid table tr th .k-checkbox:checked:focus + .k-checkbox-label:after,
#permissionsGrid table tr th .k-checkbox + .k-checkbox-label:active:after,
#permissionsGrid table tr th .k-checkbox:active + .k-checkbox-label:after {
    -webkit-box-shadow: none !important;
    box-shadow: none !important;
    background: none !important;
}
/*end User invite permission grid styles for green color*/
.overlay {
    position: absolute;
    z-index: 12;
}
/*User invite permission grid - No Access column - styles for red color (EV-1336)*/
#permissionsGrid table tr td .k-checkbox:checked + .no-access.k-checkbox-label:before {
    background-color: red;
    opacity: 0.75;
}

#permissionsGrid table tr th .k-checkbox:checked + .no-access.k-checkbox-label:before {
    background-color: red;
    opacity: 0.75;
}

#permissionsGrid table tr td .k-checkbox:checked + .no-access.k-checkbox-label:active:after,
#permissionsGrid table tr td .k-checkbox:checked + .no-access.k-checkbox-label:focus:after,
#permissionsGrid table tr td .k-checkbox:checked:active + .no-access.k-checkbox-label:after,
#permissionsGrid table tr td .k-checkbox:checked:focus + .no-access.k-checkbox-label:after,
#permissionsGrid table tr td .k-checkbox + .no-access.k-checkbox-label:active:after,
#permissionsGrid table tr td .k-checkbox:active + .no-access.k-checkbox-label:after {
    -webkit-box-shadow: none !important;
    box-shadow: none !important;
    background: none !important;
}

#permissionsGrid table tr th .k-checkbox:checked + .no-access.k-checkbox-label:active:after,
#permissionsGrid table tr th .k-checkbox:checked + .no-access.k-checkbox-label:focus:after,
#permissionsGrid table tr th .k-checkbox:checked:active + .no-access.k-checkbox-label:after,
#permissionsGrid table tr th .k-checkbox:checked:focus + .no-access.k-checkbox-label:after,
#permissionsGrid table tr th .k-checkbox + .no-access.k-checkbox-label:active:after,
#permissionsGrid table tr th .k-checkbox:active + .no-access.k-checkbox-label:after {
    -webkit-box-shadow: none !important;
    box-shadow: none !important;
    background: none !important;
}
/*end User invite permission grid - No Access column - styles for red color*/

/*User invite permission grid - styles for red 'x' mark (EV-1336)*/
#permissionsGrid table tr td .k-checkbox:checked + .no-status.k-checkbox-label:before {
    display: inline-block;
    width: 15px;
    height: 15px;
    cursor: pointer;
    background: url('../img/times.svg') no-repeat;
    background-color: red;
    opacity: 0.75;
}
/* end User invite permission grid - styles for red 'x' mark (EV-1336)*/

/*Styles for disable remaining checkboxes based on role for PRO3 Plan(EV-1275)*/
.isEditable {
    pointer-events: none;
    opacity: 0.4;
}
/*end Styles for disable remaining checkboxes based on role for PRO3 Plan*/

/*Style to place pagination inline*/
.k-pager-wrap {
    display: inline-flex;
}
/*end Style to place pagination inline */

/*Style for display complete name when is hover*/
.pe-ellipsis {
    font-size: 16px;
    overflow: hidden;
    height: 30px !important;
    text-overflow: ellipsis;
    white-space: nowrap;
    max-width: 280px;
}

    .pe-ellipsis:focus, .pe-ellipsis:hover {
        overflow: visible;
        text-overflow: initial;
        text-align: right;
        font-size: 16px;
        width: auto;
        height: 30px;
        white-space: nowrap;
        z-index: 11111;
        max-width: none;
    }

.pe-ellipsis-Mobile {
    text-overflow: ellipsis;
    white-space: nowrap;
    max-width: 280px;
    overflow: hidden;
}

    .pe-ellipsis-Mobile:focus, .pe-ellipsis-Mobile:hover {
        overflow: visible;
        text-overflow: initial;
        text-align: right;
        width: auto;
        white-space: nowrap;
        z-index: 11111;
        max-width: none;
    }

.pe-ellipsis-fs {
    text-overflow: ellipsis;
    white-space: nowrap;
    max-width: 200px;
    overflow: hidden;
}


    .pe-ellipsis-fs:focus, .pe-ellipsis-fs:hover {
        overflow: visible;
        text-overflow: initial;
        overflow-wrap: break-word;
        width: auto;
        white-space: normal;
        z-index: 11111;
        max-width: none;
    }

        .pe-ellipsis-fs:hover + p {
            visibility: hidden;
        }
/*T4 tile styles*/
@media screen and (max-width: 1137px) {
    #T4RlGridnew .k-grid-header {
        display: none;
    }

    #tFour-tile-gridnew {
        min-height: 510px;
    }
}

@media screen and (min-width: 1138px) {
    #tFour-tile-gridnew {
        min-height: 300px;
    }
}
/*end of T4 tile styles*/

/*User Management Styles*/
.user-status {
    display: inline-block;
    margin: 0px
}

#RelationshipGrid .k-grid-pager {
    display: inline-flex;
}

#RelationshipGrid > table > tbody > tr td {
    border-bottom: 1px solid #F0F3F7 !important;
}

#RelationshipGrid > table > tbody .k-detail-row .k-detail-cell > .k-grid > table > tbody > tr:last-child td {
    border: none !important;
}

#RelationshipGrid > table > tbody .k-detail-row .k-detail-cell > .k-grid > table > thead {
    display: none;
}

#RelationshipGrid > table > tbody .k-detail-row .k-detail-cell > .k-grid > table > tbody > tr td {
    padding: 12px !important;
}

#userdata_grid, #invite_profile {
    box-shadow: 8px 14px 38px rgba(39, 44, 49, .2), 1px 3px 8px rgba(39, 44, 49, .2) !important;
    transition: box-shadow .3s ease-in-out;
}

#RelationshipGrid .k-grid-content table tbody tr:last-child td:last-child > div ul {
    position: absolute;
    top: 200px !important;
}

#RelationshipGrid .k-grid-content table tbody tr:only-child td:last-child > div ul {
    position: absolute;
    top: -35px !important;
}

/*#RelationshipGrid .k-grid-pager {
    display: inline-block !important;
}*/

#invite_profile, #userdata_grid {
    box-shadow: 8px 14px 38px rgba(39, 44, 49, .2), 1px 3px 8px rgba(39, 44, 49, .2) !important;
    transition: box-shadow .3s ease-in-out;
}

#Permission-error {
    margin-top: 10px;
}

#Role-error {
    margin-top: 10px;
}

#CompanyId-error {
    margin-top: 6px;
}

.success-state {
    border-bottom: 1px solid #4CAF50 !important;
}
/*end of User Management Styles*/

/*Billing Styles*/
#billing_grid {
    box-shadow: 8px 14px 38px rgba(39, 44, 49, .2), 1px 3px 8px rgba(39, 44, 49, .2) !important;
    transition: box-shadow .3s ease-in-out;
}

.bill-tile {
    width: 100%;
    font-size: 24px !important;
    border-bottom: 1px solid #eef1f5;
    font-weight: 300;
    padding-left: 5px;
    margin-left: 10px;
}
/* end of Billing Styles*/



/******PEAdmin - Billing module *******/


/****PEAdmin: SearchInvoicegrid for Billing Module****/

#Search_adminInvoice .row {
    display: flex;
    flex-wrap: wrap;
    margin-right: 0px;
    margin-left: 0px;
}

#Search_AdminInvoiceContainer {
    flex: 0 0 auto;
    width: 50%;   
}
    #Search_AdminInvoiceContainer.tile-scroller {
        padding:10px;
    }
.tile-scroller .row {
    display: flex;
    justify-content: start;
    align-items: center;
    margin-left: 0px;
    flex-wrap: wrap;
}
/*    .tile-scroller.row.submit_btnContainer {
        justify-content: end;
    }*/
    #Search_adminInvoice .row .col-6 #SearchContainer {
        max-width: 600px;
        margin-left: 20px;
        border: 1px solid #ddd;
        border-radius: 5px
    }
    span.k-widget.k-combobox.k-input.amounttool.temporary-hidden.bottomBorderCombo {
        border-bottom: 1px solid rgba(0,0,0,.42) !important;
    }
    #Search_adminInvoice row .maxlabel {
        font-size: 20px;
    }

.search-container .control-input {
    border-style: solid;
    outline: 0;
    font: inherit;
    display: -ms-inline-flexbox;
    display: inline-flex;
    vertical-align: middle;
    position: relative;
    background-color: transparent;
    border-width: 0 0 1px;
    border-color: rgba(0,0,0,.42);
    background: var(--color-white) no-repeat;
    /*border-bottom: 1px solid var(--color-dropdown-wrap); */
    background-size: 100% 1px, 100% 1px !important;
    background-size: 0 2px, 100% 1px;
    background-position: 50% 100%, 50% 100%;
    transition: all 0.3s cubic-bezier(0.64, 0.09, 0.08, 1);
    width: 200px;
}

    .search-container .control-input :focus {
        border-bottom-color: #2196f3;
        box-shadow: 0 -1px 0 0px #2196f3 inset;
    }

#Search_adminInvoice control-input:hover {
    border-bottom-color: #2196f3;
    box-shadow: 0 -1px 0 0px #2196f3 inset;
}

#Search_adminInvoice .row span.k-picker-wrap.k-state-default {
    width: 100%;
    border: 1px solid red;
}

/***PEAdmin: Invoice grid in _BillingGrid Billing Module ****/

#InvoiceitemGrid .k-pager-wrap {
    display: flex !important;
}

#InvoiceitemGrid .k-pager-wrap .k-pager-first {
    order: 1;
}

    #InvoiceitemGrid .k-pager-wrap .k-pager-first + .k-link.k-pager-nav {
        order: 2;
    }

#InvoiceitemGrid .k-pager-wrap .k-pager-numbers.k-reset {
    display: none !important;
    order: 3;
}

#InvoiceitemGrid .k-pager-wrap .k-pager-numbers-wrap {
    order: 4;
}

#InvoiceitemGrid .k-pager-numbers.k-reset + .k-link.k-pager-nav {
    order: 5;
}

#InvoiceitemGrid .k-pager-wrap .k-pager-last {
    order: 6;
}

#InvoiceitemGrid .k-pager-wrap .k-pager-sizes {
    order: 7;
}

#InvoiceitemGrid .k-pager-wrap .k-pager-info {
    order: 8;
}
#InvoiceitemGrid .field-validation-error {
    color: red;
    font-size: smaller;
}
#InvoiceitemGrid .k-grid-edit-row {
    margin-bottom: 20px;
    height: 120px;
    border: 4px solid red;
}

/*SearchInvoice Grid*/

.search-container #status-invoices {
    width: 100%;
}
#SearchContainer #submitSearch {
    min-width: 120px;
    font-size: medium;
}
#SearchContainer #resetSearch {
    min-width: 120px;
    font-size: medium;
    border-color: #337ab7;
}
/*#InvoiceitemGrid .checkbox-align
{
    text-align: center;
    vertical-align: middle;
}*/



/*@media screen and (max-width: 912) {
    #Search_UserMgr .portlet-body .tile-scroller div a#Invoices {
        margin-top: 15px;
        margin-left: -10px;
    }
}*/
/*/****PEAdmin- CreateBilling Records*/
.billingCreateContainer {
   
    max-width: 510px;
   
    border: 1px solid #ddd;
    border-radius: 5px;
}
.billingCreateContainer div input#txtMonth {
    border-style: solid;
    width: 100%;
    outline: 0;
    font: inherit;
    display: -ms-inline-flexbox;
    display: inline-flex;
    vertical-align: middle;
    position: relative;
    background-color: transparent;
    border-width: 0 0 1px;
    border-color: rgba(0,0,0,.42);
    background: var(--color-white) no-repeat;
    background-size: 100% 1px,100% 1px !important;
    background-size: 0 2px,100% 1px;
    background-position: 50% 100%,50% 100%;
    transition: all .3s cubic-bezier(.64,.09,.08,1);
}
.billingCreateContainer div input#txtDBID {
    border-style: solid;
    width: 100%;
    outline: 0;
    font: inherit;
    display: -ms-inline-flexbox;
    display: inline-flex;
    vertical-align: middle;
    position: relative;
    background-color: transparent;
    border-width: 0 0 1px;
    border-color: rgba(0,0,0,.42);
    background: var(--color-white) no-repeat;
    background-size: 100% 1px,100% 1px !important;
    background-size: 0 2px,100% 1px;
    background-position: 50% 100%,50% 100%;
    transition: all .3s cubic-bezier(.64,.09,.08,1);
}

.billingCreateContainer .bllingMessage span#billingStatus {
    margin: 23px;
    font-weight: 800;
}
/**CreateUser/Client Bills style**/
#btnGenUserClientBills, #btnGenClientBills {
    white-space: normal;
    word-wrap: break-word;
    font-size: medium;
}
/*.billingCreateContainer .Container2 div .k-state-default {
    border-bottom: 1px solid black;
}*/
.billingCreateContainer .Container2 div .k-widget{
    border: white;
}

.billingCreateContainer .Container2 div .k-picker-wrap.k-state-default {
    background-color: #fff !important;
}
/******PEAdmin - Billing End *******/

/******PEAdmin - FileUpload *******/

#FileUploadGrid .k-pager-wrap {
    display: flex;
}

    #FileUploadGrid .k-pager-wrap .k-pager-first {
        order: 1;
    }

        #FileUploadGrid .k-pager-wrap .k-pager-first + .k-link.k-pager-nav {
            order: 2;
        }

    #FileUploadGrid .k-pager-wrap .k-pager-numbers.k-reset {
        display: none !important;
        order: 3;
    }

    #FileUploadGrid .k-pager-wrap .k-pager-numbers-wrap {
        order: 4;
    }

#FileUploadGrid .k-pager-numbers.k-reset + .k-link.k-pager-nav {
    order: 5;
}

#FileUploadGrid .k-pager-wrap .k-pager-last {
    order: 6;
}

#FileUploadGrid .k-pager-wrap .k-pager-sizes {
    order: 7;
}

#FileUploadGrid .k-pager-wrap .k-pager-info {
    order: 8;
}


.pe-canvas-container {
    max-width: 110rem;
    height: auto;
    width: 100%;
    min-width: 99.1rem;
    margin: 4rem auto;
    padding: 0rem 1rem;
}

.shadow-box {
    box-shadow: 0 0.3rem 1rem 0.3rem rgba(0, 0, 0, 0.1);
    border-radius: 0.5rem;
    height: 76%;
    background: #FFF;
}

.box-padding {
    padding: 3rem 0 2rem 1rem !important;
    margin-top: 30px;
}

.detail-label {
    font-size: 1.8rem;
    text-align: left;
    margin-bottom: 0;
    margin-top: -3px;
    color: #212121;
}

.size-25p {
    font-size: 2.5rem !important;
}

.weight-400 {
    font-weight: 400;
}

.weight-600 {
    font-weight: 600;
}

.ml-30 {
    margin-left: 3rem !important;
}

.ml-10 {
    margin-left: 1rem !important;
}

.mt-20 {
    margin-top: 2rem !important;
}

.margin-top-bottom-20 {
    margin-top: 20px;
    margin-bottom: 40px;
}

.size-20p {
    font-size: 2rem;
}

.flex-switch {
    flex-direction: row;
}

.flex-column {
    -ms-flex-direction: column !important;
    flex-direction: column !important;
}

.justify-content-start {
    justify-content: flex-start !important;
}

.justify-content-center {
    -ms-flex-pack: center !important;
    justify-content: center !important;
}

.align-items-center {
    -ms-flex-align: center !important;
    align-items: center !important;
}

.align-items-start {
    -ms-flex-align: start !important;
    align-items: flex-start !important;
}

.align-self-center {
    -ms-flex-item-align: center !important;
    align-self: center !important;
}

.align-items-baseline {
    -ms-flex-align: baseline !important;
    align-items: baseline !important;
}

.justify-content-around {
    -ms-flex-pack: distribute !important;
    justify-content: space-around !important;
}

.justify-content-between {
    -ms-flex-pack: justify !important;
    justify-content: space-between !important;
}

.d-flex {
    display: -ms-flexbox !important;
    display: flex !important;
}



.bill-desc:first-of-type {
    font-weight: 600;
    font-size: 1.6rem;
}

.price-box {
    width: 130px;
    height: 70px;
    display: flex;
    justify-content: center;
    align-items: center;
    /*background-color: #f5f6f7;*/
    position: relative;
    border-radius: 1rem;
}

    .price-box.plus {
        background-color: #001e74;
    }

    .price-box.epay {
        background-color: #7d8eb1;
    }

.price-label {
    width: 100px;
    text-align: center;
    word-wrap: break-word;
    font-size: 17px;
    color: #FFFFFF;
    line-height: 1.6;
}

.form-placeholder {
    width: inherit;
    margin-top: 3rem;
    position: relative;
    z-index: 1;
}

.type-box-lg {
    min-width: 5.5rem;
    width: 15.5rem;
    height: 15rem;
    border: 2px solid #ACB7C1;
    border-radius: 0.5rem;
    font-size: 4rem;
    color: #ACB7C1;
}

.pill-label {
    margin-left: 1rem;
    color: #212121;
}

.primary {
    color: #2285D0 !important;
}

.invoice-status {
    width: auto;
    min-width: 300px;
    margin-top: -3rem;
    margin-left: 15rem;
}

.detail-label {
    font-size: 1.8rem;
    text-align: left;
    margin-bottom: 0;
    margin-top: -3px;
    color: #212121;
}

.badge-success {
    color: #fff;
    background-color: #28a745;
}

.shadow-box-grid {
    padding: 10px !important;
    box-shadow: 0 0.3rem 1rem 0.3rem rgba(0, 0, 0, 0.1);
    border-radius: 0.5rem;
    height: 80%;
    background: #fff;
}

#DeductionGridSummarry table thead.k-grid-header tr th,#PayrunInvoiceGridSummarry table thead.k-grid-header tr th {
    font-weight: 700 !important;
}

#DeductionGridSummarry.k-grid th, #PayrunInvoiceGridSummarry.k-grid th {
    padding: 16px 24px !important;
    direction: ltr !important;
}

#DeductionGridSummarry.k-grid td, #PayrunInvoiceGridSummarry.k-grid td, #DeductionGridSummarry.k-grid th, #PayrunInvoiceGridSummarry.k-grid th {
    padding: 10px 24px;
    border-style: solid;
    outline: 0;
    font-weight: inherit;
    text-align: inherit;
    overflow: hidden;
    text-overflow: ellipsis;
    border-width: 0 0 1px 1px;
}
/** Loader for View payment History thats on _InvoiceCard**/
div#paymnetGridOverlay {
    position: fixed;
    top: 110px;
    left: 10px;
    width: 100%;
    height: 100%;
    z-index: 9999;
    display: flex;
    align-items: center;
    justify-content: center;
}

div.paymnetGridloader {
        border: 8px solid #f3f3f3;
        border-top: 8px solid #3498db;
        border-radius: 50%;
        width: 30px;
        height: 30px;
        animation: spin 2s linear infinite;
    }

div.paymnetGridloadertext {
    margin-top: 3px;
    color: #918282;
    font-size: 18px;
    margin-left: 6px;
    text-align: center;
}
.InvocoiceChargeHistory {
    width: 100%;
    display: flex;
}

#showPaymentHistory {
    display: none;
    width: 100%;
}

.leftLine {
    width: 40%;
    border-top: 1px solid rgba(151,151,151,0.35);
    margin-top: 16px;
}
/**End**/

@media (min-width: 992px) and (max-width: 1200px) {
    .pe-canvas-container {
        width: 100%;
        max-width: 99.1rem;
        min-width: inherit;
        margin: 4rem auto;
    }

    .pe-form-group {
        text-align: right;
    }

    .invoice-status {
        width: min-content;
        min-width: 300px;
        margin-top: -3rem;
        margin-left: 10rem;
    }
}

@media (min-width: 769px) and (max-width: 991px) {
    .pe-canvas-container {
        width: 100%;
        max-width: 99.1rem;
        min-width: inherit;
        margin: 4rem auto;
        overflow-x: visible;
    }


    .invoice-status {
        width: min-content;
        min-width: 300px;
        margin-top: -3rem;
        margin-left: 10rem;
    }
}
@media (min-width: 576px) and (max-width: 768px) {
    .pe-canvas-container {
        width: 100%;
        max-width: 99.1rem;
        min-width: inherit;
        margin: 4rem auto;
        overflow-x: visible;
    }

    .invoice-status {
        width: min-content;
        min-width: 200px;
        margin-top: 0rem;
        margin-left: 0rem;
    }

    .pe-form-group {
        text-align: right;
    }

    .mobile-row-mt {
        border-left: 0 !important;
        flex-direction: column;
        margin-top: 10rem;
    }
}

@media (min-width: 460px) and (max-width: 768px) {
    .contanier-card-ye-mobile {
        flex-direction: column;
        width: auto;
    }

    .contanier-ye-text {
        margin-top: 3rem !important;
        width: 100%;
        padding: 0rem 1rem 1rem 1rem;
    }
}
/**CredtiCard- Admin Invoicing CSS**/

.example.example5 {
    background-color: #9169d8;
}

    .example.example5 * {
        font-family: Helvetica Neue, Helvetica, Arial, sans-serif;
        font-size: 16px;
        font-weight: 400;
    }

    .example.example5 form {
    }

#example5-paymentRequest {
    max-width: 500px;
    width: 100%;
    margin-bottom: 10px;
}

.example.example5 fieldset {
    border: 1px solid #b5a4ed;
    padding: 15px;
    border-radius: 6px;
}

    .example.example5 fieldset legend {
        margin: 0 auto;
        padding: 0 10px;
        text-align: center;
        font-size: 14px;
        font-weight: 500;
        color: #cdd0f8;
        background-color: #9169d8;
    }

        .example.example5 fieldset legend + * {
            clear: both;
        }

.example.example5 .card-only {
    display: block;
}

.example.example5 .payment-request-available {
    display: none;
}

.example.example5 .row {
    display: -ms-flexbox;
    display: flex;
    margin: 0 0 10px;
}

.example.example5 .field {
    position: relative;
    width: 100%;
}

    .example.example5 .field + .field {
        margin-left: 10px;
    }

.example.example5 label {
    width: 100%;
    color: #cdd0f8;
    font-size: 13px;
    font-weight: 500;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.Input-container .InputElement {
    color: #212121 !important;
}

#example5-card.input {
    width: 100%;
    color: #212121;
    background: transparent;
    padding: 5px 0 6px 0;
    border-bottom: 1px solid #D4D4D4;
    transition: border-color 0.3s cubic-bezier(0.165, 0.84, 0.44, 1);
}

.example.example5 .input::-webkit-input-placeholder {
    color: lightgray;
}

.example.example5 .input::-moz-placeholder {
    color: lightgray;
}

.example.example5 .input:-ms-input-placeholder {
    color: lightgray;
}

#example5-card.input.StripeElement--focus,
#example5-card.input:focus {
    border-color: #2285D0 !important;
}

#example5-card.input.StripeElement--invalid {
    border-color: #F8333C !important;
}

.example.example5 input:-webkit-autofill,
.example.example5 select:-webkit-autofill {
    -webkit-text-fill-color: #fce883;
    transition: background-color 100000000s;
    -webkit-animation: 1ms void-animation-out;
}

.example.example5 .StripeElement--webkit-autofill {
    background: transparent !important;
}

.example.example5 input,
.example.example5 button,
.example.example5 select {
    -webkit-animation: 1ms void-animation-out;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    outline: none;
    border-style: none;
    border-radius: 0;
}

    .example.example5 select.input,
    .example.example5 select:-webkit-autofill {
        background-image: url('data:image/svg+xml;utf8,<svg width="10px" height="5px" viewBox="0 0 10 5" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"><path fill="#fff" d="M5.35355339,4.64644661 L9.14644661,0.853553391 L9.14644661,0.853553391 C9.34170876,0.658291245 9.34170876,0.341708755 9.14644661,0.146446609 C9.05267842,0.0526784202 8.92550146,-2.43597394e-17 8.79289322,0 L1.20710678,0 L1.20710678,0 C0.930964406,5.07265313e-17 0.707106781,0.223857625 0.707106781,0.5 C0.707106781,0.632608245 0.759785201,0.759785201 0.853553391,0.853553391 L4.64644661,4.64644661 L4.64644661,4.64644661 C4.84170876,4.84170876 5.15829124,4.84170876 5.35355339,4.64644661 Z" id="shape"></path></svg>');
        background-position: 100%;
        background-size: 10px 5px;
        background-repeat: no-repeat;
        overflow: hidden;
        text-overflow: ellipsis;
        padding-right: 20px;
    }

.example.example5 button {
    display: block;
    width: 100%;
    height: 40px;
    margin: 20px 0 0;
    background-color: #fff;
    border-radius: 6px;
    color: #9169d8;
    font-weight: 500;
    cursor: pointer;
}

    .example.example5 button:active {
        background-color: #cdd0f8;
    }

.example.example5 .error svg .base {
    fill: #fff;
}

.example.example5 .error svg .glyph {
    fill: #9169d8;
}

.example.example5 .error .message {
    color: #fff;
}

.example.example5 .success .icon .border {
    stroke: #bfaef6;
}

.example.example5 .success .icon .checkmark {
    stroke: #fff;
}

.example.example5 .success .title {
    color: #fff;
}

.example.example5 .success .message {
    color: #cdd0f8;
}

.example.example5 .success .reset path {
    fill: #fff;
}

.pe-grid-container {
    max-width: 140rem;
    width: 140rem;
    margin: 5rem auto;
    min-width: 110rem;
    height: fit-content;
    padding: 0rem 1rem;
}

.pe-grid-container-ph {
    max-width: 140rem;
    width: 100%;
    margin: 5rem auto;
    min-width: 35rem;
    height: fit-content;
    padding: 0rem 1rem;
}

.pe-canvas-container {
    max-width: 110rem;
    height: auto;
    width: 100%;
    min-width: 99.1rem;
    margin: 4rem auto;
    padding: 0rem 1rem;
}

.pe-form-group {
    flex-direction: row;
    text-align: right;
}

.grid-title {
    width: auto;
    min-width: 25rem;
    color: #212121 !important;
    font-family: "Open Sans";
    font-size: 2.6rem;
    font-weight: 300;
    display: table;
}

.grid-header {
    border-bottom: 1px solid #C4C6C8;
    padding: 4rem 0rem 1rem 0rem;
    position: relative;
    z-index: 1;
    align-items: center;
}

.canvas-header {
    border-bottom: 1px solid #C4C6C8;
    padding: 1rem 0rem;
    /*background-color: white;*/
    min-width: 90rem;
    width: inherit;
    position: relative;
    z-index: 2;
    margin-top: 3rem;
}

.dropdown-option-selected {
    color: #808EAE;
    font-family: 'Open Sans';
    font-size: 1.5rem;
    font-weight: 500;
}

.dropdown-option {
    color: #808EAE;
    font-family: 'Open Sans';
    font-size: 1.5rem;
}

.form-placeholder {
    width: inherit;
    margin-top: 3rem;
    position: relative;
    z-index: 1;
}

.grid-placeholder {
    margin-top: 30px;
}

.sub-edit-pad {
    padding-top: 2rem !important;
    padding-bottom: 2rem !important;
}

.shadow-box {
    box-shadow: 0 0.3rem 1rem 0.3rem rgba(0, 0, 0, 0.1);
    border-radius: 0.5rem;
    height: 76%;
    background: #FFF;
}

.shadow-box-grid {
    padding: 10px !important;
    box-shadow: 0 0.3rem 1rem 0.3rem rgba(0, 0, 0, 0.1);
    border-radius: 0.5rem;
    height: 80%;
    background: #FFF;
}

@keyframes increase-25 {
    0% {
        width: 25%;
    }

    100% {
        width: 50%;
    }
}

.svg-button-position > svg {
    width: 2rem;
}

.arrow-right-svg {
    cursor: pointer !important;
}

.line-arrow-right1 {
    animation: line-arrow-right1-fly 1s infinite ease-in-out;
}
@keyframes line-arrow-right1-fly {
    0% {
        transform: translate3d(-200px, 0, 0);
    }

    30% {
        transform: translate3d(0px, 0, 0);
    }

    40% {
        transform: translate3d(-4px, 0, 0);
    }

    50% {
        transform: translate3d(0px, 0, 0);
    }

    70% {
        transform: translate3d(-4px, 0, 0);
    }

    100% {
        transform: translate3d(240px, 0, 0);
    }
}

.arrow-left-svg {
    cursor: pointer !important;
}

.line-arrow-left1 {
    animation: line-arrow-left1-fly 1s infinite ease-in-out;
}
@keyframes line-arrow-left1-fly {
    0% {
        transform: translate3d(200px, 0, 0);
    }

    30% {
        transform: translate3d(-4px, 0, 0);
    }

    40% {
        transform: translate3d(0, 0, 0);
    }

    50% {
        transform: translate3d(-4px, 0, 0);
    }

    70% {
        transform: translate3d(0, 0, 0);
    }

    100% {
        transform: translate3d(-240px, 0, 0);
    }
}

/***CSS FOR SVG ANIMATION***/
.arrow-right-animate {
    width: 2rem !important;
    display: inline-block;
    position: relative;
    top: 4px;
}

.svg-button-position {
    position: relative;
    margin: -63px 23px -47px 23px;
    opacity: 0 !important;
}

.hover-hide {
    display: inline-block;
}

.loading-active:active .hover-hide {
    opacity: 0 !important;
    transition: 0.5s;
}

.hide-label {
    z-index: -1;
    position: relative;
}

.animation-button-hover:hover .hover-hide {
    opacity: 0;
    transition: 0.5s;
}

.animation-button-hover:hover .svg-button-position {
    opacity: 1 !important;
    transition: 0.5s;
}

.loading-spinner-position {
    position: relative;
    margin-top: 0px;
    opacity: 1;
    display: none;
}

.next-loading {
    display: none;
}
.animation-button-hover.pe-primary:focus-visible .phc-tab {
    border: 1px dashed white !important;
}
.pe-primary {
    background-color: var( --color-primary) !important;
}



    .pe-primary:hover, .k-button:hover, .swal-button:hover, .pe-primary:hover > .inner-icon-btn-background, .pe-primary:hover > .inner-icon-btn-background-large {
        font-weight: 500 !important;
        /* opacity: 0.65; */
        background-color: var(--color-secondary-border) !important;
        cursor: pointer;
        transition: background-color 0.5s;
    }
    .pe-primary:active {
        font-weight: 500 !important;
        opacity: 0.90;
    }
/*.loading-active:focus .loading-spinner-position {
        opacity: 0;
        transition: 1.5s;
    }*/
.loading-active:focus .svg-button-position {
    opacity: 0 !important;
}

/****Pulse***/
.pulse-animation {
    -webkit-animation: pulse-animation 0.7s linear infinite;
    animation: pulse-animation 0.7s linear infinite;
}

#check2back {
    stroke: path("#333") !important;
}

/***LOCK****/
.lockedicon:hover {
    cursor: pointer !important;
}

    .lockedicon:hover .line-lock4 {
        animation: line-lock4 1.5s;
        animation-iteration-count: 1;
        transform: translate3d(0, 10px, 0);
    }

@keyframes line-lock4 {
    0% {
        transform: translate3d(0, 10px, 0);
    }

    20% {
        transform: translate3d(0, 0px, 0);
    }

    40% {
        transform: translate3d(0, 0px, 0);
    }

    50% {
        transform: translate3d(0, 2px, 0);
    }

    80% {
        transform: translate3d(0, 0px, 0);
    }

    100% {
        transform: translate3d(0, 0px, 0);
    }
}

.lockicon, .lockedicon {
    width: 3rem;
}

.fast-spin {
    -webkit-animation: fa-spin 0.7s infinite linear;
    animation: fa-spin 0.7s infinite linear;
}

.lockicon:hover {
    cursor: pointer !important;
}

    .lockicon:hover .line-lock3 {
        animation: line-lock3 1.5s;
        animation-iteration-count: 1;
        transform: translate3d(0, 10px, 0);
    }

@keyframes line-lock3 {
    0% {
        transform: translate3d(0, 0px, 0);
    }

    20% {
        transform: translate3d(0, 10px, 0);
    }

    40% {
        transform: translate3d(0, 10px, 0);
    }

    50% {
        transform: translate3d(0, 8px, 0);
    }

    80% {
        transform: translate3d(0, 10px, 0);
    }

    100% {
        transform: translate3d(0, 10px, 0);
    }
}

.justify-content-end {
    -ms-flex-pack: end !important;
    justify-content: flex-end !important;
}

.editDd .k-input {
    font-size: 15px;
    font-family: 'lato', 'sans serif';
    position: absolute;
}

.editDd .k-select {
    padding-bottom: 10px;
}

.edit-input.editDd {
    height: 40px;
}

.editDd .k-dropdown-wrap {
    margin-top: -0.9rem;
}

.no-padding-right {
    padding-right: 0rem;
}

@media (max-width: 575px) {
    .pe-canvas-container {
        width: 100%;
        min-width: inherit;
        padding-left: 5px;
        margin: 4rem 0rem 5rem 0rem;
        overflow-x: visible;
        padding: 0rem 0.5rem;
    }

    .shadow-box {
        padding: 15px !important;
        box-shadow: none; /*0 0.3rem 1rem 0.3rem rgba(0,0,0,0.1);*/
        border-radius: 0.5rem;
        height: 80%;
    }
}
@media (min-width: 576px) and (max-width: 768px) {
    .pe-canvas-container {
        width: 100%;
        max-width: 99.1rem;
        min-width: inherit;
        margin: 4rem auto;
        overflow-x: visible;
    }
}
    @media (min-width: 992px) and (max-width: 1200px) {
        .pe-canvas-container {
            width: 100%;
            max-width: 99.1rem;
            min-width: inherit;
            margin: 4rem auto;
        }
    }

    @media (min-width: 769px) and (max-width: 991px) {
        .pe-canvas-container {
            width: 100%;
            max-width: 99.1rem;
            min-width: inherit;
            margin: 4rem auto;
            overflow-x: visible;
        }
    }
    /****/

    .w-115{
        width:115px;
    }

    .input-style {
        padding-top: 0;
        width: 100%;
    }