﻿.prefix_color {
    color:#BEBEBE !important;
}
.wrap-notes {
    word-wrap: break-word;
}

.sending-buttons.green-one {
    width: calc(90% - 2px);
    border: 1px solid #7ac943;
    background-color: #7ac943;
}

    .sending-buttons.green-one.empty {
        color: #7ac943;
        background-color: #fff;
    }

.sending-buttons.red-one {
    width: calc(90% - 2px);
    border: 1px solid #ff1d25;
    background-color: #ff1d25;
}

    .sending-buttons.red-one.empty {
        color: #ff1d25;
        background-color: #fff;
    }

.sending-buttons.gray {
    background-color: #999;
}

.saved-price-block {
    position: absolute;
    right: 0;
    top: 0;
    text-align: center;
    z-index: 5;
}

    .saved-price-block span {
        background-color: #808080;
        padding: 1px 10px;
        color: #fff;
        font-size: 40px;
        font-weight: 100;
        display: block;
    }

.saved-price-block {
    right: 3%;
    top: 10px;
}

.cost-item-price-block {
    position: absolute;
    text-align: center;
    z-index: 5;
    right: -1.5%;
    top: 10px;
    min-width: 100px;
}

    .cost-item-price-block.invoiced-top {
        top: 54px;
    }

    .cost-item-price-block span {
        background-color: #808080;
        padding: 1px 10px;
        color: #fff;
        font-size: 40px;
        font-weight: 100;
        display: block;
    }

* {
    margin: 0;
    padding: 0;
    border: 0;
    outline: 0;
}

@font-face {
    font-family: 'proxima-nova';
    src: url('mark_simonson_-_proxima_nova_regular_0-webfont.eot');
    src: url('mark_simonson_-_proxima_nova_regular_0-webfont.eot?#iefix') format('embedded-opentype'), url('mark_simonson_-_proxima_nova_regular_0-webfont.woff2') format('woff2'), url('mark_simonson_-_proxima_nova_regular_0-webfont.woff') format('woff'), url('mark_simonson_-_proxima_nova_regular_0-webfont.ttf') format('truetype'), url('mark_simonson_-_proxima_nova_regular_0-webfont.svg#proxima_nova_rgregular') format('svg');
    font-weight: 300;
    font-style: normal;
}

@font-face {
    font-family: 'proxima-nova';
    src: url('light-webfont.ttf');
    src: url('light-webfont.ttf') format('truetype');
    font-weight: 200;
    font-style: normal;
}

@font-face {
    font-family: 'proxima-nova-thin';
    src: url('mark_simonson_-_proxima_nova_thin-webfont.ttf');
    src: url('mark_simonson_-_proxima_nova_thin-webfont.ttf') format('truetype');
    font-weight: 100;
    font-style: normal;
}

html, body {
    width: 100%;
    float: left;
    position: relative;
    background-color: #fff;
    font-family: 'proxima-nova', helvetica;
    font-weight: 300;
    font-size: 15px;
    -webkit-font-smoothing: subpixel-antialiased;
}

body.browser-ios {
    font-weight: normal;    
}

a {
    text-decoration: none;
    font-family: 'proxima-nova', helvetica;
}

ul {
    list-style: none;
}

select {
    font-family: 'proxima-nova', helvetica;
    background-color: #fff;
    -webkit-appearance: none;
    -moz-appearance: none;
    -ms-appearance: none;
    appearance: none;
    font-size: 1px;
}

input {
    font-family: 'proxima-nova', helvetica;
    font-size: 15px;
}

textarea {
    font-family: 'proxima-nova', helvetica;
    font-size: 15px;
}

button {
    font-size: 15px;
    font-family: "proxima-nova",sans-serif;
}

img {
    background-color: transparent;
}

i, span {
    background-color: transparent;
}

.global-disable-selecting, .bricks-panel, .schedulable-brick, .markerLabel, .white_content, .retouchable-trigger {
    -webkit-touch-callout: none !important;
    -webkit-user-select: none !important;
    -khtml-user-select: none !important;
    -moz-user-select: none !important;
    -ms-user-select: none !important;
    user-select: none !important;
}

[contentEditable="true"] {
    -webkit-touch-callout: text;
    -webkit-user-select: text;
    -khtml-user-select: text;
    -moz-user-select: text;
    -ms-user-select: text;
    user-select: text;
}

    [contentEditable="true"]:empty:before {
        content: attr(data-phold);
    }

.pos-rel {
    position: relative;
}

.pos-abs {
    position: absolute;
}

.full99line {
    height: 1px;
    float: left;
    background-color: #e6e6e6;
    width: 100%;
}

.full99lineBlack {
    height: 1px;
    float: left;
    background-color: #000000;
    width: 100%;
}

.white-butt, .gray-butt, .orange-butt, .red-butt {
    padding: 9px 40px;
    text-align: center;
    color: #fff;
    border-radius: 5px;
    cursor: pointer;
}

    .orange-butt.tiny {
        padding: 9px 20px;
    }

    .gray-butt.tiny {
        padding-top: 8px !important;
        padding-bottom: 8px !important;
    }

.white-butt {
    background-color: #fff;
    color: #808080;
}

    .white-butt.fontf6 {
        color: #f16522;
    }

.gray-butt {
    background-color: #999999;
}

.orange-butt {
    background-color: #f16522;
}

.red-butt {
    background-color: #ff1d25 !important;
}

.orange-butt.white-o {
    background-color: transparent;
    color: #f16522;
}

    .orange-butt.white-o.ff4 {
        color: #999;
    }

.all-inherit {
    color: inherit;
    font-family: inherit;
    font-size: inherit;
    font-weight: inherit;
    text-decoration: inherit;
}

.gr-br-sec {
    width: 72px;
    height: 30px;
    border: 1px solid #d9d9d9;
    border-radius: 4px;
    position: relative;
    background-color: #fff;
    overflow: hidden;
}

    .gr-br-sec i {
        width: 20px;
        height: 30px;
        background: url('../assests/images/highq/down-arrow.svg') center center no-repeat #fff;
        position: absolute;
        top: 0;
        right: 0;
        pointer-events: none;
    }

    .gr-br-sec select {
        width: 100%;
        height: 30px;
        padding-left: 6px;
        float: left;
        border: none;
        font-size: 15px;
    }

        .gr-br-sec select:disabled {
            background-color: lightgrey;
        }

            .gr-br-sec select:disabled + i {
                background-color: lightgrey;
            }

.wrapall {
    word-wrap: break-word;
}

.full-wrap {
    width: 1024px;
    margin: 0px auto;
    float: none;
}

.full-width {
    width: 100%;
    float: left;
    position: relative;
}

.half-width {
    width: 50% !important;
}

.inner-half {
    width: 48%;
}

.fleft {
    float: left;
}

.fright {
    float: right;
}

.fnone {
    float: left;
}

.dis-block {
    display: block;
}

.dis-iblock {
    display: inline-block;
}

.dis-iflex {
    display: inline-flex;
}

.dis-inline {
    display: inline;
}

.dis-no {
    display: none;
}

.no-padding {
    padding: 0;
}
.no-bottom-padding {
    padding-bottom: 0 !important;
}
.mt11 {
    margin-top: 11px;
}

.mt14 {
    margin-top: 14px;
}

.mt30 {
    margin-top: 30px;
}

.mt40 {
    margin-top: 40px;
}

.mt90 {
    margin-top: 90px;
}

.mt20 {
    margin-top: 20px;
}

.mt25 {
    margin-top: 25px;
}

.ml8 {
    margin-left: 8px;
}

.ml15 {
    margin-left: 15px;
}

.ml28 {
    margin-left: 28px;
}

.ml25 {
    margin-left: 25px;
}

.ml24 {
    margin-left: 24px;
}

.ml34 {
    margin-left: 34px;
}

.ml115 {
    margin-left: 115px;
}

.ml116 {
    margin-left: 116px;
}

.ml117 {
    margin-left: 117px;
}

.ml120 {
    margin-left: 120px;
}

.ml3 {
    margin-left: 3px;
}

.mb12 {
    margin-bottom: 12px;
}

.mb10 {
    margin-bottom: 10px;
}

.mb16 {
    margin-bottom: 16px;
}

.mt16 {
    margin-top: 16px;
}

.mt14 {
    margin-top: 14px;
}

.mb22 {
    margin-bottom: 22px;
}

.mb20 {
    margin-bottom: 20px;
}

.mb30 {
    margin-bottom: 30px;
}

.mr10 {
    margin-right: 10px;
}

.mr8 {
    margin-right: 8px;
}

.mr2 {
    margin-right: 2px;
}
.mr4 {
    margin-right: 4px;
}
.mr5 {
    margin-right: 5px;
}

.mr16 {
    margin-right: 16px;
}

.mr13 {
    margin-right: 13px;
}

.mr20 {
    margin-right: 20px;
}

.mr24 {
    margin-right: 24px;
}

.mr30 {
    margin-right: 30px;
}

.mr35 {
    margin-right: 35px;
}

.mr40 {
    margin-right: 40px;
}

.mb5 {
    margin-bottom: 5px;
}

.mb8 {
    margin-bottom: 8px;
}

.mt5 {
    margin-top: 5px;
}

.mt45 {
    margin-top: 45px;
}

.mt6 {
    margin-top: 6px;
}

.mt7 {
    margin-top: 7px;
}

.mt10 {
    margin-top: 10px;
}

.mt50 {
    margin-top: 50px;
}

.mt80 {
    margin-top: 80px;
}

.mt100 {
    margin-top: 100px;
}

.ml-25 {
    margin-left: -25px;
}

.ml3 {
    margin-left: 3px;
}

.ml12 {
    margin-left: 12px;
}

.ml14 {
    margin-left: 14px;
}

.ml11 {
    margin-left: 11px;
}

.ml10 {
    margin-left: 10px;
}

.ml16 {
    margin-left: 16px;
}

.ml6 {
    margin-left: 6px;
}

.ml60 {
    margin-left: 60px;
}

.ml20 {
    margin-left: 20px;
}

.ml25 {
    margin-left: 25px;
}

.ml30 {
    margin-left: 30px;
}

.mt2 {
    margin-top: 2px;
}

.mt3 {
    margin-top: 3px;
}

.mb3 {
    margin-bottom: 3px;
}

.mt0 {
    margin-top: 0 !important;
}
.pt10 {
    padding-top: 10px;   
}
.annul-pt {
    padding-top: 0 !important;
}

.annul-pb {
    padding-bottom: 0 !important;
}

.mb-4 {
    position: relative;
    bottom: -4px;
}

.mb-9 {
    position: relative;
    bottom: -9px;
}

.mb-14 {
    position: relative;
    bottom: -14px;
}

.mb-2 {
    position: relative;
    bottom: -2px;
}

.mb-3 {
    position: relative;
    bottom: -3px;
}

.mt-2 {
    position: relative;
    top: -2px;
}

.mt-9 {
    position: relative;
    top: -9px;
}

.mt-11 {
    position: relative;
    top: -11px;
}

.v-middle {
    vertical-align: middle;
    position: relative;
    top: -1px;
}

.ph12 {
    padding-top: 12px;
    padding-bottom: 12px;
}

.full-width.vp4p {
    width: 92%;
    padding-left: 4%;
    padding-right: 4%;
}

.min160 {
    min-width: 160px;
    display: inline-block;
}

.min130 {
    min-width: 130px;
    display: inline-block;
}

.min100 {
    min-width: 102px;
    display: inline-block;
}

.min90 {
    min-width: 82px;
    display: inline-block;
}

.purple-sq, .blue-sq, .green-sq, .orange-sq, .red-sq, .gray-sq, .brown-sq, .white-sq, .yellow-sq, .aqua-sq {
    display: block;
    width: 20px;
    height: 10px;
}

.purple-sq {
    background-color: #a5409f;
}

.blue-sq {
    background-color: #3fa9f5;
}

.green-sq {
    background-color: #42be5c;
}

.orange-sq {
    background-color: #f7931e;
}

.red-sq {
    background-color: #ff0000;
}

.gray-sq {
    background-color: #a8a8a8;
}

.brown-sq {
    background-color: #875019;
}

.white-sq {
    background-color: transparent;
}

.yellow-sq {
    background-color: #f7e037;
}

.aqua-sq {
    background-color: #008AE6;
}

.pending-cr, .scheduled-cr, .in-progress-cr, .completed-cr, .cancelled-cr, .gray-cr, .travelling-cr, .on-route-cr, .attention-cr, .on-hold-cr, .orange-cr, .purple-cr, .yellow-cr, .green-cr, .red-cr, .gray-cr, .blue-cr, .aqua-cr, .brown-cr, .white-cr {
    width: 14px;
    height: 14px;
    display: block;
    border-radius: 15px;
}

.status-bubble {
    width: 14px;
    height: 14px;
    display: block;
    border-radius: 15px;
}

.orange-cr {
    background-color: #f9a326;
}

.purple-cr {
    background-color: #be4a9b;
}

.yellow-cr {
    background-color: #f7e037;
}

.green-cr {
    background-color: #9ccd50;
}

.red-cr {
    background-color: #ff2600;
}

.gray-cr {
    background-color: #999999;
}

.blue-cr {
    background-color: #000080;
}

.aqua-cr {
    background-color: #008AE6;
}

.brown-cr {
    background-color: #875019;
}

.white-cr {
    background-color: transparent;
}

.scheduled-cr {
    background-color: #f9a326;
}

.pending-cr {
    background-color: #875019;
}

.in-progress-cr {
    background-color: #be4a9b;
}

.completed-cr {
    background-color: #9ccd50;
}

.cancelled-cr {
    background-color: #ff2600;
}

.gray-cr {
    background-color: #999999;
}

.on-route-cr, .travelling-cr {
    background-color: #008AE6;
}

.attention-cr {
    background-color: #f7e037;
}

.on-hold-cr {
    background-color: #999999;
}

.yell-warning {
    padding-left: 25px;
    background: url('../assests/images/highq/error-pic.svg') left top no-repeat;
}

.red-dang {
    color: #ff0000;
    background: url('../assests/images/highq/red-dang.svg') center right no-repeat;
    padding-right: 20px;
}

.red-dang-reminder{
    color:#ff0000;
    background: url('../assests/images/highq/overdue_reminder_tick.svg') center  no-repeat;
    padding-right: 55px;
}

.red-dang-reminder-font{
    color:#ff0000;
}

#menu-bar ul li {
    position:relative;
}
.red-dang-reminder-menu{
    color:#fff;
    background: url('../assests/images/highq/overdue_reminder.svg') center left  no-repeat;      
    background-size:cover;
    text-align:center;
    width: 19px !important;
    height:18px;
    position:absolute;
    top:3px;
    right:18px;
    margin-right: 5px;
    font-size:10px;
    font-weight: 600;   
    line-height:20px; 
}

.red-dang-stock-menu{
    color:#fff;
    background: url('../assests/images/highq/overdue_reminder.svg') center left  no-repeat;      
    background-size:cover;
    text-align:center;
    width: 19px !important;
    height:18px;
    position:absolute;
    top:7px;
    right:18px;
    margin-right: 5px;
    font-size:10px;
    font-weight: 600;   
    line-height:20px; 
}

.red-dang-work-menu{
    color:#fff;
    background: url('../assests/images/highq/overdue_reminder.svg') center left  no-repeat;      
    background-size:cover;
    text-align:center;
    width: 19px !important;
    height:18px;
    float:right;      
    font-size:10px;
    font-weight: 600;   
    line-height:20px; 
    margin-right:13px;
    margin-top:5px;
}

.red-dang-stock-work-menu{
    color:#fff;
    background: url('../assests/images/highq/overdue_reminder.svg') center left  no-repeat;      
    background-size:cover;
    text-align:center;
    width: 19px !important;
    height:18px;
    float:left;  
    right:18px;
    font-size:10px;
    font-weight: 600;   
    line-height:20px; 
    margin-top:-11px;
    margin-left:-20px;
}
.red-dang-reminder-menu-3{
    width: 21px !important;
    height:20px;  
    line-height:22px; 
}
.red-dang-reminder-menu-4{
    width: 26px !important;
    height:25px;  
    line-height:27px; 
    font-size:9px;
    top:0px;
    right:14px;
}
#menu-bar ul li:hover .red-dang-reminder-menu{
    right:17px;
}
#menu-bar ul li:hover .red-dang-stock-work-menu{
    right:17px;
}
#menu-bar ul li:hover .red-dang-stock-menu{
    right:17px;
}
#menu-bar ul li:hover .red-dang-reminder-menu-3{
    right:17px;    
}
#menu-bar ul li:hover .red-dang-reminder-menu-4{
    top:0px;
    right:13px;
}
.red-dang.rdl {
    color: #000;
    background-position: center left;
    padding-left: 20px;
}

.re-button {
    width: 15px;
    height: 18px;
    background: url('../assests/images/highq/re-icon.svg') center center no-repeat;
}

.x-butt {
    width: 21px;
    height: 21px;
    background: url('../assests/images/highq/x-icon.svg') center center no-repeat;
    cursor: pointer;
}

