.mobile-loader {
    width: 100%;
    margin: 60px auto;
    font-size: 20px;
    text-align: center;
}

.no-data-found-table {
    width: 100%;
    margin: 100px auto;
    opacity: .9;
    max-width: 280px;
}

.no-data-found-icon {
    font-size: 80px;
    color: #888888;
}

.no-data-found-text-1 {
    font-size: 30px;
    color: #A81831;
}

.no-data-found-text-2 {
    font-size: 20px;
}

@media (min-width: 600px) {
    .wf-pr-container {
        margin: 0px !important;
    }
    .wf-eq-container {
        margin: 0px !important;
    }
    .wf-el-container {
        margin: 0px !important;
    }
    .timelog-mobile-container {
        margin: 0px !important;
    }
    .cls-timelog-emp{

    }
    .timelog-container-row2{

    }
    .claim-mobile-container {
        margin: 0px auto !important;
    }
}

@media (max-width: 600px) {
    .wf-pr-container {
        margin: 1px auto !important;
    }
    .wf-eq-container {
        margin: 1px auto !important;
    }
    .wf-el-container {
        margin: 1px auto !important;
    }
    .timelog-mobile-container {
        margin: 0px auto !important;
    }
    .cls-timelog-emp{
        min-width: 180px !important;
    }
    .timelog-container-row2{
        
    }
    .claim-mobile-container {
        margin: 175px auto !important;
    } 
}

@media (min-width: 768px) {
    .wf-pr-container {
        margin: 10px 7px auto !important;
    }
    .wf-eq-container {
        margin: 10px 7px auto !important;
    }
    .wf-el-container {
        margin: 10px 7px auto !important;
    }
    .timelog-mobile-container {
        margin: 0px 7px auto !important;
    }
    .cls-timelog-emp{
        min-width: 180px !important;
    }
    .timelog-container-row2{
        
    }
    .claim-mobile-container{
        margin: 7px 15px auto !important;
    } 
}

.no-row-padding {
    padding-left: 0px!important;
    padding-right: 0px!important;
} 

.card__text__heading, .card__sender__heading {
    font-size: 10px;
    text-transform: uppercase;
    color: #B5B5B5;
}

.card {
    z-index: 1;
    position: relative;
    width: 100%;
    height: 160px;
    margin: 8px auto;
    /* margin-bottom: 15px; */
    -webkit-perspective: 2000px;
    perspective: 2000px;
    -webkit-transition: margin 0.4s 0.1s;
    transition: margin 0.4s 0.1s;
}

.card.theme-purple .card__face__colored-side {
    background: #BA68C8;
}

