h1, .h1 {
    font-size: 22px;
}

h2, .h2 {
    font-size: 20px;
}

h3, .h3 {
    font-size: 18px;
}

h4, .h4,
table caption {
    font-size: 16px;
}

h5, .h5 {
    font-size: 14px;
}

h6, .h6 {
    font-size: 12px;
}

table caption {
    margin: 0 0 5px;
}

textarea {
    width: 100%;
}

.hideblock {
    display: none;
}

.showblock {
    display: block;
}

.showline {
    display: inline;
}

.gray {
    color: gray;
}

.coral-background {
    background-color: coral;
}

.lightgray {
    color: lightgray;
}

.alert-info {
    width: 600px;
}

.spinner {
    text-align: center;
}

.container {
    padding-left: 15px;
    padding-right: 15px;
    max-width: 100%;
}

#radioBtn .notActive {
    color: #3276b1;
    background-color: #fff;
}

/** The Magic **/
.btn-breadcrumb .btn:not(:last-child):after {
    content: " ";
    display: block;
    width: 0;
    height: 0;
    border-top: 17px solid transparent;
    border-bottom: 17px solid transparent;
    border-left: 10px solid white;
    position: absolute;
    top: 50%;
    margin-top: -17px;
    left: 100%;
    z-index: 3;
}

.btn-breadcrumb .btn:not(:last-child):before {
    content: " ";
    display: block;
    width: 0;
    height: 0;
    border-top: 17px solid transparent;
    border-bottom: 17px solid transparent;
    border-left: 10px solid rgb(173, 173, 173);
    position: absolute;
    top: 50%;
    margin-top: -17px;
    margin-left: 1px;
    left: 100%;
    z-index: 3;
}

/** The Spacing **/
.btn-breadcrumb .btn {
    padding: 6px 12px 6px 24px;
}

    .btn-breadcrumb .btn:first-child {
        padding: 6px 6px 6px 10px;
    }

    .btn-breadcrumb .btn:last-child {
        padding: 6px 18px 6px 24px;
    }

    /** Default button **/
    .btn-breadcrumb .btn.btn-default:not(:last-child):after {
        border-left: 10px solid #fff;
    }

    .btn-breadcrumb .btn.btn-default:not(:last-child):before {
        border-left: 10px solid #ccc;
    }

    .btn-breadcrumb .btn.btn-default:hover:not(:last-child):after {
        border-left: 10px solid #ebebeb;
    }

    .btn-breadcrumb .btn.btn-default:hover:not(:last-child):before {
        border-left: 10px solid #adadad;
    }

    /** Primary button **/
    .btn-breadcrumb .btn.btn-primary:not(:last-child):after {
        border-left: 10px solid #428bca;
    }

    .btn-breadcrumb .btn.btn-primary:not(:last-child):before {
        border-left: 10px solid #357ebd;
    }

    .btn-breadcrumb .btn.btn-primary:hover:not(:last-child):after {
        border-left: 10px solid #3276b1;
    }

    .btn-breadcrumb .btn.btn-primary:hover:not(:last-child):before {
        border-left: 10px solid #285e8e;
    }

    /** Success button **/
    .btn-breadcrumb .btn.btn-success:not(:last-child):after {
        border-left: 10px solid #5cb85c;
    }

    .btn-breadcrumb .btn.btn-success:not(:last-child):before {
        border-left: 10px solid #4cae4c;
    }

    .btn-breadcrumb .btn.btn-success:hover:not(:last-child):after {
        border-left: 10px solid #47a447;
    }

    .btn-breadcrumb .btn.btn-success:hover:not(:last-child):before {
        border-left: 10px solid #398439;
    }

    /** Danger button **/
    .btn-breadcrumb .btn.btn-danger:not(:last-child):after {
        border-left: 10px solid #d9534f;
    }

    .btn-breadcrumb .btn.btn-danger:not(:last-child):before {
        border-left: 10px solid #d43f3a;
    }

    .btn-breadcrumb .btn.btn-danger:hover:not(:last-child):after {
        border-left: 10px solid #d2322d;
    }

    .btn-breadcrumb .btn.btn-danger:hover:not(:last-child):before {
        border-left: 10px solid #ac2925;
    }

    /** Warning button **/
    .btn-breadcrumb .btn.btn-warning:not(:last-child):after {
        border-left: 10px solid #f0ad4e;
    }

    .btn-breadcrumb .btn.btn-warning:not(:last-child):before {
        border-left: 10px solid #eea236;
    }

    .btn-breadcrumb .btn.btn-warning:hover:not(:last-child):after {
        border-left: 10px solid #ed9c28;
    }

    .btn-breadcrumb .btn.btn-warning:hover:not(:last-child):before {
        border-left: 10px solid #d58512;
    }

    /** Info button **/
    .btn-breadcrumb .btn.btn-info:not(:last-child):after {
        border-left: 10px solid #5bc0de;
    }

    .btn-breadcrumb .btn.btn-info:not(:last-child):before {
        border-left: 10px solid #46b8da;
    }

    .btn-breadcrumb .btn.btn-info:hover:not(:last-child):after {
        border-left: 10px solid #39b3d7;
    }

    .btn-breadcrumb .btn.btn-info:hover:not(:last-child):before {
        border-left: 10px solid #269abc;
    }