.minus-icon {
    width: 15px;
    height: 15px;
    background: url('../assests/images/highq/minus-icon.svg') center center no-repeat;
    position: absolute;
    top: 50%;
    margin-top: -7px;
    margin-left: 5px;
}

.plus-icon {
    width: 15px;
    height: 15px;
    background: url('../assests/images/highq/plus-icon.svg') center center no-repeat;
    position: absolute;
    top: 50%;
    margin-top: -7px;
    margin-left: 5px;
}

    .plus-icon.static {
        position: relative;
        display: inline-block;
        margin-top: 0;
        margin-bottom: -2px;
    }

.minus-icon.ftable {
    position: absolute;
    top: 50%;
    right: 4px;
    margin-top: -9px;
}

.bordered {
    border-top-left-radius: 6px;
    border-top-right-radius: 6px;
}

.width60 {
    width: 60px;
}

.width54 {
    width: 54px;
}

.font-upper {
    text-transform: uppercase;
}

.font-bold {
    font-weight: 600;
}

.font-semi-bold {
    font-weight: 500;
}

.font-400 {
    font-weight: 400;
}

.font-thin {
    font-weight: 100;
}

.font80 {
    color: #808080;
}

.font88 {
    color: #888888;
}

.font4d {
    color: #4d4d4d;
}

.font00 {
    color: #000000;
}

.font66 {
    color: #666666;
}

.fontf6 {
    color: #f16522;
}

.font-ok {
    color: #51ef56;
}

.fontb3 {
    color: #b3b3b3;
}

.fontd3 {
    color: #d3d3d3;
}

.fontff {
    color: #ff0000;
}

.font99 {
    color: #999;
}

.fontwh {
    color: #fff;
}

.center-text {
    text-align: center;
}

.right-text {
    text-align: right;
}

.left-text {
    text-align: left !important;
}

.justify-text {
    text-align: justify;
}

.italic {
    font-style: italic;
}

.font15 {
    font-size: 15px;
}

.font14 {
    font-size: 15px;
}

.font14s {
    font-size: 14px;
}

.font13 {
    font-size: 13px;
}

.font12 {
    font-size: 12px;
}

.font11 {
    font-size: 11px;
}

.font10 {
    font-size: 10px;
}

.font17 {
    font-size: 17px;
}

.font16 {
    font-size: 15px;
}

.font16s {
    font-size: 16px;
}

.font18 {
    font-size: 18px;
}

.font20 {
    font-size: 20px;
}

.font22 {
    font-size: 22px;
}

.font25 {
    font-size: 25px;
}

.font31 {
    font-size: 31px;
}

.font35 {
    font-size: 35px;
}

.font28 {
    font-size: 28px;
}

.font77 {
    font-size: 77px;
    line-height: 64px;
}

.font-initial {
    font-size: initial;
}

.big-fp {
    font-size: 28px;
    color: #4d4d4d;
}

.fontf0 {
    color: #ff0000;
}

.font-italic {
    font-style: italic;
}

.font-normal {
    font-weight: 300;
}

.lh19 {
    line-height: 21px;
}

.font-proxima {
    font-family: 'proxima-nova', helvetica;
}

.actual-h2 {
    font-size: 25px;
    color: #4d4d4d;
    font-weight: 300;
}

input.actual-h2 {
    font-size: 22px;
}

.little-big-font {
    font-size: 30px;
    font-weight: 300;
    color: #4d4d4d;
}

#header {
    background-color: #f2f2f2;
    padding: 0px 0 5px 0px;
    height: 55px;
}

#logo {
    margin-left: 20px;
    display: block;
    margin-top: 7px;
}

    #logo img {
        float: left;
        height: auto;
        width: 200px;
        margin-top: 3px;
    }

    #logo div {
        font-size: 20px;
        color: #4d4d4d;
        font-family: 'proxima-nova', helvetica;
        margin-top: 9px;
        margin-left: 36px;
        float: left;
    }

#top-q-mark {
    width: 100px;
    height: 24px;
    display: block;
    margin-top: 0px;
    padding-top: 17px;
    margin-right: 0px;
    padding-right: 50px;
    float: right;
    position: relative;
    top: 0px;
    text-align: right;
}

    #top-q-mark > a {
        width: 100px;
        height: 24px;
        background: url('../assests/images/highq/q-mark.svg') center center no-repeat;
        display: block;
        position: relative;
        z-index: 10010 !important;
    }

    #top-q-mark:hover a {
        background-image: url('../assests/images/highq/q-mark-white.svg');
    }

    #top-q-mark:hover .black-upper-dropdowns {
        display: block;
    }

.user-tr {
    margin-right: 0px;
    padding-right: 30px;
    color: #666;
    font-size: 15px;
    margin-top: 0px;
    padding-top: 7px;
    position: relative;
    top: 0px;
}

    .user-tr > .just-tr-inner {
        padding-right: 20px;
        background: url('../assests/images/highq/down-arrow.svg') right center no-repeat;
        float: left;
        position: relative;
        z-index: 10010 !important;
        cursor: pointer;
    }

    .user-tr .just-tr-inner img {
        border-radius: 50% !important;
        width: 45px;
        height: 45px;
    }

    .user-tr:hover > .just-tr-inner {
        background-image: url('../assests/images/highq/white-arrow-top.svg');
    }

    .user-tr > .just-tr-inner > div.fright a {
        color: #333;
    }

    .user-tr > .just-tr-inner > div.fright {
        margin-right: 12px;
        margin-top: 6px;
    }

        .user-tr > .just-tr-inner > div.fright > a:first-child {
            font-size: 15px;
        }

        .user-tr > .just-tr-inner > div.fright > a:last-child {
            font-size: 13px;
        }

    .user-tr:hover > .just-tr-inner > div.fright a {
        color: #fff;
    }

    .user-tr:hover > .black-upper-dropdowns {
        display: block;
    }

#under-main {
    background-color: #4d4d4d;
}

#menu-bar {
    background-color: #4d4d4d;
    width: 96px;    
}

    #menu-bar:after {
        content: ' ';
        width: 96px;
        position: fixed;
        top: 0;
        bottom: 0;
        left: 0;
        background: #4d4d4d;
        z-index: -1;
    }

.menu-switch {
    float: left;
    display: block;
    height: 35px;
    width: 37px;
    background: transparent;
    background: url('../assests/images/highq/hamburger-menu-gray.svg') center center no-repeat #4d4d4d;
    background-size: 70%;
    display: none;
}

#menu-bar li {
    width: 100%;
    float: left;
}

    #menu-bar li a {
        display: block;
        width: 90%;
        text-align: center;
        color: #e6e6e6;
        padding-top: 12px;
        padding-bottom: 12px;
        font-size: 15px;
        margin-left: 5%;
        margin-right: 5%;
    }

    #menu-bar .separator {
        margin-top: 40px;
    }

        #menu-bar .separator a {
            border-top: 2px solid #808080;
        }

    #menu-bar li:hover:not(.app-version), #menu-bar li.active {
        background-color: #808080;
    }

    #menu-bar li:hover:not(.app-version), #menu-bar li .active {
        background-color: #808080;
        width: 95px !important;
        margin-left: 0px !important;
    }

    #menu-bar li a img {
        display: inline-block;
        max-width: 100%;
    }

    #menu-bar li a span {
        display: block;
        width: 100%;
    }

#main-page {
    width: calc(100% - 96px);
    background-color: #fff;
    padding-bottom: 350px;
}

    #main-page.fleft.full-width {
        width: 100%;
    }

.login-halfs-wrapper {
    width: 750px;
    margin: 0px auto;
}

.login-halfs {
    width: calc(40% - 2px);
    border: 1px solid #b3b3b3;
    margin: 0 auto;
    border-radius: 8px;
    padding: 40px 4%;
    height: 350px;
}

#top-menu-site {
    height: 35px;
}

#top-menu-site li.menu-site-li {
    float: left;
    display: block;
    height: 35px;
    background-color: #f16522;
}

#top-menu-site li.menu-site-li a {
    display: block;
    font-size: 15px;
    padding: 10px 30px 7px;
    color: #fff;
}


#top-menu-site li.menu-site-li a:hover, #top-menu-site li.menu-site-li a.active {
    background-color: #4d4d4d;
    color: #fff;
}

#top-menu {
    background-color: #f16522;
    
}

#top-menu li {
    float: left;
    display: block;
    height: 35px;
}

#top-menu li a {
    display: block;
    margin: 5px 5px 0;
    font-size: 15px;
    padding: 6px 30px 7px;
    color: #fff;
}

        #top-menu li:first-child a {
            margin-left: 60px;
        }

#top-menu li a:hover, #top-menu li a.active {
    background-color: #fff;
    color: #f16522;
}

.addit-menu, .addit-menu-1 {
    width: 190px;
    margin-left: 26px;
}

    .addit-menu h2 {
        padding-left: 24px;
        margin-left: 20px;
        background: url('../assests/images/highq/head-left-arrow.svg') left center no-repeat;
    }

    .addit-menu-1 h2 {
        padding-left: 24px;
        margin-left: 20px;
    }

    .addit-menu li, .addit-menu-1 li, .custom-popup-menu li {
        width: 100%;
        float: left;
    }

        .addit-menu li a, .addit-menu-1 li a, .custom-popup-menu li a {
            display: block;
            border-bottom: 1px solid #e6e6e6;
            padding: 12px 0 12px 10px;
            color: #000;
        }

        .custom-popup-menu li a {
            padding-right: 10px;
        }

        .addit-menu li:first-child a, .addit-menu-1 li:first-child a, .custom-popup-menu li:first-child a {
            margin-top: 14px;
            border-top: 1px solid #e6e6e6;
        }

        .addit-menu li a:hover, .addit-menu li a.active, .addit-menu-1 li a:hover, .addit-menu-1 li a.active {
            background-color: #e6e6e6;
        }

        .custom-popup-menu li a:hover, .custom-popup-menu li a.active {
            background-color: #808080;
            border-color: #808080;
            color: #fff;
        }

.main-min {
    width: 600px;
}

    .main-min.bigger {
        width: 800px;
    }

.thead {
    border-bottom: 1px solid #999999;
    padding-bottom: 4px;
}

.tbody {
    border-bottom: 1px solid #e6e6e6;
    padding: 10px 0;
}

.w37 {
    width: 37%;
}

.w36 {
    width: 36%;
}

.w40 {
    width: 40%;
}

.w55 {
    width: 55%;
}

.w100{/*1 elm width*/
    width: 100%;
}
.w50 {/*2 elm width*/
    width: 50%;
}
.w33 {/*3 elm width*/
    width: 33%;
}
.w25 {/*4 elm width*/
    width: 24.5%;
}
.w20 {/*5 elm width*/
    width: 19.5%;
}
.w16 {/*6 elm width*/
    width: 16%;
}

.w65 {
    width: 64%;
}
.w75 {
    width: 75%;
}
.w57 {
    width: 57%;
}
.w76 {
    width: 76%;
}
.w35 {
    width: 34%;
}

.w30 {
    width: 30%;
}

.w27 {
    width: 27%;
}

.w21 {
    width: 21%;
}

.w18 {
    width: 18%;
}

.w19 {
    width: 19%;
}

.w17 {
    width: 17%;
}

.w15 {
    width: 15%;
}

.w12 {
    width: 12%;
}
.w10 {
    width: 10%;
}
.w7 {
    width: 7%;
}

.w30 {
    width: 31.3%;
    padding-right: 2%;
}

.customer-nvc .tbody, .customer-nvc-sub .tbody {
    padding: 18px 0;
}

.customer-nvc .thead, .customer-nvc-sub .thead {
    padding-bottom: 8px;
}

.customer-nvc .w37 {
    width: 34%;
}

.customer-nvc .w15 {
    width: 18%;
}

.customer-nvc-sub .w37 {
    width: 32%;
}

.customer-nvc-sub .w21 {
    width: 26%;
}

.pound-symbol {
    position: relative;   
}

    .pound-symbol:after {
        content: "£";
        color: #333;
        position: absolute;
        top: 1px;
        bottom: 1px;
        left: 1px;
        background-color: #fff;
        border-radius: 4px;
        font-size: 15px;
        font-weight: 600;
        padding: 4px 8px 0 8px;
        pointer-events: none;
    }

    .pound-symbol input {
        padding-left: 26px !important;
    }

.add-button {
    width: calc(94% - 2px);
    margin: 20px 3% 0 3%;
    border: 1px solid #cccccc;
    border-radius: 6px;
    background-color: #e6e6e6;
    font-weight: 600;
    padding: 10px 0;
    cursor: pointer;
}

    .add-button.full {
        width: 100%;
        margin: 14px 0 0 0;
    }

.total {
    background-color: #808080;
    color: #fff;
    padding: 6px 30px;
    font-size: 34px;
}

    .total span {
        font-size: 18px;
        position: relative;
        top: -5px;
        margin-right: 5px;
    }

.nvc-drop {
    background: url('../assests/images/highq/white-arrow-down.svg') center right 20px no-repeat #f16522;
    color: #fff;
    border-radius: 6px;
    cursor: pointer;
}

    .nvc-drop.active {
        background-image: url('../assests/images/highq/white-arrow-top.svg');
    }

.invoice-dropable {
    width: calc(94% - 2px);
    border: 1px solid #b3b3b3;
    border-top: none;
    border-radius: 0 0 6px 6px;
    padding: 20px 3%;
    position: relative;
    top: -4px;
}

.down-arrow {
    padding-right: 17px;
    background: url('../assests/images/down-arrow.png') no-repeat 98% 50%;
}

.top-bott-arr {
    padding-right: 17px;
    background: url('../assests/images/highq/top-down-arrow.svg') right center no-repeat;
}

    .top-bott-arr.loopd {
        background: url('../assests/images/highq/search-loop.svg') right center no-repeat;
    }

    .top-bott-arr.orange {
        background-image: url('../assests/images/highq/top-bott-orange.svg');
    }

.calendar-field {
    background: url('../assests/images/highq/calendar-icon.svg') right center no-repeat;
}

.red-left-arrow {
    background: url('../assests/images/highq/red-arrow.svg') left center no-repeat;
    padding-left: 14px;
}



.looped-field {
    background: url('../assests/images/highq/search-loop.svg') right 14px center no-repeat;
    width: calc(95% - 14px) !important;
    margin-left: 2.5%;
    margin-right: 2.5%;
    margin-top: 10px;
    margin-bottom: 10px;
}

    .looped-field.makeme-fully {
        width: calc(100% - 52px) !important;
        padding-right: 40px;
        padding-left: 10px;
        margin-left: 0;
        margin-right: 0;
    }

.search-container {
    display: inline-block;
    position: relative;
    overflow: hidden;
}

    .search-container .search-btn {
        position: absolute;
        top: 7px;
        right: 8px;
        cursor: pointer;
    }

    .search-container .looped-field {
        background: none;
    }

.gr-br-field {
    border: 1px solid #d9d9d9;
    /*overflow:hidden;*/
    border-radius: 4px;
    height: 34px;
    width: 140px;
    padding-left: 5px;
    padding-right: 5px;
}

.gr-br-field-con {
    border: 1px solid #d9d9d9;
    /*overflow:hidden;*/
    border-radius: 4px;
    height: 34px;
    width: 140px;
    padding-left: 5px;
    padding-right: 5px;
}
.gr-br-field-con-sel {
    border: 1px solid #d9d9d9;
    /*overflow:hidden;*/
    border-radius: 4px;
    height: 34px;
    width: 140px;
    padding-left: 5px;
    padding-right: 5px;
}

    .gr-br-field.post_billing_quote_time {
        border: none;
    }

    .gr-br-field.post_billing_customer_number {
        border: none;
    }
    .gr-br-field#category-template-name {
        width: 30%;
    }
    .gr-br-field#new-category-name {
        width: 96%;
    }
input[type="text"].gr-br-field {
    padding-left: 9px;
    padding-right: 9px;
}

input[type="text"].gr-br-field-con {
    padding-left: 9px;
    padding-right: 9px;
}

input[type="text"].gr-br-field-con-sel {
    padding-left: 9px;
    padding-right: 9px;
}


.gr-br-field.is-full {
    width: calc(100% - 12px);
}

.gr-br-field.smally {
    height: 28px;
    border-width: 1px;
    font-weight: 600;
}

.gr-br-field.top-bott-arr {
    background-position: center right 10px;
}

textarea.gr-br-field {
    padding-top: 6px;
    padding-bottom: 6px;
}

.gr-br-field-con.smally {
    height: 28px;
    border-width: 1px;
    font-weight: 600;
}

.gr-br-field-con.top-bott-arr {
    background-position: center right 10px;
}

textarea.gr-br-field-con {
    padding-top: 6px;
    padding-bottom: 6px;
}


.gr-br-field-con-sel.smally {
    height: 28px;
    border-width: 1px;
    font-weight: 600;
}

.gr-br-field-con-sel.top-bott-arr {
    background-position: center right 10px;
}

textarea.gr-br-field-con-sel {
    padding-top: 6px;
    padding-bottom: 6px;
}

.invoice-dropable .gr-br-sec {
    border-width: 1px;
    border-color: #e6e6e6;
    display: inline-block;
    width: 90px;
}