.card.theme-purple .card__face__path {
    background: repeating-linear-gradient(#BA68C8, #BA68C8 3px, transparent 3px, transparent 6px);
    border-color: #BA68C8;
}

.card.theme-purple .card__header {
    background: #BA68C8;
}

.card.theme-purple .card__sender__rating__star {
    color: #BA68C8;
}

.card.theme-purple .card__path-big {
    background: repeating-linear-gradient(#BA68C8, #BA68C8 3px, transparent 3px, transparent 6px);
    border-color: #BA68C8;
}

.card.theme-green .card__face__colored-side {
    background: #52A43A;
}

.card.theme-green .card__face__path {
    background: repeating-linear-gradient(#52A43A, #52A43A 3px, transparent 3px, transparent 6px);
    border-color: #52A43A;
}

.card.theme-green .card__header {
    background: #52A43A;
}

.card.theme-green .card__sender__rating__star {
    color: #52A43A;
}

.card.theme-green .card__path-big {
    background: repeating-linear-gradient(#52A43A, #52A43A 3px, transparent 3px, transparent 6px);
    border-color: #52A43A;
}

.card.theme-orange .card__face__colored-side {
    background: #F7AA17;
}

.card.theme-orange .card__face__path {
    background: repeating-linear-gradient(#F7AA17, #F7AA17 3px, transparent 3px, transparent 6px);
    border-color: #F7AA17;
}

.card.theme-orange .card__header {
    background: #F7AA17;
}

.card.theme-orange .card__sender__rating__star {
    color: #F7AA17;
}

.card.theme-orange .card__path-big {
    background: repeating-linear-gradient(#F7AA17, #F7AA17 3px, transparent 3px, transparent 6px);
    border-color: #F7AA17;
}

.card.theme-red .card__face__colored-side {
    background: #EF5350;
}

.card.theme-red .card__face__path {
    background: repeating-linear-gradient(#EF5350, #EF5350 3px, transparent 3px, transparent 6px);
    border-color: #EF5350;
}

.card.theme-red .card__header {
    background: #EF5350;
}

.card.theme-red .card__sender__rating__star {
    color: #EF5350;
}

.card.theme-red .card__path-big {
    background: repeating-linear-gradient(#EF5350, #EF5350 3px, transparent 3px, transparent 6px);
    border-color: #EF5350;
}

.card__part {
    z-index: 1;
    position: absolute;
    left: 0;
    width: 100%;
    border-radius: 11px;
    -webkit-transform-origin: 50% 0;
    transform-origin: 50% 0;
    -webkit-transform-style: preserve-3d;
    transform-style: preserve-3d;
}

.card__part__side {
    z-index: 1;
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    border-radius: inherit;
    background: #fff;
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
    -webkit-transform-style: preserve-3d;
    transform-style: preserve-3d;
}

.card__part__side.m--back {
    -webkit-transform: rotateX(180deg);
    transform: rotateX(180deg);
}

.card__part__side.m--front {
    background: #fff;
}

.card__part-2 {
    box-shadow: 0px 1px 7px 0px #ccc;
    z-index: 6;
    top: 100%;
    height: 100%;
    -webkit-transform: rotateX(179deg) translateZ(3px);
    transform: rotateX(179deg) translateZ(3px);
    -webkit-transition: border-radius 0.25s, -webkit-transform 0.5s ease-out;
    transition: border-radius 0.25s, -webkit-transform 0.5s ease-out;
    transition: transform 0.5s ease-out, border-radius 0.25s;
    transition: transform 0.5s ease-out, border-radius 0.25s, -webkit-transform 0.5s ease-out;
}

.card__part-2>.m--back {
    overflow: hidden;
    cursor: pointer;
}

.card.flip-step1 .card__part-2 {
    -webkit-transform: translateZ(0);
    transform: translateZ(0);
    border-radius: 0;
}

.card.req-active1 .card__part-2 {
    -webkit-transition: -webkit-transform 0.6s;
    transition: -webkit-transform 0.6s;
    transition: transform 0.6s;
    transition: transform 0.6s, -webkit-transform 0.6s;
    -webkit-transform: translate3d(0, -120px, 0);
    transform: translate3d(0, -120px, 0);
}

.card.req-active2 .card__part-2 {
    -webkit-transition: -webkit-transform 0.6s cubic-bezier(0.61, 0.14, 0.18, 1.52);
    transition: -webkit-transform 0.6s cubic-bezier(0.61, 0.14, 0.18, 1.52);
    transition: transform 0.6s cubic-bezier(0.61, 0.14, 0.18, 1.52);
    transition: transform 0.6s cubic-bezier(0.61, 0.14, 0.18, 1.52), -webkit-transform 0.6s cubic-bezier(0.61, 0.14, 0.18, 1.52);
    -webkit-transform: translate3d(0, 140px, 0);
    transform: translate3d(0, 140px, 0);
}

.card.req-closing1 .card__part-2 {
    -webkit-transition: -webkit-transform 0.5s;
    transition: -webkit-transform 0.5s;
    transition: transform 0.5s;
    transition: transform 0.5s, -webkit-transform 0.5s;
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
}

.card.req-closing2 .card__part-2 {
    -webkit-transition: border-radius, -webkit-transform;
    transition: border-radius, -webkit-transform;
    transition: transform, border-radius;
    transition: transform, border-radius, -webkit-transform;
    -webkit-transition-duration: 0.5s;
    transition-duration: 0.5s;
    -webkit-transform: rotateX(179deg) translateZ(3px);
    transform: rotateX(179deg) translateZ(3px);
    border-radius: 11px;
}

.card__part__inner {
    overflow: hidden;
    position: relative;
    height: 100%;
    border-radius: inherit;
}

.card__face {
    padding: 20px 20px 15px;
}

.card__face:after {
    content: "";
    z-index: 5;
    position: absolute;
    right: 0;
    top: 0;
    width: 20px;
    height: 100%;
    background: -webkit-gradient(linear, left top, right top, from(rgba(255, 255, 255, 0)), color-stop(60%, white), to(white));
    background: linear-gradient(90deg, rgba(255, 255, 255, 0), white 60%, white 100%);
}

.card__face__colored-side {
    z-index: -1;
    position: fixed;
    left: 0;
    top: 0;
    width: 7px;
    height: 100%;
    border-top-left-radius: 11px;
    border-bottom-left-radius: 11px;
    -webkit-transition: width 0.3s;
    transition: width 0.3s;
}

.card__face:hover .card__face__colored-side {
    width: 80px;
}

.card__face__price {
    margin-top: 42px;
    font-weight: normal;
    font-size: 22px;
    color: #555A5F;
    -webkit-transition: color 0.3s;
    transition: color 0.3s;
}

.card__face:hover .card__face__price {
    color: #fff;
}

.card__face__divider {
    position: absolute;
    left: 80px;
    top: 10px;
    width: 1px;
    height: calc(100% - 20px);
    background: #ECECEC;
}

.card__face__path {
    position: absolute;
    left: 95px;
    top: 32px;
    width: 2px;
    height: 23px;
}

.card__face__path:before, .card__face__path:after {
    content: "";
    position: absolute;
    left: -3px;
    width: 8px;
    height: 8px;
    border-radius: 50%;
    border: 2px solid;
    border-color: inherit;
}

.card__face__path:before {
    top: -11px;
}

.card__face__path:after {
    bottom: -9px;
}

.card__face__from-to {
    position: absolute;
    left: 109px;
    top: 18px;
    /* width: 300px; */
    width: 100%;
    /* color: #555A5F; */
    font-size: 13px;
}

.card__face__from-to:before {
    content: "";
    position: absolute;
    left: 0;
    top: 41%;
    width: 100%;
    height: 1px;
    background: #ECECEC;
}

.card__face__from-to p:first-child {
    margin-bottom: 15px;
}

.card__key {
    position: absolute;
    left: 11px;
    top: 16px;
    color: #337ab7;
    text-transform: uppercase;
    font-size: 12px;
    -webkit-transition: color 0.3s;
    transition: color 0.3s;
}

.card__face:hover .card__key .card__rdt__pr p {
    color: #fff;
}

.card__rdt__pr {
    position: absolute;
    left: 11px;
    top: 16px;
    color: #337ab7;
    font-size: 12px;
    -webkit-transition: color 0.3s;
    transition: color 0.3s;
    width: 65px;
}

.card__face:hover .card__rdt__pr {
    color: #fff;
}

.card__rdt__pr:hover {
    color: #fff;
}

.card__face__deliv-date {
    position: absolute;
    left: 15px;
    top: 105px;
    /* color: #9A9E9E; */
    color: #337ab7;
    text-transform: uppercase;
    font-size: 12px;
    -webkit-transition: color 0.3s;
    transition: color 0.3s;
    width: 64px;
}

.card__face__pr-date{
    position: absolute;
    left: 15px;
    top: 90px; 
    color: #337ab7;
    text-transform: uppercase;
    font-size: 12px;
    -webkit-transition: color 0.3s;
    transition: color 0.3s;
    width: 64px;
}

.card__face__leavetype {
    position: absolute;
    left: 96px;
    top: 79px;
    color: #9A9E9E;
    text-transform: uppercase;
    font-size: 12px;
    -webkit-transition: color 0.3s;
    transition: color 0.3s;
}

.card__face__pr_bottom2 {
    position: absolute;
    left: 96px;
    top: 147px;
    color: #9A9E9E;
    text-transform: uppercase;
    font-size: 12px;
    -webkit-transition: color 0.3s;
    transition: color 0.3s;
}

.card__face__deliv-date p {
    /* color: #606568; */
    -webkit-transition: color 0.3s;
    transition: color 0.3s;
}

.card__face:hover .card__face__deliv-date {
    color: rgba(255, 255, 255, 0.8);
} 

.card__face:hover .card__key {
    color: rgba(255, 255, 255, 0.8);
}

.card__face:hover .card__face__deliv-date p {
    color: #fff;
}

.card__face__remarks {

    position: absolute;
    left: 95px;
    top: 87px;
    color: #B5B5B5;
}

.card__face__stats {
    position: absolute;
    top: 105px;
    color: #B5B5B5;
    /* text-transform: uppercase; */
    font-size: 12px;
}

.card__face__stats p {
    font-size: 13px;
    font-weight: bold;
}



.card__face__stats--req {
    left: 97px;
}

.card__face__stats--pledge {
    left: 175px;
}

.card__face__stats--weight {
    left: 253px;
}

.card__face__stats__eq--weight {
    left: 225px;
}

.card__face__stats__pr--weight {
    left: 210px;
}

.card__face__stats--weight p {
    /* text-transform: lowercase; */
}

.card__face__stats__Enq {
    position: absolute;
    top: 110px;
    color: #B5B5B5;
    /* text-transform: uppercase; */
    font-size: 12px;
}

.card__face__stats__Enq--pledge {
    left: 215px;
}

.card_pr {
    height: 170px !important;
}

.card_mr {
    height: 150px !important;
}

.card_po {
    height: 133px !important;
}

.card__face__stats__pr {
    position: absolute;
    top: 107px;
    color: #B5B5B5;
    /* text-transform: uppercase; */
    font-size: 12px;
}

.card__face__stats__po {
    position: absolute;
    top: 90px;
    color: #B5B5B5;
    font-size: 12px;
}
.card__face__stats__p0--pledge {
    left: 170px;
}

.card__face__stats__pr--pledge {
    left: 170px;
}

.card__face__stats__eq {
    position: absolute;
    top: 107px;
    color: #B5B5B5;
    /* text-transform: uppercase; */
    font-size: 12px;
}

.card__face__stats__eq--pledge {
    left: 215px;
}