.weekend {
    opacity: 0.5;
}

[ng\:cloak], [ng-cloak], .ng-cloak {
    display: none !important;
}

.link:hover {
    text-decoration: underline;
    cursor: pointer;
}

.negativetime, div.negativetime input {
    background-color: #FF9999 !important;
}

.frontpage-report-month {
    padding-top: 5px;
}

.dayreportactivities th, .dayreportactivities td {
    border: solid 1px lightgray;
    padding: 4px;
}

.dayreportactivities th {
    text-align: center;
}

#projectHoursReport {
    width: 50%;
    margin: 0 auto;
}

.trelloUrl {
    height: 14px;
    margin-right: 3px;
    vertical-align: middle;
    width: 14px;
}
/* billing report styles */
.strike {
    text-decoration: line-through;
}

.totalTimeBold {
    font-weight: bold;
}

.panel-primary .panel-heading a {
    color: #fff;
}

#mvr-main .mvr-xlsLink.text-primary {
    color: #428bca;
}

.weekHeading h2,
.projHeading h3 {
    display: inline;
    position: relative;
    padding: 0 0 0 20px;
    margin: 0 0 5px;
    cursor: pointer;
}

.projHeading h3 {
    padding: 0 0 0 16px;
    font-size: 16px;
    display: block;
}

.drop-body {
    padding: 10px 0 0;
}

.weekHeading h2:after,
.weekHeading h2:before,
.projHeading h3:after,
.projHeading h3:before {
    content: '';
    position: absolute;
    left: 0;
    top: 9px;
    width: 14px;
    height: 2px;
    background: #333;
}

.projHeading h3:after {
    width: 11px;
    height: 1px;
}

.projHeading h3:before {
    left: 5px;
    top: 4px;
    width: 1px;
    height: 11px;
}

.weekHeading h2:before {
    left: 6px;
    top: 4px;
    width: 2px;
    height: 14px;
}

.editTable.active .weekHeading h2:before,
.project-area.active .projHeading h3:before {
    display: none;
}

.projHeading .mvr-xlsLink {
    margin: 3px 0 0 5px;
}

.report-table {
    margin: 0;
}

    .report-table .btn {
        font-size: 22px;
        line-height: 21px;
        padding: 2px 6px;
    }

    .report-table th {
        vertical-align: middle;
    }

        .report-table th:last-child,
        .report-table td:first-child {
            width: 120px;
            text-align: center;
        }

    .report-table th {
        background: #428bca /*62abea*/;
        color: #fff;
    }

    .report-table input[type='text'],
    .report-table textarea {
        border: 1px solid #e1e1e1;
        background: none;
        padding: 1px 4px;
        width: 74px;
    }

        .full-width,
        .report-table .old-value.full-width,
        .report-table input[type='text'].full-width,
        .report-table textarea.full-width {
            width: 100%;
        }

        .report-table input[type='text']:focus,
        .report-table textarea:focus {
            outline: 1px solid #ccc;
            border-color: #ccc;
        }

    .report-table th input[type='text'],
    .report-table th textarea {
        color: #fff;
        border-color: #58a1e0;
    }

        .report-table th input[type='text']:focus,
        .report-table th textarea:focus {
            outline: 1px solid #fff;
            border-color: #fff;
        }

    .report-table .old-value {
        display: inline-block;
        vertical-align: top;
        padding: 1px 4px;
        width: 74px;
        text-align: left;
    }

.table.report-table thead > tr > th,
.table.report-table tbody > tr > th,
.table.report-table tfoot > tr > th,
.table.report-table thead > tr > td,
.table.report-table tbody > tr > td,
.table.report-table tfoot > tr > td {
    vertical-align: middle;
}

.modal-header h1,
.modal-header h2,
.modal-header h3,
.modal-header h4,
.modal-body .panel h1,
.modal-body .panel h2,
.modal-body .panel h3,
.modal-body .panel h4 {
    margin: 0;
}