.top-min {
    position: relative;
    top: -10px;
}

.top-min-less {
    position: relative;
    top: -3px;
}

.add-file {
    height: 36px;
    padding: 5px 26px 5px 50px;
    background: url('../assests/images/highq/right-plus.svg') center left 4px no-repeat #f16522;
    color: #fff;
    display: block;
    border-radius: 6px;
    cursor: pointer;
}
.add-file#import-csv-btn {
    display: inline-block;
}
.spec-note {
    width: calc(96% - 2px);
    border: 1px solid #d9d9d9;
    padding: 10px 2%;
    border-radius: 6px;
}

.adv-popup, .adv-popup-con,.adv-popup-con-sel, .adv-big-popup {
    width: 302px;
    position: absolute;
    top: calc(100% + 2px);
    left: 0;
    border: 1px solid #d9d9d9;
    border-radius: 5px;
    background-color: #fff;
    z-index: 12;
    padding-bottom: 10px;
}

    .adv-big-popup.bit-small {
        width: 505px;
    }

.adv-big-popup {
    padding: 10px 14px;
    width: 580px;
}

.adv-popup.template-dropdown, .adv-popup.customer-dropdown, .adv-popup-con.template-dropdown, .adv-popup-con.customer-dropdown, .adv-popup-con-sel.template-dropdown, .adv-popup-con-sel.customer-dropdown {
    width: 308px;
}

.adv-popup.service-item-dropdown, .adv-popup-con.service-item-dropdown, .adv-popup-con-sel.service-item-dropdown {
    width: 273px;
}

.gr-br-field.cost_item {
    width: calc(100% - 20px);
}

.pop-inner {
    width: 92%;
    float: left;
    padding: 6px 4%;
    cursor: default;
}

    .pop-inner .italic {
        font-weight: 600;
        font-size: 12px;
    }

    .pop-inner:hover {
        background-color: #808080;
        color: #fff;
    }

.see-map {
    background: url('../assests/images/highq/gray-pointer.svg') left center no-repeat;
    padding-left: 19px;
    min-height: 19px;
    position: relative;
    float: right;
    top: -90px;
}

.popup-shadow {
    width: 100%;
    height: 100%;
    position: fixed;
    background-color: rgba(0,0,0,0.6);
    top: 0;
    left: 0;
    z-index: 10020;
}

.main-popup-in {
    width: 94%;
    padding: 14px 3%;
    float: left;
}

    .main-popup-in.sosmall {
        width: 90%;
        padding: 14px 5%;
    }

.main-popup-biggin {
    width: 86%;
    padding: 22px 7%;
    float: left;
}

.main-popup {
    width: 560px;
    height: auto;
    position: absolute;
    top: 100px;
    left: 50%;
    margin-left: -280px;
    background-color: #fff;
    z-index: 10025;
    border-radius: 5px;
    overflow: hidden;
    padding-bottom: 15px;
}

    .main-popup.bit-big {
        width: 570px;
        margin-left: -285px;
        overflow: visible;
    }

    .main-popup.bit-small {
        width: 512px;
        margin-left: -256px;
    }

.objs-wrapper {
    width: 80%;
    padding: 0 10%;
    float: left;
}

.main-popup.so-small {
    width: 440px;
    margin-left: -220px;
}

.main-popup.very-small {
    width: 300px;
    margin-left: -150px;
}

.login-popup {
    width: 300px;
    padding: 30px 30px;
    background-color: #fff;
    border: 1px solid #b3b3b3;
    border-radius: 5px;
    position: absolute;
    top: 120px;
    left: 50%;
    margin-left: -181px;
    z-index: 10021;
}

.main-popup .w21, .main-popup .w15 { /*text-align:right*/
}

    .main-popup .w21 div, .main-popup .w15 div {
        margin-right: 10px;
    }

.main-popup .tips {
    background-color: #e6e6e6;
    padding: 4px 2%;
    width: 96%;
    font-size: 13px;
}

.main-popup-foot {
    background-color: #333333;
}

.main-popup-head {
    background-color: #f2f2f2;
}

.job-list-wrap {
    width: 1190px;
    float: left;
    margin-left: 30px;
}

.job-list-anchors {
    width: 100%;
    float: left;
}

    .job-list-anchors.full {
        margin-left: 0;
        margin-right: 0;
        width: 100%;
    }

.job-per-anchor {
    padding: 6px 8px;
    border-radius: 6px;
    margin-right: 5px;
}

.job-list-anchors.full .job-per-anchor {
    padding: 8px 8px;
    border-radius: 6px;
    margin-right: 16px;
    margin-bottom: 8px;
}

.job-per-anchor:hover, .job-per-anchor.active {
    box-shadow: 0 0 0 1px #e6e6e6;
}

.job-search-tools {
    width: 98%;
    padding: 8px 1% 8px 1%;
    background-color: #e6e6e6;
    height: 35px;
}

    .job-search-tools .gray-butt {
        padding: 8px 32px;
        height: 35px;
    }

    .job-search-tools .add-file {
        padding-top: 8px;
        padding-bottom: 8px;
        height: 35px;
    }

    .job-search-tools .looped-field {
        margin: 0;
        background-color: #fff;
        border-color: #cccccc;
        height: 33px;
        width: 220px !important;
    }

.jw-table {
    font-size: 15px;
    width: 98%;
    padding: 10px 1%;
    border-top: 1px solid #dcdede;
}

.job-status-list-item {
    width: 71%;
    padding: 10px 1%;
}

    .job-status-list-item .status-container {
        width: 85%;
    }

        .job-status-list-item .status-container .status-circle {
            height: 13px;
            width: 13px;
            border-radius: 15px;
        }

            .job-status-list-item .status-container .status-circle:hover {
                cursor: pointer;
            }
            .status-circle .status-color-picker {
                width: 100%;
                height: 100%;
                opacity: 0;
                cursor: pointer;
            }

        .job-status-list-item .status-container .gr-br-field {
            width: 75%;
        }
        .job-status-list-item .status-container .status-description {
            font-size: 12px;
            padding-right: 14%;
            float: right;
            padding-top: 3px;
        }
        
    .retouchable-area .job-status-list-item:hover {
        background-color: #EBEFEE;
    }
    .save-job-statuses {
        padding-right: 25%;
        padding-top: 5px;
    }
.jheading {
    border-top: none;
    font-size: 13px;
}

.jw-table:not(.jheading) {
    font-size: 15px;
}

    .jw-table:not(.jheading):hover {
        background-color: #ebf0ef;
    }

.jw2-1, .jw2-2, .jw2-3, .jw2-4, .jw2-5, .jw2-6, .jw2-7, .jw2-8, .jw2-9 {
    padding-left: 0.3%;
    padding-right: 0.3%;
}

.jw1 {
    width: 4%;
}

.jw2 {
    width: 96%;
}

.jw2-1 {
    width: 12%;
}

.jw2-2 {
    width: 3%;
}

.jw2-3 {
    width: 8%;
}

.jw2-4 {
    width: 8%;
}

.jw2-5 {
    width: 15%;
}

.jw2-6 {
    width: 15%;
}

.jw2-7 {
    width: 14%;
}

.jw2-8 {
    width: 12%;
}

.jw2-9 {
    width: 7%;
}

    .jw2-9.cus-job {
        width: 6%;
    }

.jw2-1.cus-job {
    width: 21.8%;
}

.jw2-300 {
    width: 32%;
}

.jw9 .orange-butt {
    padding-left: 0;
    padding-right: 0;
    width: 100%;
}

.jws-10 {
    width: 10%;
    height: 100%;
}

.jws-25 {
    width: 26%;
    padding-right: 1%;
    height: 100%;
}

.jws-24 {
    width: 24%;
    padding-right: 1%;
    height: 100%;
}

.jws-30 {
    width: 34%;
    padding-right: 1%;
    height: 100%;
}

.jws-45 {
    width: 44%;
    padding-right: 4%;
    height: 100%;
}

.jws-75 {
    width: 70%;
    padding-right: 1%;
    height: 100%;
}

.jws-24.right-moveme {
    padding-right: 4%;
}

.right-moveme {
    min-height: 20px;
}

.jw-table:hover .right-moveme {
    background: url('../assests/images/highq/movement-cross.svg') right center no-repeat;
}

.trspr-dropdown {
    width: 80px;
    height: 24px;
    display: inline-block;
    position: relative;
}

    .trspr-dropdown.fontf6 select {
        color: #f16522;
    }

    .trspr-dropdown select {
        font-size: 15px;
        width: 100%;
        height: 24px;
        -moz-appearance: none;
        -webkit-appearance: none;
        -o-appearance: none;
        -ms-appearance: none;
        appearance: none;
        padding-top: 2px;
    }

    .trspr-dropdown i {
        width: 18px;
        height: 24px;
        background: url('../assests/images/highq/top-bott-orange.svg') center center no-repeat #fff;
        position: absolute;
        top: 0;
        right: 0;
        z-index: 10;
    }

.sec-menu-additional {
    display: none;
    margin-top: 5px;
}

.status-popup {
    display: block;
    width: 280px;
    float: left;
    position: relative;
    display: none;
}

    .status-popup.for-scheduler {
        display: block;
        border: none;
        width: 100%;
        padding: 0;
        margin-bottom: 0;
    }

    .status-popup .anchor {
        border: 1px solid #f6f6f6;
        background: url('../assests/images/highq/down-arrow.svg') center right 14px no-repeat #fff;
        border-radius: 6px;
        float: left;
    }

    .status-popup.for-scheduler .anchor {
        border: 0;
    }
    
    .status-popup .item-inner {
        padding: 8px 4%;
        width: 92%;
        float: left;
        cursor: pointer;
    }
    .status-popup .priority {
        width: 65%;
    }
    .status-popup.for-scheduler .item-inner {
        width: 100%;
        padding: 0;
    }

.dropdown-items {
    border: 1px solid #f6f6f6;
    width: 100%;
    margin-top: 2px;
    border-radius: 6px;
    position: absolute;
    top: calc(100% + 4px);
    left: 0;
    display: none;
    background-color: #fff;
    z-index: 14;
}

.status-popup.for-scheduler .dropdown-items .item-inner {
    padding: 4px 4%;
    width: 92%;
}

.letdrop {
    width: 92%;
    margin-left: 4%;
    margin-right: 4%;
    float: left;
    height: 1px;
    background-color: #f6f6f6;
}

.then-half {
    width: 100%;
    float: left;
}

    .then-half.none {
        display: none;
    }

.very-small-font {
    font-size: 11px;
}

.nonenone {
    display: none;
}

.jw2-9 .orange-butt {
    padding-left: 0;
    padding-right: 0;
    width: 100%;
}

.popup-buttons {
    padding: 6px;
    background-color: #f16522;
    display: inline-block;
    margin: 6px;
    color: #fff;
    font-size: 15px;
    border-radius: 5px;
    min-width: 120px;
    min-height: 24px;
}

    .popup-buttons.green {
        background-color: #39b54a;
    }

    .popup-buttons span {
        position: relative;
        bottom: -3px;
    }

    .popup-buttons.no-mar {
        margin: 0;
    }

input[type="submit"].popup-buttons {
    padding: 9px;
    margin: 0;
}

.sending-buttons {
    width: 90%;
    margin: 8px 0 0 5%;
    float: left;
    background-color: #f16522;
    text-align: center;
    color: #fff;
    font-size: 15px;
    font-family: 'proxima-nova', helvetica;
    padding: 6px 0;
    border-radius: 5px;
}

    .sending-buttons.gray {
        background-color: #999;
    }

.clean-plus {
    width: 24px;
    height: 24px;
    background: url('../assests/images/highq/clean-plus.svg') center center no-repeat;
    display: inline-block;
    float: left;
    margin-left: 14px;
}

.accepted-icon-white {
    width: 24px;
    height: 24px;
    display: inline-block;
    background: url('../assests/images/button-accepted.png') center center no-repeat;
    float: left;
    margin-left: 14px;
}

.rejected-icon-white {
    width: 24px;
    height: 24px;
    display: inline-block;
    background: url('../assests/images/button-rejected.png') center center no-repeat;
    float: left;
    margin-left: 14px;
}

.check-marker {
    width: 21px;
    height: 21px;
    background: url('../assests/images/highq/check-marker.svg') center center no-repeat;
    display: inline-block;
}

.check-note {
    cursor: pointer;
}

    .check-note .check-marker {
        display: none;
    }

    .check-note.active .check-marker {
        width: 18px;
        height: 18px;
        background-size: 100% 100%;
        position: absolute;
        bottom: 0;
        right: -25px;
        display: inline-block;
    }

.edited-objects {
    float: none;
    display: inline-block;
    width: 100px;
    margin-right: 10px !important;
}

.editable-obj, .edited-objects {
    position: relative;
}

    .editable-obj .check-marker, .edited-objects .check-marker {
        position: absolute;
        top: 5px;
        right: 7px;
        display: none;
        cursor: pointer;
        z-index: 12;
    }

    .editable-obj.dimed.let-edit .check-marker {
        display: block;
    }

    .edited-objects .check-marker {
        display: block;
        background: url('../assests/images/highq/white-x.svg') center center no-repeat #999;
        border-radius: 10px;
    }

.photo_detail {
    width: 100px;
    float: left;
    margin-right: 10px;
    height: 120px;
    margin-bottom: 20px;
    overflow: hidden;
}

.photo_img_content {
    height: 100px;
    overflow: hidden;
    text-align: center;
    background-size: cover;
    background-position: 50% 0% !important;
    background-repeat: no-repeat;
    width: 100px;
}

    .photo_img_content img {
        max-width: 100px;
        max-height: 100px;
        display: none;
    }

.content-file-one {
    width: 300px !important;
    max-height: 300px !important;
    text-align: center !important;
}

    .content-file-one .photo_img_content {
        width: 300px !important;
        max-height: 300px !important;
        height: 200px !important;
        overflow: visible;
        text-align: center;
        background-size: contain;
        background-position: 50% 0% !important;
        text-align: center !important;
    }

        .content-file-one .photo_img_content img {
            max-width: 300px !important;
            max-height: 300px !important;
        }

.clean-download {
    width: 19px;
    height: 22px;
    background: url('../assests/images/highq/clean-download.svg') center center no-repeat;
    display: inline-block;
    float: left;
    margin-left: 14px;
    position: relative;
    bottom: -1px;
}

.clean-upload {
    width: 18px;
    height: 23px;
    background: url('../assests/images/highq/clean-upload.svg') center center no-repeat;
    display: inline-block;
    float: left;
    margin-left: 14px;
}

.clean-send {
    width: 30px;
    height: 24px;
    background: url('../assests/images/highq/clean-send.svg') center bottom no-repeat;
    display: inline-block;
    float: left;
    margin-left: 14px;
    position: relative;
    bottom: -2px;
}

.little-top {
    display: inline-block;
    position: relative;
    bottom: -3px;
    float: left;
    margin-left: 14px;
}

    .little-top.ml24 {
        margin-left: 24px;
    }

    .little-top.fnope {
        margin-left: 6px;
    }

        .little-top.fnope.ml24 {
            margin-left: 17px;
        }

.sending-buttons.empty {
    text-align: center;
    padding: 9px 0;
}

    .sending-buttons.empty .little-top {
        float: none;
        bottom: 0;
        margin-left: 0;
    }

.buttons-separator-line {
    width: 90%;
    margin-left: 5%;
    height: 1px;
    background-color: #bcbcbc;
    float: left;
    margin-top: 14px;
    margin-bottom: 6px;
}

    .buttons-separator-line.bold {
        height: 1px;
        margin-left: 0;
        margin-right: 0;
        width: 100%;
    }

.bold-border-text {
    height: auto !important;
}

.bold-border-textarea {
    border: 1px solid #bcbcbc;
    border-radius: 4px;
    width: calc(96% - 4px);
    padding: 8px 2%;
    height: 60px;
}

    .bold-border-textarea.fleft.dis-block.mt5 {
        width: 96%;
        margin-left: 0px;
    }

    .bold-border-textarea.tiny {
        border-width: 1px;
        width: calc(96% - 2px);
        border-color: #ccc;
    }

.right-slide-out {
    width: 200px;
    position: fixed;
    right: -200px;
    top: 88px;
    background: #f2f2f2;
    padding-bottom: 12px;
    padding-top: 4px;
    border-bottom-left-radius: 8px;
}

#right-plus {
    width: 35px;
    height: 36px;
    background: url('../assests/images/right-plus.png') center right 16px no-repeat #f2f2f2;
    position: fixed;
    right: 0;
    top: 120px;
    z-index: 20;
    padding: 36px;
    border-radius: 8px 0 0 8px;
    display: block;
    cursor: pointer;
}

.block-switcher-reminder {
    width: 70px;
    height: 34px;
    background: red;
    border: 1px solid #b3b3b3;
    border-radius: 4px;
    overflow: hidden;
    cursor: pointer;
}

.block-switcher-reminder.active {
    background-color: #7DCD00;    
}

.block-switcher-reminder.active span {
    margin-Left: 35px;
}

.block-switcher-reminder span {
    width: 50%;
    height: 34px;
    display: block;
    background-color: #fff;
    border-radius: 3px;
}

.block-switcher {
    width: 70px;
    height: 34px;
    background: #ccc;
    border: 1px solid #b3b3b3;
    border-radius: 4px;
    overflow: hidden;
    cursor: pointer;
}

.block-switcher.active {
    background-color: #ed1c24;
}

.block-switcher span {
    width: 50%;
    height: 34px;
    display: block;
    background-color: #fff;
    border-radius: 3px;
}

.acc-pagenum, .acc-pagenav {
    display: inline-block;
    list-style: none;
}

.acc-pagenum {
    border: 1px solid #b3b3b3;
    border-radius: 4px;
}

.acc-pagenav {
    margin-left: 40px;
}

    .acc-pagenum li, .acc-pagenav li {
        display: block;
        float: left;
    }

        .acc-pagenum li a, .acc-pagenav li a {
            padding: 8px 16px;
            color: #808080;
            display: block;
        }

        .acc-pagenum li a {
            border-right: 1px solid #b3b3b3;
        }

        .acc-pagenum li:last-child a {
            border-right: 0;
        }

        .acc-pagenav li a {
            border: 1px solid #b3b3b3;
            border-radius: 4px;
            margin-right: 8px;
        }

            .acc-pagenum li a:hover, .acc-pagenav li a:hover, .acc-pagenav li a.active {
                background: #b3b3b3;
                color: #fff;
            }

.customer-nvc .rmvbl, .customer-nvc-sub .rmvbl {
    display: none;
    width: 31%;
    float: left;
}

.dropable-page {
    display: none;
}

.nvc-popupable-wrap {
    position: relative;
    cursor: default;
}

    .nvc-popupable-wrap.work_company_name {
        cursor: pointer;
        display: block;
        margin-bottom: -10px;
    }

.nvc-popupable {
    background-color: #fff;
    width: 170px;
    position: absolute;
    top: 100%;
    left: 0;
    z-index: 10;
    border-radius: 5px;
    border: 1px solid #d9d9d9;
    font-weight: 300;
    padding-bottom: 8px;
    display: none;
}
    /*.nvc-popupable.sub-sub{top:0;left:100%}*/
    .nvc-popupable.active {
        display: block;
    }

.halfbl-f.none {
    display: none;
}

.line-appearable {
    display: none;
}

.w-fsml {
    width: 340px;
}

.styled-radio {
    width: 7px;
    height: 7px;
    border: 3px solid #fff;
    box-shadow: 0 0 0 1px #333;
    background-color: #fff;
    border-radius: 7px;
}

    .styled-radio.checked {
        background-color: #333;
    }

    .styled-radio input {
        display: none;
    }

.alfbt {
    font-size: 18px;
    padding: 11px 11px 9px 11px;
}

    .alfbt:hover {
        background-color: #ddd;
    }

    .alfbt.active {
        color: #f16522;
    }

.formitable {
    margin-top: -2px;
    display: none;
}

.popup-editable {
    border: 1px solid #fff;
    border-radius: 5px;
    padding: 7px 20px;
    background-color: transparent;
}

    .popup-editable:not([disabled]) {
        border-color: #ccc;
    }

.j-files {
    width: 95px;
    margin-right: 5px;
}

    .j-files > p {
        height: 16px;
        overflow: hidden;
    }

    .j-files img {
        max-width: 100%;
        height: auto;
    }

    .j-files.dimed:before {
        content: ' ';
        position: absolute;
        top: 0;
        left: 0;
        width: 100px;
        height: 100px;
        background: rgba(0,0,0,0.2);
        z-index: 10;
    }

    .j-files.dimed > p {
        text-shadow: 0 0 0 #000;
    }

.upload-popup-full-big {
    width: 85%;
}

.upload-popup-big {
    width: 60%;
}

.upload-popup-small {
    width: 40%;
}

.upload-popup-50 {
    width: 50%;
}

.upload-popup-35 {
    width: 35%;
}

.upload-popup-15 {
    width: 15%;
}

.private-checkbox {
    text-align: center;
    padding-top: 10px;
}

.upload-popup-wrapper .deleter {
    width: 20px;
    height: 20px;
    border-radius: 5px;
    background: url('../assests/images/highq/white-x.svg') center center no-repeat #999;
    margin-top: 7px;
    cursor: pointer;
}

.upload-popup-image {
    width: 36px;
    height: 36px;
    overflow: hidden;
}

    .upload-popup-image img {
        width: auto;
        max-width: 100%;
        height: auto;
    }

.upload-popup-name-holder {
    width: 120px;
}

/** scheduler **/

.scheduler-wrap {
    width: calc(100% - 40px);
    padding-left: 30px;
}


#google-map-canvas {
    height: 400px;
}

#mapZoom {
    position: absolute;
    right: 30px;
    bottom: 30px;
    z-index: 20;
}

#mapZoomOut, #mapZoomIn, #mapZoomToFit {
    background: url('../assests/images/highq/zoom-in-plus.svg') center center no-repeat #f16522;
    margin-bottom: 1px;
    display: block;
    width: 28px;
    height: 28px;
    cursor: pointer;
}

#mapZoomOut {
    background-image: url('../assests/images/highq/zoom-out-minus.svg');
}

#mapSelect, #mapStartScheduling, #trafficLines {
    position: absolute;
    z-index: 20;
    top: 12px;
    right: 12px;
    padding: 9px 14px;
    background: #f16522;
    color: #fff;
    font-size: 15px;
    border-radius: 3px;
    cursor: pointer;
    font-weight: 300 !important;
}

#mapStartScheduling {
    top: 57px;
    display: none;
}

    #mapStartScheduling.active {
        display: block;
    }

.gmnoprint {
    opacity: 0.4;
}

.markerLabel {
    opacity: 1 !important;
    overflow: visible !important;
    font-family: 'proxima-nova', helvetica !important;
}

.scheduled, .schedulable {
    position: absolute;
    width: 46px;
    text-align: center;
    height: 30px;
    background-color: #4d4d4d;
    box-shadow: 0 0 1px 1px #fff, 0 0 6px -2px #000;
    left: -19px;
    top: -18px;
    border-radius: 3px;
}

.schedulable {
    background-color: #fff;
    box-shadow: 0 0 1px 1px #4d4d4d;
}

    .scheduled .mapMarkerNum, .schedulable .mapMarkerNum {
        font-size: 15px;
        font-weight: 600;
        margin-top: 7px;
        color: #fff;
    }

    .schedulable .mapMarkerNum {
        margin-top: 5px;
        color: #4d4d4d;
        line-height: 11px;
    }

    .schedulable .mapMarkerNumEmpty {
        margin-top: 10px;
    }

    .schedulable .mapMarkerDec {
        font-size: 9px;
        margin-top: 1px;
    }

    .scheduled:before, .schedulable:before {
        content: ' ';
        width: 21px;
        height: 20px;
        position: absolute;
        left: 13px;
        bottom: -20px;
        background: url('../assests/images/highq/markerBlackArrow.svg') center center no-repeat;
    }

    .schedulable:before {
        width: 21px;
        height: 20px;
        background-image: url('../assests/images/highq/markerWhiteArrow.svg');
        bottom: -20px;
        left: 6px;
    }

    .schedulable.batch-process.active:before {
        background-image: url('../assests/images/highq/markerWhiteArrow-active.svg');
    }

.person {
    width: 46px;
    height: 46px;
    position: absolute;
    left: -21px;
    top: -32px;
}

    .person > .mapMarkerImg {
        width: 44px;
        height: 34px;
        border: 1px solid #fff;
        border-radius: 22px;
        display: block;
        background-position: center center;
        background-repeat: no-repeat;
        position: relative;
        z-index: 200;
        box-shadow: -4px 0 10px -8px #000;
        color: #fff;
        font-size: 20px;
        padding-top: 10px;
        font-family: 'proxima-nova', helvetica;
        font-weight: 300;
        text-align: center;
    }

    .person > .mapMarkerName {
        position: absolute;
        left: 23px;
        top: 4px;
        padding: 0 7px 0 26px;
        height: 36px;
        background-color: #fff;
        box-shadow: 0 0 7px -5px #000;
    }

.mapMarkerFirstname, .mapMarkerLasttname {
    display: block;
    font-size: 12px;
    color: #4d4d4d;
    font-weight: 600;
    padding: 1px 2px;
    white-space: nowrap;
    line-height: 12px;
}

.mapMarkerFirstname {
    margin-top: 4px;
}

.person:before {
    content: ' ';
    width: 0;
    height: 0;
    border: 8px solid transparent;
    border-top: 20px solid #fff;
    position: absolute;
    bottom: -25px;
    left: 16px;
    -webkit-filter: drop-shadow(0 0 3px rgba(0,0,0,0.3));
    filter: drop-shadow(0 0 3px rgba(0,0,0,0.3));
}

#scheduler-canvas {
    overflow: visible !important;
    border-left: 1px solid #e6e6e6;
    border-right: 1px solid #e6e6e6;
    width: calc(100% - 2px);
    overflow: hidden;
}

.anulize {
    position: relative !important;
    left: auto !important;
    right: auto !important;
    top: auto !important;
    bottom: auto !important;
}

.dhx_cal_navline {
    background-color: #e6e6e6;
    width: 96% !important;
    height: auto !important;
    padding: 10px 2% !important;
    float: left;
    bottom: -1px !important;
}

.dhx_cal_date {
    float: left;
    font-family: 'proxima-nova', helvetica !important;
    color: #666666;
    font-size: 28px !important;
    font-weight: 300 !important;
    line-height: 28px;
    bottom: -2px !important;
    width: auto !important;
    padding-right: 30px;
    text-align: left !important;
    cursor:pointer;
}

.dhx_cal_tab, .dhx_cal_prev_button, .dhx_cal_next_button, .dhx_cal_today_button {
    position: relative;
}

.dhx_cal_tab, .dhx_cal_prev_button, .dhx_cal_next_button, .dhx_cal_today_button {
    background-color: #fff;
    color: #666666;
    font-family: 'proxima-nova', helvetica !important;
    border-color: #cccccc;
    font-weight: 300 !important;
    padding-top: 1px !important;
    font-size: 15px !important;
}

    .dhx_cal_tab.active, .dhx_cal_prev_button.active, .dhx_cal_next_button.active, .dhx_cal_today_button.active {
        background-color: #f16522;
        color: #fff;
        text-shadow: none;
    }

    .dhx_cal_tab[name="timeline_tab"] {
        border-right-width: 0;
        border-top-right-radius: 0;
        border-bottom-right-radius: 0;
        width: 62px;
        padding-left: 0;
        padding-right: 0;
    }

    .dhx_cal_tab[name="month_tab"] {
        border-left-width: 0;
        width: 62px;
    }

.dhx_cal_prev_button, .dhx_cal_next_button {
    border-radius: 5px;
}

.dhx_cal_prev_button {
    margin-right: 4px;
}

.dhx_cal_next_button {
    margin-left: 4px;
}

.dhx_month_body {
    height: 70px !important;
}

    .dhx_month_body .dhx_marked_timespan {
        top: 0 !important;
        left: 0 !important;
        bottom: 0 !important;
        right: 0 !important;
        height: auto !important;
    }

.dhx_cal_event_clear.dhx_cal_event_line_start.dhx_cal_event_line_end h3, .dhx_cal_event_line.dhx_cal_event_line_start h3 {
    padding-top: 0;
    line-height: 18px;
}
/*.dhx_cal_data > table > tbody > tr > td {position:relative}*/
/*.dhx_cal_data > table > tbody > tr > td .dhx_month_head{
    position:absolute;
    left:0;
    top:0;
    right:0;
    bottom:0;
    padding-top:31px;
    color:#f16522;
    font-size:30px;
    font-family:'proxima-nova', helvetica;
    text-align:center;
    vertical-align:middle
}*/
.sche-past-marker {
    background-color: #adabab;
    opacity: 0.4;
}

.sche-weekend-marker {
    background-color: #f16522;
    opacity: 0.2;
}

.dhx_cal_event_line {
    z-index: 10;
}

.dhx_scale_holder_now {
    background-image: url('../dhtml/codebase/imgs_dhx_terrace/databg.svg');
}

.dhx_scheduler_month .dhx_marked_timespan {
    display: block;
}

.scheduler-bricks-wrap {
    width: 100%;
    float: left;
    max-height: 122px;
    padding-top: 7px;
    overflow-x: hidden;
    overflow-y: auto;
}

.nicescroll-rails {
    opacity: 1 !important;
    display: block !important;
    width: 6px !important;
}

    .nicescroll-rails > div {
        background-color: #999999 !important;
        width: 6px !important;
        border: none !important;
    }

.schedulable-brick {
    /*width:160px;*/
    height: 40px;
    border: 1px solid #e5e5e5;
    border-radius: 4px;
    float: left;
    margin-right: 6px;
    padding: 3px 8px;
    white-space: nowrap;
    position: relative;
    vertical-align: bottom;
    margin-top: 9px;
    margin-bottom: 7px;
    background-color: #fff;
    cursor: pointer;
}

    .schedulable-brick.cloned {
        position: absolute;
        margin-top: 0;
    }

    .schedulable-brick:after {
        content: ' ';
        width: 18px;
        height: 16px;
        background: url('../assests/images/highq/dragme.svg') center right no-repeat #fff;
        position: absolute;
        top: 6px;
        right: 5px;
    }

    .schedulable-brick > h3 {
        width: calc(100% - 13px);
        color: #4d4d4d;
        font-size: 15px;
        font-weight: 600;
        height: 22px;
        line-height: 22px;
        overflow: hidden;
        text-overflow: ellipsis;
    }

        .schedulable-brick > h3.red-dang {
            color: #ff0000;
            background-image: none;
        }

            .schedulable-brick > h3.red-dang:after {
                content: ' ';
                width: 14px;
                height: 13px;
                display: inline-block;
                margin-left: 5px;
                background: url('../assests/images/highq/red-dang.svg') center right no-repeat;
                position: relative;
                bottom: -2px;
            }

        .schedulable-brick > h3 > span {
            height: 22px;
            margin-right: 4px;
        }

    .schedulable-brick > div {
        color: #f16522;
        font-size: 13px;
        height: 18px;
        line-height: 18px;
        overflow: hidden;
    }

        .schedulable-brick > div > span {
            height: 18px;
            line-height: 18px;
            font-weight: 600;
            font-size: 12px;
            margin-right: 10px;
        }

.scheduler-bricks {
    width: 4px;
    background-color: #cccccc;
    height: 56px;
    float: left;
    margin-right: 8px;
    margin-left: 2px;
    position: relative;
}

    .scheduler-bricks:first-child, .scheduler-bricks.rem-line {
        width: 0;
        margin-right: 0;
        margin-left: 0;
    }

    .scheduler-bricks > span {
        position: absolute;
        white-space: nowrap;
        font-size: 10px;
        color: #666666;
        left: 20px;
        top: -5px;
        font-weight: 300;
    }

    .scheduler-bricks:first-child > span {
        left: 10px;
    }

.timeline_section {
    color: #666666;
    height: 100%;
    width: 93%;
    padding-left: 5%;
    padding-right: 2%;
}

    .timeline_section > figure {
        width: 46px;
        height: 35px;
        display: block;
        float: left;
        margin-right: 7px;
        border-radius: 23px;
        color: #fff;
        font-size: 20px;
        padding-top: 11px;
        font-family: 'proxima-nova', helvetica;
        font-weight: 300;
    }

    .timeline_section.for-popup {
        height: 40px;
    }

        .timeline_section.for-popup > figure {
            font-size: 18px;
            width: 35px;
            height: 35px;
            padding-top: 0;
            position: relative;
        }

            .timeline_section.for-popup > figure > span {
                position: absolute;
                left: 50%;
                top: 50%;
                transform: translate(-50%, -50%);
            }

        .timeline_section.for-popup > div {
            margin-top: 9px;
            font-weight: 500;
        }

    .timeline_section > div {
        width: calc(100% - 54px);
        float: left;
        white-space: nowrap;
        margin-top: 5px;
    }

        .timeline_section > div > div {
            width: 100%;
            text-align: left;
            font-size: 15px;
            line-height: 18px;
            font-family: 'proxima-nova', helvetica !important;
            font-weight: 500;
        }

.dhx_cal_header div div, .dhx_cal_header, .dhx_matrix_cell, .dhx_matrix_scell, .dhx_cal_data,
#scheduler-canvas[data-mode="timeline"] .dhx_scale_holder {
    border-color: #e5e5e5;
}

    .dhx_scale_bar.dhx_second_scale_bar:not(:first-child),
    .dhx_cal_header.dhx_second_cal_header > div:nth-child(2) > div:nth-child(5),
    .dhx_cal_header.dhx_second_cal_header > div:nth-child(2) > div:nth-child(9),
    .dhx_cal_header.dhx_second_cal_header > div:nth-child(2) > div:nth-child(13),
    .dhx_cal_header.dhx_second_cal_header > div:nth-child(2) > div:nth-child(17),
    .dhx_cal_header.dhx_second_cal_header > div:nth-child(2) > div:nth-child(21),
    .dhx_cal_header.dhx_second_cal_header > div:nth-child(2) > div:nth-child(25),
    .dhx_cal_header.dhx_second_cal_header > div:nth-child(2) > div:nth-child(29),
    .dhx_cal_header.dhx_second_cal_header > div:nth-child(2) > div:nth-child(33),
    .dhx_cal_header.dhx_second_cal_header > div:nth-child(2) > div:nth-child(37),
    .dhx_cal_header.dhx_second_cal_header > div:nth-child(2) > div:nth-child(41),
    .dhx_cal_header.dhx_second_cal_header > div:nth-child(2) > div:nth-child(45) {
        border-left-color: #afafaf;
    }