.modal-body h1,
.modal-body h2,
.modal-body h3,
.modal-body h4,
.modal-body h5 {
    margin: 0 0 10px;
}

.modal-dialog ol {
    list-style: none;
    counter-reset: newCounter;
    padding: 0;
}

    .modal-dialog ol > li {
        position: relative;
        padding: 0 0 10px;
    }

    .modal-dialog ol > ol > li {
        position: relative;
        padding: 0 0 10px;
    }

    .modal-dialog ol > li:before {
        counter-increment: newCounter;
        content: counters(newCounter,".") " ";
        float: left;
        background: #428bca;
        color: #fff;
        text-align: center;
        font-size: 12px;
        line-height: 26px;
        min-width: 28px;
        min-height: 28px;
        padding: 1px;
        border-radius: 50%;
        margin: -4px 5px 0 0;
    }

    .modal-dialog ol ol > li:before {
        margin: -3px 5px 0 0;
    }

.modal-dialog .list-group-item {
    background: none;
}

    .modal-dialog .list-group-item:before {
        content: '';
        position: absolute;
        left: 0;
        top: 9px;
        width: 5px;
        height: 5px;
        border-radius: 50%;
        background: #333;
    }

#mvr-main .modal-dialog .list-group,
#mvr-main .modal-dialog .list-group-item {
    padding: 0 0 0 10px;
}

.modal-dialog .panel-body + .panel-body {
    border-top: 1px solid #ddd;
}

.modal-dialog .panel-body:nth-child(2n+1) {
    background: #fcfcfc;
}

@media screen and (max-width: 480px) {
    h1, .h1 {
        font-size: 21px;
    }

    h2, .h2 {
        font-size: 19px;
    }

    h3, .h3 {
        font-size: 17px;
    }

    h4, .h4,
    table caption {
        font-size: 15px;
    }

    h5, .h5 {
        font-size: 13px;
    }

    h6, .h6 {
        font-size: 11px;
    }

    .report-table td:first-child,
    .report-table th:last-child {
        width: 60px;
    }

    .report-table input[type="text"],
    .report-table textarea,
    .report-table .old-value {
        width: 54px;
    }

    .report-table {
        font-size: 13px;
    }
}

.table-striped > tbody > tr:nth-child(even) > td {
    background-color: #fcfcfc;
}

.table-striped > tbody > tr:nth-child(odd) > td {
    background-color: #fff;
}
table td.alert-danger,
.table td.alert-danger,
.table-striped>tbody>tr:nth-child(odd)>td.alert-danger,
.table-striped>tbody>tr:nth-child(even)>td.alert-danger {
    background:#f2dede;
    border-radius:0;
}

.table-striped-even {
  border: 1px solid #DDDDDD;
}

.table-striped-even > tbody > tr:nth-child(odd) > td {
  background-color: #FAFAFA;
}

.table-striped-even > tbody > tr:nth-child(even) > td {
  background-color: #fff;
}

.table-striped-even > tbody > tr:first-child > td {
  background-color: #F1F5F5;
}

.first-row {
    margin: 0px;
    border: 0px;
}
.first-row > tbody > tr:first-child > td {
    background-color: #FAFAFA;
}

.booking-table .orange-label {
  padding: 2px 10px;
  border-radius: 100px;
  font-weight: bold;
  background: #F89406;
  color: #fff;
  font-size: 13px;
  line-height: 18px;
  white-space: nowrap;
}

.booking-table .red-label {
  padding: 2px 10px;
  border-radius: 100px;
  background: #DC3545;
  font-weight: bold;
  color: #fff;
  white-space: nowrap;
}
.no-description {
    padding: 2px 10px;
    border-radius: 100px;
    background: #ffeeaa;
    color: black;
    white-space: nowrap;
    border: 2px solid #ffeeaa;
}

.teams-table {
  width: 100%;
  margin-bottom: 20px;
}

.teams-table .user-info {
  display: flex;
  flex-direction: row;
  justify-content: left;
  align-items: center;
}

.teams-table td {
  padding: 8px 0;
}

.panel-box h2 {
  line-height: 18px;
  margin: 0 0 18px;
  color: #333333;
  font-weight: 500;
}

.user-info .user-info-holder {
   width: 100%;
}

.user-info .user-info-position {
  display:inline-block;
  vertical-align: top;
}

.user-info .user-info-position.lead-position {
  position: relative;
}