#scheduler-canvas[data-mode="timeline"] .dhx_matrix_line .dhx_matrix_cell:nth-child(4n):not(:last-child) {
    border-right-color: #afafaf;
}

#scheduler-canvas[data-mode="week"] .dhx_matrix_line .dhx_matrix_cell:nth-child(4n):not(:last-child),
#scheduler-canvas[data-mode="week"] .dhx_scale_holder,
#scheduler-canvas[data-mode="week"] .dhx_scale_holder_now,
#scheduler-canvas[data-mode="timeline"] .dhx_scale_bar {
    border-right-color: #808080;
}

#scheduler-canvas[data-mode="week"] .dhx_cal_header .dhx_scale_bar:not(:first-child) {
    border-left-color: #808080;
}

#scheduler-canvas[data-mode="week"] .dhx_cal_data > div:nth-child(7),
#scheduler-canvas[data-mode="week"] .dhx_cal_data > div:last-child {
    border-right-color: #e5e5e5 !important;
}

.dhx_scale_holder .dhx_scale_hour:not(:last-child) {
    border-bottom-color: #cacaca;
}

#scheduler-canvas[data-mode="month"] .dhx_scale_bar,
#scheduler-canvas[data-mode="month"] .dhx_month_head,
#scheduler-canvas[data-mode="month"] .dhx_month_body,
.sche-weekend-marker {
    border-color: #d9d9d9;
}

.dhx_cal_event_line, .dhx_cal_event .dhx_body, .dhx_cal_event .dhx_footer, .dhx_cal_event .dhx_header, .dhx_cal_event .dhx_title {
    background-color: #4d4d4d;
}

    .dhx_cal_event_line.just-event, .dhx_cal_event.just-event .dhx_body, .dhx_cal_event.just-event .dhx_footer, .dhx_cal_event.just-event .dhx_header, .dhx_cal_event.just-event .dhx_title {
        background-color: #934cab;
    }

.dhx_event_resize {
    opacity: 0.1;
}

.dhx_cal_event_line > div, .dhx_body > div {
    width: calc(100% - 6px);
    float: left;
}

    .dhx_cal_event_line > div > h3, .dhx_body > div > h3 {
        width: 100%;
        font-size: 15px;
        font-weight: 600;
        line-height: 19px;
        padding-top: 5px;
        white-space: nowrap;
        font-family: 'proxima-nova', helvetica;
        font-weight: 600;
    }

        .dhx_cal_event_line > div > h3 > span, .dhx_body > div > h3 > span {
            margin-right: 5px;
            display: inline-block;
        }

    .dhx_body > div > h3 {
        white-space: normal;
    }
    /*#scheduler-canvas[data-mode="week"] .dhx_body {position:relative}
#scheduler-canvas[data-mode="week"] .dhx_event_move.dhx_title{opacity:0}*/
    .dhx_cal_event_line > div > div, .dhx_body > div > div {
        width: 100%;
        font-size: 13px;
        font-weight: 300;
        line-height: 17px;
        padding-top: 3px;
        white-space: nowrap;
        font-family: 'proxima-nova', helvetica;
        font-weight: 300;
    }

        .dhx_cal_event_line > div > div > span, .dhx_body > div > div > span {
            margin-right: 7px;
            display: inline-block;
            position: relative;
            bottom: -2px;
        }

    .dhx_body > div > div {
        white-space: normal;
    }

        .dhx_body > div > div > span {
            float: left;
        }

#scheduler-canvas[data-mode="week"] .dhx_cal_select_menu {
    display: none !important;
}

#scheduler-canvas[data-mode="month"] .dhx_cal_data table > tbody > tr > td {
    position: relative;
}

    #scheduler-canvas[data-mode="month"] .dhx_cal_data table > tbody > tr > td.dhx_before .fullable-month,
    #scheduler-canvas[data-mode="month"] .dhx_cal_data table > tbody > tr > td.dhx_after .fullable-month {
        opacity: 0.3;
    }

    #scheduler-canvas[data-mode="month"] .dhx_cal_data table > tbody > tr > td > .dhx_month_head > .fullable-month {
        font-size: 33px;
        font-family: 'proxima-nova', helvetica;
        font-weight: lighter;
        text-align: center;
        color: #f16522;
        padding-top: 36px;
        z-index: 5;
        position: absolute;
        top: 0;
        right: 0;
        bottom: 0;
        left: 0;
        cursor: pointer;
    }

.right-orange-arr {
    background: url('../assests/images/highq/down-orange-arrow.svg') center left no-repeat;
    padding-left: 18px;
}

.up-orange-arr {
    background: url('../assests/images/up-orange-arrow.png') center left no-repeat;
    padding-left: 18px;
}

.dhx_scale_bar {
    color: #4d4d4d;
    font-size: 12px;
}

#scheduler-canvas[data-mode="timeline"] .dhx_cal_header.dhx_second_cal_header > div:last-child > div {
    color: #999999;
    font-size: 10px;
}

.scheduler-top-filter-bar {
    background-color: #f2f2f2;
}

    .scheduler-top-filter-bar .filter-button {
        background: url('../assests/images/highq/white-arrow-down.svg') right 8px center no-repeat #f16522;
        color: #fff;
        font-size: 15px;
        padding: 5px 24px 5px 9px;
        margin-right: 20px;
        cursor: pointer;
    }

    .scheduler-top-filter-bar .filter-button-selected {
        background-color: #f16522;
        color: #fff;
        cursor: pointer;
        padding: 5px 9px 5px 9px;
        border-radius: 5px;
    }

    .scheduler-top-filter-bar .filter-button-no-selected {
        cursor: pointer;
        padding: 5px 9px 5px 9px;
    }

.scheduler-view-dropdown {
    cursor: pointer;
    width: 135px;
}

    .scheduler-view-dropdown.trspr-dropdown i {
        background-image: url('../assests/images/highq/down-orange-arrow.svg');
        cursor: pointer;
    }

    .scheduler-view-dropdown.trspr-dropdown select {
        cursor: pointer;
        font-weight: 300;
    }

.scheduler-minimize-bricks {
    background: url('../assests/images/highq/minimize-orange.svg') right center no-repeat;
    padding-right: 26px;
    cursor: pointer;
    font-weight: 300;
}

#remove-filter {
    width: 18px;
    height: 18px;
    background: url('../assests/images/highq/gray-xross.svg') center center no-repeat;
    cursor: pointer;
    margin-left: 10px;
    display: inline;
    vertical-align: middle;
    margin-bottom: 5px;
    position: relative;
    bottom: -2px;
}

#show-hide-map {
    font-size: 15px;
    line-height: 17px;
    font-weight: 300;
    padding: 6px 19px 6px 19px;
    color: #666666;
    border: 1px solid #CECECE;
    background-color: #fff;
}

    #show-hide-map.active {
        color: #fff;
        border-color: #f16522;
        background-color: #f16522;
    }

.pop-inner > .removeme {
    position: absolute;
    right: 12px;
    top: 6px;
    width: 18px;
    height: 18px;
    display: inline-block;
    background: url('../assests/images/highq/gray-xross.svg') center center no-repeat;
    cursor: pointer;
}

.no-hover-gray .pop-inner:hover {
    background-color: transparent;
    color: #000;
}

.adv-popup.custom, .adv-popup-con.custo, .adv-popup-con-sel.custom  {
    width: 380px;
    padding-left: 10px;
    padding-right: 10px;
}


.iblock-crs .dis-iblock {
    display: inline-block;
}

.gray-separator {
    height: 1px;
    background-color: #bfbfbf;
}

.light-gray-separator {
    height: 1px;
    background-color: #f6f6f6;
}

.custom-popup-per-tab {
    display: none;
}

    .custom-popup-per-tab.active {
        display: block;
    }

.scheduler-event-creator, .event-edit-popup {
    width: 238px;
    padding: 17px 0;
    background-color: #f2f2f2;
    border: 2px solid #fff;
    border-radius: 5px;
    position: absolute;
    top: 600px;
    left: 600px;
    z-index: 30;
    box-shadow: 0 0 16px -7px #000;
    display: none;
}

.event-edit-popup {
    background-color: #fff;
}

    .scheduler-event-creator:before, .event-edit-popup:before {
        content: ' ';
        border: 9px solid transparent;
        border-bottom: 20px solid #fff;
        position: absolute;
        top: -30px;
        left: 50%;
        margin-left: -10px;
        z-index: 0;
        -webkit-filter: drop-shadow(0 -3px 3px rgba(0,0,0,0.1));
        filter: drop-shadow(0 -3px 3px rgba(0,0,0,0.1));
    }

.event-by-click-been, .event-by-click-been {
    width: 100%;
    float: left;
    height: 290px;
    overflow: hidden;
    background-color: #fff;
    padding-top: 10px;
    padding-bottom: 10px;
}

    .event-by-click-been .schedulable-brick {
        width: calc(100% - 24px);
        padding-right: 8px;
        border: 0;
        margin: 0 8px 5px 8px;
        border-bottom: 1px solid #d9d9d9;
        padding: 0 0 5px 0;
        border-radius: 0;
    }

        .event-by-click-been .schedulable-brick:after {
            display: none;
        }

        .event-by-click-been .schedulable-brick > h3 {
            background-image: none;
        }

    .event-by-click-been .scheduler-bricks {
        width: 100%;
        height: auto;
        background-color: transparent;
        margin-bottom: 5px;
        display: none !important;
    }

        .event-by-click-been .scheduler-bricks > span {
            position: relative;
            margin: 0 0 0 10px;
            left: auto;
            top: auto;
        }

.hide-strongly {
    display: none !important;
}

#ascrail2000-hr, #ascrail2001-hr {
    display: none !important;
}

.addit-menu.inside-popup {
    width: 94%;
    padding: 0;
    margin-left: 0;
    margin-bottom: 20px;
}

    .addit-menu.inside-popup ul, .addit-menu.inside-popup h2 {
        width: auto;
        display: inline-block;
        float: none;
    }

    .addit-menu.inside-popup h2 {
        margin-right: 30px;
        position: relative;
        bottom: -6px;
    }

    .addit-menu.inside-popup li {
        width: auto;
        float: none;
        display: inline-block;
    }

        .addit-menu.inside-popup li a {
            border-top: none !important;
            padding-right: 12px;
        }

.addit-menu-1.inside-popup {
    width: 94%;
    padding: 0;
    margin-left: 0;
    margin-bottom: 20px;
}

    .addit-menu-1.inside-popup ul, .addit-menu.inside-popup h2 {
        width: auto;
        display: inline-block;
        float: none;
    }

    .addit-menu-1.inside-popup h2 {
        margin-right: 30px;
        position: relative;
        bottom: -6px;
    }

    .addit-menu-1.inside-popup li {
        width: auto;
        float: none;
        display: inline-block;
    }

        .addit-menu-1.inside-popup li a {
            border-top: none !important;
            padding-right: 12px;
        }

#scheduler-canvas[data-mode="month"] .dhx_now .dhx_month_body, #scheduler-canvas[data-mode="month"] .dhx_now .dhx_month_head {
    background: #f16522 !important;
}

#scheduler-canvas[data-mode="month"] .dhx_now .fullable-month {
    color: #fff !important;
}

.fullable-month-jobs {
    color: #939292 !important;
    font-size: 13px;
    font-weight: 400;
    position: absolute;
    right: 10px;
    top: 2px;
}

#scheduler-canvas[data-mode="month"] .dhx_now .fullable-month-jobs {
    color: #fff !important;
}

.bricks-panel {
    width: 205px;
    height: 285px;
    max-height: 285px !important;
    padding: 15px;
    border: 1px solid #d9d9d9;
    background: #fff;
    border-radius: 6px;
    position: fixed;
    right: 6px;
    top: 50px;
    z-index: 30;
    overflow: hidden;
    cursor: move;
}

    .bricks-panel > .full-width:first-child {
        margin-top: 0;
        margin-bottom: 3px;
    }

    .bricks-panel > .full-width:last-child {
        overflow: hidden;
        height: 213px;
        overflow-x: hidden;
        overflow-y: scroll;
    }

    .bricks-panel > .full-width > span {
        font-size: 15px;
        color: #333333;
    }

        .bricks-panel > .full-width > span:first-child {
            font-weight: 600;
            margin-right: 3px;
            margin-left: 0;
        }

    .bricks-panel .scheduler-minimize-bricks {
        display: none;
    }

    .bricks-panel .additional-cancel-panel {
        display: block;
        position: absolute;
        top: -6px;
        right: 0px;
        cursor: pointer !important;
    }

    .bricks-panel .scheduler-bricks {
        display: block;
        width: 100% !important;
        float: left !important;
        height: auto !important;
        background-color: transparent !important;
        margin: 0 !important;
    }

        .bricks-panel .scheduler-bricks span {
            position: relative !important;
            left: auto !important;
            bottom: auto !important;
            top: auto !important;
        }

    .bricks-panel .schedulable-brick {
        margin: 0 0 7px 0;
    }

    .bricks-panel .scheduler-view-dropdown {
        margin: 10px 0 0 0;
    }

    .bricks-panel > .top-part * {
        cursor: auto;
    }

    .bricks-panel > .full-width:last-child {
        cursor: auto;
    }

.markerDraggable.batch-process.active {
    box-shadow: 0 0 1px 1px #f16522, 0 0 1px 1px #fff;
}

.just-event-been {
    background-color: #fff;
}

.two-times, .four-times {
    display: inline-block;
    height: 16px;
    line-height: 16px;
    padding-left: 1px;
    padding-right: 1px;
    overflow: hidden;
    position: relative;
    bottom: -2px;
}

.four-times {
}

#event-staff-drpdwn {
    width: 140px;
}

.holdcolor-times {
    cursor: pointer;
}

    .holdcolor-times:hover, .holdcolor-times:focus, .holdcolor-times.highlighted {
        background-color: #e5e5e5;
    }

.scheduler-event-creator *::selection, .event-edit-popup *::selection {
    background: #e5e5e5;
}

.scheduler-event-creator *::-moz-selection, .event-edit-popup *::-moz-selection {
    background: #e5e5e5;
}

.right-side-dropdw {
    position: absolute;
    top: 50%;
    left: calc(100% + 15px);
    top: -80px;
    width: 150px;
    height: 212px;
    background-color: #fff;
    border-radius: 4px;
    box-shadow: 0 0 9px -1px #ccc;
    z-index: 10;
    padding: 0 5px 0 10px;
    display: none;
}

    .right-side-dropdw > div {
        margin: 6px 0 6px 0;
        height: 200px;
        width: 100%;
        float: left;
        overflow-x: hidden;
        overflow-y: auto;
    }

    .right-side-dropdw:before {
        content: ' ';
        border: 10px solid transparent;
        border-right: 15px solid #f4f1f1;
        position: absolute;
        top: 79px;
        left: -25px;
    }

    .right-side-dropdw a {
        font-size: 15px;
        color: #000;
        display: block;
        margin-top: 4px;
        margin-bottom: 4px;
    }

        .right-side-dropdw a:hover, .right-side-dropdw a.active {
            color: #f16522;
        }

#event-staff-drpdwn {
    cursor: pointer;
}

    #event-staff-drpdwn.active .right-side-dropdw {
        display: block;
    }

.bind-filters-scrollable {
    height: 300px;
    overflow-x: hidden;
    overflow-y: auto;
}

.scheduler-menu-top {
    width: calc(100% - 50px) !important;
}

    .scheduler-menu-top li, .scheduler-menu-top li:hover {
        background-color: #fff;
        border-radius: 4px !important;
        height: 32px !important;
        margin: 7px 5px 0 0 !important;
        float: right !important;
        display: inline-block !important;
        overflow: hidden;
    }

        .scheduler-menu-top li a, .scheduler-menu-top li a:hover {
            color: #666666 !important;
            display: block !important;
            padding: 7px 16px 6px 16px !important;
            margin: 0 !important;
        }

        .scheduler-menu-top li.sche-next, .scheduler-menu-top li.sche-today {
            margin-right: 2px !important;
        }

        .scheduler-menu-top li.sche-prev a {
            padding: 16px 26px !important;
            background: url('../dhtml/codebase/imgs_dhx_terrace/arrow_right.svg') center center no-repeat;
        }

        .scheduler-menu-top li.sche-next a {
            padding: 16px 26px !important;
            background: url('../dhtml/codebase/imgs_dhx_terrace/arrow_left.svg') center center no-repeat;
        }

        .scheduler-menu-top li.sche-time, .scheduler-menu-top li.sche-time:hover {
            float: left !important;
            background-color: transparent !important;
        }

            .scheduler-menu-top li.sche-time a, .scheduler-menu-top li.sche-time a:hover {
                font-size: 15px !important;
                color: #fff !important;
                background-color: transparent !important;
            }

.jobs-evnts-mobile-blocks {
    background-color: #f2f2f2;
    margin-top: 3px;
}

#mobile-scheduled .scheduled-part {
    width: 94%;
    float: left;
    margin-left: 3%;
}

    #mobile-scheduled .scheduled-part .timeline_section {
        width: 100%;
        float: left;
        padding: 0;
        color: #666666;
        font-size: 15px;
        margin-top: 18px;
    }

        #mobile-scheduled .scheduled-part .timeline_section > div {
            margin-top: 14px;
        }

    #mobile-scheduled .scheduled-part .event-clickable-inner {
        width: calc(100% - 26px);
        float: left;
        padding: 0;
        background-color: #4d4d4d;
        color: #fff;
        padding: 7px 13px;
        border-radius: 5px;
        margin-top: 6px;
    }

        #mobile-scheduled .scheduled-part .event-clickable-inner h3 {
            width: 100%;
            font-size: 15px;
            margin-bottom: 4px;
        }

            #mobile-scheduled .scheduled-part .event-clickable-inner h3 span {
                margin-right: 5px;
            }

        #mobile-scheduled .scheduled-part .event-clickable-inner div {
            width: 100%;
            font-size: 15px;
            font-size: 15px;
        }

            #mobile-scheduled .scheduled-part .event-clickable-inner div span {
                display: inline-block;
                position: relative;
                bottom: -2px;
                float: left;
                margin-right: 7px;
            }

    #mobile-scheduled .scheduled-part .event-clickable-inner1 {
        width: calc(100% - 26px);
        float: left;
        padding: 0;
        background-color: #934cab;
        color: #fff;
        padding: 7px 13px;
        border-radius: 5px;
        margin-top: 6px;
    }

        #mobile-scheduled .scheduled-part .event-clickable-inner1 h3 {
            width: 100%;
            font-size: 15px;
            margin-bottom: 4px;
        }

            #mobile-scheduled .scheduled-part .event-clickable-inner1 h3 span {
                margin-right: 5px;
            }

        #mobile-scheduled .scheduled-part .event-clickable-inner1 div {
            width: 100%;
            font-size: 15px;
            font-size: 15px;
        }

            #mobile-scheduled .scheduled-part .event-clickable-inner1 div span {
                display: inline-block;
                position: relative;
                bottom: -2px;
                float: left;
                margin-right: 7px;
            }

.times-separator-sign {
    position: relative;
    top: -2px;
}

.img-edit-label {
    width: 70px;
    height: 70px;
    display: inline-block;
    background-color: #f16522;
    border-radius: 35px;
    text-align: center;
    vertical-align: middle;
    color: #fff;
}

    .img-edit-label .pure-text {
        padding-top: 14px;
        display: inline-block;
    }

.choose-image-position-wrap {
    position: relative;
    overflow: hidden;
    height: 260px;
}

.choose-image-position-wrap-replace {
    position: relative;
    overflow: hidden;
    height: 260px;
}

    .choose-image-position-wrap-replace img {
        margin-top: 40px;
    }

.choose-image-position {
    width: 180px;
    height: 180px;
    background: transparent;
    position: absolute;
    top: 15%;
    left: 25%;
    /*margin-top:-35px;
    margin-left:-35px;*/
    box-shadow: 0 0 0 9000px rgba(0,0,0,0.5);
    border-radius: 50%;
    cursor: pointer;
    max-height: 100%;
    max-width: 100%;
}

.choose-image-position-wrap img {
    cursor: move;
    position: absolute;
    top: 0;
    left: 0;
    width: auto;
    height: auto;
}

.choose-image-zoom {
    width: 200px;
    height: 6px;
    background-color: #fff;
    border-radius: 3px;
    position: absolute;
    left: 50%;
    margin-left: -100px;
    bottom: 12px;
    z-index: 5;
}

    .choose-image-zoom > div {
        width: 14px;
        height: 14px;
        border: 2px solid #fff;
        background-color: #f16522;
        position: absolute;
        top: -6px;
        left: 100px;
        border-radius: 50%;
        cursor: pointer;
    }

#my-been {
    position: absolute;
    left: -44px;
    top: 0px;
    width: 44px;
    height: 44px;
    background: url('../assests/images/highq/head-left-arrow.svg') center center no-repeat #e6e6e6;
}

.shortcodes-been {
    background-color: #e6e6e6;
    position: fixed;
    right: 0;
    width: 280px;
    padding-top: 20px;
    padding-bottom: 20px;
}

    .shortcodes-been > .full-width {
        overflow-y: auto;
        overflow-x: hidden;
        max-height: 100%;
        width: 200px;
        padding-right: 40px;
        margin-right: 10px;
        padding-left: 30px;
    }

    .shortcodes-been.active #my-been {
        -webkit-transform: rotate(180deg);
        -moz-transform: rotate(180deg);
        -ms-transform: rotate(180deg);
        transform: rotate(180deg);
    }

    .shortcodes-been > .full-width > ul {
        overflow: hidden;
    }

        .shortcodes-been > .full-width > ul > li {
            display: block;
            margin: 5px 0;
        }

            .shortcodes-been > .full-width > ul > li > a {
                color: #666;
                padding-left: 20px;
                position: relative;
            }

                .shortcodes-been > .full-width > ul > li > a:before {
                    content: ' ';
                    width: 10px;
                    height: 14px;
                    background: url('../assests/images/highq/orange-right-arrow.svg') center center no-repeat;
                    position: absolute;
                    top: 1px;
                    left: 2px;
                    -webkit-transition: transform 0.2s;
                    -moz-transition: transform 0.2s;
                    -ms-transition: transform 0.2s;
                    transition: transform 0.2s;
                }

            .shortcodes-been > .full-width > ul > li.active > a:before {
                -webkit-transform: rotate(90deg);
                -moz-transform: rotate(90deg);
                -ms-transform: rotate(90deg);
                transform: rotate(90deg);
            }

            .shortcodes-been > .full-width > ul > li > ul {
                padding: 8px 0;
                display: none;
            }

            .shortcodes-been > .full-width > ul > li.active ul {
                display: block;
            }

            .shortcodes-been > .full-width > ul > li > ul > li {
                display: block;
                margin: 3px 0;
                padding-left: 30px;
            }

                .shortcodes-been > .full-width > ul > li > ul > li > a {
                    display: block;
                    background-color: #4d4d4d;
                    color: #fff;
                    width: 130px;
                    padding: 6px 10px;
                    display: inline-block;
                    text-align: left;
                    border-radius: 4px;
                }

.log-results-line {
    width: 96%;
    float: left;
    border-bottom: 2px solid #e5e5e5;
    padding: 10px 2%;
}

.logs-search-result .log-results-line:first-child {
    border-top: 2px solid #e5e5e5;
}

.black-upper-dropdowns {
    width: 100%;
    padding: 70px 20px 20px 20px;
    background-color: rgba(0,0,0,0.8);
    border-bottom-left-radius: 7px;
    border-bottom-right-radius: 7px;
    position: absolute;
    top: 0;
    right: 0px;
    z-index: 10000 !important;
}

.user-tr .black-upper-dropdowns {
    right: 0px;
}

.retouchable-trigger {
    cursor: move;
}

.retouchable-brick.dragging {
    position: absolute;
    z-index: 2;
    background-color: #ebf0ef;
}

.accordion-trigger.warrow {
    padding-left: 24px;
    position: relative;
}

    .accordion-trigger.warrow:before {
        content: ' ';
        width: 10px;
        height: 14px;
        background: url('../assests/images/highq/orange-right-arrow.svg') center center no-repeat;
        position: absolute;
        top: 50%;
        margin-top: -7px;
        left: 0;
        -webkit-transition: transform 0.2s;
        -moz-transition: transform 0.2s;
        -ms-transition: transform 0.2s;
        transition: transform 0.2s;
    }

.accordion-out.active .accordion-trigger.warrow:before {
    -webkit-transform: rotate(90deg);
    -moz-transform: rotate(90deg);
    -ms-transform: rotate(90deg);
    transform: rotate(90deg);
}

.appear-service-item-popup .appear-service-item-popup {
    cursor: pointer;
}

/**** temp styles ****/

.white_content {
    display: none;
    position: fixed;
    left: 50%;
    width: 380px;
    height: auto;
    padding: 16px;
    border: none;
    background-color: white;
    z-index: 10025;
    overflow: auto;
    margin-left: -190px;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    border-radius: 5px;
}

.user-permissions-table {
    border-collapse: separate;
    border-spacing: 26px 18px;
}

    .user-permissions-table tr > td {
        vertical-align: top;
    }

        .user-permissions-table tr > td:not(:first-child) {
            text-align: center;
        }

.permissions-table th {
    font-weight: 500;
}

.permissions-table tr td:first-child {
    padding-right: 15px;
}

.permissions-table tr td:not(:first-child) {
    text-align: center;
}

.permissions-table td {
    padding-top: 15px;
}

.group-edit-popup {
    width: 260px;
    padding: 14px 30px;
    background-color: #fff;
    border-radius: 5px;
    position: absolute;
    top: 100px;
    left: 50%;
    margin-left: -160px;
    z-index: 100;
}

/**** temp styles ****/

.orange38-button {
    width: 38px;
    height: 38px;
    border-radius: 4px;
    display: inline-block;
    background-color: #f16522;
    position: relative;
    cursor: pointer;
}

    .orange38-button.minus:before, .orange38-button.plus:before {
        content: '';
        width: 21px;
        height: 5px;
        position: absolute;
        top: 17px;
        left: 9px;
        display: block;
        background-color: #fff;
    }

    .orange38-button.plus:after {
        content: '';
        width: 5px;
        height: 21px;
        position: absolute;
        top: 9px;
        left: 17px;
        display: block;
        background-color: #fff;
    }

#bo-bricks {
    clear: both;
}

    #bo-bricks > div, #bo-bricks > button {
        padding: 3px 14px;
        background-color: #4d4d4d;
        color: #fff;
        font-size: 24px !important;
        text-align: center;
        min-width: 180px;
    }

        #bo-bricks > div > .cur, #bo-bricks > div > .price {
            font-size: 40px;
        }

    #bo-bricks > button {
        margin-top: 6px;
        padding-top: 13px;
        padding-bottom: 13px;
        display: block;
        font: inherit;
        background-color: #f16522;
        width: calc(100%);
        cursor: pointer;
    }

.gray-radio {
    padding-left: 20px;
    position: relative;
    cursor: pointer;
}

    .gray-radio input {
        display: none;
    }

        .gray-radio input + span {
            display: block;
            width: 8px;
            height: 8px;
            position: absolute;
            top: 2px;
            left: 0;
            box-shadow: 0 0 0 1px #666;
            border: 3px solid #fff;
            border-radius: 50%;
        }

        .gray-radio input:checked + span {
            background-color: #666;
        }

#users-qty-buttons-been {
    position: absolute;
    right: 0;
    bottom: 5px;
}

/*** gray slideup ***/

.gray-slideup {
    position: fixed;
    left: 50px;
    bottom: 0;
    box-sizing: border-box;
    background: #808080;
    border-top-right-radius: 4px;
    color: #fff;
    z-index: 10030;
    width: 300px;
    padding-top: 12px;
}

    .gray-slideup > .wrap-tab {
        display: block;
        width: 100%;
        box-sizing: border-box;
        padding: 8px 20px 10px 20px;
        float: left;
        display: none;
    }

    .gray-slideup > .button-closer {
        display: block;
        width: 12px;
        height: 11px;
        background: url('../assests/images/highq/gray-tab-closer.svg') center center no-repeat;
        position: absolute;
        right: 14px;
        top: 12px;
        cursor: pointer;
    }

    .gray-slideup > .button-toggler {
        border-top-left-radius: 4px;
        border-top-right-radius: 4px;
        background: #808080;
        position: absolute;
        top: -30px;
        left: 0;
        line-height: 26px;
        font-size: 16px;
        padding-left: 20px;
        padding-right: 60px;
        font-weight: 400;
        color: inherit;
        box-sizing: border-box;
        padding-top: 4px;
        cursor: pointer;
    }

        .gray-slideup > .button-toggler:after {
            content: '';
            width: 14px;
            height: 15px;
            background: url('../assests/images/highq/gray-tab-opener-img-down.svg') center center no-repeat;
            position: absolute;
            top: 8px;
            right: 20px;
        }

    .gray-slideup.active > .button-toggler:after {
        background-image: url('../assests/images/highq/gray-tab-opener-img-down.svg');
    }

    .gray-slideup > .wrap-tab .the-header {
        font-size: 20px;
        font-weight: 400;
    }

    .gray-slideup > .wrap-tab .list-inside {
        display: block;
        list-style: none;
        width: 100%;
        float: left;
        margin-top: 10px;
    }

        .gray-slideup > .wrap-tab .list-inside > li {
            display: block;
            width: 100%;
            float: left;
            box-sizing: border-box;
            padding-left: 40px;
            position: relative;
        }

            .gray-slideup > .wrap-tab .list-inside > li:before {
                content: attr(data-index);
                background: #f16522;
                width: 30px;
                height: 30px;
                line-height: 30px;
                border-radius: 50%;
                color: inherit;
                font-size: 17px;
                font-weight: 400;
                position: absolute;
                top: 5px;
                left: 0;
                text-align: center;
                z-index: 3;
            }

            .gray-slideup > .wrap-tab .list-inside > li.passed:before {
                content: '';
                background-color: #33cc00;
            }

            .gray-slideup > .wrap-tab .list-inside > li.passed:after {
                content: '';
                width: 13px;
                height: 16px;
                background: url('../assests/images/highq/white-tick-midd.svg') center center no-repeat;
                position: absolute;
                top: 11px;
                left: 9px;
                z-index: 4;
            }

            .gray-slideup > .wrap-tab .list-inside > li > a {
                display: block;
                font-size: 16px;
                line-height: 22px;
                min-height: 30px;
                font-weight: 400;
                color: inherit;
                padding: 9px 0;
                box-sizing: border-box;
            }

            .gray-slideup > .wrap-tab .list-inside > li.passed > a {
                color: #64d83d;
            }

.watch-video-button {
    display: block;
    background-color: #fff;
    border-radius: 4px;
    line-height: 40px;
    color: #666666;
    font-size: 16px;
    font-weight: 400;
    padding-left: 14px;
    padding-right: 50px;
    position: relative;
    cursor: pointer;
}

    .watch-video-button:after {
        content: '';
        display: block;
        width: 23px;
        height: 24px;
        position: absolute;
        right: 12px;
        top: 50%;
        margin-top: -12px;
        background: url('../assests/images/watch-video-bg.png') center center no-repeat;
    }

/*** gray slideup ***/

.jwlooped::-webkit-input-placeholder, .stl-plhdl::-webkit-input-placeholder {
    font-style: italic;
    font-weight: 300;
}

.jwlooped:-moz-placeholder, .stl-plhdl:-moz-placeholder {
    font-style: italic;
    font-weight: 300;
}

.jwlooped::-moz-placeholder, .stl-plhdl::-moz-placeholder {
    font-style: italic;
    font-weight: 300;
}

.jwlooped:-ms-input-placeholder, .stl-plhdl:-ms-input-placeholder {
    font-style: italic;
    font-weight: 300;
}

.spec-phlf::-webkit-input-placeholder {
    color: #4d4d4d !important;
    font-weight: 600 !important;
}

.spec-phlf:-moz-placeholder {
    color: #4d4d4d !important;
    font-weight: 600 !important;
}

.spec-phlf::-moz-placeholder {
    color: #4d4d4d !important;
    font-weight: 600 !important;
}

.spec-phlf:-ms-input-placeholder {
    color: #4d4d4d !important;
    font-weight: 600 !important;
}

.normal-plh input::-webkit-input-placeholder {
    font-weight: 300;
}

.normal-plh input:-moz-placeholder {
    font-weight: 300;
}

.normal-plh input::-moz-placeholder {
    font-weight: 300;
}

.normal-plh input:-ms-input-placeholder {
    font-weight: 300;
}

.roundedImage {
    border-radius: 50% !important;
}

.cust-table .roundedImage  {
    
    float:left;
}

.roundedImageContractor {
    border-radius: 50% !important;
    background-size: 112px 112px !important;
}

.daterangepicker, .xdsoft_datetimepicker {
    z-index: 11001 !important;
}

.overflowhd {
    overflow: hidden;
}

.image-profile-shadow {
    /*-webkit-box-shadow: inset 0px 0px 20px 0px rgba(184, 74, 74, 1) !important; 
    -moz-box-shadow: inset 0px 0px 20px 0px rgba(184, 74, 74, 1)  !important; 
    box-shadow: inset 0px 0px 20px 0px rgba(184, 74, 74, 1)  !important;*/
}

.blockOverlay {
    background-color: #fff !important;
}