.user-info .user-info-position.lead-position:after {
  display:inline-block;
  vertical-align: middle;
  width: 13px;
  height: 13px;
  background: url('../images/flag.svg') no-repeat;
  content: '';
  margin: -2px 0 0 ;
}

.user-info .user-info-position.mentor-position:after {
  display: inline-block;
  vertical-align: middle;
  width: 15px;
  height: 15px;
  background: url('../images/star.svg') no-repeat;
  content: '';
  margin: -4px 0 0;
}

.user-info .user-info-position.mentor-lead-position:after {
  display: inline-block;
  vertical-align: middle;
  width: 41px;
  height: 18px;
  background: url('../images/flag-star.svg') no-repeat;
  content: '';
  margin: -4px 0 0;
}

.user-info .user-info-heading {
  font-weight: bold;
  font-size: 14px;
  line-height: 18px;
  margin: 0;
}

.user-info .user-info-icon {
  width: 40px;
  border-radius: 100px;
  margin: 0 10px 0 0;
}

.user-info .user-info-icon img {
  width: 100%;
  height: auto;
  border-radius: 100px;
}

  .table-area-fn table {
    table-layout: fixed;
  }
.table-area-fn table th,
.table-area-fn table  thead>tr>th{
    vertical-align:top;
}
.table-area-fn table th:first-child{
    width:25%;
}
/* New billing report */
.main-table-holder {
    width: 100%;
    background: #428bca;
    padding: 4px;
}

    .main-table-holder .panel-heading a {
        margin-bottom: 5px;
        margin-left: 15px;
    }

    .main-table-holder .panel-heading .exportForPeriod {
        display: flex;
        margin-top: 10px;
    }
    .panel-heading .exportForPeriod .mvr-xlsLink {
        display: flex;
        align-items: center;
        text-decoration: none;
    }

    .panel-heading .exportForPeriod .mvr-xlsLink label {
        margin-bottom: auto;
        margin-top: auto;
        margin-left: 5px;
    }

    .main-table-holder .panel-heading {
        background-color: #428bca;
    }

.main-table-wrapper {
    width: 100%;
    border: 1px solid #666;
}

.main-table-holder table {
    height: 155px;
    border-collapse: collapse;
    width: 100%;
}

@-moz-document url-prefix() {
    .main-table-holder .main-table-wrapper table {
        border-collapse: initial;
    }
}

.main-table {
    width: 100%;
}

.fixed-element {
    position: absolute;
    top: 6px;
    left: 0px;
    width: 100%;
}

.main-table input {
    padding: 1px 3px;
    border: none;
    margin: -1px 0 0;
}

    .main-table input:focus {
        outline: none;
        border-color: #428bca;
        box-shadow: inset 0 0 3px #428bca;
    }

.main-header th {
    height: 40px;
    font-weight: normal;
    text-align: center;
    color: #fff;
    padding: 5px 8px;
    background: #aaaaaa;
    background: -moz-linear-gradient(top, #aaaaaa 0%, #666666 100%);
    background: -webkit-linear-gradient(top, #aaaaaa 0%,#666666 100%);
    background: linear-gradient(to bottom, #aaaaaa 0%,#666666 100%);
    vertical-align: middle;
}

.week-td {
    font-weight: bold;
    width: 10%;
    position: relative;
}

    .week-td span,
    .project-td span,
    .day-td span,
    .reported-td span {
        font-weight: normal;
        display: block;
    }

.project-td {
    width: 9%;
    position: relative;
}

.day-td {
    width: 9%;
}

.name-td {
    width: 40%;
}

.invoice-td {
    width: 9%;
}

.reported-td {
    width: 3%;
}

.task-td {
    width: 33%;
}

.detailed-td {
    width: 2%;
    max-width: 28px;
}

.action-td {
    width: 1%;
    vertical-align: top;
}

    .action-td .glyphicon-repeat {
        font-size: 12px;
        margin-top: 3px;
    }

        .action-td .glyphicon-repeat:hover {
            text-decoration: none;
        }

    .action-td .btn {
        padding: 1px 6px;
        font-weight: bold;
        border: none;
    }

.main-table td {
    text-align: center;
    background: #fff;
    border-top: 1px solid #c6c6c6;
    border-bottom: 1px solid #c6c6c6;
    border-left: 1px solid #ebebeb;
    border-right: 1px solid #ebebeb;
    padding: 5px 8px;
    /*min-height:80px;*/
}

.main-table .removed td{
    background-color: gainsboro;
    }

.week-table .task-td,
.week-table .invoice-td {
    text-align: left;
}

.main-table .week-table,
.main-table .project-table,
.main-table .name-table,
.main-table .day-table,
.main-table .detailed-table {
    padding: 0;
    border: 0;
    vertical-align: top;
}

.main-table .project-table {
    overflow: hidden;
}

.personInDayPeople {
    padding: 0 !important;
}

.project-table table {
    min-height: 80px;
    height: auto;
}

.day-table td {
    position: relative;
    padding: 2px 8px;
}

.table-person-detailed tr:last-child td {
    padding-bottom: 5px;
}

.person-row-in-day-people td {
    padding: 10px 8px 2px;
}

.personInDayPeople .person-name {
    padding: 0 3px;
}

.border-block {
    position: absolute;
    left: -1px;
    top: 0;
    height: 9999px;
    width: 1px;
    background: #ebebeb;
}

.week-table > table,
.project-table > table,
.name-table > table,
.day-table > table,
.detailed-table > table {
    width: 100%;
    border-collapse: collapse;
}

@-moz-document url-prefix() {
    .main-table-holder .main-table-wrapper .detailed-table > table {
        border-collapse: collapse;
    }
}

.week-td,
.week-table .project-td,
.week-table .day-td,
.week-table .name-td,
.week-table .invoice-td,
.week-table .reported-td,
.week-table .detailed-td,
.week-table .task-td {
    vertical-align: top;
}

.main-table .project-td,
.main-table .day-td,
.main-table .name-td,
.main-table .invoice-td,
.main-table .reported-td {
    border-bottom: 0;
    border-left: 0;
}

.main-table .wt-project-title-row {
    padding: 0 0 5px;
}

    .main-table .wt-project-title-row * {
        display: inline;
        line-height: 21px;
    }

    .main-table .wt-project-title-row a {
        text-decoration: none;
        opacity: .3;
    }

.main-table .personList {
    padding: 8px;
    line-height: 16px;
    text-align: center;
}

    .main-table .personList b {
        display: block;
        font-size: 10px;
        color: #092e9c;
    }

    .main-table .personList i {
        display: block;
        font-size: 12px;
        margin: 0 0 8px;
    }

/*.week-table .invoice-td,
.week-table .reported-td,
.week-table .name-td{
    border-bottom:1px solid #c6c6c6;
}*/
/*.main-table .detailed-table{
    border-bottom:1px solid #c6c6c6;
}*/
/*.main-table .name-td{
    border-bottom-width:2px;
}*/
.main-table .detailed-td {
    border-left: 0;
}

.main-table .totalList{
    margin: 0 5px 10px 5px;
    background-color: #EBEBE4;
    border-radius: 5px;
}

.main-table .totalList b {
    font-size: 10px;
    color: #092e9c;
    margin: 0 5px 0 0;
}

.main-table .totalList b.total {
    color: #000;
    font-size: 12px;
}

.main-table .totalList b.projectTotal {
    color: #000;
    font-size: 12px;
}

.main-table .totalList i {
    font-size: 12px;
    margin: 0 0 8px;
}

.main-table .totalList i.total{
    font-size: 13px;
}

.main-table .totalList i.projectTotal {
    font-size: 12px;
    font-weight: normal;
}

.week-table .project-td {
    width: 12%;
}

.week-table .day-td {
    width: 8%;
    padding: 10px 8px 5px;
}

.week-table .name-td {
    width: 73%;
}

.week-table .invoice-td {
    width: 8%;
    text-align: center;
    padding: 10px 8px 5px;
}

    .week-table .invoice-td span {
        cursor: default;
    }

    .week-table .invoice-td .invoice-time {
        text-align: center;
        font-weight: bold;
    }

.week-table .reported-td {
    width: 13%;
}

.week-td {
    border-bottom: 0 !important;
}

    .week-td .invoice-week-row {
        padding: 5px 0 0;
        font-weight: normal;
    }

        .week-td .invoice-week-row * {
            display: inline;
            vertical-align: middle;
        }

.week-table .locked-project-row {
    padding: 5px 0 0;
}

    .week-table .locked-project-row * {
        display: inline;
        vertical-align: middle;
    }

.week-table .wt-project-title-row * {
    display: inline;
    line-height: 21px;
}

.week-table .wt-project-title-row a {
    text-decoration: none;
    opacity: .3;
}

.detailed-table {
    width: 80%;
}

    .detailed-table table tr:last-child td {
        border-bottom: 0;
    }

.day-table > table > tbody > tr:last-child .name-td,
.day-table > table > tbody > tr:last-child .invoice-td,
.day-table > table > tbody > tr:last-child .reported-td,
.day-table > table > tbody > tr:last-child .detailed-table {
    border-bottom-width: 0px;
}
/*.main-table .day-table{
     border-bottom: 1px solid #c6c6c6;
}*/

.person-row-in-day-people {
    height: 15px;
    border: none;
}

    .person-row-in-day-people td {
        border: none;
        text-align: left;
    }

.mp-todayinMyReport {
    /*text-decoration: underline;*/
    font-weight: bold;
}

.show-on-hover{
     opacity:0;
     transition:all 0.2s linear;
    -moz-transition:all 0.2s linear;
    -webkit-transition:all 0.2s linear;
 }
  .table-hover>tbody>tr:hover>td:hover .show-on-hover,
 .table-hover>tbody>tr:hover>th:hover .show-on-hover{
     opacity:1;
 }
table#invoice-order-generator {
    border-radius: 10px;
    border: 1px solid #ccc;
    -moz-border-radius: 10px;
    -webkit-border-radius: 10px;
}

    table#invoice-order-generator input.form-control {
        height: 25px;
    }

    fieldset.invoice-generator select{
        padding-top: 0;
        padding-bottom: 0;
    }

     fieldset.invoice-generator label{
        margin-bottom: 0;
    }

.glyphicon.glyphicon-sm {
    font-size: 16px;
}

.glyphicon {
    font-size: 20px;
    line-height: 1;
    margin: 0 10px 0 0;
}

.glyphicon:hover {
    text-decoration: none;
}

.glyphicon-without-margin{
    margin: 0;    
}

.report-link {
    font-size: 16px;
    line-height: 18px;
    margin: 0 4px;
}

.report-link .caret{
    margin-left: 0;
}

.user-info-row {
    margin: 4px 0 0;
    text-align: right;
}
@media only screen and (max-width:767px){
    .user-info-row {
        text-align: left;
        font-size: 12px;
        line-height: 14px;
        margin: 10px 0 10px;
    }
}

.reported-time-per-month{
        font-size: 12px;
        color:darkgrey;
}

.ng-invalid.ng-dirty {
    border-color: red;
}

.ng-valid.ng-dirty {
    border-color: green
}

.month-work-hours {
font-size: 6pt;
color: gray;
}

.avatar {
    width: 75px;
    height: 75px;
    object-fit: cover;
    object-position: 50% 25%;
    border-radius: 40px;
}

.big-avatar {
    max-width:250px;
    border-radius:125px;
}

.user-wrap:after {
    clear: both;
    width: 100%;
    display: table;
}

.planing-triangle {
  width: 0;
  height: 0;
  border-top: 5px solid black;
  border-left: 5px solid transparent;
  top:0;
  right:0;
  position:absolute;
}

.planing-cell-with-triangle {
position:relative;
}

.user-wrap .user-avatar, .user-wrap .user-profile-avatar {
    float: left;
}
.user-wrap .user-avatar {
    position:relative;
}
.user-wrap .user-info, .user-wrap .user-profile-info {
    overflow: hidden;
    padding: 0 10px;
}
.profile-btn {
    position: absolute;
    bottom: 0;
    left: 14px;
    opacity: 0;
    visibility: hidden;
}
.table-hover > tbody > tr:hover .profile-btn {
    opacity:1;
    visibility:visible;
}

@media only screen and (max-width:1400px) {
    .user-wrap .user-avatar, .user-wrap .user-profile-avatar {
        float: none;
        width: 100%;
        margin: 0 0 10px;
    }

    .user-wrap .user-info, .user-wrap .user-profile-info {
        padding: 0;
    }
}

@media only screen and (max-width:991px) {
    .user-wrap .user-avatar {
        float: left;
        width: auto;
    }

    .user-wrap .user-info {
        padding: 0 10px;
    }
}



.user-area {
    display: flex;
    flex-direction: row;
    justify-content: left;
    align-items: center;
}

    .user-area .user-area-holder {
        width: 100%;
    }

    .user-area .user-area-position {
        display: inline-block;
        vertical-align: top;
    }

        .user-area .user-area-position.lead-position {
            position: relative;
        }

            .user-area .user-area-position.lead-position:after {
                display: inline-block;
                vertical-align: middle;
                width: 13px;
                height: 13px;
                background: url('../images/flag.svg') no-repeat;
                content: '';
                margin: -2px 0 0;
            }

        .user-area .user-area-position.mentor-position:after {
            display: inline-block;
            vertical-align: middle;
            width: 15px;
            height: 15px;
            background: url('../images/star.svg') no-repeat;
            content: '';
            margin: -4px 0 0;
        }

        .user-area .user-area-position.mentor-lead-position:after {
            display: inline-block;
            vertical-align: middle;
            width: 41px;
            height: 18px;
            background: url('../images/flag-star.svg') no-repeat;
            content: '';
            margin: -4px 0 0;
        }

    .user-area .user-area-heading {
        font-weight: bold;
        font-size: 14px;
        line-height: 18px;
        margin: 0;
    }

    .user-area .user-area-icon {
        width: 40px;
        border-radius: 100px;
        margin: 0 10px 0 0;
    }

        .user-area .user-area-icon img {
            width: 100%;
            height: auto;
            border-radius: 100px;
        }

.user-wrap {
    border-top: 1px solid #cecece;
    padding: 8px 0;
}

    .user-wrap .fake-label {
        display: inline;
        padding: .2em .6em .3em;
        font-size: 75%;
        font-weight: bold;
        line-height: 1;
        vertical-align: baseline;
    }

    .user-wrap .heading {
        display: block;
        min-height: 20px;
    }

    .user-wrap p {
        margin: 0;
    }

.heading-panel .heading-panel-top {
    padding: 15px 8px;
    border-bottom: 2px solid #ddd;
}

.page-heading {
    font-size: 20px;
    line-height: 22px;
    margin-right: 10px;
    display: inline-block;
    vertical-align: bottom;
    font-weight: bold;
}

.dropdown:hover .dropdown-menu{
    display: block;
  }

.heading-panel .heading-panel-wrap {
    padding: 15px 8px;
}

.table .user-wrap {
  border-top: none;
}
.user-report-status{
    width: 15px;
    height: 15px;
    margin-right: 10px;
    border-radius: 50%;
}
.user-report-status.disable{
    display: none;
    visibility: hidden;
}

.totalDayReport-heading-panel{
    margin-bottom: 10px;
}

.totalDayReport-button-wrap {
    margin-bottom: 10px;
}

.totalDayReport-heading{
    display:flex;
}

.mp-specialDay {
    background: url('../images/flag-ua.png') no-repeat;
    background-position: top right;
    background-size: 13px 13px;
}

.glyphicon-refresh-animate {
    -webkit-animation: spin 1.5s linear infinite;
    -moz-animation: spin 1.5s linear infinite;
    animation: spin 1.5s linear infinite;
}

@keyframes spin {
    100% {
        -webkit-transform: rotate(360deg);
        transform: rotate(360deg);
    }
}

.mvr-xlsLink label {
    font-size: 14px;
    color: #333;
}
.mvr-xlsLink label:hover {
    cursor: pointer;
}

.check-time-item {
    margin: 10px auto;
    display: block;
    text-align: center;
}

.mentors{
    padding: 0px 50px;
}

.mentor-row {
    display: flex;
    flex-direction: row;
    margin: 20px 0px;
}

.mentor-avatar img{
    width: 60px;
    height: 60px;
}
.mentor-info {
    margin: 0px 15px;
    display:flex;
    flex-direction: column;
    justify-content: center;
}
.mentor-info .star::after{
    display: inline-block;
    vertical-align:middle;
    width: 41px;
    height: 18px;
    background: url('../images/star.svg') no-repeat;
    content: '';
    margin-left: 10px;
}
.mentor-info .flag::after {
    display: inline-block;
    vertical-align: middle;
    width: 41px;
    height: 18px;
    background: url('../images/flag.svg') no-repeat;
    content: '';
    margin-left: 10px;
}
.mentor-info .flag.star::after {
    display: inline-block;
    vertical-align: middle;
    width: 41px;
    height: 18px;
    background: url('../images/flag-star.svg') no-repeat;
    content: '';
    margin-left: 10px;
}
.mentor-info-name{
    font-size: 15px;
}
td.month-day-time{
    max-width: 50px;
}
.report-link .glyphicon{
    font-size: 15px;
    margin-left: 5px;
}
.configs-mr-05{
    margin-right: 0.5%
}
.configs-mr-1{
    margin-right: 1%
}
.configs-mr-15{
    margin-right: 1.5%
}
.configs-ml-05{
    margin-left: 0.5%
}
.configs-ml-1{
    margin-left: 1%
}
.configs-ml-15{
    margin-left: 1.5%
}
.configs-search{
    width: 250px;
}
.configs-select{
    width: 200px;
}


/*Toggle*/
.toggle {
    cursor: pointer;
    display: inline-block;
}

.toggle-switch {
    display: inline-block;
    background: #ccc;
    border-radius: 12px;
    width: 42px;
    height: 24px;
    position: relative;
    vertical-align: middle;
    transition: background 0.25s;
}

    .toggle-switch:before, .toggle-switch:after {
        content: "";
    }

    .toggle-switch:before {
        display: block;
        background: linear-gradient(to bottom, #fff 0%, #eee 100%);
        border-radius: 50%;
        box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.25);
        width: 18px;
        height: 18px;
        position: absolute;
        top: 3px;
        left: 4px;
        transition: left 0.25s;
    }

.toggle:hover .toggle-switch:before {
    background: linear-gradient(to bottom, #fff 0%, #fff 100%);
    box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.5);
}

.toggle-checkbox:checked + .toggle-switch {
    background: #428bca;
}

    .toggle-checkbox:checked + .toggle-switch:before {
        left: 50%;
    }

.toggle-checkbox {
    position: absolute;
    visibility: hidden;
}

.toggle-label {
    margin-left: 5px;
    position: relative;
    top: 2px;
}

/*Tooltip*/
.tooltip-item {
    cursor: help;
    position: relative;
}

.tooltip-item {
    cursor: help;
    position: relative;
}


    /*== common styles for both parts of tool tip ==*/
    .tooltip-item::before,
    .tooltip-item::after {
        left: 43%;
        opacity: 0;
        position: absolute;
        z-index: -100;
    }

    .tooltip-item:hover::before,
    .tooltip-item:focus::before,
    .tooltip-item:hover::after,
    .tooltip-item:focus::after {
        opacity: 1;
        transform: scale(1) translateY(0);
        z-index: 100;
    }

    .tooltip-item::before {
        border-style: solid;
        border-width: 1em 0.75em 0 0.75em;
        border-color: #3E474F transparent transparent transparent;
        bottom: 100%;
        content: "";
        margin-left: -0.5em;
        transition: all .65s cubic-bezier(.84,-0.18,.31,1.26), opacity .65s .5s;
        transform: scale(.6) translateY(-90%);
    }

    .tooltip-item:hover::before,
    .tooltip-item:focus::before {
        transition: all .65s cubic-bezier(.84,-0.18,.31,1.26) .2s;
    }
    /*== speech bubble ==*/
    .tooltip-item::after {
        background: #3E474F;
        border-radius: .25em;
        bottom: 180%;
        color: #EDEFF0;
        content: attr(data-tip);
        margin-left: -8.75em;
        padding: 1em;
        transition: all .65s cubic-bezier(.84,-0.18,.31,1.26) .2s;
        transform: scale(.6) translateY(50%);
        width: 17.5em;
    }

    .tooltip-item:hover::after,
    .tooltip-item:focus::after {
        transition: all .65s cubic-bezier(.84,-0.18,.31,1.26);
    }

.avatar-md{
    width: 128px;
    object-fit: cover;
}
.avatar-sm {
    width: 96px;
    object-fit: cover;
}

.colleagues-user-card{
    width: calc(20% - 4.1rem);
}

.separator {
    height: 1px;
    background-color: white;
}

.users-dropdown{
    
}
    .users-dropdown-search-items {
        height: 20rem;
        overflow-y: auto;
        overflow-x: hidden;
        visibility: hidden;
        z-index: 3;
        position: relative;
    }
    .users-dropdown-search-items:focus-within {
        visibility: visible;
    }
    .users-dropdown-search-item:hover {
        background-color: #f5f5f5;
        cursor: pointer;
    }
    .users-dropdown-input{
        cursor: pointer;
    }

.manager-notifications-selected-user {
    text-align: left;
    background-color: unset;
    border: unset;
    border-bottom: 1px solid #ccc;
}
    .manager-notifications-selected-user:last-child{
        border-bottom: none; 
    }

.client-commit {
    color: lightgrey;
    font-size: smaller;
}

.pagination-container {
    position: relative;
    text-align: center;
    left: 50%;
    transform: translateX(-50%);
    background-color: white;
    padding: 10px 15px;
}

.pagination {
    margin: 0;
    padding: 0;
    list-style: none;
    text-align: center;
}

.pagination li {
    display: inline-block;
    margin-right: 5px;
    vertical-align: middle;
}

.pagination li a {
    color: #337ab7;
    padding: 5px 10px;
    text-decoration: none;
    border: 1px solid #ddd;
    border-radius: 3px;
}

.pagination li.disabled a {
    color: #777;
    cursor: not-allowed;
}

.pagination label {
    font-weight: normal;
}

.ellipsis {
    pointer-events: none;
    color: #000;
    border: none !important;
}

.select-label {
    margin-left: 10px;
    vertical-align: middle;
}

.red-label-color {
    color: #DC3545
}

.orange-label-color {
    color: #F89406
}