.blockMsg {
    background-color: transparent !important;
    border: 0px !important;
}

.spinner {
    margin: 0 auto;
    width: 70px;
    height: 70px;
    text-align: center;
    font-size: 10px;
}

    .spinner > div {
        background-color: #333;
        height: 100%;
        width: 10px;
        margin-right: 2px;
        display: inline-block;
        -webkit-animation: sk-stretchdelay 1.2s infinite ease-in-out;
        animation: sk-stretchdelay 1.2s infinite ease-in-out;
    }

    .spinner .rect2 {
        -webkit-animation-delay: -1.1s;
        animation-delay: -1.1s;
    }

    .spinner .rect3 {
        -webkit-animation-delay: -1.0s;
        animation-delay: -1.0s;
    }

    .spinner .rect4 {
        -webkit-animation-delay: -0.9s;
        animation-delay: -0.9s;
    }

    .spinner .rect5 {
        -webkit-animation-delay: -0.8s;
        animation-delay: -0.8s;
    }

@-webkit-keyframes sk-stretchdelay {
    0%, 40%, 100% {
        -webkit-transform: scaleY(0.4);
    }

    20% {
        -webkit-transform: scaleY(1.0);
    }
}

@keyframes sk-stretchdelay {
    0%, 40%, 100% {
        transform: scaleY(0.4);
        -webkit-transform: scaleY(0.4);
    }

    20% {
        transform: scaleY(1.0);
        -webkit-transform: scaleY(1.0);
    }
}

.stripe_checkout_app {
    z-index: 10700 !important;
}

.pac-container {
    z-index: 10600 !important;
}

.beacon-wrapper .article {
    max-height: 450px !important;
}

.recurrence-parent-job-row {
    border-bottom: 2px solid #a2a2a2;
    padding: 10px 0;
}

.recurrence-job-title {
    width: 100%;
    text-align: center;
    padding: 10px 0;
}

    .recurrence-job-title.recurrences {
        margin-top: 130px;
    }

.w21-important {
    width: 21% !important;
}

.multi-job-invoice-popup {
    width: 600px;
    margin-left: -280px;
}

.recurring-box {
    background-color: #eee;
    padding: 15px 15px;
}

#current-setup {
    width: 95%;
}

.schedule-collision {
    margin-top: 21px;
}

    .schedule-collision > h2 {
        font-family: sans-serif;
    }

.popUp-header-text {
    font-size: 27px;
    margin-bottom: 20px;
}

    .popUp-header-text.small {
        font-size: 22px;
    }

    .popUp-header-text.small16 {
        font-size: 16px;
    }

.popUp-description-text {
    font-family: "proxima nova", helvetica;
}

.bold-600 {
    font-weight: 600;
}

.required {
    font-weight: 600;
}

.service-popup-content .recurrence-error-message {
    height: 40px;
    border: 1px solid red;
    border-radius: 3px;
    padding: 5px;
    -moz-transition: 1s;
    -o-transition: 1s;
    -webkit-transition: 1s;
    transition: 1s;
}

.in-body-remove-recurrent-warning, .center-text {
    text-align: center;
}

.anchor-link {
    color: #808080;
    cursor: pointer;
    margin-left: 10px;
}

    .anchor-link:hover {
        text-decoration: underline;
    }

.pointer {
    cursor: pointer;
}

.grayout {
    background-color: lightgray;
    opacity: 0.3;
}

button.uneditable-job {
    padding: 9px 20px;
    cursor: default;
}

.main-popup.recurrence-changing-popup {
    width: 580px;
}

.main-popup.recurrence-changing-popup-on-drag {
    width: 580px;
}

.msgWeek > div > input:not(:first-child) {
    margin-left: 15px;
}

.msgYear > div > input:not(:first-child) {
    margin-left: 15px;
}

#excelude-weekends, #recurring-show {
    padding-left: 25px;
}

.table-view {
    display: table;
}

    .table-view .table-row-view {
        display: table;
    }

        .table-view .table-row-view .table-cell-view {
            display: table-cell;
            float: none;
            vertical-align: middle;
            padding: 0 1%;
        }

.service-or-item-tax-rate-value {
    font-family: 'proxima-nova', helvetica;
    font-size: 15px;
    font-weight: bold;
    color: #878787;
}

.link:hover {
    text-decoration: underline;
    cursor: pointer;
}

.invoice-settings-checkbox {
    position: absolute;
    top: 3px;
    margin-left: 7px;
}

.invoice-settings-bottom-field {
    box-sizing: border-box;
    width: 90%;
    min-width: 90%;
    max-width: 90%;
    border: 1px solid #d9d9d9;
    border-radius: 4px;
    padding: 5px 5px;
}


ul#document_notes_holder li {
    padding: 20px 0;
    border-bottom: 1px solid #e6e6e6;
    transition: 1s;
}

    ul#document_notes_holder li > div {
        display: inline-block;
        width: 100%;
    }

.private-note-bg {
    background-color: #FFFDE4;
    position:relative;
}

.internal-note {
    position:absolute;
    top:0px;
    left:0px;
}

.internal-note-fix {
    margin-bottom:0px;
}

.internal-note span {
    background-color:#4d4d4d;
    color:#fff;
    font-size:10px;
    line-height:10px;
    padding:5px 10px 3px 10px;
}

.main-popup-closer-pay :hover {
    cursor: pointer;
}

.ellipsis {
    text-overflow: ellipsis;
    overflow: hidden;
}
.reset-statuses-popup .main-popup-biggin .full-width .white-o {
    padding-left: 5px;
}
.log-out-button {
    padding: 15px 50px;
}
.contact-us-link {
    border-bottom: 1px solid #B3B3B3;
}

#invoice-popUp .main-popup-biggin .clickInvoice .canCreate .full-width .gr-br-sec{
    width: 125px;
}
 .multi-job-invoice-popup .main-popup-biggin .full-width .gr-br-sec{
    width: 125px;
}
.delete-job-from-invoice {
    cursor: pointer;
}
.new-item-cost:disabled {
    cursor: default;
}
.status-inner > .font-bold {
    width: 80%;
}
.white-butt.move-left {
    padding-left: 5px;
}
.tax-rate-payment {
    width: 44.5%;
    float: right;
}
.tax-rate-payment select {
    font-size: 15px;
    height: 36px;
    padding-left: 9px;
    width: 100%;
}
#add-change-log-btn {
    margin-right: 118px;
}
.reports-tools select {
    width: 160px;
}
.reports-tools .gr-br-sec.mr10.fleft {
    width: 160px;
}
#app-version {
    position: absolute;
    bottom: 10px;
    left: 25px;
}
#app-version-mobile {
    padding: 25px;
}

/*Responsive*/
@media only screen and (max-width:1330px) {
    .job-list-wrap {
        width: 96%;
        padding-left: 2%;
        padding-right: 2%;
        margin-left: 0;
    }
}

@media only screen and (max-width:1190px) {
    .job-list-wrap {
        width: 96%;
        padding-left: 2%;
        padding-right: 2%;
        margin-left: 0;
    }
    /*.jw2-3,.jw2-4,.jw2-5,.jw2-6,.jw2-7,.jw2-8,.jw2-9{}*/
    .job-list-anchors {
        margin-left: 0;
        width: 100%;
    }

    .status-drp {
        float: right;
        width: 60px;
        margin-right: 0 !important;
    }

        .status-drp span {
            width: 100%;
            position: static;
        }

        .status-drp div {
            width: 100% !important;
        }

    .main-min.bigger {
        width: 600px;
    }

    .job-search-tools .looped-field.w1132 {
        width: 136px !important;
    }
}

@media only screen and (max-width:960px) {
    #menu-bar:after {
        display: none;
    }

    #menu-bar {
        padding-top: 0;
        position: absolute;
        top: 35px;
        left: 0;
        z-index: 10;
        display: none;
    }

        #menu-bar.sec-switch {
            top: 0;
        }

        #menu-bar.active {
            display: block;
        }

    .menu-switch {
        display: block;
    }

    #main-page {
        width: 100%;
    }

    .jw1 {
        width: 4%;
    }

    .jw1 {
        position: relative;
        bottom: -3px;
    }

    .jw2 {
        width: 96%;
    }

    .jw2-1, .jw2-5, .jw2-6, .jw2-7, .jw2-8, .jw2-9 {
        width: 99.4% !important;
        margin-top: 10px;
    }

    .nonenone {
        display: inline-block;
        margin-right: 8px;
    }

    .jb-nvc {
        float: none;
        display: inline-block;
        margin-left: 0;
        position: relative;
        bottom: -1px;
    }

    .then-right {
        float: none;
        display: inline-block;
    }

    .jw2-9 .orange-butt {
        padding-left: 60px;
        padding-right: 60px;
        width: auto;
    }

    .jw2-1:not(.cus-job) {
        margin-top: 0;
    }

    .jw2-1 .font-bold {
        font-size: 18px;
    }

    .jw2-9 {
        text-align: left;
        margin-top: 22px;
        padding-bottom: 11px;
    }

    .jw2-2 {
        float: right;
        width: 54%;
        padding-left: 5%;
        padding-top: 7px;
        margin-top: 10px;
        text-align: left;
    }

    .jw2-3 {
        float: right;
        width: 19%;
        margin-top: 10px;
        padding-top: 5px;
        text-align: center;
    }

    .jw2-4 {
        float: left;
        width: 12%;
        margin-top: 10px;
        font-size: 24px;
        color: #333;
    }

    .then-half {
        width: 85%;
        padding-left: 1%;
    }

        .then-half.none, .jw2-3.cus-job-hfbl {
            display: block;
            width: 14%;
            padding-left: 0;
            padding-right: 0;
            float: left;
        }

    .jw2-3.cus-job-hfbl {
        margin-top: 0;
        padding-top: 0;
        text-align: left;
    }

    .jw2-5.cus-job-hfbl {
        width: 86% !important;
        padding-left: 0;
        padding-right: 0;
        float: left;
        margin-top: 0;
    }

    .jheading {
        display: none;
    }

    .jw-table {
        padding-top: 16px;
        padding-bottom: 16px;
    }

    .cust-table .then-half:not(.none) .jf-that {
        font-weight: 300 !important;
        color: #000 !important;
    }
    #app-version {
        display: none;
    }
     #app-version-mobile {
        display: block !important;
    }
}

@media only screen and (max-width:810px) {
    .hide810 {
        display: none !important;
    }
}
@media only screen and (max-width:467px) {
    .status-to-reassign .status-arrow {
        display: none !important;
    }
}
@media only screen and (max-width:870px) {
    .sending-buttons:not(.non-wrapable) {
        width: 30.3%;
        margin-right: 2%;
        margin-left: 0;
        float: none;
        display: inline-block;
    }

    .sending-buttons:not(.non-wrapable) {
        max-height: 36px;
    }

        .sending-buttons:not(.non-wrapable) i + .little-top {
            float: none;
            top: -6px;
            margin-left: 8px;
        }

        .sending-buttons:not(.non-wrapable) i {
            float: none;
            margin-left: 0;
        }

        .sending-buttons:not(.non-wrapable).gray {
            margin-bottom: 5px;
        }

    .butts-res-center-text {
        text-align: center;
    }

    .buttons-separator-line {
        display: none;
    }

    .status-drp {
        display: none;
    }

    .addit-menu {
        width: 94%;
        padding: 10px 3%;
        margin-left: 0;
        margin-bottom: 20px;
    }

        .addit-menu ul, .addit-menu h2 {
            width: auto;
            display: inline-block;
            float: none;
        }

        .addit-menu h2 {
            margin-right: 30px;
            position: relative;
            bottom: -6px;
        }

        .addit-menu li {
            width: auto;
            float: none;
            display: inline-block;
        }

            .addit-menu li a {
                border-top: none !important;
                padding-right: 12px;
            }

    .addit-menu-1 {
        width: 94%;
        padding: 10px 3%;
        margin-left: 0;
        margin-bottom: 20px;
    }

        .addit-menu-1 ul, .addit-menu-1 h2 {
            width: auto;
            display: inline-block;
            float: none;
        }

        .addit-menu-1 h2 {
            margin-right: 30px;
            position: relative;
            bottom: -6px;
        }

        .addit-menu-1 li {
            width: auto;
            float: none;
            display: inline-block;
        }

            .addit-menu-1 li a {
                border-top: none !important;
                padding-right: 12px;
            }

    .main-min, .main-min.bigger {
        width: 94%;
        padding: 10px 3%;
        margin-left: 0;
    }

    .job-per-anchor {
        display: none;
    }

    .status-popup {
        display: block;
    }

    .add-file:not(.nondisable) {
        display: none;
    }

    .formitable {
        display: block;
    }

    .right-slide-out {
        display: none;
    }

    .job-search-tools .looped-field.w1132 {
        width: 150px !important;
    }

    .cost-item-price-block {
        right: 1.5%;
    }
	.colorpicker-right:before{
		left: 0px !important;
		right: auto !important;
	}
	.colorpicker-right:after{
		left: 0px !important; 
		right: auto !important;
	}
	.colorpicker.dropdown-menu{
		margin: 2px 145px 0;
	}    
}

@media only screen and (max-width:770px) {
    .login-halfs-wrapper {
        width: 100%;
    }

    .then-mobile {
        margin-top: 5px;
    }

    .addit-menu {
        margin-bottom: 0;
        padding-bottom: 0;
    }

        .addit-menu .actual-h2, .then-mobile-head {
            font-size: 18px;
            margin-left: 0;
        }

        .addit-menu .actual-h2 {
            margin-bottom: 15px;
        }

        .addit-menu ul li a {
            margin-top: 0 !important;
        }

    .addit-menu-1 {
        margin-bottom: 0;
        padding-bottom: 0;
    }

        .addit-menu-1 .actual-h2, .then-mobile-head {
            font-size: 18px;
            margin-left: 0;
        }

        .addit-menu-1 .actual-h2 {
            margin-bottom: 15px;
        }

        .addit-menu-1 ul li a {
            margin-top: 0 !important;
        }
}

@media only screen and (max-width:750px) {
    #top-menu > ul a {
        margin-left: 10px;
        margin-right: 10px;
        padding-left: 20px;
        padding-right: 20px;
    }

    .make-it-inline {
        display: none;
    }

    .then-half {
        width: 79%;
        padding-left: 1%;
    }

        .then-half.none, .jw2-3.cus-job-hfbl {
            display: block;
            width: 20%;
            padding-left: 0;
            padding-right: 0;
        }

    .jw2-5.cus-job-hfbl {
        width: 80% !important;
    }

    .adv-big-popup {
        width: calc(96% - 2px) !important;
        padding-left: 2% !important;
        padding-right: 2% !important;
    }

    .inner-half {
        width: 100%;
    }
    
}

@media only screen and (max-width:640px) {
    .job-status-list-item {
        width: 100%;
    }
    .job-status-list-item .status-container .status-description {
        padding-right: 13%;
    }
}

@media only screen and (max-width:590px) {
    .saved-price-block {
        width: 100%;
        position: relative;
        right: auto;
        top: auto;
        float: left;
        margin-bottom: 20px;
    }

    .sending-buttons:not(.non-wrapable) {
        text-align: center;
    }

    .sending-buttons:not(.non-wrapable) {
        max-height: 300px;
    }

        .sending-buttons:not(.non-wrapable) .little-top, .sending-buttons:not(.non-wrapable) .clean-send, .sending-buttons:not(.non-wrapable) .clean-plus {
            width: 100%;
            float: left !important;
            margin-left: 0 !important;
            margin-right: 0;
        }

        .sending-buttons:not(.non-wrapable) .little-top {
            top: 0 !important;
        }

        .sending-buttons:not(.non-wrapable) .snd-removable {
            display: none;
        }

    .jw1 {
        width: 7%;
    }

    .jw2 {
        width: 93%;
    }

    .jw2-2 {
        float: right;
        width: 20%;
        padding-right: 10%;
        padding-top: 7px;
        margin-top: 10px;
        text-align: center;
    }

    .jw2-3 {
        float: right;
        width: 42%;
        margin-top: 10px;
        padding-top: 5px;
        text-align: center;
    }

    .jw2-4 {
        float: left;
        width: 18%;
        margin-top: 10px;
        font-size: 24px;
        color: #333;
    }

    .then-half {
        width: 65%;
        padding-left: 1%;
    }

        .then-half.none, .jw2-3.cus-job-hfbl {
            display: block;
            width: 34%;
            padding-left: 0;
            padding-right: 0;
        }

    .jw2-5.cus-job-hfbl {
        width: 66% !important;
    }

    .plus-icon, .minus-icon {
        position: static;
        top: auto;
        margin-top: 3px;
        margin-left: 2px;
    }

    #main-page {
        width: 100%;
    }

    .invoice-dropable > .full-width > .top-min {
        top: 0;
    }

    .invoice-dropable > .full-width {
        margin-bottom: 14px;
        float: left;
    }

        .invoice-dropable > .full-width > span:first-child:not(.top-bott-arr),
        .invoice-dropable > .full-width > label {
            width: 100%;
            margin-left: 0;
            margin-right: 0;
            display: block;
        }

    .nvc-table .mob-removable, .img-nvc-removable {
        display: none;
    }

    .w37 {
        width: 100%;
        margin-left: 0;
        margin-right: 0;
        margin-bottom: 6px;
    }

        .w37 .ml12 {
            margin-left: 0;
        }

    .w27 {
        width: 45%;
        margin-left: 0;
        margin-right: 0;
    }

    .w21 {
        width: 35%;
        margin-left: 0;
        margin-right: 0;
    }

    .w15 {
        width: 20%;
        margin-left: 0;
        margin-right: 0;
    }

    .invoice-dropable > .full-width input[type="text"] {
        width: calc(94% - 2px) !important;
        margin-left: 0;
        margin-right: 0;
        padding-left: 3%;
        padding-right: 3%;
    }

    .invoice-dropable > .full-width .gr-br-sec {
        width: calc(100% - 2px) !important;
        margin-left: 0;
        margin-right: 0;
    }

    .new-job-fields input[type="text"]:not(.looped-field), .new-job-fields .gr-br-sec, .new-job-fields .min100:not(.no-mobres), .new-job-fields .mob-full {
        width: calc(98% - 4px) !important;
        padding-left: 1% !important;
        padding-right: 1% !important;
        margin-left: 0 !important;
        margin-right: 0 !important;
        text-align: left;
    }

    .new-job-fields .top-min {
        top: 0;
    }

    .new-job-fields > div:not(.no-wrplb) {
        margin-top: 6px;
        margin-bottom: 6px;
    }

    .new-job-fields .mob-none {
        bottom: -4px !important;
        float: none;
    }

    .adv-popup, .adv-popup-con ,.adv-popup-con-sel  {
        width: calc(100% - 2px);
    }

        .adv-popup .looped-field, .adv-popup-con .looped-field, .adv-popup-con-sel .looped-field {
            width: calc(92% - 4px);
            margin-left: 2%;
            margin-right: 2%;
            padding-left: 2%;
            padding-right: 2%;
        }

    label .no-mobres {
        text-align: left;
    }

    .main-popup, .main-popup.bit-small, .main-popup.bit-big, .main-popup.so-small, .main-popup.very-small {
        width: 96%;
        margin-left: 2%;
        margin-right: 2%;
        top: 50px;
        left: 0;
    }

        .main-popup.bit-small .objs-wrapper {
            width: 100%;
            padding: 0;
        }

    #top-menu ul {
        width: 100%;
    }

    #top-menu > ul:not(.scheduler-menu-top) li {
        margin-left: 3% !important;
        margin-right: 3%;
    }

    #top-menu > ul:not(.scheduler-menu-top) a {
        margin-left: 0 !important;
        margin-right: 0;
        padding-left: 8px;
        padding-right: 8px;
    }

    .menu-switch {
        display: none;
    }

    #header {
        text-align: center;
        padding: 4px 0;
    }

    .user-tr > .just-tr-inner > div.fright {
        display: none;
    }

    .user-tr {
        padding-left: 2%;
        padding-right: 0;
        margin-left: 0;
        margin-right: 0;
        margin-top: 0;
    }

        .user-tr > .just-tr-inner {
            margin-right: 10px;
        }

        .user-tr img {
            max-width: 100%;
        }

    #logo {
        display: none;
    }

    .sec-menu-additional {
        display: block;
        margin-left: 3%;
    }

        .sec-menu-additional .menu-switch.sec-switch {
            width: 31px;
            height: 21px;
            background: url('../assests/images/highq/hamburger-menu-black.svg') center center no-repeat;
            display: inline-block;
            float: left;
            margin-top: 12px;
            margin-right: 21px;
        }

        .sec-menu-additional .search-loop-black {
            width: 28px;
            height: 28px;
            background: url('../assests/images/highq/search-loop-black.svg') center center no-repeat;
            display: inline-block;
            float: left;
            margin-top: 8px;
        }

    .search-loop-black-toggle {
        width: calc(100% - 60px) !important;
        margin: 0;
        padding: 4px 43px 4px 15px;
    }

    .job-list-wrap .make-it-full {
        display: none;
    }

    .job-search-tools {
        display: none;
    }

    .mob-make-center {
        text-align: center;
    }

    .dropable-page {
        display: block;
    }

    .customer-nvc {
        margin-top: 0;
    }

        .customer-nvc .tbody, .customer-nvc-sub .tbody {
            padding: 8px 0;
        }

    .nvc-table.customer-nvc .w37, .nvc-table.customer-nvc-sub .w37,
    .nvc-table.customer-nvc .w15, .nvc-table.customer-nvc-sub .w15,
    .nvc-table.customer-nvc .w21, .nvc-table.customer-nvc-sub .w21,
    .nvc-table.customer-nvc .w27, .nvc-table.customer-nvc-sub .w27 {
        width: 94%;
        padding: 5px 3%;
    }

        .nvc-table.customer-nvc-sub .w27 span.ml12 {
            margin-left: 0;
        }

        .nvc-table.customer-nvc .w37 input[type="checkbox"] {
            display: none;
        }

    .customer-nvc .rmvbl, .customer-nvc-sub .rmvbl {
        display: block;
    }

    .customer-nvc .halfbl, .customer-nvc-sub .halfbl {
        width: 69%;
        float: left;
    }

    .acc-pagenav {
        margin: 10px 0;
    }

    .customer-nvc-sub {
        margin-top: 0;
    }

    .job-search-tools.nonhideable {
        display: block;
        background: transparent;
        padding: 0;
        margin-top: 20px;
    }

        .job-search-tools.nonhideable .hhidable {
            display: none;
        }

        .job-search-tools.nonhideable .aapearable {
            display: block !important;
            margin-left: 3%;
        }

    .fulbl-u {
        width: 100%;
    }

    .make-full-aw {
        width: calc(96% - 2px) !important;
        padding-left: 2% !important;
        padding-right: 2% !important;
    }

        .make-full-aw.full {
            width: calc(100% - 2px) !important;
            padding-left: 0 !important;
            padding-right: 0 !important;
        }

    .halfbl-f {
        width: 22%;
        margin-left: 0;
        margin-right: 0;
        display: block !important;
        float: left;
        text-align: right;
        margin-right: 8%;
        font-size: 15px;
    }

        .halfbl-f * {
            display: inline-block;
            float: none;
        }

    .halfbl-s {
        width: 70%;
        margin-left: 0;
        margin-right: 0;
        display: block;
        float: left;
    }

    .add-padd-dd {
        padding-left: 6%;
    }

    .line-appearable {
        width: 100%;
        height: 1px;
        background-color: #d4d4d4;
        display: block;
        float: left;
        margin-top: 18px;
    }

    .login-halfs-wrapper .login-halfs {
        width: calc(88% - 2px);
        margin: 10px 2%;
        padding-top: 20px;
        padding-bottom: 20px;
        height: auto;
    }

        .login-halfs-wrapper .login-halfs:last-child {
            padding-top: 50px;
            padding-bottom: 50px;
        }

            .login-halfs-wrapper .login-halfs:last-child h2 {
                margin-top: 0;
            }

    .scheduler-menu-top {
        width: 100% !important;
    }

    .user-tr .black-upper-dropdowns {
        right: 0;
    }

    .none590 {
        display: none;
    }

    .payment-process-popup .w30 {
        width: 100%;
    }

    .tbody.payment .w30 .title, .tbody.payment .w30 .value, .payment-tabs-trigger {
        display: block;
        width: 49%;
        float: left;
        margin: 0;
        margin: 5px 0;
    }

    .tbody.payment .w30 .title {
        padding-right: 2%;
    }

    .payment-process-popup .payment-butts-been {
        text-align: center;
    }

    .payment-process-popup .orange-butt {
        float: none;
        display: inline-block;
        margin-bottom: 10px;
    }

    .cost-item-price-block {
        width: 100%;
        position: inherit;
    }

    .sending-buttons:not(.non-wrapable) {
        width: 100%;
    }
}

@media only screen and (max-width:540px) {
    .upload-popup-header {
        display: none;
    }

    .upload-popup-wrapper {
        margin-top: 12px;
    }

        .upload-popup-wrapper .upload-popup-name-holder {
            width: calc(100% - 50px) !important;
        }

        .upload-popup-wrapper .upload-popup-small, .upload-popup-wrapper .upload-popup-big {
            width: 100%;
        }

        .upload-popup-wrapper .upload-popup-big {
            margin-top: 5px;
        }

            .upload-popup-wrapper .upload-popup-big input.gr-br-field {
                width: calc(85% - 2px) !important;
            }

    .main-popup.upload .upload-popup-buttons {
        text-align: center;
        width: 100%;
    }

        .main-popup.upload .upload-popup-buttons a, .main-popup.upload .upload-popup-buttons button {
            float: none;
            display: inline-block;
            margin-top: 12px !important;
        }

        .main-popup.upload .upload-popup-buttons a {
            position: relative;
            top: -3px;
        }

    .adv-popup.custom, .adv-popup-con.custom {
        width: calc(100% - 22px);
    }
    .reset-statuses-container {
        width: 100% !important;
    }
    #reset-job-statuses {
        margin-bottom: 20px;
    }
     #reset-system-statuses-names {
        margin-bottom: 20px;
    }
    .save-job-statuses {
        float: left;
    }
}

@media only screen and (max-width:490px) {
    #prices-been {
        width: 100%;
        margin-bottom: 20px;
    }

    .no-text-images img {
        width: 100%;
    }
    #download-example-csv {
        width: 100%;
        margin-top: 10px;
        float: left;
        margin-left: 0;
    }
}

@media only screen and (max-width:361px) {
    .main-popup.upload .upload-popup-buttons button {
        margin-right: 0;
    }
}
@media only screen and (max-width:321px) {
    .main-popup.upload .upload-popup-buttons button {
        margin-right: 0;
    }
    .status-popup .priority  {
        width: 76% !important;
    }  
}

@media only screen and (max-width:400px) {
    #top-menu > ul li {
        margin-left: 1.1% !important;
        margin-right: 1.1%;
    }

    .login-popup {
        width: calc(86% - 2px);
        left: 3%;
        padding: 30px 4%;
        margin-left: 0;
    }
    .dd-statuses-container {
        width: 80%;
        margin-bottom: 20px;
    }
    .dd-priorities-container {
        width: 81%;
        margin-left: 0;
    }
    .status-popup .priority  {
        width: 79%;
    }  
    .status-popup .priority .priority-item {
        width: 100%;
    }   

}
/*END of responsive*/

/*Categories section*/
#import-csv-btn {
    position: relative;
    overflow: hidden;
    padding: 9px 20px 9px 40px;
    height: 18px;
}
#import-csv-btn span {
    padding-left: 15px;
}
#import-csv-btn input.upload{
    position: absolute;
    top: 0;
    right: 0;
    margin: 0;
    padding: 0;
    cursor: pointer;
    opacity: 0;
    filter: alpha(opacity=0);
}
.template-import .dis-iblock {
    vertical-align: top;
    padding-top: 10px;
}
.categories-container .category {
    margin: -3px;
    box-sizing: border-box;
    border:  1px solid #D4D4D4;
    margin-right: 2px;
}
.categories-container .category.root-category {
    margin-right: -1px;
}
.category-items-container {
    min-height: 400px; 
    max-height: 600px;
    overflow-y: auto;
    overflow-x: hidden;
    font-size: 13px;
}
.root-category .category-items-container :nth-child(2) .category-item-name:after  {
    content: "*";
}
.category-header {
    height: 25px;
    background-color: #E6E6E6;
}
.category-btn {
    height: inherit;
    width: 15px;
    font-size: 24px;
    margin-top: -2px;
    background: none;
    font-weight: bold;
    font-family: sans-serif;
    cursor: pointer;
}
.category-btn:active:focus {
    color: #4d4d4d;
}

.all-item {
    width: auto;
    margin-top: 3px;
    margin-left: 5px;
}

.minus-btn {
    margin-top: -4px;
}

.category-item {
    width: 97%;
    margin-top: 5px;
    height: 25px;
    position: relative;
    padding-left: 5px;
    padding-top: 9px;
    cursor: pointer;
}

.category-item.active .category-item-name[contenteditable="true"] {
    outline:none;
    border-color:#9ecaed;
    box-shadow: 1px 0 5px #9ecaed;
}

.category.root-category .category-item.active {
    color: #fff;
    background-color: #f16522;
}
.category .category-item.active {
    color: #fff;
    background-color: #666666;
}
.category-item:hover {
    color: #fff;
    background-color: #D4D4D4;
}
.category-item-name {
    white-space: nowrap;
    width: 60%;
}
.category-item-name.short {
     width: 60%;
}
.expand-category {
    text-align: center;
}
.category-preset {
    font-weight: bold;
    font-size: 16px;
    width: 60%;
}
.template-container {
    /*width: 55%;*/
     margin-top: 15px;
}
.template-container .font12 {
       width: 10%;
}
.categories-section .category-templates .looped-field {
    width: calc(95% - 19px) !important;
}
.categories-section .category.adv-popup, .categories-section .category.adv-popup-con.adv-popup-con-sel {
    width: 264px;
}
.categories-section .category .looped-field {
     width: calc(95% - 20px) !important;
}
.categories-section .pop-inner span{
    white-space: nowrap;
    width: 77%;
}
.categories-section .category .pop-inner > span{
    position: absolute;
    margin-left: 5px;
}
.categories-section .category-name {
    width: 230px;
    padding-right: 25px;
}
.categories-section .category-selection-category {
    width:284px;
}
.categories-section-filters .category-name {
    width:190px !important;
}

.categories-section-filters .category-selection-category {
    width:206px !important;
}
.categories-section .workers-section #filter-workers{
    margin-left: 0;
    margin-top: 0;
}

.categories-section .workers-section #search-slots-btn {
    background-color: #4d4d4d;
    padding: 6px 15px;    
}
.categories-section .workers-section #start-date {
    width: 60%;
}
.categories-section .workers-section .looped-field {
    height: 28px;
    margin-bottom: 0;
}
.categories-section .workers-section table th {
    font-size: 13px;
    text-align: left;
    color: #4d4d4d;
}
.categories-section .workers-section table tr {
    vertical-align: top;
}
.categories-section .workers-section table tr td {
    font-weight: bold;
    padding: 7px 0;
}
.categories-section .workers-section table th>span {
    margin-left: 10px;
    content:url(../assests/images/top-down-arrow.png);
}
#workers-table {
    border-collapse: collapse;
}
#workers-table tr td:not(:last-child){
    padding-right: 10px;
}
.worker.selected.underlined {
    border-bottom: 2px solid  #DFDFDF;
}
.categories-section #clear-filters {
    margin-top: -28px;
    margin-right: 10px;
}

.categories-preview .preset-preview .pop-inner:hover{
    background-color: transparent;
    color:black;
}
.categories-preview {
    background-color:  #F2F2F2; 
}
.categories-preview > div {
    margin-top: 20px;
    margin-bottom: 20px;
}
.categories-preview > div > div {
    color: black;
}
.categories-preview > div:not(:last-child) {
    border-right: 2px solid  #DFDFDF;
}
.categories-preview > div:last-child {
    border-left: 2px solid  #DFDFDF;
    margin-left: -2px;
}
.categories-preview > div:nth-child(4) {
    border-right: none;
    border-left: 2px solid  #DFDFDF;
    margin-left: -2px;
}

.active-preset:before {
    position: absolute;
    content: "▸";
    margin-left: -15px;
    margin-top: -0.5%;
}

span.active-preset {
    margin-left: 5px;
}

@media only screen and (max-width:870px) {
    .categories-section {
        width: 90% !important;
    }
}
@media only screen and (max-width:590px) {
   .category {
       margin-bottom: -2px;
       width: 40%;
   }
   .category:nth-child(2n) {
       border-right: 1px solid #D4D4D4;
   }
   .gr-br-field#category-template-name {
        width: 65%;
    }
   .category-preset {
       width: 70%;
   }
   .template-container {
        width: 100%;
    }
   .template-container .font12 {
       width: 15%;
   }
   .categories-section .clear-filters {
       margin-top: 30px;
   }
   .categories-section #start-date {
       width: 60% !important;
       padding-left: 9px !important;
       padding-right: 9px !important;
       margin-right: 10px !important;
   }
}
@media only screen and (max-width:490px) {
    #download-example-csv {
        width: 100%;
        margin-top: 10px;
        float: left;
        margin-left: 0;
    }
}
@media only screen and (min-width:401px) {
    .categories-preview {
        display: flex;
    }
    .preset-preview {
        flex: 1;
    }
}
@media only screen and (max-width:400px) {
    .category {
       margin-bottom: -2px;
       width: 80%;
       border-right: 2px solid #D4D4D4;
   }
    .categories-preview  {
        padding-right: 20px;
        padding-left: 20px;
    }
    .categories-preview > div:not(:last-child) {
        border-right: none;
    }
    .categories-preview > div {
        width: 80%;
    }
     .categories-preview > div:not(:first-child) {
        width: 80%;
        border-top: 2px solid  #DFDFDF;
        border-left: none;
    }

}

/*Categories section end*/


