@font-face 
{
    font-family: 'Open Sans Hebrew';
    src:    url('/client/fonts/opensanshebrew-regular-webfont.eot');
    src:    url('/client/fonts/opensanshebrew-regular-webfont.eot?#iefix') format('embedded-opentype'),
            url('/client/fonts/opensanshebrew-regular-webfont.woff') format('woff'),
            url('/client/fonts/opensanshebrew-regular-webfont.ttf')  format('truetype'),
            url('/client/fonts/opensanshebrew-regular-webfont.svg#opensanshebrew') format('svg');
    font-weight: normal;
    font-style: normal;
}

@font-face 
{
    font-family: 'Open Sans Hebrew';
    src:    url('/client/fonts/opensanshebrew-bold-webfont.eot');
    src:    url('/client/fonts/opensanshebrew-bold-webfont.eot?#iefix') format('embedded-opentype'),
            url('/client/fonts/opensanshebrew-bold-webfont.woff') format('woff'),
            url('/client/fonts/opensanshebrew-bold-webfont.ttf')  format('truetype'),
            url('/client/fonts/opensanshebrew-bold-webfont.svg#opensanshebrew') format('svg');
    font-weight: bold;
    font-style: normal;
}

@font-face 
{
    font-family: 'Roboto';
    src:    url('/client/fonts/Roboto-Regular-webfont.eot');
    src:    url('/client/fonts/Roboto-Regular-webfont.eot?#iefix') format('embedded-opentype'),
            url('/client/fonts/Roboto-Regular-webfont.woff') format('woff'),
            url('/client/fonts/Roboto-Regular-webfont.ttf') format('truetype'),
            url('/client/fonts/Roboto-Regular-webfont.svg#robotoregular') format('svg');
    font-weight: normal;
    font-style: normal;
}

@font-face 
{
    font-family: 'Roboto Medium';
    src:    url('/client/fonts/Roboto-Medium-webfont.eot');
    src:    url('/client/fonts/Roboto-Medium-webfont.eot?#iefix') format('embedded-opentype'),
            url('/client/fonts/Roboto-Medium-webfont.woff') format('woff'),
            url('/client/fonts/Roboto-Medium-webfont.ttf') format('truetype'),
            url('/client/fonts/Roboto-Medium-webfont.svg#robotomedium') format('svg');
    font-weight: normal;
    font-style: normal;
}

body
{
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;

    font-family: 'Open Sans Hebrew';
    font-size: 13px;
}

.height-100p
{
    height: 100%;
}

.site-button
{
    float:left;
    color : #2E5F75; 
    border: 1px solid #2E5F75; 
    border-radius: 7px; 
    font-size: 12px; 
    background-color: transparent;
    padding: 0 6px 1px 5px;
}

.site-button img {
    vertical-align: middle;
}

.site-button:hover {
    padding: 1px 5px 0 6px;
}

.ocr-box-label
{
    position: absolute;
    top: -17px;
    right: 0px;
    font-size: 12px;
    color: #cf7c34;
    font-weight: bold;
}

button:active, button:hover
{
    /* background-color: transparent !important; */
    filter: brightness(1.1);
}

.md-nav-item button:focus
{
    background-color: transparent !important;
}

.md-input-focused input:-webkit-autofill,
.md-input-focused input:-webkit-autofill:hover, 
.md-input-focused input:-webkit-autofill:focus, 
.md-input-focused input:-webkit-autofill:active  {
    -webkit-box-shadow: 0 0 0 30px #d0ebf5 inset !important;
    box-shadow: 0 0 0 30px #d0ebf5 inset !important;
}

textarea
{
    min-height: 47px !important;
}

input:-webkit-autofill,
input:-webkit-autofill:hover, 
input:-webkit-autofill:focus,
textarea:-webkit-autofill,
textarea:-webkit-autofill:hover,
textarea:-webkit-autofill:focus,
select:-webkit-autofill,
select:-webkit-autofill:hover,
select:-webkit-autofill:focus {
    -webkit-text-fill-color: #2E5F75 !important;
    -webkit-box-shadow: 0 0 0 1000px white inset !important;
    box-shadow: 0 0 0 1000px white inset !important;
}

button.large-button.md-focused
{
    filter: brightness(1.2);
}

.view, .view-container
{
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;

    /* overflow-x: hidden;
    overflow-y: auto; */
    
    background-color: white;
    overflow: hidden;
}

.view > md-content
{
    background-color: white;
}

.view md-content.gray
{
    background-color: #F2F2F2 !important;
}

.view md-content.orange
{
    background-color: #AD754614 !important;
}

*
{
    outline: none !important;
}

a
{
    text-decoration: none;
}

#popup-back
{
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 19;
    background-color: rgba(0,0,0,0.48);
    pointer-events: none;
    opacity: 0;
    
    transition: opacity 0.3s;
}

#popup-back.show
{
    pointer-events: all;
    opacity: 1;
}

#popup, #popup-system
{
    position: relative;
    margin: 0 auto;
    width: 800px;
    max-width: 100%;
    z-index: 20;
    padding: 20px;
    /* padding-top: 50px; */
    box-sizing: border-box;
    display: none;
    pointer-events: none;
}

#popup-system
{
    margin: 50px auto;
    z-index: 21 !important;
}

#popup-system video
{
    max-width: 100%;
}

#popup
{
    max-height: 100%;
}

#popup.wide
{
    width: 90%;
    height: 100%;
}

#popup.full-height
{
    height: 100%;
}

#popup-system
{
    z-index: 10;
}

.overlay-only
{
    display: none;
}

#overlay-view .overlay-only
{
    display: block;
}

#overlay-view
{
    display: none;
    pointer-events: none;
    position: fixed;
    bottom: 0%;
    width: 100%;
    z-index: 2;

    box-shadow: -8px 3px 8px rgb(0 0 0 / 6%);
    
    transition: bottom 0.3s;
}

#overlay-view.active
{
    display: block;
    pointer-events: all;
}

#overlay-view #overlay-view-view
{
    position: fixed;
    width: 100%;
    height: 50%;
    box-shadow: -8px -3px 8px rgb(0 0 0 / 6%);
}

#overlay-view-tab
{
    cursor: pointer;
    margin-top: -37px;
    background-color: white;
    width: 80px;
    padding: 10px;
    padding-right: 20px;
    padding-top: 5px;
    border-top-left-radius: 30px;
    box-shadow: -8px -3px 8px rgb(0 0 0 / 6%);
}

#overlay-view-tab img
{
    position: relative;
    top: 3px;
}

#overlay-view.show
{
    bottom: 50%;
}

.icon-tooltip-container
{
    pointer-events: all; 
    position: absolute; 
    width: 100%;
    max-width: 40px; 
    height: 100%; 
    display: inline-block; 
    top: 0px; 
    left: 0px
}

.from-offer, .fromoffer > md-card
{
    background-color: #ffeee0 !important;
}

.no-float
{
    float: none !important;
}

.from-client
{
    position: absolute;
    bottom: 0px;
    left: 0px;
}

@keyframes pop-in 
{
    0% 
    {
        transform: translateY(-100%);
    }
    100% 
    {
        transform: translateY(0);
    }
}

@keyframes pop-out
{
    0% 
    {
        transform: translateY(0);
    }
    100% 
    {
        transform: translateY(-100%);
    }
}

body.cid-6 .view-container .view > md-content
{
    background-color: #e7f8ff;
}

.virtual-repeat-header
{
    width: 97%;
    padding: 0 16px;
}

.md-virtual-repeat-container .md-virtual-repeat-scroller
{
    height: 97%;
    overflow-y: scroll;
}

/*
@keyframes pop-in 
{
    0% 
    {
        transform: translateY(-600px) rotateX(-30deg) scale(0);
        transform-origin: 50% 100%;
        opacity: 0;
    }
    100% 
    {
        transform: translateY(0) rotateX(0) scale(1);
        transform-origin: 50% 1400px;
        opacity: 1;
    }
}

@keyframes pop-out
{
    0% 
    {
        transform: translateY(0) rotateX(0) scale(1);
        transform-origin: 50% 1400px;
        opacity: 1;
    }
    100% 
    {
        transform: translateY(-600px) rotateX(-30deg) scale(0);
        transform-origin: 50% 100%;
        opacity: 0;
    }
}
*/

#popup.show, #popup-system.show
{
    display: block;
    pointer-events: all;
    animation: pop-in 0.2s linear;
}

#popup.hide, #popup-system.hide
{
    pointer-events: none;
    animation: pop-out 0.2s linear;
}

#popup .view, #popup-system .view
{
    position: relative;
    border-radius: 15px;
    padding: 30px 20px;
    box-sizing: border-box;
    box-shadow: 0 7px 8px -4px rgba(0,0,0,.2), 0 13px 19px 2px rgba(0,0,0,.14), 0 5px 24px 4px rgba(0,0,0,.12);
}

#popup md-content, #popup-system md-content
{
    max-height: 90vh;
    padding: 0px !important;
}

#popup menu
{
    display: none;
}

menu
{
    right: 0;
}

md-select-menu md-content::-webkit-scrollbar {

    -webkit-appearance: none;
    appearance: none;
}

md-select-menu md-content::-webkit-scrollbar:vertical {
    width: 8px;
}

md-select-menu md-content::-webkit-scrollbar:horizontal {
    height: 8px;
}

md-select-menu md-content::-webkit-scrollbar-thumb {
    background-color: #64899A;
    border-radius: 10px;
    border: 2px solid #ffffff;
}

md-select-menu md-content::-webkit-scrollbar-track {
    border-radius: 10px;  
    background-color: #ffffff; 
}

input:-webkit-autofill 
{
    -webkit-box-shadow: 0 0 0px 1000px #EEF1F2 inset;
    box-shadow: 0 0 0px 1000px #EEF1F2 inset;
    -webkit-text-fill-color: #2E5F75 !important;
}

input
{
    border: 1px solid black;
    background-color: transparent;
}

.strong
{
    font-weight: bold;
}

[dir=rtl] .md-toolbar-tools>.md-button:first-child
{
    margin-left: 0px;
}

md-backdrop.md-opaque.md-default-theme, md-backdrop.md-opaque
{
    background-color: black;
}

.splash-view .dev-info
{
    position: absolute;
    top: 10px;
    right: 10px;
}

#toaster
{
    position: fixed;
    top: 2px;
    width: 304px;
    left: 50%;
    margin-left: -150px;
    height: 50px;
    max-height: 300px;
    z-index: 10000;
    pointer-events: none;
    text-align: center;
}

md-toast
{
    padding: 0px;
}

md-toast button
{
    pointer-events: all !important;
}

.white-text
{
    color: white !important;
}

[dir=rtl] md-card .md-actions:not(.layout-column) .md-button.md-icon-button:last-of-type, [dir=rtl] md-card md-card-actions:not(.layout-column) .md-button.md-icon-button:last-of-type
{
    margin-left: 0px;
}

.tight .bk-table-button > button
{
    margin-right: -10px !important;
}

[dir=rtl] ._md-datepicker-floating-label._md-datepicker-has-calendar-icon>label:not(.md-no-float):not(.md-container-ignore)
{
    left: auto;
}

[dir=rtl] .md-icon-button+.md-datepicker-input-container
{
    margin-right: auto;
}

.md-datepicker-input-container
{
    width: 100%;
}

.mt-0 { margin-top: 0px !important; }
.mt-5 { margin-top: 5px !important; }
.mt-10 { margin-top: 10px !important; }
.mt-20 { margin-top: 20px !important; }
.mt-30 { margin-top: 30px !important; }
.mt-40 { margin-top: 40px !important; }
.mt-50 { margin-top: 50px !important; }
.mt-60 { margin-top: 60px !important; }
.mt-70 { margin-top: 70px !important; }
.mt-80 { margin-top: 80px !important; }
.mt-90 { margin-top: 90px !important; }
.mt-100 { margin-top: 100px !important; }
.mt-150 { margin-top: 150px !important; }
.mt-200 { margin-top: 200px !important; }

.mb-5 { margin-bottom: 5px !important; }
.mb-10 { margin-bottom: 10px !important; }
.mb-20 { margin-bottom: 20px !important; }
.mb-30 { margin-bottom: 30px !important; }
.mb-50 { margin-bottom: 50px !important; }

.mt--10 { margin-top: -10px !important; }
.mt--20 { margin-top: -20px !important; }
.mt--100 { margin-top: -100px !important; }

.mb--10 { margin-bottom: -10px !important; }

.mr-5 { margin-right: 5px !important; }
.mr-10 { margin-right: 10px !important; }
.mr-15 { margin-right: 15px !important; }
.mr-20 { margin-right: 20px !important; }
.mr-25 { margin-right: 25px !important; }
.mr-30 { margin-right: 30px !important; }
.mr-40 { margin-right: 40px !important; }
.mr-50 { margin-right: 50px !important; }
.mr-100 { margin-right: 100px !important; }

.ml-0 { margin-left: 0px !important; }
.ml-5 { margin-left: 5px !important; }
.ml-10 { margin-left: 10px !important; }
.ml-20 { margin-left: 20px !important; }
.ml-30 { margin-left: 30px !important; }
.ml--5 { margin-left: -5px !important; }
.ml--10 { margin-left: -10px !important; }
.ml--20 { margin-left: -20px !important; }
.ml--30 { margin-left: -30px !important; }
.ml--34 { margin-left: -34px !important; }
.ml--40 { margin-left: -40px !important; }

.top-10 { top: 10px; }
.top-20 { top: 20px; }

.pr-10 { padding-right: 10px; box-sizing: border-box; }

.pd-20 { padding: 20px; box-sizing: border-box; }
.pd-25 { padding: 25px; box-sizing: border-box; }
.pd-30 { padding: 30px; box-sizing: border-box; }
.pd-50 { padding: 50px; box-sizing: border-box; }
.pd-70 { padding: 70px; box-sizing: border-box; }

.pt-10 { padding-top: 10px !important; }
.pt-20 { padding-top: 20px !important; }
.pt-100 { padding-top: 100px !important; }
.pt-150 { padding-top: 150px !important; }
.pt-200 { padding-top: 200px !important; }

.pb-5 { padding-bottom: 5px !important; }
.pb-10 { padding-bottom: 10px !important; }
.pb-100 { padding-bottom: 100px !important; }
.pb-300 { padding-bottom: 300px !important; }
.pb-500 { padding-bottom: 500px !important; }

.width-50p { width: 50% }
.width-60p { width: 60% }
.width-70p { width: 70% }
.width-75p { width: 75% }
.width-100p { width: 100%; }
.width-80p { width: 80% }
.width-200 { width: 200px; max-width: 100%; }
.width-300 { width: 300px; max-width: 100%; }

.max-200 { max-width: 200px; }

.va-m { vertical-align: middle }

.fr { float: right; }
.fl { float: left; }

.zi-1 { z-index: 1; }

.o0 { opacity: 0; }
.o02 { opacity: 0.2; }
.o05 { opacity: 0.5; }
.strike { opacity: 0.5; text-decoration: line-through; }

.color-transparent { color: transparent }

.font-103 * { font-size: 103%; }

.vertical-center 
{
    margin: 0;
    position: absolute;
    top: 50%;
    -ms-transform: translateY(-50%);
    transform: translateY(-50%);
}

[dir=rtl] .md-chips.md-removable md-chip
{
    padding-left: 30px;
    padding-right: 10px;
}

md-menu-item img
{
    position: relative;
    top: 5px;
    margin-left: 10px;
}

.long md-chips-wrap
{
    margin-right: 0px;
}

.long md-chip
{
    width: 100%;
    border-radius: 40px;
    padding: 5px !important;
    height: auto !important;
    background-color: #F2F2F2;
    color: #2E5F75;
    font-weight: bold;
    padding-right: 10px !important;
}

.long md-chip md-icon
{
    color: #2E5F75;
}

._md-chip
{
    display: inline-block;
    margin-left: 5px;
    margin-bottom: 5px;
    border-radius: 30px;
    padding: 0px 10px;
    white-space: nowrap;
}

md-chips.md-default-theme md-chip, md-chips md-chip, ._md-chip
{
    background-color: #D58C4D;
    color: white;
}

._md-chip[disabled]
{
    background-color: transparent;
    color: black;
    opacity: 0.5;
}

md-chips.md-default-theme md-chip md-icon, md-chips md-chip md-icon
{
    color: white;
}

md-select
{
    position: relative;
}

password
{
    width: 100%;
}

.md-select-value > span
{
    color: #2E5F75;
}

md-input-container
{
    background-color: white;
}

#popup md-input-container, .card md-input-container, .white-box md-input-container, .tab md-input-container
{
    background-color: #F2F2F2 !important;
}

md-input-container:not(.no-style).md-input-focused, 
#popup md-input-container:not(.no-style).md-input-focused, 
.card md-input-container:not(.no-style).md-input-focused, 
.white-box md-input-container:not(.no-style).md-input-focused, 
.tab md-input-container:not(.no-style).md-input-focused, 
md-input-container:not(.no-style).md-input-focused .md-resize-wrapper
{
    background-color: #d0ebf5 !important;
}

.table-filter-no-value md-input-container:not(.no-style).md-input-focused 
{
    background-color: white !important;
}

md-input-container:not(.no-style) .md-select-value .md-select-icon
{
    position: absolute;
    top: 0px;
    left: 0px;
}

.no-arrow .md-select-value .md-select-icon
{
    display: none;
}

.transport-main-button
{
    position: absolute;
    top: 5px;
    left: 5px;
}

.date-selector
{
    background-color: white;
    border-radius: 30px;
    padding: 10px;
    display: inline-block;
    text-align: center;
    width: 230px;
    height: 37px;
    position: relative;
}

.w100 .date-selector
{
    width: 100%;
}

.date-selector .arrow
{
    position: absolute;
    z-index: 2;
    top: -1px;
}

.date-selector .arrow-left
{
    left: 0px;
}

.date-selector .arrow-right
{
    right: 0px;
}

.virtual-repeat-header .sort-arrow
{
    width: 20px;
    transform: rotate(90deg);
    margin-left: 10px;
    position: relative;
    top: 2px;

    transition: transform 0.3s, opacity 0.3s;

    opacity: 0.2;
}

.virtual-repeat-header .group-arrow
{
    position: absolute; 
    left: 10px;
    opacity: 0.2;
}

.virtual-repeat-header > div:hover .sort-arrow, .virtual-repeat-header > div:hover .group-arrow
{
    opacity: 0.5;
}

.virtual-repeat-header .sorted .sort-arrow, .virtual-repeat-header .group-arrow.active
{
    opacity: 1 !important;
}

.virtual-repeat-header .reverse-sort .sort-arrow
{
    transform: rotate(-90deg);
}

.switch-mode .md-container
{
    display: none !important;
}

.switch-mode .md-text
{
    position: relative !important;
    right: -26px !important;
}

.print
{
    display: none;
}

.progress
{
    width: 50px;
    margin-right: 10px;
}

/*
.view.admin .date-selector
{
    position: absolute;
    top: 75px;
    left: 10px;
}
*/

menu-desktop .date-selector md-datepicker
{
    margin-top: -8px;
}

.mobile-realtime .date-selector
{
    right: 15%;
}

.smaller-icon img
{
    width: 15px;
    margin-top: 5px;
}

.view.admin .filters-container
{
    position: absolute;
    top: 85px;
    right: 130px;
    width: 400px;
}

.filters-container .clear-filters
{
    width: 60px;
}

.date-selector md-datepicker
{
    display: inline-block;
    vertical-align: top;
    margin-top: -2px;
}

.date-selector .md-datepicker-input-container
{
    border: none;
    display: inline-block;
}

.date-selector .md-datepicker-input-container .md-datepicker-input
{
    color: #64899A !important;
    text-align: center;
    font-size: 13px;
    font-weight: bold;
}

.menu-date-selector
{
    margin: 0;
    background-color: transparent !important;
    overflow: hidden;
    width: 50px;
}

.menu-date-selector input
{
    display: none;
}

.small-request-button
{
    float: left;
    transform: scale(0.6);
    transform-origin: 0 0;
}

.large-button.small-request-button:active
{
    transform: translateY(3px) scale(0.59);
    box-shadow: 0px 0px 0px rgba(0,0,0,0.5);
}

.transport-request-button img
{
    transform: scale(2);
    margin-left: -10px;
    margin-right: 10px;
}

.transport-request-time
{
    position: absolute;
    top: 10px;
    left: 10px;
    font-size: 12px;
}

@keyframes rotate
{
    0% { transform: rotate(0deg) }
    100% { transform: rotate(359deg) }
}

.transport-request-searching
{
    transform-origin: 56% 55%;
    animation: rotate 1s infinite linear;
}

.clear-fix
{
    clear: both;
}

.clear-icon
{
    width: 90%;
}

.middle
{
    position: fixed;
    top: 50%;
    left: 0;
    width: 100%;
    text-align: center;
}

filtered-select[disabled]
{
    pointer-events: none;
}

md-dialog[md-theme=prompt] 
{
    width: 500px;
    max-width: 80%;
}

md-dialog[md-theme=wide]
{
    width: 1000px;
    max-width: 80%;
}

md-dialog[md-theme=wide] table
{
    width: 100%;
}

md-dialog-content .md-title
{
    font-size: 20px;
    font-weight: bold;
    color: #334750;
}

md-input-container:not(.no-style)
{
    width: 100%;
    background-color: white;
    /* background-color: #EEF1F2; */
    height: 42px;
    margin-top: 0px;
    margin-bottom: 30px;
    box-sizing: border-box;
}

.md-resize-wrapper
{
    background-color: white !important;
    margin-right: -2px;
    margin-left: -2px;
}

.tight md-input-container
{
    margin-bottom: 15px;
}

md-autocomplete
{
    width: 100%;
}

md-autocomplete md-input-container
{
    height: 45px;
}

md-input-container.no-bg
{
    background-color: transparent !important;
}

md-input-container.simple-border, .simple-border md-input-container
{
    background-color: white !important;
    border: 1px solid #64899A !important;
    border-radius: 10px;
}

.view-table
{
    padding-top: 5px;
}

.view-table:hover
{
    background-color: #ffecdc;
}

.table-filter-no-value md-input-container
{
    background-image: url(/client/img/icon-arrow-down.svg);
    background-repeat: no-repeat;
    background-position: right;
}

.table-filter-no-value md-input-container.md-input-focused, .table-filter-no-value .no-arrow md-input-container
{
    background-image: none;
}

.table-filter-no-value label
{
    padding-right: 10px !important;
}

.table-filter-no-value
{
    border-bottom: 1px dashed #2E5F75;
}

.table-filter-no-value md-input-container
{
    background-color: white !important;
}

.table-filter-no-value md-input-container input
{
    cursor: pointer;
}

.simple-border md-input-container input:not(.no-style), md-input-container textarea:not(.no-style)
{
    border-bottom: none !important;
}

md-input-container.simple-border md-input-container
{
    background-color: transparent !important;
}

md-input-container.simple-border .input-icon
{
    top: 9px;
}

.multi-router-order md-input-container
{
    margin-bottom: 12px;
}

.summary-viewer
{
    text-align: center;
    direction: ltr;
}

.summary-viewer table
{
    width: 100%;
}

.summary-viewer table.table1
{
    direction: ltr;
    border-spacing: 0px;

    margin-bottom: 40px;
    border-bottom: 2px dashed black;
    padding-bottom: 40px;
}

.summary-viewer table td, .summary-viewer table th
{
    border-bottom: 1px solid black;
}

.summary
{
    color: black;
    padding: 20px;
}

.summary .partner-info
{
    direction: rtl;
    float: right;
}

.summary .partner-info > div
{
    display: inline-block;
    vertical-align: top;
}

.summary .client-info
{
    float: left;
    text-align: left;
    margin-top: 10px;
    margin-bottom: 20px;
}

.summary .partner-info .partner-address
{
    margin-right: 20px;
    text-align: right;
}

.summary h1
{
    text-align: center;
}

.summary h3 
{
    margin-top: 30px;
    margin-bottom: -10px;
    text-decoration: underline;
    text-align: right;
}

.summary .total
{
    float: left;
    direction: rtl;
    margin-top: 20px;
    text-align: right;
}

.summary .total > div > div
{
    display: inline-block;
    vertical-align: top;
}

.summary .total > div > div:first-child
{
    width: 150px;
}

.summary .total.only-total
{
    width: 100%;
    font-size: 20px;
    float: none !important;
}

.summary .total.only-total > div > div:first-child
{
    width: 300px;
}

.summary .group-summary
{
    margin-top: 5px;
    margin-bottom: 10px;
    direction: rtl;
    text-align: right;

    background-color: #fdf2d2;
}

.summary .group-summary > div
{
    font-size: 12px;
    display: inline-block;
    vertical-align: top;
    margin-left: 30px;
}

.summary .total
{
    font-size: 12px;
}

.summary .grand-total
{
    margin-top: 10px;
    font-size: 120%;
    font-weight: bold;
}

.summary .summary-header
{
    clear: both;
    margin-top: 40px;
    text-align: center !important;
    border: 1px solid black;
    padding: 5px !important;
    position: relative;
}

.summary .summary-header .summary-company-name
{
    text-align: center;
    font-size: 24px;
    font-weight: bold;
}

.summary .summary-header .summary-type
{
    position: absolute;
    top: 10px;
    right: 20px;
}

.summary .summary-header .summary-date
{
    position: absolute;
    top: 10px;
    left: 20px;
}

.summary h2
{
    clear: both;
    margin-top: 110px;
    text-align: center !important;
    border: 1px solid black;
    padding: 20px !important;
}

.summary table
{
    direction: rtl;
    width: 100%;
    margin-top: 20px;
    border-collapse: collapse;
}

.summary table th, .summary table td
{
    border: none;
    text-align: right;
    border-bottom: 1px solid lightgray;
}

.summary table tr.header
{
    background-color: #EEE;
}

.summary .logo img
{
    height: 80px;
}

.summary .row
{
    width: 10%;
}

md-input-container input:not(.no-style), md-input-container textarea:not(.no-style)
{
    border-bottom: 1px solid #64899A !important;
    margin-top: 12px !important;
    padding: 10px !important;
    color: #2E5F75 !important;
    font-weight: bold;
    font-size: 15px;
}

md-input-container md-select:not(.no-style)
{
    border-bottom: 1px solid #64899A !important;
    color: #2E5F75 !important;
    font-weight: bold;
    font-size: 13px;
    padding: 6px;
    padding-top: 10px;
    padding-bottom: 0px;
}

.no-bottom-border md-input-container md-select
{
    border-bottom: none !important;
}

md-input-container.simple-border input, md-input-container.simple-border md-select
{
    border-bottom: none !important;
}

md-input-container.with-icon input
{
    padding-left: 50px !important;
}

.table-filter-no-value md-input-container input
{
    border-bottom: none !important;
}

md-input-container .md-placeholder, md-input-container label:not(.md-no-float):not(.md-container-ignore) {
    transform: translate3d(0,30px,0) scale(1);
    font-weight: bold;
    color: #2E5F75;
}

md-input-container.md-input-focused label:not(.md-no-float), md-input-container.md-input-has-placeholder label:not(.md-no-float), md-input-container.md-input-has-value label:not(.md-no-float) {
    /* color: #636363; */
    color: #000;
    font-weight: normal;
    transform: translate3d(0,23px,0) scale(.75);
}

[dir=rtl] md-card .md-actions:not(.layout-column) .md-button.md-icon-button:first-of-type, [dir=rtl] md-card md-card-actions:not(.layout-column) .md-button.md-icon-button:first-of-type
{
    margin-right: 0px !important;
}

.daily-report-info
{
    width: 66%;
}

.md-button.large-button.md-default-theme:not([disabled]).md-focused, .md-button.large-button:not([disabled]).md-focused, .md-button.large-button.md-default-theme:not([disabled]):hover, .md-button.large-button:not([disabled]):hover
{
    filter: brightness(1.2);
    /* background-color: #D58C4D !important; */
}

.md-button.large-button[disabled]
{
    background-color: #e4e4e4 !important;
    box-shadow: none;
    transform: translateY(3px) scale(0.99);
    box-shadow: 0px 0px 0px rgba(0,0,0,0.5);
}

[dir=rtl] md-input-container .md-placeholder, [dir=rtl] md-input-container label:not(.md-no-float):not(.md-container-ignore)
{
    padding-right: 0px;
}

.file-selector-input
{
    display: none;
}

md-checkbox.md-default-theme.md-checked .md-icon, md-checkbox.md-checked .md-icon
{
    background-color: #487386;
}

md-input-container label
{
    color: #636363;
    margin-right: 10px;
}

md-content.md-default-theme, md-content
{
    background-color: white;
}

.tags
{
    margin-top: 17px;
}

.md-tab
{
    text-transform: none;
}

.tags .md-tab
{
    font-size: 14px;
    padding: 3px 15px;
    background-color: #BACAD1;
    margin: 2px;
    color: white;
    border-radius: 13px;
}

.tags .md-tab.md-active
{
    background-color: #64899A;
    color: white;
}

.tags md-tabs-wrapper
{
    border-color: transparent;
}

.tags md-content
{
    padding: 0px 20px;
}

.tags md-pagination-wrapper
{
    height: auto;
}

.tags h2
{
    text-align: center;
    font-size: 15px;
    margin-top: 0px;
}

.add-photo
{
    position: relative;

    background-color: white;
    width: 100%;
    height: 235px;
    /* height: 280px; */
    background-image: url(/client/img/icon-add-photo.svg);
    background-position: center;
    background-repeat: no-repeat;
    background-size: 80px;
    
    margin-bottom: 14px;
    
    font-size: 15px;
    text-align: center;
    padding-top: 174px;
    box-sizing: border-box;

    cursor: pointer;
}

#popup .add-photo, .card .add-photo, .white-box .add-photo, .tab .add-photo
{
    background-color: #F2F2F2;
}

.earning-transport.odd
{
    background-color: #CCC !important;
}

.tight .add-photo
{
    height: 200px;
    padding-top: 140px;
}

.large .add-photo
{
    height: 450px;
    padding-top: 270px;
}

.add-photo video, .add-photo .video-container
{
    position: absolute;
    top: 0;
    width: 100%;
    height: 100%;
    left: 0;
}

.add-photo .video-container
{
    background-color: rgba(0,0,0,0.9);
}

.cover
{
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center;
}

.cover1
{
    width: 120px;
    height: 70px;
}

.cover2
{
    width: 90px;
    height: 90px;
}

.cover3
{
    width: 360px;
    height: 257px;
}

.cover4
{
    width: 50px;
    height: 20px;
}

.cover5
{
    width: 100% !important;
    height: 400px !important;
    background-size: contain !important;
}

.jobs-left
{
    position: fixed;
    z-index: 1;
    bottom: 0px;
    left: 10px;
    color: black;
    width: 50px;
    height: 50px;
    text-align: center;
    font-size: 12px;
    font-weight: bold;
    /* pointer-events: none; */
}

.jobs-left md-progress-circular
{
    position: relative;
    top: -33px;
    left: -1px;
}

.document-picture
{
    display: inline-block;
    margin-left: 10px;
    margin-bottom: 10px;
    position: relative;
}

.document-picture .close
{
    top: 0px !important;
    right: 0px !important;
    background-color: rgba(0,0,0,0.3) !important;
    padding: 5px !important;
}

*[role=button]
{
    cursor: pointer;
}

.new-order
{
    background-color: #f5f5f5;
}

.table-buttons-container
{
    cursor: pointer;
}

.table-buttons-container button
{
    float: left;
}

.table-button-label
{
    float: left;
    padding: 8px 0px;
}

.add-photo.has-image
{
    background-size: contain;
    color: transparent;
}

.multi-route-transport .add-photo
{
    height: 100px;
    padding-bottom: 40px;
    padding-top: 130px;
    background-position: center 30px;
}

.multi-route-transport .rotate-picture
{
    color: transparent;
    width: 0px;
    background-size: 30px;
    margin-top: -17px;
    margin-right: -7px;
}

.multi-route-transport h2
{
    text-align: center;
    font-size: 16px;
}

md-slider-container.driver .md-slider-wrapper 
{
    width: 80%;
    margin-right: 20px;
    margin-top: -12px;
}

md-slider-container span
{
    direction: ltr;
    text-align: right;
}

md-slider-container.driver span
{
    margin-top: -18px;
    margin-right: -10px !important;
    margin-left: 20px !important;
}

.update-picture
{
    /*
    background-image: url(/client/img/icon-add-photo.svg);
    background-size: contain;
    background-repeat: no-repeat;
    background-position: left;
    */
    /* padding: 5px;
    padding-left: 30px;
    margin-bottom: 10px; */
    margin-top: -13px;
    text-align: left;
    float: left;
    margin-left: 0px;
}

.rotate-picture
{
    /*
    background-image: url(/client/img/icon-refresh.svg);
    background-size: contain;
    background-repeat: no-repeat;
    background-position: left;
    padding: 5px;
    padding-left: 30px;
    margin-bottom: 10px;
    */
    margin-top: -13px;
    margin-right: 0px;
    /* text-align: left; */
    float: right;
}

.down-arrow-icon
{
    position: absolute;
    top: 8px;
    left: 10px;
    pointer-events: none;
}

.icon-phone img
{
    width: 30px;
    height: 30px;
}

.card .icon-accept-offer
{
    margin-left: 5px !important;
}

.offer-card
{
    margin-bottom: 15px;
}

.offer-card.clicked
{
    border: 2px solid #D58C4D;
}

.card .icon-accept-offer img
{
    width: 35px;
    height: 35px;
}

.dig-no-posts
{
    padding: 50px;
    text-align: center;
}

.dig-no-posts div
{
    font-size: 20px;
}

.toggle-button
{
    width: 100%;
    padding: 20px;
    box-sizing: border-box;
    transition: all 0.3s;
    border-bottom: 1px solid #64899A !important;
}

.toggle-button.selected
{
    background-color: #D58C4D !important;
    color: white !important;
    border-bottom: 1px solid transparent !important;
}

.dig-add-view .toggle-button
{
    font-weight: bold;
    font-size: 15px;
    white-space: normal;
    line-height: 20px;
}


.icon-top-left
{
    position: absolute;
    top: 0;
    left: 0;
}

.icon-top-left-5p
{
    position: absolute;
    top: 5px;
    left: 5px;
}

.icon-top-right-5p
{
    position: absolute;
    top: 5px;
    right: 5px;
}

.icon-top-left-10p
{
    position: absolute;
    top: 10px;
    left: 10px;
}

.bookkeeper-order-status-icon
{
    position: absolute;
    bottom: 15px;
    left: 15px;
    width: 15px;
    height: 15px;
    border-radius: 50px;
}

.bookkeeper-order-status-icon-no-position::after
{
    content: "";
    position: absolute;
    top: 21px;
    right: 3px;
    width: 8px;
    height: 8px;
    border-radius: 50px;
}

.bookkeeper-order-status-icon-no-position.status-red::after
{
    background-color: #E85656;
}

.bookkeeper-order-status-icon-no-position.status-green::after
{
    background-color: #7AD54D;
}

.bookkeeper-order-status-icon-no-position.status-orange::after
{
    background-color: #892eb7;
}

.bookkeeper-order-status-icon.orange
{
    background-color: #892eb7;
}

.bookkeeper-order-status-icon.red
{
    background-color: #E85656;
}

.bookkeeper-order-status-icon.green
{
    background-color: #7AD54D;
}

.virtual-repeat-table
{
    height: 530px;
}

.smaller-table .virtual-repeat-table
{
    height: 300px;
}

.message-board
{
    background-color: white;
    overflow-x: hidden;
    overflow-y: hidden;
    height: 19px;
    transition: height 0.3s;
    box-shadow: 0px 3px 20px rgba(0,0,0,0.16);

    padding-top: 10px;
    padding-bottom: 10px;
    border-bottom-right-radius: 10px;
    border-bottom-left-radius: 10px;

    background-color: rgb(238, 238, 238);
    box-shadow: 0px 10px 10px rgb(0 0 0 / 20%);
}

.message-board.show
{
    overflow-y: scroll;
    height: 205px;
}

.message-board h2
{
    padding: 0;
    margin: 0px 10px;
    opacity: 1;
    height: 0px;
    line-height: 0px;
    overflow: hidden;
    transition: all 0.3s;
}

.message-board.show h2
{
    line-height: 50px;
    height: 50px;
    opacity: 1;
}

.message-board .message-list > div
{
    font-size: 14px;
    /* background-color: rgb(238, 238, 238); */
    padding-right: 5px;
    margin-bottom: 10px;
}

.message-board.show .message-list > div.odd
{
    background-color: #DDD;
    padding-top: 10px;
}

/*
.message-board .message-list > div.priority
{
    background-color: #D58C4D;
    color: white;
}
*/

.message-board .message-list > div .icon
{
    position: relative;
    top: 2px;
}

.message-board .message-list > div .text
{
    width: 95%;
    height: 20px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    display: inline-block;
}

.message-board.show .message-list > div .text
{
    width: auto;
    height: auto;
    overflow: visible;
    white-space: initial;
    display: inline;
}

.message-board .message-list > div.priority .text
{
    font-weight: bold;
}

.message-board .message-list .date
{
    opacity: 0;
    min-width: 80px;
    margin-top: 2px;
    margin-left: 15px;
    font-size: 10px;
    text-align: left;
    transition: opacity 0.3s;
    margin-bottom: 30px;
}

.message-board.show .message-list .date
{
    opacity: 1;
}

.ashtrum-lomda
{
    margin-top: 20px;
    border: 1px solid #64899A;
    background-color: white;
    text-align: center;
}

.ashtrum-lomda.oh-no
{
    border-color: #E85656;
}

.ashtrum-lomda.filled
{
    border-color: #0BC217 !important;
}

.ashtrum-lomda > div
{
    padding: 10px;
}

.ashtrum-lomda .days-left
{
    background-color: #64899A;
    color: white;
    padding: 20px;
}

.ashtrum-lomda.filled .days-left
{
    background-color: #0BC217 !important;
}

.ashtrum-lomda.oh-no .days-left
{
    background-color: #E85656;
    color: white !important;
}

.ashtrum-lomda .days-left span
{
    font-weight: bold;
    font-size: 30px;
}

md-progress-linear.h20 .md-container, md-progress-linear.h20 .md-container .md-bar.md-bar2
{
    height: 20px;
}

md-progress-linear.h2 .md-container, md-progress-linear.h2 .md-container .md-bar.md-bar2
{
    height: 2px;
}

.table-summary
{
    background-color: #ffffb4;
    color: black;
}

table.cnc
{
    border-collapse: collapse;
    width: 100%;
}

table.cnc tr th 
{
    background-color: black;
    color: white;
    position: sticky;
    top: 0;
    text-align: right;
    z-index: 1;
}

table.cnc td, table.cnc th
{
    vertical-align: top;
    padding: 5px;
}

table.cnc tbody tr:hover td, table.cnc a:hover
{
    background-color: rgb(224, 229, 231);
}

table.report-table
{
    width: 100%;
}

table.report-table thead tr th 
{
    background-color: #D58C4D;
    color: white;
    position: sticky;
    top: 0;
    text-align: right;
    z-index: 1;
}

table.report-table tbody td
{
    border-bottom: 1px solid #D58C4D;
}

table.report-table tbody tr:hover td, table.report-table a:hover
{
    /* color: #D58C4D; */
    background-color: rgb(224, 229, 231);
}

table tr.selected
{
    background-color: rgb(224, 229, 231);
}

table tr.highlighted
{
    font-weight: bold;
    background-color: rgb(224, 229, 231);
}

.strong
{
    font-weight: bold;
}

.underdriver
{
    padding-right: 20px;
}

.add-report-buttons > button
{
    margin: 0px;
    border-bottom: none !important;
}

.add-report-buttons > button div
{
    white-space: normal;
    line-height: 15px;
}

.report
{
    background-color: white;
    margin-bottom: 20px;
    border-radius: 10px;
    border: 1px solid black;
}

.report .report-message
{
    padding: 10px;
    padding-top: 15px;
    text-align: center;
    box-sizing: border-box;

    border-top-right-radius: 10px;
    border-bottom-right-radius: 10px;
}

.report .report-message p
{
    margin: 0;
    margin-bottom: -5px;
    margin-top: -7px;
}

.report .report-message h2
{
    margin: 0;
}

.report .report-button
{
    background-color: #D58C4D;
    color: white;
    text-align: center;
    width: 100px;
    font-size: 18px;
    padding-top: 15px;
    border-top-left-radius: 10px;
    /* border-bottom-left-radius: 10px; */
}

table.md-table th
{
    padding: 0px !important;
}

table.md-table tbody.md-body>tr.md-row, table.md-table tfoot.md-foot>tr.md-row, table.md-table thead.md-head>tr.md-row
{
    height: 30px;
}

table tr.highlight, .highlight
{
    background-color: #fff6e5;
}

table.report-table .document-picture img
{
    margin-top: 3px;
    width: 15px;
    height: 15px;
}

table.report-table .document-picture
{
    float: left;
    margin-right: 5px;
    cursor: pointer;
}

table.report-table td, table.report-table th
{
    padding: 0px 10px;
}

.warning
{
    color: #E85656 !important;
    font-weight: bold;
}

.ok
{
    color: #0BC217 !important;
    font-weight: bold;
}

.table-level1
{
    background-color: #e0e0e0 !important;
}

.odd .table-level1
{
    background-color: #f1efef !important;
}

.table-level2
{
    background-color: #fff3e9 !important;
}

.table-level3
{
    background-color: #f1faff !important;
}

/*
.table-level4
{
    
}
*/

.table-level4 span
{
    opacity: 0.7;
}

.green
{
    color: #ADCE6B !important;
    font-weight: bold;
}

.payment-cancelled
{
    opacity: 0.5;
    color: red !important;
}

.payment-cancelled input
{
    text-decoration: line-through;
}

.payment-cancelled md-input-container input:not(.no-style), .payment-cancelled md-input-container textarea:not(.no-style)
{
    color: red !important;
}

.counter.green
{
    color: white !important;
    background-color: #ADCE6B !important;
}

.counter.red
{
    background-color: #E85656 !important;
}

.counter.orange
{
    background-color: #D58C4D !important;
}

.counter.gray
{
    background-color: #B4C5CD !important;
}

.counter.black
{
    background-color: black !important;
}

.counter.blue
{
    background-color: #2E5F75 !important;
}

.counter.white
{
    background-color: white !important;
    color: black !important;
}

.counter.transparent
{
    color: black !important;
    border: 1px solid black;
    background-color: transparent !important;
}

.counter.blue-transparent
{
    color: #64899A !important;
    border: 1px solid transparent;
    background-color: transparent !important;
}

.counter.green-line
{
    color: green !important;
    border: 1px solid green;
    background-color: transparent !important;
    font-weight: bold;
}

.counter.blue-line
{
    color: #64899A !important;
    border: 1px solid #64899A;
    background-color: transparent !important;
    font-weight: bold;
}

.counter.chat
{
    position: absolute;
    top: 6px;
    right: 6px;
    width: 15px;
    height: 15px;
    min-width: 15px;
    min-height: 15px;
    line-height: 15px;
    font-size: 8px;
    background-color: #FF7263 !important;
}

.check span
{
    display: inline-block;
    height: 15px;
}

.check .key
{
    width: 80px;
}

.check .value
{
    width: 100px;
    border-bottom: 1px solid #CCC;
    font-weight: bold;
    font-style: italic;
}

.waiting-approval
{
    /* border: 1px solid #2E5F75; */
    background-color: #d9f3ff;
}

.cancelled-transport
{
    color: #b0544d;
}

.sign-drawer
{
    position: relative;
    opacity: 0;
}

.sign-drawer.show
{
    opacity: 1;
}

.sign-buttons
{
    position: fixed; 
    bottom: 10px; 
    width: 100%; 
    z-index: 3;
    background-color: rgba(255, 255, 255, 0.9);
}

.status-circle
{
    margin-top: 3px;
    margin-right: 3px;
    width: 15px;
    height: 15px;
    border-radius: 50px;
    background-color: #DDD;
}

.status-circle-100
{
    background-color: #7AD54D;
}

.status-circle-55
{
    background-color: #D58C4D;
}

.status-circle-40, .status-circle-50
{
    background-color: #46a6d2;
}

.status-circle-60
{
    background-color: #b0544d;
}

.status-circle-49
{
    background-color: #E85656;
}

.company-logo
{
    height: 100px;
}

.md-errors-spacer
{
    /* display: none; */
    pointer-events: none;
}

.admin-company-list.open .company-label
{
    color: #E1B9BA;
}

.admin-company-list.open .counter
{
    background-color: #E1B9BA !important;
}


md-autocomplete.autocomplete-small,
.autocomplete-small md-autocomplete-wrap
{
    min-width: auto;
}

/*
header.group-header
{
    background-color: #46a6d2 !important;
    color: white !important;
}
*/

.counter.group-header
{
    display: block !important;
    margin-left: 18px;
    margin-top: 20px;
}

.group-header-name
{
    width: 160px;
    font-size: 80%;
}

.truck-icon
{
    display: inline-block;
    vertical-align: top;
    height: 15px;
    margin-left: 10px;
}

.admin-truck-card .admin-truck-icon
{
    height: 50px;
    max-width: 100%;
}

.admin-truck-card .truck-icon-container
{
    padding: 50px;
    padding-bottom: 0px;
    box-sizing: border-box;
    text-align: center;
}

.admin-material-card
{
    padding-bottom: 0px !important;
}

.admin-material-card header
{
    background-color: white !important;
}

.card-my-message
{
    background-color: #64899A;
    color: white;
    border-color: transparent !important;
}

.html-viewer a, .summary a
{
    color: #D58C4D;
}

.html-viewer a:hover, .summary a:hover
{
    text-decoration: underline;
}

md-autocomplete[md-floating-label] .md-show-clear-button button 
{
    left: 0px;
    right: auto;
    top: 5px;
}

md-autocomplete[disabled] button
{
    display: none !important;
    pointer-events: none;
}

md-autocomplete md-input-container
{
    height: 40px;
}

md-autocomplete md-input-container input[type=search]
{
    height: 27px;
}

.card-announcement
{
    font-size: 12px;
    background-image: url(/client/img/icon-announcement.svg);
    background-repeat: no-repeat;
    background-position: top 10px left 10px;
    background-size: 20px;
    background-color: #D58C4D;
    color: white;
}

.card-announcement h1
{
    margin: 0;
    margin-bottom: 10px;
    font-size: 14px;
}

.transport-card
{
    min-height: 125px;
}

.transport-card.has-bottom
{
    min-height: 160px;
}

#graph-days
{
    display: inline-block;
    vertical-align: top;
    width: 600px;
    position: relative;
    top: 40px;
    left: -50px;
}

#graph-months
{
    display: inline-block;
    vertical-align: top;
    width: 300px;
    text-align: center;
    position: relative;
    top: 40px;
    left: -70px;
}

#graph-months h2.this
{
    font-size: 40px;
}

#graph-months h2.last
{
    font-size: 30px;
}

.graph-orders-today
{
    font-size: 100px;
    font-weight: bold;
}

.orange
{
    color: #D58C4D;
}

.orange-bg
{
    background-color: #ffe2c8;
}

.blue
{
    color: #64899A;
}

.dark-blue
{
    color: #2E5F75;
}

.transport-card.status-100, .order-card.status-100
{
    background-image: url(/client/img/order-complete-stamp.svg);
    background-repeat: no-repeat;
    background-position: top 5px left 5px;
    background-size: 80px;
}

.transport-card.status-100.transport-not-finished
{
    background-position: bottom 5px left 5px;
}

.transport-card.status-100.cert-
{
    min-height: 160px;
}

.auto-finished
{
    padding: 5px;
    margin-left: 10px;
    border: 2px solid #7AD54D;
    border-radius: 10px;
    font-size: 14px;
}

.order-card.status-100
{
    background-position: top 5px left 5px
}

.icon-refresh
{
    width: 30px;
    transition: all 0.2s;
}

.icon-refresh:hover
{
    transform: rotate(180deg);
}

.transport-card.status-71
{
    border: 2px solid #ff9595 !important;
}

.license-button
{
    transform: scale(0.85) !important;
    margin-top: 2px !important;
}

.help-item
{
    padding-bottom: 10px !important;
    border-bottom: 1px solid #c4dce7;
    padding-right: 10px !important;
}

.help-item .menu-item-icon
{
    position: relative;
    top: 7px;
    margin-left: 10px !important;
}

@keyframes slide-down
{
    0% { top: -100% }
    100% { top: 0% }
}

@keyframes slide-up
{
    0% { top: 0% }
    100% { top: -100% }
}

#zoom
{
    position: fixed;
    top: -100%;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 120;
    background-color: rgba(0,0,0,0.48);
    opacity: 0;
    text-align: center;
    
    transition: opacity 0.3s;
}

.summary-cancelled
{
    opacity: 0.3;
    position: absolute;
    top: 50px;
    left: 180px;
}

#zoom .is-cancelled
{
    background-image: url(/client/img/cancelled.png);
    width: 196px;
    height: 116px;

    position: absolute;
    top: 50px;
    left: 50px;
}

#zoom.show
{
    top: 0;
    opacity: 1;
}

#zoom.exit
{
    opacity: 0;
}

#zoom .loading
{
    position: absolute;
    top: 50%;
    left: 50%;
    z-index: 100;
}

#zoom .zoom-not-found
{
    background-color: white;
    display: inline-block;
    text-align: center;
    margin: 200px auto;
    width: 200px;
    padding: 50px;
    border-radius: 5px;
    font-size: 18px;
}

#zoom .zoom-not-found img
{
    float: right;
    margin-bottom: 20px;
}

#zoom .zoom-not-found span
{
    display: block;
    margin-top: 20px;
    color: #D58C4D;
    font-weight: bold;
    cursor: pointer;
    font-size: 13px;
}

#zoom.show .image
{
    animation: slide-down 0.3s forwards;
}

#zoom.exit .image
{
    animation: slide-up 0.3s forwards;
}

#zoom .temp-image
{
    opacity: 0;
}

#zoom .image
{
    position: absolute;
    top: -100%;
    left: 0;
    background-size: contain;
    background-position: center;
    background-repeat: no-repeat;
}

#zoom.normal .image
{
    width: 100vw;
    height: 100vh;
}

#zoom.rotate .image
{
    transform: rotate(90deg) translateY(-100vw);
    transform-origin: top left;
    height: 100vw;
    width: 100vh;
}

#zoom.normal.flipped .image
{
    transform: rotate(180deg);
}

#zoom.rotate .image
{
    transform: rotate(90deg) translateY(-100vw);
    transform-origin: top left;
    height: 100vw;
    width: 100vh;
}

#zoom.rotate.flipped .image
{
    transform: rotate(270deg) translateY(-100vh);
    transform-origin: top right;
}

md-autocomplete md-input-container input[type=search]
{
    height: 30px;
}

.ocr-button
{
    max-width: 40px !important;
    min-width: 40px !important;
    margin-top: 0px;
    height: 43px;
    margin-right: -2px;
    background-color: #f2f2f2;
    border-top-left-radius: 10px;
    border-bottom-left-radius: 10px;
    text-align: center;
    line-height: 59px;
    border-bottom: 1px solid #6898bf;
}

.ocr-button:hover
{
    background-color: #d0ebf5;
}

#ocr-suggestions-box
{
    position: fixed;
    z-index: 130;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 150px;
    background-color: white;
    border-top-left-radius: 20px;
    border-top-right-radius: 20px;
    padding: 0px 30px;
    box-sizing: border-box;
    font-size: 18px;
    box-shadow: 0px 0px 20px rgb(0 0 0 / 50%);
    padding-top: 10px;
}

#ocr-suggestions-box .ocr-container
{
    overflow-x: auto;
    white-space: nowrap;
    overflow-y: hidden;
    height: 130px;
    padding-left: 100px;
    margin-top: 10px;
}



#ocr-suggestions-box article
{
    display: inline-block;
    vertical-align: top;
    margin-left: 20px;
    margin-right: 20px;
    padding: 0px 20px;
    opacity: 0.5;
    transform: translateY(15px);

    transition: all 0.3s;
}

#ocr-suggestions-box article:hover
{
    opacity: 1;
    transform: translateY(5px);
}

#ocr-suggestions-box article.ocr-current
{
    opacity: 1;
    transform: translateY(5px);
    border-left: 5px dotted lightgray;
    padding-left: 70px;
    /* background-image: url(../img/icon-arrow-back2.svg); */
    /* background-repeat: no-repeat; */
    /* background-position: center left; */
}

#ocr-suggestions-box span
{
    white-space: nowrap;
}

#ocr-suggestions-box h2
{
    /* text-align: center; */
    margin-bottom: 20px;
}

#ocr-suggestions-box p
{
    margin-top: 0px;
    display: inline-block;
    position: relative;
    min-width: 100px;
}

#ocr-suggestions-box select, #ocr-suggestions-box input
{
    background-color: #F2F2F2 !important;
    border: none;
    border-bottom: 1px solid #64899A !important;
    margin-top: 0px !important;
    padding: 10px !important;
    color: #2E5F75 !important;
    font-weight: bold;
    font-size: 15px;
}

#ocr-suggestions-box button
{
    padding: 2px 20px;
    background-color: #64899a;
    color: white;
    border: none;
    font-size: 18px;
}

#ocr-suggestions-box #ocr-suggestions-box-hide
{
    position: absolute;
    left: 47px;
    top: 13px;
    z-index: 2;
}

#ocr-suggestions-box #ocr-suggestions-box-close
{
    position: absolute;
    left: 20px;
    top: 16px;
    z-index: 2;
}

.switch-box
{
    display: block;
    margin-top: -10px;
}

.switch-box img
{
    margin-left: 10px;
}

#ftcode-container
{
    position: absolute;
    bottom: 0px;
    left: 20px;
    text-align: center;
}

#ftcode
{
    color: lightgray;
    border: 3px dotted lightgray;
    height: 100px;
    line-height: 100px;
    margin-bottom: 30px;
}

#ftcode.has-code
{
    border: none;
}

md-input-container.size-400
{
    max-width: 400px !important;
}

md-input-container.highlight-label label, md-input-container.highlight-label input
{
    color: #D58C4D !important;
    font-weight: bold !important;
}

md-select[disabled] .md-select-value
{
    background-repeat: no-repeat;
    opacity: 0.5;
}

.popup-only
{
    display: none;
}

#popup .popup-only
{
    display: block;
}

#popup h2
{
    text-align: center;
    margin-bottom: 30px;
}

#zoom.x2
{
    overflow-y: scroll;
}

#zoom.x2 #zoom-image, #zoom.x2 #svg-container svg
{
    transform: scale(2);
    transform-origin: 50% 0;
}

#svg-container polygon
{
    fill: rgba(170,20,0,.25);
    /* stroke: rgba(0,0,0,.6); */
    stroke-width: 1px;
    transition: all 0.1s;
}

#svg-container polygon:hover
{
    fill: rgba(170,20,0,.5);
}

#zoom .close, #popup .close,
#zoom .rotate, #popup .rotate,
#zoom .hide-comment, #popup .hide-comment,
#zoom .print-icon,
#zoom .zoom-icon,
#popup-system .close
{
    position: absolute;
    
    padding: 10px;
    background-color: rgba(0,0,0,0.1);
    border-radius: 100px;
    z-index: 10;
    cursor: pointer;
}

#zoom .close, #popup .close, #popup-system .close
{
    top: 10px;
    right: 10px;
}

#zoom .rotate, #popup .rotate
{
    bottom: 8px;
    left: 10px;
}

#zoom .hide-comment, #popup .hide-comment
{
    bottom: 6px;
    left: 70px;
}

#zoom .print-icon, #zoom .zoom-icon, #zoom .zoom-rotate-button, #zoom .close
{
    position: fixed;
}


#zoom .print-icon
{
    top: 10px;
    left: 10px;
}

#zoom .zoom-icon
{
    top: 10px;
    left: 60px;
}

.desktop-icon-button
{
    margin-top: -8px !important;
}

.desktop-icon-button .md-ripple-container
{
    transform: translate(-5px, 5px);
}

#popup .close, #popup-system .close
{
    top: 20px;
    right: 20px;
    background-color: white;
}

.w100 button.md-datepicker-button
{
    width: 50% !important;
    margin-left: 25% !important;
}

.table-cancel-order
{
    cursor: pointer;
    float: left;
    margin-right: 20px;
    padding-top: 20px;
}

.transport-bottom-emblem
{
    font-size: 13px;
    background-repeat: no-repeat;
    background-position: center right;
    padding-right: 20px;
    margin-top: 10px;
    background-repeat: no-repeat;
}

.transport-purchase
{
    margin-top: 10px;
    background-image: url(/client/img/icon-orders.svg);
    background-repeat: no-repeat;
    background-position: right;
    padding-right: 20px;
}

.transport-purchase-70
{
    background-image: url(/client/img/icon-wait-approval.svg);
    background-size: 16px;
}

.transport-request
{
    background-image: url(/client/img/icon-offer-selected.svg);
}

.realtime-sidebar
{
    position: fixed;
    top: 0;
    width: 350px;
    height: 100%;
    z-index: 1;

    background-color: white;
}

.realtime-sidebar .highlight
{
    background-color: #607d8b;
    color: white;
}

.realtime-sidebar.right
{
    right: 0;
    box-shadow: -20px 3px 30px rgba(0,0,0,0.20);
}

.realtime-sidebar.bottom
{
    top: auto;
    bottom: 0;
    width: 100%;
    height: 80px;
}

.realtime-circle
{
    width: 60px;
    height: 60px;
    border-radius: 100px;
    background-color: #64899A;
    color: white;
    text-align: center;
    border: 3px solid white;
    box-shadow: 0px 3px 8px rgba(0,0,0,0.5);
}

.realtime-circle.loaded
{
    background-color: #D58C4D;
}

/*
.transport-card.day-today, .truck-list-view .my-truck
{
    background-color: #EBF2F5;
}
*/

.icon-accept-transport, .icon-accept-transport img
{
    padding: 0px !important;
    margin: 0px !important;
    width: 65px !important;
    height: 65px !important;
}

.map-label
{
    padding: 3px 6px;
    color: black;
    border-radius: 20px;
    top: -37px !important;
}

.map-label.origin
{
    /* background-color: #64899A; */
    /* background-color: #FF9900; */
    background-color: #EA4335;
    color: white;
}

.map-label.destination
{
    /* background-color: #D58C4D; */
    /* background-color: #FF9900; */
    background-color: #EA4335;
    color: white;
}

.order-table
{
    width: 100%;
    font-size: 11px;
    line-height: 12px;
    border: 1px solid #DDD;
}

.order-table tr:first-child
{
    color: white;
    background-color: #D58C4D;
}

.order-table td
{
    padding: 5px;
    text-align: center;
}

.input-icon
{
    position: absolute;
    left: 14px;
    top: 11px;

    width: 24px;
    height: 24px;

    pointer-events: none;
}

.admin-underdrive-card
{
    padding: 0px;
    min-height: 160px;
}

.admin-underdrive-card-image
{
    position: absolute;
    bottom: 5px;
    right: 20px;
    width: 80px;
}

.back-button
{
    position: fixed;
    top: 20px;
    left: 0px;
}

.link
{
    color: #487386;
    font-weight: bold;
    cursor: pointer;
}

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

.user-box
{
    padding: 20px; 
    border-radius: 10px; 
    background-color: #678d9f; 
    padding-bottom: 0px; 
    margin-bottom: 20px;
    color: white;
}

.user-box h2
{
    color: white;
}

.user-box .link
{
    border: 1px solid white; 
    border-radius: 10px;
    transition: background-color 0.2s;
}

.user-box .link:hover
{
    background-color: rgba(255, 255, 255, 0.3);
}

.user-box .phone
{
    transform: translateY(4px);
}

#video-help-button
{
    position: fixed;
    left: 10px;
    bottom: 120px;
}

#video-help-button button
{
    background-color: rgba(0,0,0,0.6); 
    overflow: initial
}

#video-help-button .text-label
{
    position: relative;
    left: 7px;
    top: 5px;
    line-height: 15px;
    text-align: center;
}

#video-help-button:hover button
{
    background-color: rgba(0,0,0,0.4);
}

.admin-offers
{
    position: fixed;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 50px;
    background-color: white;
    border-top: 7px solid #ADCE6B;
    border-top-left-radius: 20px;
    border-top-right-radius: 20px;
    z-index: 2;
    box-shadow: 0px 0px 20px rgba(0,0,0,0.5);

    transition: height 0.3s;
}

.admin-offers.truck-earnings
{
    height: 160px;
}

.admin-offers.open
{
    height: 85%;
}

.admin-offer-line
{
    padding: 10px 0px;
}

.admin-offer-line > div
{
    padding-top: 5px;
}

.admin-offer-line:hover
{
    background-color: #F7F9FA;
}

.admin-offer-line.selected
{
    background-color: #EEEEEE;
}

.sold-offer
{
    filter: grayscale();
}

.red-box
{
    border: 1px solid #E85656;
    padding: 20px;
}

.blue-box
{
    border: 1px solid #2E5F75;
    padding: 20px;
}

.orange-box
{
    border: 1px solid #D58C4D;
    padding: 20px;
}

.bookkeeper-update-box
{
    position: absolute;
    left: 30px;
    top: 90px;
    text-align: center;
    padding: 10px;
    padding-right: 30px;
    font-weight: bold;
}

.admin-update-box
{
    position: fixed;
    bottom: 10px;
    right: 10px;
    text-align: center;
    padding: 5px;
    padding-right: 20px;
    background-color: #323232;
    color: white;
    z-index: 3;
}

.bottom-menu md-button
{
    position: relative;
}

.badge.show
{
    opacity: 1;
    transform: scale(1);
}

.badge
{
    position: absolute;
    bottom: 15px;
    left: 5px;
    background-color: #E85656;
    color: white;
    text-align: center;
    border-radius: 100px;
    width: 15px;
    height: 15px;
    line-height: 15px;

    transition: all 0.3s cubic-bezier(0.175, 0.885, 0.32, 2);
    opacity: 0;
    transform: scale(0);
}

.card
{
    position: relative;
    background-color: white;
}

.card md-card-actions
{
    position: absolute;
    bottom: 0;
    left: 0;
}

.daily-report-card
{
    min-height: 100px;
}

.md-icon-button-circle
{
    padding: 0px !important;
}

.overflowVisible
{
    overflow:visible !important;
}

.order-reorder
{
    width: 23px;
    height: 23px;
    position: absolute;
    top: 10px;
    left: 10px;
    padding-right: 40px;
    padding-bottom: 40px;
}

.dnd
{
    margin: 0;
    padding: 0;
    min-height: 100px;
}

ul.dnd
{
    list-style: none;
}

ul[dnd-list] .dndPlaceholder 
{
    display: block;
    background-image: none;
    border-bottom: 2px dashed black;
}

.sortable-item, .dnd > *
{
    cursor: grab;

    background-image: url(/client/img/icon-drag-indicator.svg);
    background-repeat: no-repeat;
    background-position: center right 10px;
    padding-right: 40px;
}

.ftm-connecting-drive
{
    cursor: default;

    background-image: url(/client/img/icon-arrow-down-connect.svg);
}

.ftm-connecting-drive md-card
{
    box-shadow: none;
}

.ftm-home-drive
{
    background-image: url(/client/img/icon-home.svg);
}

.sortable-item
{
    list-style: none;
    margin: 0; 
}

.sortable-item:active, .dnd > *:active
{
    cursor: grabbing;
}

.sortable, .draggable 
{ 
    list-style-type: none; 
    margin: 0; 
    padding: 0; 
}

.draggable
{
    cursor: grabbing;
}

.certificate-number
{
    font-weight: bold;
}

.certificate-number:visited
{
    color: black;
}

.certificate-thumbnail
{
    background-size: cover;
    width: 25px;
    height: 25px;
    position: absolute;
    bottom: 10px;
    left: 10px;
}

.transport-details-card
{
    min-height: 100px;
}

.transport-details-button
{
    position: absolute;
    left: 15px;
    bottom: 15px;
}

.question
{
    text-align: justify;
}

.question img
{
    width: 40px;
    float: left;
    margin-right: 10px;
}

.accordion > div
{
    transition: all 0.3s;
    overflow: hidden;
}

.accordion.open
{
    box-shadow: 0px 2px 4px #D6D6D6;
    padding: 10px;
}

.accordion > div.ng-hide
{
    height: 0px;
    opacity: 0;
}

.accordion h2
{
    margin-bottom: 0px;
}

.accordion.open h2
{
    margin-bottom: 10px;
}

.accordion, .accordion h2
{
    font-size: 13px;
}

.go-button
{
    position: absolute;
    top: 0px;
    left: 0px;
}

.finished-emblem
{
    background-image: url(../img/order-complete-stamp-bg.svg);
    background-repeat: no-repeat;
    background-position: bottom -140px left -120px;
    background-size: 400px;
}

md-dialog-content md-input-container:not(.md-block)
{
    background-color: #F2F2F2 !important;
    margin-bottom: 0px !important;
    overflow: hidden;
    height: 44px !important;
}

md-dialog-content md-input-container input
{
    border-bottom: 1px solid #64899A !important;
}

ng-map .gmnoprint, ng-map a img
{
    display: none;
}

ng-map.location-map .gmnoprint, ng-map.location-map a img
{
    display: block;
}

.all-drivers-switch
{
    direction: ltr;
    position: absolute;
    top: 25px;
    left: 10px;
}

.all-drivers-switch .md-label
{
    margin-left: 10px;
}

.realtime-drivers-list .name .status
{
    background-color: #7AD54D;
    display: inline-block;
    width: 10px;
    height: 10px;
    border-radius: 10px;
    margin-left: 5px;
}

.realtime-drivers-list .busy .name .status
{
    background-color: #E65555;
}

.realtime-drivers-list .selected .name .status
{
    background-color: #5B9CDC;
}

.ng-map-info-window
{
    position: relative;
    margin-top: -50px;
}

.map-label
{
    background-color: #2E5F75;
    color: white;
    padding: 5px;
    border-radius: 10px;
}

.map-label.orange
{
    background-color: #D58C4D;
}

.realtime-label .info
{
    opacity: 0;
    width: 200px;
}

.realtime-label:hover .info
{
    opacity: 1;
}

.realtime-label.selected
{
    z-index: 200 !important;
}

.realtime-label img.marker
{
    position: absolute;
    left: calc(50% - 16.5px);
    top: calc(100% - 10px);

    cursor: pointer;

    pointer-events: all !important;
}

.realtime-label img.marker.selected
{
    left: calc(50% - 25px);
    top: calc(100% - 10px);
}

.license-plate
{
    background-color: #FFCC00;
    border: 1px solid black;
    color: black;
    border-radius: 3px;
    background-image: url(../img/israel-license-blue.png);
    background-repeat: no-repeat;
    background-position: left center;
    background-size: contain;
    font-size: 20px;
    font-weight: bold;
    padding-left: 20px;
    padding-right: 10px;
    text-align: center;
    display: inline-block;
    margin-bottom: 5px;
}

.mobile-menu .md-toolbar-tools h1
{
    position: absolute;
    width: 100%;
    right: 30px;
}

filtered-select, filtered-select-multiple
{
    width: 100%;
}

ng-map .map-counter
{
    color: white;
    border-radius: 100px;
    width: 20px;
    height: 20px;
    text-align: center;
    line-height: 20px;
}

ng-map .selected-marker
{
    filter: grayscale();
    opacity: 1 !important;
}

ng-map.location-map
{
    position: relative;
    height: 470px !important;
}

.small ng-map.location-map
{
    height: 300px !important;
}

ng-map.location-map .buttons
{
    position: absolute;
    top: 65px;
    right: 4px;
    z-index: 1;
}

key-value .key
{
    font-weight: bold;
}

.md-chip-input-container
{
    margin-top: 0px !important;
}

md-chips-wrap
{
    margin-top: 0px !important;
}

.md-chips md-chip 
{
    height: 20px;
    line-height: 20px;
    margin: 0px;
    padding: 0px 10px;
}

md-chips.square md-chip
{
    padding: 0px 5px;
    border-radius: 0px;
    background-color: white;
    color: black;
}

md-chips.square md-chip > div
{
    min-width: 300px;
}

md-chips.square md-chips-wrap
{
    margin-right: 0px;
}

md-chips.square md-chip > div md-chip-template:hover
{
    text-decoration: underline;
}

[dir=rtl] .md-chips md-chip 
{
    margin: 6px 0 0 4px;
}

.md-chips md-chip .md-chip-remove md-icon
{
    top: 31%;
}

md-content
{
    color :#2E5F75;
    padding: 5px;
    padding-top: 0px;
    box-sizing: border-box;
    overflow-x: hidden;
}

md-content.with-draggable.dragging
{
    display: inline !important;
}

.spacer-5
{
    width: 5px;
}

.spacer-12
{
    width: 12px;
}

.spacer-20
{
    width: 20px;
}

.spacer-30
{
    width: 30px;
}

.spacer-200
{
    display: inline-block;
    width: 200px;
}

.float-right
{
    float: right !important;
    margin-right: 20px;
}

.float-left
{
    float: left;
    margin-left: 20px;
}

.menu-item .icon-selected
{
    display: none;
}

.menu-item.selected .icon-selected
{
    display: block;
}

.menu-item.selected .icon-normal
{
    display: none;
}

.desktop-menu .menu-button
{
    position: relative;
    width: 86px;
    height: 86px;
    margin: 0 !important;
    margin-top: 83px !important;
    margin-left: 70px;
    background-color: transparent;
    background-image: url(/client/img/menu-button-half-circle.svg);
    background-repeat: no-repeat;
    background-position: center bottom;
    font-size: 14px;
    overflow: visible;
}

.desktop-menu .menu-button img
{
    width: 80px;
    height: 80px;
}

.display-none
{
    display: none;
}

.hide-not-hover
{
    opacity: 0;
    pointer-events: none;
}

.hide-not-hover-container:hover .hide-not-hover
{
    opacity: 1;
    pointer-events: all;
}

.company-group-header
{
    font-weight: bold;
}

.market-blue
{
    color: #8CBAE6;
}

.market-orange
{
    color: #D58C4D;
}

.market-blue .admin-market-card header
{
    background-color: #8CBAE6;
    color: white;
}

.market-orange .admin-market-card header
{
    background-color: #D58C4D;
    color: white;
}

.market-orange .admin-market-card.my-cid header
{
    background-color: #ffb677;
    color: white
}

.hover-expand-target > div
{
    border-radius: 20px;
}

.hover-expand-target.dragging > div
{
    background-color: #D58C4D;
    margin-bottom: 5px;
}

.dragging .hide-dragging
{
    display: none;
}

.show-dragging
{
    display: none;
}

.dragging .show-dragging
{
    display: block;
}

.mobile-menu .md-nav-bar
{
    height: 30px;
}

.desktop-menu .md-nav-item
{
    margin-left: 0px;
}

/*
.desktop-menu .md-nav-item::after
{
    content: "";
    position: absolute;
    width: 2px;
    height: 2px;
    border-radius: 2px;
    background-color: #2E5F75;
    margin-left: 14px;
    margin-top: 22px;
}
*/

.no-logo
{
    background-color: #64899A;
    border-radius: 100px;
    width: 20px;
    height: 20px;
    line-height: 18px;
    text-align: center;
    color: white;
    font-weight: normal;
}

.desktop-menu .md-nav-item:last-child::after
{
    display: none;
}

.desktop-menu .menu-button .label
{
    font-size: 14px;
    margin-top: -10px;
    white-space: pre-wrap;
    line-height: 15px;
    text-align: center;
    background-color: rgba(255,255,255,0.8);
    border-radius: 5px;
}

.desktop-menu menu
{
    position: relative;
    width: 70px;
    margin-right: -20px;
}

md-tooltip
{
    height: auto !important;
}

.share-icon-active
{
    position: relative; 
    display: inline-block; 
    cursor: pointer;
    top: 0px;
    left: 1px;
}

header .share-icon-active
{
    top: 2px;
}

.desktop-menu menu md-toolbar
{
    background-color: transparent !important;
}

.desktop-menu .menu-button img
{
    transform: translate(0px, -13px);
    /* transform: translate(5px, -13px); */
}

/*
.desktop-menu .counter,
.tab .counter,
.group .counter,
*/
.counter
{
    display: inline-block;
    background-color: #2E5F75;
    /*background-color: #A0B7C1;*/
    font-size: 11px;
    color: white;
    text-align: center;
    width: 20px;
    min-width: 20px;
    height: 20px;
    min-height: 20px;
    line-height: 18px;
    border: 1px solid transparent;
    border-radius: 100px;
}

md-input-container[disabled]
{
    opacity: 0.5 !important;
    pointer-events: none;
}

#popup .summary-spacer
{
    height: 200px;
}

.counter.small
{
    width: 13px;
    height: 13px;
    min-width: 13px;
    min-height: 13px;
    line-height: 13px;
    position: relative;
    top: -1px;
}

.counter.auto-width
{
    min-width: auto !important;
    width: auto !important;
    padding: 0px 3px;
}

.counter.big
{
    background-color: #D58C4D; 
    font-weight: bold;
    font-size: 20px;
    width: 34px;
    height: 34px;
    min-width: 34px;
    min-height: 34px;
    line-height: 34px;
}

.tab.right .counter
{
    position: absolute;
    top: -8px;
    left: -8px;
}

.tab.left .counter
{
    position: absolute;
    top: -8px;
    right: -8px;
}

.tab.open .counter
{
    display: none;
}

.mobile-menu .counter
{
    display: inline-block;
    background-color: #A0B7C1;
    color: white;
    text-align: center;
    border-radius: 100px;
    position: relative;
    font-size: 10px;
    width: 14px;
    min-width: 14px;
    height: 14px;
    min-height: 14px;
    line-height: 13px;
    top: -2px;
}

md-chip-template.selected
{
    color: black;
}

.language-field .language-selector
{
    width: auto;
}

.mobile-menu .label
{
    font-size: 10px;
    margin-top: -5px;
}

.counter-big .counter
{
    padding: 13px 7px;
    text-align: center;
    line-height: 0px;
    width: initial;
    height: initial;
}

.counter-red .counter
{
    background-color: #E85656;
}

.narrow-label{
    margin-inline-start: 10px;
    margin-block-start: 13px;
}

.narrow-label  > .md-label {
    margin-right: 25px !important;
}

md-nav-bar.md-default-theme.md-primary>.md-nav-bar, md-nav-bar.md-primary>.md-nav-bar
{
    background-color: #64899A;
}

.mobile-menu-button
{
    margin-top: -3px;
    margin-left: 0px !important;
}

.mobile-menu button
{
    min-width: auto;
}

.mobile-menu ._md-nav-button
{
    padding: 10px 10px;
}

.mobile-menu md-nav-ink-bar
{
    background-color: #D58C4D;
}

.counter.three
{
    width: 25px !important;
}

.counter.four
{
    width: 40px !important;
}

.desktop-menu .menu-button .md-ripple-container
{
    margin-top: -15px;
}

.desktop-menu md-nav-bar
{
    padding-top: 8px;
}

.materials-summary-list
{
    width: 100%;
    margin: 0px auto;
    margin-bottom: 10px;
    text-align: center;
}

.materials-summary-list h2
{
    font-size: 12px;
    font-weight: bold;
    color: white;
    background-color: #D58C4D;
    padding: 2px;
    margin-bottom: 0px !important;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    height: 18px;
    border-top-left-radius: 5px;
    border-top-right-radius: 5px;
    border-bottom: 1px solid white;
}

.materials-summary-list > div
{
    position: relative;
    cursor: pointer;
    display: inline-block;
    vertical-align: top;
    width: 100px;
    height: 60px;
    text-align: center;
    box-shadow: 0px 3px 8px rgba(0,0,0,0.16);
    color: white;
    background-color: #8DB4C6;
    border-radius: 6px;
    margin-left: 4px;
    margin-right: 4px;
    margin-bottom: 12px;
    font-size: 12px;
    font-weight: bold;
}

.materials-summary-list > div.payer-total
{
    width: auto;
}

.materials-summary-list > div.payer-total h2
{
    padding-left: 10px;
    padding-right: 10px;
    background-color: #64899a;
}

.materials-summary-list > div.payer-total .done, .materials-summary-list > div.payer-total .on-way
{
    display: none;
}

.materials-summary-list > div.payer-total .total
{
    background-color: transparent;
}

.materials-summary-list > div .on-way, .materials-summary-list > div .done
{
    padding-top: 13px;
    box-sizing: border-box;
}

.materials-summary-list > div .on-way span, .materials-summary-list > div .done span
{
    position: relative;
    top: -7px;
}

.materials-summary-list > div .total
{
    /* background-color: #64899A; */
    font-size: 23px;
    font-weight: bold;
    padding-top: 3px;
    padding-left: 3px;
    padding-right: 3px;

    border-right: 1px solid white;
    border-left: 1px solid white;
}

.materials-summary-in-row
{
    display: inline-block; 
    vertical-align: top; 
    width: 30%;
}

.materials-summary-list.summary-style- > div, .materials-summary-list.summary-style-tomorrow > div
{
    background-color: transparent;
    height: auto;
    border: none;
}

md-chips.md-default-theme .md-chips, md-chips .md-chips
{
    box-shadow: none;
}

md-chips-wrap
{
    margin-right: 20px;
}

.materials-summary-list > div .divider
{
    margin-top: 20px;
    width: 1px;
    height: 10px;
    display: inline-block;
    vertical-align: top;
    background-color: #2E5F75;
}

.materials-summary-list > div span
{
    font-size: 8px;
}

.materials-summary-list.summary-style- > div .total, .materials-summary-list.summary-style-tomorrow > div .total
{
    border-radius: 6px;
    border: 1px solid #B0B0B0;
}

.materials-summary-list > div .done, .materials-summary-list > div .on-way, .materials-summary-list > div .total
{
    height: 44px;
    background-color: #64899a;
    /* background-color: #8db4c6; */
}

.materials-summary-list > div .box.active
{
    background-color: #D58C4D;
    color: white;
}

.materials-summary-list > div .done
{
    border-bottom-left-radius: 5px;
}

.materials-summary-list > div .on-way
{
    border-bottom-right-radius: 5px;
}

.materials-summary-list > div .total span
{
    display: inline-block;
    margin-top: 5px;
}

.materials-summary-list.summary-style- > div  .total h3, .materials-summary-list.summary-style-tommorow > div  .total h3
{
    font-size: 34px;
    margin-top: -8px;
    margin-bottom: 0px;
}

md-nav-bar.md-default-theme md-nav-ink-bar, md-nav-bar md-nav-ink-bar
{
    /* background-color: #2E5F75; */
    background-color: #D58C4D;
}

.date-picker-label
{
    font-size: 14px;
    position: relative;
    top: -3px;
}

.admin-order-card
{
    width: 324px;
    margin: 5px;
    /* width: 400px; */
    /* width: 262px; */
    margin-bottom: 10px;
    padding: 0px;
    /* padding-bottom: 30px; */
    font-size: 14px;

    transition: opacity 0.3s;
}

.admin-market-card
{
    padding-bottom: 0px;
    width: auto;
}

header.admin-client-card
{
    margin-right: -20px;
}

.admin-realtime-card .order-info
{
    min-height: auto !important;
    height: auto !important;
}

.realtime-drivers-list .drop-zone
{
    display: none;
    border: 1px dashed lightgray;

    transition: all 0.3s;
    
}

/*
.drop-zone-transports.dragging
{
    cursor: crosshair;
    opacity: 0.5;
    transform: scale(0.98);

    transition: all 0.3s;
}
*/

.realtime-drivers-list .drop-zone
{
    opacity: 1;
    filter: none;
    transform: scale(1);
}

/*
.drop-zone-transports:not(.cant-carry).dragging.ui-droppable-hover
{
    opacity: 1;
    filter: none;
    transform: scale(1.02);
}
*/

.realtime-drivers-list .cant-carry .drop-zone
{
    border: 1px solid transparent !important;
}

.realtime-drivers-list .drop-zone.ui-droppable-hover
{
    border: 1px dashed black;
    background-color: #DDD;
}

.drop-zone-drivers, .drop-zone-transports
{
    border: 1px solid transparent;
}

.drop-zone-drivers.dragging.ui-droppable-hover,
.drop-zone-transports.dragging.ui-droppable-hover
{
    border: 1px dashed black;
}

.drop-zone-drivers.cant-carry.ui-droppable-hover,
.drop-zone-transports.cant-carry.ui-droppable-hover
{
    border: 1px dashed transparent !important;
}

.realtime-drivers-list .cant-carry .drop-zone.ui-droppable-hover
{
    border: 1px solid transparent !important;
    background-color: transparent;
}

.draggable-drivers .ui-draggable-dragging,
.draggable-transports .ui-draggable-dragging,
.draggable-quick .ui-draggable-dragging,
.admin-realtime-card.ui-draggable-dragging
{
    transform: translateY(40px);
    box-shadow: 10px 10px 20px rgba(0,0,0,0.4);
    z-index: 1000;
}

.realtime-drivers-list.dragging .drop-zone
{
    display: block;
}

.realtime-drivers-list .listing
{
    border: 1px dashed transparent;
}

.realtime-drivers-list .listing,
.realtime-drivers-list .drop-zone
{
    border-radius: 10px;
    padding-right: 5px;
    padding-top: 1px;
    padding-bottom: 1px;
    margin-bottom: 3px;
}

#realtime-map
{
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    transition: filter 1s;

    height: calc(100% - 64px); 
    margin-top: 64px;
}

#overlay-view #realtime-map
{
    position: absolute;
    height: calc(50% - 64px); 
    margin-top: 0px;
}

#realtime-map-filter
{
    width: 330px;
    margin-left: 20px;
}

.map-history-slider
{
    position: absolute;
    bottom: 0px;
    left: 0px;
    width: calc(100% - 350px);
    z-index: 2;
    background-color: white;
    padding: 0px 30px;
    box-sizing: border-box;
    padding-top: 10px;
}

.history-events-container
{
    position: relative;
    top: 35px;
    height: 20px;
}

.history-events-container > div
{
    position: absolute;
    /* background-color: lightgreen; */
    text-align: center;
    overflow-x: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    font-size: 12px;
    /*
    border-left: 1px solid black;
    border-right: 1px solid black;
    padding-top: 6px;
    margin-top: 3px;
    */
}

/*
.history-events-container > div > div
{
    border-bottom: 1px solid black;
    transform: translateY(-8px);
}
*/

#realtime-map-spacer
{
    height: 70px;
}

#overlay-view #realtime-map-filter-container
{
    height: 0px;
}

#overlay-view .realtime-map-spacer
{
    height: 0px;
    display: none;
}

#realtime-map.blur
{
    filter: grayscale() brightness(0.3);
    /* filter: blur(10px) brightness(0.3); */
}

#realtime-map button.gm-ui-hover-effect
{
    display: none !important;
}

.realtime-drivers-list.dragging .listing
{
    display: none;
}

.realtime-drivers-list.dragging md-card
{
    pointer-events: none;
    filter: grayscale();
    opacity: 0.3;
}

.admin-realtime-card header
{
    background-color: #F8E3BA !important;
}

.admin-realtime-card
{
    margin: 0;
    margin-bottom: 10px;
    width: 100%;
}

.admin-realtime-card .inner
{
    padding: 2px 7px 2px 12px !important;
}

.admin-client-card, .admin-realtime-card
{
    padding-bottom: 0px !important;
}

.status-badge
{
    top: 12px !important;
    background-color: #64899A;
    width: 48px;
    height: 48px;
    box-sizing: border-box;
    border-top-left-radius: 50px;
    border-bottom-left-radius: 50px;
}

.status-badge.status-badge-waiting
{
    background-color: #46a6d2;
    /* background-color: #64899A; */
}

.status-badge.status-badge-waiting img, .status-badge.status-badge-unassigned img
{
    margin-right: 10px;
    margin-top: 12px;
}

.status-badge.status-badge-active img
{
    margin-right: 7px;
    margin-top: 12px;
}

.status-badge.status-badge-finished img
{
    margin-right: 10px;
    margin-top: 14px;
}

.status-badge.status-badge-cancelled img
{
    margin-right: 10px;
    margin-top: 12px;
}

.status-badge.status-badge-active
{
    background-color: #D58C4D;
}

.status-badge.status-badge-finished
{
    background-color: #7AD54D;
}

.status-badge.status-badge-cancelled
{
    background-color: #E85656;
}

.status-badge.status-badge-unassigned
{
    opacity: 0.5;
}

.grouped-transports .admin-client-card .status-badge
{
    top: 8px !important;
}

.half > *
{
    width: 45%;
}

.half > *:first-child
{
    margin-left: 5%;
}

.half-opacity
{
    opacity: 0.5;
}

.grouped-transports .group-header-truck,
.grouped-transports .transport-card-header
{
    border-top-left-radius: 0px;
    border-top-right-radius: 0px;
}

.grouped-transports .group-header-truck.inner
{
    padding-top: 0px;
}

.admin-order-card.admin-client-card
{
    height: auto;
    /* height: 100%; */
    padding-bottom: 0px;
}

.admin-client-card .status-55
{
    background-color: #F0D7C1 !important;
}

.admin-client-card .status-100
{
    background-color: #BCEAA5 !important;
}

.admin-order-card hr
{
    border-bottom: 1px solid #2E5F75;
    margin: 0px;
    margin-top: -1px;
}

.admin-order-card .counter
{
    color: white;
    background-color: #2E5F75;
    border-radius: 50px;
    width: 18px;
    height: 18px;
    text-align: center;
    margin-left: 3px;
    font-size: 12px;
    font-weight: normal;
    /* border: 1px solid transparent; */

    transition: all 0.3s;
}

.counter-progress-back
{
    background-color: white;
    border-radius: 100px;
}

.counter-progress-back path
{
    opacity: 0.5;
}

.counter-progress path
{
    stroke: black;
}

.counter-progress.green path, .counter-progress-back.green path
{
    stroke: green;
}

.counter-progress.blue path, .counter-progress-back.blue path
{
    stroke: #64899A;
}

.counter-progress-label
{
    width: 19px;
    text-align: center;
    line-height: 20px;
    color: black;
    font-size: 12px;
}

.counter-progress-label.green
{
    color: green;
}

.counter-progress-label.blue
{
    color: #64899A;
}

/*
.admin-order-card .counter.closed
{
    color: #2E5F75;
    background-color: transparent;
    border: 1px solid #2E5F75;
}
*/

.order-info .counter
{
    margin-left: 6px;
}

.admin-order-card .expand
{
    position: absolute;
    left: 15px;
    bottom: 5px;
}

.anim-rotate
{
    transition: transform 0.2s;
}

.anim-rotate-rotated
{
    transform: rotate(180deg);
}

.admin-order-card .expand-arrow
{
    position: absolute;
    top: 5px;
}

.unassigned-orders-card header
{
    background-color: #F8E3BA !important;
}

.admin-order-card .expand-arrow.group-bottom
{
    position: absolute; 
    top: auto; 
    bottom: -20px; 
    width: 20px; 
    left: 50%;
}

.admin-order-card-bottom
{
    background-color: #B1C4CC;
    color: white;
    padding: 3px;
    border-bottom-left-radius: 5px;
    border-bottom-right-radius: 5px;
    text-align: center;
    position: relative;
}

.grouped-transports > md-card
{
    max-height: 292px;
    /* max-height: 272px; */
}


.grouped-transports > md-card.open
{
    max-height: 100%;
}

.grouped-transports .admin-order-card .expand
{
    bottom: -22px;
    left: 5px;
}

.grouped-transports transport-card header,
.grouped-transports .driver-info
{
    background-color: transparent !important;
}

.grouped-transports transport-card.odd > header, 
.grouped-transports transport-card.odd > div
{
    background-color: #F3F6F7 !important;
}

.hover-highlight:hover, .item-selected
{
    background-color: #E0E7EB;
}

.hover-highlight.cant-carry:hover
{
    background-color: transparent;
    cursor: default;
}

.cant-carry
{
    opacity: 0.3 !important;
    pointer-events: none;
    filter: grayscale() !important;
    /* filter: blur(3px) grayscale() !important; */
}

.all-transports.odd
{
    background-color: #edf8fd;
}

.drivers-list .under-driver.cant-carry
{
    display: none;
}

.drivers-list .recommended
{
    font-weight: bold;
}

.admin-order-card.not-selected
{
    opacity: 0.3;
}

.ftm-reason
{
    margin-top: 5px;
    background-color: #EEE;
    padding: 0px 5px;
    font-size: 12px;
}

.ftm-reason1
{
    background-color: #ffe3cb;
}

.ftm-place
{
    float: right;
    margin-left: 5px;
    background-color: #EEE;
    font-weight: bold;
    text-align: center;
    width: 18px;
    border-radius: 20px;
}

.ftm-place1
{
    color: white;
    background-color: #D58C4D;
}

.mode-switcher
{
    background-color: white;
}

.mode-switcher .md-nav-bar
{
    border: none;
    background-color: transparent !important;
}

.mode-selector
{
    position: absolute;
    top: 50px;
    left: calc(50% - 250px);
    width: 550px;
    height: 62px;
    background-color: white;
    border-bottom-left-radius: 30px;
    border-bottom-right-radius: 30px;
    z-index: 2;
    /* z-index: 4; */
    box-shadow: 0px 3px 6px rgba(0,0,0,0.1);
    text-align: center;

    transition: top 0.3s;
}

.mode-selector .open
{
    margin-top: 50px;
}

.mode-selector .md-nav-bar
{
    margin-top: 14px;
    border: none;
    background-color: transparent !important;
}

.mode-selector.closed
{
    top: 13px;
}

.mode-selector > div
{
    display: inline-block;
    vertical-align: top;
    width: 145px;
    height: 34px;
    border: 1px solid #64899A;
    border-radius: 5px;
    text-align: center;
    line-height: 34px;
    margin-top: 13px;
    margin-right: 3px;

    transition: all 0.3s;
}

.mode-selector > div.active
{
    background-color: #64899A;
    color: white;
}

.admin-order-card.selected
{
    opacity: 1;
    border: 2px solid #64899A;
}

.admin-order-card .status-badge
{
    position: absolute;
    top: 40px !important;
    right: 0px;
}

.admin-order-card .inner
{
    padding: 6px 14px;
    box-sizing: border-box;
    padding-bottom: 0px;
}

.admin-order-card .order-info
{
    min-height: 86px;
    padding-left: 45px;
}

.grouped-transports .admin-order-card .order-info
{
    min-height: 50px;
}

.admin-client-card .order-info
{
    position: relative;
}

.card header
{
    border-top-left-radius: 5px;
    border-top-right-radius: 5px;
    background-color: #E0E7EB;
    font-weight: bold;
    color: #2E5F75;
    /* border: 1px solid transparent; */
}

.card .footer
{
    position: absolute;
    min-height: 30px;
    bottom: 0px;
    width: 100%;
    border-bottom-left-radius: 5px;
    border-bottom-right-radius: 5px;
    background-color: #E0E7EB;
    font-weight: bold;
    color: #2E5F75;
}

.admin-order-card .driver-info
{
    position: relative;
    background-color: #F3F6F7;
    min-height: 30px;
}

.admin-order-card.admin-client-card .driver-info
{
    margin-bottom: 1px;
}

.admin-order-card.admin-client-card.one
{
    background-color: transparent;
    box-shadow: none;
}

.admin-order-card.admin-client-card.one transport-card > div
{
    background-color: white;
    height: 248px;
}

.admin-order-card .driver-info > div
{
    position: relative;
    top: 3px;
}

.admin-order-card .driver-info .value
{
    /* position: relative; */
    /* top: 3px; */
    /* max-width: 114px; */
    max-width: 45%;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    display: inline-block;
}

.ellipsis
{
    max-width: 100%;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    display: inline-block;
}

.admin-client-card header > div:first-child
{
    max-width: 85%;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    display: inline-block;
}

.admin-order-card .driver-link-icon
{
    position: absolute;
    top: -4px;
    /* top: 9px; */
    left: -5px;
}

._md-nav-button.md-active
{
    /* color: #2E5F75; */
    color: #D58C4D;
}

._md-nav-button.md-active .counter
{
    color: white;
    background-color: #D58C4D;

    /*
    color: #334750;
    background-color: #FFF;
    */
}

.desktop-menu .md-nav-bar
{
    padding-bottom: 56px;
}

.mobile-menu
{
    overflow: visible !important;
}

.mobile-menu .md-nav-bar
{
    margin-top: -8px;
}

.truck-details-view .menu-icon-icon-license-white_svg img
{
    height: 17px;
    margin-top: 5px;
}

.view.admin > md-content, .view > md-content
{
    /* background-color: #65CEE6; */
    background-color: #e8f6ea;
    background-image: url(/client/img/bg.png);
}

#popup .view > md-content
{
    background-image: none;
    background-color: white;
}

md-content.no-bg
{
    background-image: none !important; 
    background-color: white !important;
}

.view > md-content
{
    background-color: #F2F2F2;
}

header.admin-client-card .mr-10
{
    background-color: #e8f6ea;
    position: absolute;
    z-index: 1;
    right: 120px;
    padding-left: 10px;
}

header.admin-client-card::after
{
    content: "";
    position: absolute;
    z-index: 0;
    width: 88%;
    height: 1px;
    border-bottom: 1px solid #2E5F75;
    margin-top: 7px;
    left: 60px;
}

.on-the-line
{
    background: transparent radial-gradient(closest-side at 50% 50%, #C7AD62 0%, #E6D588 100%) 0% 0% no-repeat padding-box;
    padding-left: 0px;
    padding-right: 0px;
    color: #334750;
}

.on-the-line span
{
    padding-left: 10px;
    padding-right: 10px;
}

.on-the-line h2
{
    font-size: 16px;
    margin-bottom: 0px;
    color: #334750;
}

.on-the-line hr
{
    border-bottom: 1px solid #334750;
}

.on-the-line > div
{
    background-color: rgba(51,71,80,0.1);
    padding: 8px;
    margin-bottom: 4px;
    font-size: 14px;
}

.on-the-line-route
{
    padding-right: 10px;
    padding-left: 10px;
    margin-top: 5px;
}

.on-the-line-route div
{
    width: 7px;
    height: 7px;
    border-radius: 100px;
    background-color: white;
    border: 2px solid #334750;
}

.on-the-line-route span
{
    border-bottom: 2px dashed #334750;

    position: relative;
    top: -7px;
}

.view.with-create-button .menu-button,
.truck-list-view .menu-icon-button-truck-add_svg,
.transport-list-view .menu-icon-button-truck-add_svg,
.orders-list-view .menu-icon-button-order-add_svg,
.view .menu-button1, .view .menu-button2, .view .menu-button3
{
    width: 75px;
    height: 75px;

    margin-top: 5px !important;
    margin: 0;
    padding: 0 !important;
    margin-top: 50px !important;

    color: black;
}

.view.with-create-button .menu-button img,
.truck-list-view .menu-icon-button-truck-add_svg img,
.transport-list-view .menu-icon-button-truck-add_svg img,
.orders-list-view .menu-icon-button-order-add_svg img,
.view .menu-button1 img, .view .menu-button2 img, .view .menu-button3 img
{
    width: 75px;
    /* height: 75px; */
}

.menu-button.small-button
{
    margin-top: 15px !important;
}

.menu-button.small-button, .menu-button.small-button img
{
    width: 24px;
    height: 24px;
}

.menu-button.medium-button
{
    margin-top: 85px !important;
}

.menu-button.medium-button, .menu-button.medium-button img
{
    width: 50px;
    height: 50px;
}

.menu-icon-icon-trash-white_svg img
{
    width: 27px !important;
}

.view.with-create-button .menu-button
{
    height: 150px;
    margin-top: 120px !important;
}

.view.with-create-button .label
{
    margin-top: -10px;
    white-space: normal;
    line-height: 20px;
    background-color: rgba(255,255,255,0.8);
}

.board-message
{
    border-right: 5px solid black;
}

.board-message-type-1
{
    /* border-color: #C47070; */
    border-color: #D58C4D;
}

.board-message-type-2
{
    /* border-color: #00BECC; */
    border-color: #64899A;
}

.my-message
{
    border-color: black;
}

.details-picture
{
    position: relative;
    width: 100%;
    height: 180px;
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center;
    cursor: pointer;
}

#popup .details-picture
{
    height: 300px;
}

.details-picture::after
{
    content: "";
    position: absolute;
    bottom: 5px;
    left: 7px;
    width: 24px;
    height: 24px;
    background-image: url(/client/img/icon-eye.svg);
    background-repeat: no-repeat;
    background-position: center;
    background-color: rgba(0,0,0,0.2);
    padding: 3px;
    border-radius: 100px;
    background-size: 20px;
}

.text-left
{
    text-align: left;
}

.truck-list-info
{
    width: 67%;
}

.nothing-to-display
{
    text-align: center;
    background-image: url(/client/img/icon-info.svg);
    background-repeat: no-repeat;
    background-position: top center;
    position: fixed;
    top: calc(50% - 50px);
    left: calc(50% - 50px);
    width: 100px;
    height: 100px;
    padding-top: 30px;
    box-sizing: border-box;
    color: black;
    opacity: 0.5;
}

.no-records 
{
    text-align: center;
    background-image: url(/client/img/icon-info.svg);
    background-repeat: no-repeat;
    background-position: top 10px center;
    width: 100px;
    background-color: rgba(255, 255, 255, 0.4);
    padding: 20px;
    padding-top: 40px;
    box-sizing: border-box;
    color: black;
    width: 100%;
    display: block;
}

.admin-sites-card
{
    min-height: 120px;
    padding: 0px;
}

.admin-route-card
{
    height: auto;
    min-height: auto;
}

.admin-route-card md-card-content
{
    /* max-width: 450px; */
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    display: inline-block;
}

.admin-route-card, .admin-route-card md-card-content
{
    padding: 5px;
}

.truck-picture
{
    width: 80px;
    position: absolute;
    top: 20px;
    left: 20px;
}

.select-button .truck-picture img
{
    transition: transform 0.3s;
}

.select-button.selected .truck-picture img
{
    filter: grayscale() brightness(2);
    transform: translateX(20px);
}

.truck-list-view md-card-actions
{
    margin-top: -10px;
    margin-bottom: 0px;
}

.terms-view
{
    padding: 25px;
    padding-bottom: 0px;
    box-sizing: border-box;
    text-align: justify;
}

.registration-paragraph
{
    width: 300px;
    max-width: 100%;
    text-align: center;
    margin: 0 auto;
    font-size: 16px;
}

.register-now
{
    background-color: white;
    border-radius: 20px;
    border: 5px solid #d58c4d;
}

.register-options > div
{
    background-color: white;
    border-radius: 20px;
    border: 5px solid #d58c4d;
    margin-left: 20px;
    text-align: center;
}

.register-options article
{
    padding: 30px;
    padding-bottom: 10px;
}

.register-options > div h3
{
    margin: 0;
    padding: 0;
}

.register-options .price
{
    color: white;
    background-color: #d58c4d;
    padding-top: 10px;
    padding-bottom: 10px;
}

.register-options1
{
    border-color: #64899a !important;
}

.register-options1 .price
{
    background-color: #64899a !important;
}

.register-options3
{
    border-color: #d3c15b !important;
}

.register-options3 .price
{
    background-color: #d3c15b !important;
}

md-card .md-actions, md-card md-card-actions
{
    margin: 0;
}

.md-button
{
    text-transform: unset !important;
}

.admin-quick-drawer
{
    position: fixed;
    bottom: -400px;
    left: 0;
    width: 100%;
    height: 380px;
    background-color: white;
    z-index: 100;
    border-top-left-radius: 20px;
    border-top-right-radius: 20px;
    box-shadow: 0px -2px 10px #C9D6DC;

    transition: bottom 0.3s;
}

.admin-quick-drawer.open
{
    bottom: 0;
}

.admin-quick-drawer-image-container
{
    margin-top: 50px;
    height: 300px;
    width: 96%;
    overflow-y: scroll;
    position: absolute;
    left: 2%;
}

.admin-quick-drawer-image
{
    width: 100%;
    transform-origin: 50% 50%;
}

.admin-quick-drawer-image.r2
{
    margin-top: 300px;
    transform: rotate(270deg);
}

.admin-quick-drawer-image.r3
{
    transform: rotate(180deg);
}

.admin-quick-drawer-image.r4
{
    margin-top: 300px;
    transform: rotate(90deg);
}

.admin-quick-drawer-close
{
    position: absolute;
    top: 10px;
    right: 10px;
}

.admin-quick-drawer-rotate
{
    position: absolute;
    top: 13px;
    right: 50px;
    width: 30px;
}

/*
md-card .md-actions:not(.layout-column) .md-button.md-icon-button, md-card md-card-actions:not(.layout-column) .md-button.md-icon-button
{
    margin: 0px;
}

md-card-actions .md-button.md-icon-button
{
    margin: 0px;
}
*/

md-virtual-repeat-container .md-button.md-icon-button
{
    margin: -4px;
}

md-virtual-repeat-container .md-button.md-icon-button.button-1
{
    margin-left: -20px;
}

menu
{
    position: fixed;
    width: 100%;
    top: 0;
    left: 0;
    margin: 0;
    padding: 0;
    z-index: 10;
    overflow: visible !important;
}

.clear-menu
{
    padding-top: 56px !important;
}

.clear-extended-menu
{
    padding-top: 86px !important;
}

.clear-bottom-menu
{
    padding-bottom: 150px !important;
}

.clear-desktop-menu
{
    padding-top: 100px !important;
}

.bottom-menu
{
    position: fixed;
    background-color: white !important;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 71px;
    box-shadow: 0px -1px 5px #C9D6DC;
}

.bottom-menu .md-button
{
    padding: 10px;
    margin: 0;
    color: #64899A;
    font-size: 10px;
    line-height: 10px;
}

md-toolbar.bottom-menu .md-toolbar-tools
{
    overflow-x: auto;
    overflow-y: hidden;
    height: 71px;
    max-height: 71px;
}

md-toolbar.bottom-menu .md-toolbar-tools::-webkit-scrollbar {

    display: none;
}

.bottom-menu .md-toolbar-tools
{
    padding: 0px;
    mask-image: linear-gradient(
        to right,
        rgba(0,0,0,0) 0%,
        rgba(0,0,0,1) 3%,
        rgba(0,0,0,1) 97%,
        rgba(0,0,0,0) 100%
    );
}

.bottom-menu .md-button img
{
    margin-bottom: 5px;
}

.desktop-menu > md-toolbar > .md-toolbar-tools
{
    padding-left: 5px;
}

.material-type-button
{
    background-color: #EEF1F2;
    border-bottom: 1px solid #64899A;
    font-weight: bold;
    padding: 10px 30px;
    border-radius: 0px;
    margin: 0;
    margin-left: 8px;
}

.material-type-button.last
{
    margin-left: 0px;
}

.ad, .ad img
{
    max-width: 100%;
    cursor: pointer;
    text-align: center;
}

.bottom-menu .md-button div
{
    padding: 0px;
    margin: 0px;
}

.bottom-menu .md-button img
{
    height: 30px;
}

.bottom-menu .md-button.selected
{
    color: #D58C4D;
}

.route-price-boxes > span
{
    display: inline-block;
    vertical-align: top;
    margin-left: 10px;
    background-color: #EEF1F2;
    box-shadow: 2px 2px 4px #D6D6D6;
    /* min-width: 90px; */
}

.chip
{
    background-color: #EEF1F2;
    padding: 2px 10px;
    border-radius: 20px;
    margin-left: 10px;
}

.chip.orange
{
    color: white;
    background-color: #D58C4D;
}

.html-viewer h1
{
    width: 100%;
    text-align: right;
    margin-top: 20px;
}

.has-comment
{
    color: #D58C4D;
    font-weight: bold;
    background-image: url(/client/img/icon-comments.svg);
    background-repeat: no-repeat;
    background-position: 20px;
}

.route-price-boxes > span > div
{
    text-align: center;
    padding: 2px;
    direction: rtl;
    padding: 0px 10px;
}

.route-price-boxes > span > div:first-child
{
    background-color: #D58C4D;
    color: white;
}

.add-additional
{
    margin-top: 0px;
    cursor: pointer;
    text-align: center;
    background-color: #EEE;
    border-radius: 10px;
}

.certificate-card
{
    display: inline-block;
    vertical-align: top;

    width: 32%;
}

.certificate-card img
{
    width: 100%;
}

md-dialog-content article
{
    max-height: 300px;
    overflow-y: auto;
}

md-dialog-content article th
{
    border-bottom: 1px solid black;
    text-align: right;
}

md-card
{
    position: relative;
    padding: 10px;
    font-size: 15px;
    box-shadow: 0px 2px 4px #D6D6D6;
    border-radius: 5px;
    color: #334750;
    min-height: 80px;
}

.total-orders
{
    font-size: 18px;
    font-weight: bold;
    padding: 20px;
    padding-left: 15px;
}

.total-orders .total
{
    font-size: 30px;
    margin-top: -10px;
    width: 60px;
    text-align: center;
}

.total-day
{
    text-align: center;
    width: 30px;
    font-weight: bold;
}

.total-header
{
    font-size: 15px;
    font-weight: bold;
    padding-right: 27px;
    padding-left: 22px;
}

.justify
{
    text-align: justify;
}

.align-left
{
    text-align: left;
}

.align-right
{
    text-align: right;
}

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

md-toolbar h1
{
    color: white;
    margin-right: 18px !important;
}

.material-label
{
    display: inline-block;
    position: relative;
    top: -6px;
}

h2
{
    font-size: 18px;
    color: #2E5F75;
    margin-top: 0px;
    padding-top: 0px !important;
    padding-bottom: 0px !important;
    margin-bottom: 10px;
}

md-select:not(.no-style).md-default-theme .md-select-value, md-select:not(.no-style) .md-select-value 
{
    border-bottom-color: transparent !important;
}

#test-login
{
    position: absolute;
    width: 30px;
    height: 30px;
    /* background-color: red; */
    top: 20px;
    right: 20px;
    z-index: 20;
}

.last-login
{
    width: 100%;
    text-align: right;
    padding: 5px 10px;
}

.truck-selector
{
    position: fixed;

    background-color: white;
    width: 400px !important;
    height: 400px !important;
    min-width: 400px !important;
    top: 200px !important;
    left: calc(50% - 200px) !important;
    overflow-y: auto;
    box-shadow: 0 2px 5px rgba(0,0,0,.25);
}

.truck-selector md-select-menu
{
    overflow-x: hidden;
}

.truck-selector.right
{
    left: auto;
    right: 90px;
    top: 270px !important;
}

.truck-selector > md-select-menu, .truck-selector > md-select-menu > md-content
{
    max-height: 100%;
    min-height: 100%;
}

.truck-selector md-option
{
    height: 70px;
}

.truck-selector md-select-label
{
    font-weight: bold;
    color: #636363;
    padding: 10px;
    position: fixed;
    background-color: white;
    display: block;
    width: 100%;
    z-index: 2;
}

.truck-selector md-select-menu.md-default-theme md-content md-option:not([disabled]):focus, .truck-selector md-select-menu md-content md-option:not([disabled]):focus, .truck-selector md-select-menu.md-default-theme md-content md-option:not([disabled]):hover, .truck-selector md-select-menu md-content md-option:not([disabled]):hover
{
    background-color: transparent !important;
}

.truck-selector md-option .md-text
{
    position: relative;

    width: 100%;
    height: 60px;

    text-align: center;

    font-weight: bold;
    color: #64899A;

    background-repeat: no-repeat;
    background-size: auto 30px;
    background-position: center top 5px;
}

.truck-selector md-option .md-text .name
{
    position: absolute;
    width: 100%;
    font-size: 13px;
    margin-top: 41px;
}

md-option.small-text, md-select.small-text .md-text
{
    font-size: 10px;
}

.smaller-text
{
    font-size: 12px;
}

.truck-selector md-option[selected] .md-text .name
{
    color: #D58C4D;
}

.truck-selector md-option .md-text .name div
{
    background-color: white;
    text-align: center;
    display: inline-block;
    padding: 0px 10px;
}


.truck-selector md-option.truck0 .md-text { background-size: 140px; }
.truck-selector md-option.truck1 { margin-top: 50px; }

.truck-selector md-option.truck0 .md-text               { background-image: url(/client/img/trucks/truck-default.svg); }
.truck-selector md-option.truck1 .md-text               { background-image: url(/client/img/trucks/truck1.svg); }
.truck-selector md-option.truck2 .md-text               { background-image: url(/client/img/trucks/truck2.svg); }
.truck-selector md-option.truck3 .md-text               { background-image: url(/client/img/trucks/truck3.svg); }
.truck-selector md-option.truck4 .md-text               { background-image: url(/client/img/trucks/truck4.svg); }
.truck-selector md-option.truck5 .md-text               { background-image: url(/client/img/trucks/truck5.svg); }
.truck-selector md-option.truck6 .md-text               { background-image: url(/client/img/trucks/truck6.svg); }
.truck-selector md-option.truck7 .md-text               { background-image: url(/client/img/trucks/truck7.svg); }
.truck-selector md-option.truck8 .md-text               { background-image: url(/client/img/trucks/truck8.svg); }
.truck-selector md-option.truck9 .md-text               { background-image: url(/client/img/trucks/truck9.svg); }
.truck-selector md-option.truck10 .md-text              { background-image: url(/client/img/trucks/truck10.svg); }
.truck-selector md-option.truck12 .md-text              { background-image: url(/client/img/trucks/truck12.svg); }
.truck-selector md-option.truck24 .md-text              { background-image: url(/client/img/trucks/truck24.svg); }

.truck-selector md-option[selected].truck0 .md-text     { background-image: url(/client/img/trucks/truck-default-selected.svg); }
.truck-selector md-option[selected].truck1 .md-text     { background-image: url(/client/img/trucks/truck1-selected.svg); }
.truck-selector md-option[selected].truck2 .md-text     { background-image: url(/client/img/trucks/truck2-selected.svg); }
.truck-selector md-option[selected].truck3 .md-text     { background-image: url(/client/img/trucks/truck3-selected.svg); }
.truck-selector md-option[selected].truck4 .md-text     { background-image: url(/client/img/trucks/truck4-selected.svg); }
.truck-selector md-option[selected].truck5 .md-text     { background-image: url(/client/img/trucks/truck5-selected.svg); }
.truck-selector md-option[selected].truck6 .md-text     { background-image: url(/client/img/trucks/truck6-selected.svg); }
.truck-selector md-option[selected].truck7 .md-text     { background-image: url(/client/img/trucks/truck7-selected.svg); }
.truck-selector md-option[selected].truck8 .md-text     { background-image: url(/client/img/trucks/truck8-selected.svg); }
.truck-selector md-option[selected].truck9 .md-text     { background-image: url(/client/img/trucks/truck9-selected.svg); }
.truck-selector md-option[selected].truck10 .md-text    { background-image: url(/client/img/trucks/truck10-selected.svg); }
.truck-selector md-option[selected].truck12 .md-text    { background-image: url(/client/img/trucks/truck12-selected.svg); }
.truck-selector md-option[selected].truck24 .md-text    { background-image: url(/client/img/trucks/truck24-selected.svg); }

.truck-selector md-option[selected]
{
    background-color: transparent !important;
}

.subheader
{
    padding-top: 0px; 
    padding-bottom: 0px; 
    margin-bottom: 0px; 
    margin-top: 0px;
    color: #A9A9A9;
    font-size: 12px;
}

ad.mt-20 > div
{
    margin-top: 20px;
}

md-toolbar.menu
{
    background-color: transparent !important;
    box-shadow: none;
}

md-toolbar.menu h1
{
    color: #334750;
    padding-left: 16px;
    width: 100%;
    margin-right: 0px !important;    
}

md-toolbar.menu h1 .name
{
    margin-right: 17px;
    font-size: 18px;
}

md-sidenav, md-backdrop
{
    position: fixed;
    top: 0;
    z-index: 60;
}

footer
{
    position: fixed;
    left: 0px;
    bottom: 0px;
    width: 100%;
    text-align: center;
    font-size: 10px;
    /* background-color: white; */
    padding-bottom: 10px;
    font-size: 14px;
    color: #2E5F75;
}

md-sidenav .user-truck
{
    width: 60%;
    margin: 0 auto;
    margin-bottom: 10px;
}

md-toolbar.md-default-theme:not(.md-menu-toolbar), md-toolbar:not(.md-menu-toolbar)
{
    background-color: #64899A;
}

.menu-item
{
    font-size: 18px;
    text-align: right;
    padding: 0px;
    padding-top: 2px;
    margin-top: 0px;
    margin-bottom: 5px;
}

.menu-item.selected
{
    color: #D58C4D;
}

.menu-item .menu-item-icon
{
    width: 23px;
    height: 23px;
    margin-left: 26px;
    margin-top: -7px;
}

.menu-item .menu-item-label
{
    width: 220px;
    /* width: 177px; */
    padding-bottom: 13px;
    border-bottom: 2px solid #E4EAED;
}

.menu-item:last-child .menu-item-label
{
    padding-bottom: 0px;
    margin-bottom: 0px;
}

.menu-item:last-child .menu-item-label
{
    border-bottom: none;
}

.md-subheader
{
    /* margin-top: 15px; */
    text-align: center;
    pointer-events: none;
}

.md-subheader-inner
{
    width: auto;
    display: inline-block !important;
    margin: 0 auto;
    font-size: 12px;
    /* color: #64899A; */
    /* background-color: #EEF1F2; */
    color: #EEF1F2;
    background-color: #64899A;
    font-weight: bold;
    border-radius: 10px;
}

.md-button:disabled
{
    opacity: 0.3;
}

.disabled
{
    opacity: 0.3 !important;
    pointer-events: none !important;
}

.summary-viewer td
{
    direction: rtl;
}

.md-subheader.inverted .md-subheader-inner
{
    background-color: #D58C4D;
    color: #EEF1F2;
}

.md-subheader.no-bg .md-subheader-inner
{
    background-color: #F2F2F2;
}

.md-subheader.md-default-theme, .md-subheader
{
    background-color: transparent;
}

.md-subheader .md-subheader-inner
{
    padding: 3px 10px;
}

.offers-left
{
    position: absolute;

    width: 90px;
    height: 100px;
    top: -2px;
    left: -2px;

    overflow: hidden;
}

.offers-left > div
{
    width: 90px;
    height: 90px;

    position: absolute;
    top: -14px;
    left: -14px;

    background-image: url(/client/img/card-ribbon.svg);
    background-repeat: no-repeat;
    transform: rotate(-45deg);
    pointer-events: none;

    position: absolute;
    color: white;
    text-align: center;
    width: 100%;
    font-size: 10px;
    font-weight: bold;

    padding-top: 22px;
    box-sizing: border-box;

    line-height: 18px;
}

md-card.selected
{
    background-color: #D58C4D;
    color: white;
}

md-card.highlight
{
    background-color: #f9d6b7;
}

md-select.no-icon .md-select-icon
{
    display: none;
}

.offers-left.smaller-text > div
{
    font-weight: normal;
    font-size: 10px;
}

.comments
{
    background-image: url(/client/img/icon-comments.svg);
    background-repeat: no-repeat;
    background-position: top 2px right;
    background-size: 12px 12px;
    padding-right: 20px;
    font-size: 12px;
    line-height: 13px;
    width: 150px;
}

.request-message
{
    margin-top: 10px;
    width: 70%;
    font-size: 12px;
}

.transport-is-purchase
{
    background-color: #F8E3BA !important;
}

.order-emblem
{
    position: absolute;
    top: 10px;
    left: 10px;
    font-size: 12px;
    background-position: 0px 0px;
    padding-left: 18px;
    text-align: left;
    background-size: 15px 15px;
    padding-bottom: 20px;
    background-repeat: no-repeat;
}

.white-bg
{
    background-color: white !important;
}

.order-emblem.icon-is-purchase
{
    background-image: url(/client/img/icon-orders.svg);
}

.order-emblem.icon-is-request
{
    background-image: url(/client/img/icon-offer.svg);
}

.content-padding-20
{
    padding: 10px;
    padding-top: 70px;

    box-sizing: border-box;
}

.content-padding-30
{
    padding: 30px;
    padding-top: 70px;

    box-sizing: border-box;
}

.content-padding-40
{
    padding: 40px;
    padding-top: 70px;

    box-sizing: border-box;
}

.content-padding-100
{
    padding: 100px;
    padding-top: 70px;

    box-sizing: border-box;
}

.content-padding-120
{
    padding: 120px;
    padding-top: 70px;

    box-sizing: border-box;
}

.status-seperator
{
    display: inline-block;
    width: 10px;
    margin-left: 5px;
    margin-right: 5px;
    height: 11px;
    border-top: 1px solid #B4C7D0;
}

.table-no-records
{
    text-align: center;
    padding: 20px;
    border: 1px solid #6A8E9E;
    margin-top: 10px;
}

.status-seperator.active
{
    border-top: 1px solid #D58C4D;
}

md-table-container
{
    clear: both;
}

table.md-table td, table.md-table th
{
    text-align: right !important;
}

table.md-table th.label-center
{
    text-align: center !important;
}

table.md-table tbody tr:hover
{
    background-color: #EBF2F5;
}

table.md-table td.first, table.md-table th.first
{
    padding-right: 10px !important;
}

.table-filter
{
    margin-top: 3px;
    margin-bottom: 0px;
    width: 250px;
    max-width: 100%;
    float: left;
}

.table-filter.no-float
{
    float: none;
}

.table-header
{
    padding-top: 20px;
    padding-bottom: 20px;
}

.md-table-pagination md-select
{
    min-width: 100px;
}

md-autocomplete
{
    min-width: 170px;
}

md-input-container *[disabled]
{
    opacity: 0.5 !important;
}

.md-table-pagination>.buttons>.label+.md-button.md-icon-button, .md-table-pagination>.buttons>.md-button.md-icon-button
{
    transform: rotate(180deg);
}

md-select.md-table-select>.md-select-value
{
    min-width: 50px;
}

md-table-pagination
{
    border-top: none !important;
    float: right;
}

.md-table-pagination>.buttons:not(:first-child), .md-table-pagination>.limit-select:not(:first-child)
{
    margin-left: 0px;
    margin-right: 32px;
}

md-input-container.md-input-focused:not([md-no-float]) .md-select-placeholder span:first-child
{
    transform: translateY(-12px) translateX(-2px) scale(.75);
}

.select-button
{
    margin: 0;
    margin-bottom: 10px;
}

.select-driver-view .select-button
{
    padding: 20px;
}

.select-button.selected
{
    background-color: #D58C4D;
    color: white;

    transition: all 0.2s;
}

.select-button md-card-content
{
    padding: 0px;
}

md-checkbox.md-checked .md-icon:after
{
    border-color: white;
}

.build-info
{
    direction: ltr;
}

.tab
{
    position: fixed;
    z-index: 2;
    top: 60px;

    width: 677px;

    pointer-events: none;
}

.tab.open
{
    pointer-events: all;
    z-index: 3;
}

.tab.narrow
{
    width: 377px;
}

.tab.wide
{
    width: 1500px;
}

.tab.wide.left
{
    left: -1500px;
}

.tab.right
{
    transition: right 0.3s;
    right: -600px;
}

.tab.left
{
    transition: left 0.3s;
    left: -677px;
}

.tab.narrow.right
{
    right: -300px;
}

.tab.narrow.left
{
    left: -377px;
}

.tab.right.open
{
    right: 0;
}

.tab.left.open
{
    left: -77px;
}

.tab-label
{
    position: absolute;
    z-index: 2;
    top: 60px;

    pointer-events: all;
    
    width: 77px;
    height: 128px;
    background-color: white;
    
    text-align: center;
    padding: 20px;
    box-sizing: border-box;
    line-height: 13px;

    transition: all 0.3s;
}

.tab-label.green-border
{
    border: 3px solid #7AD54D;
    border-right: 0px;
}

.tab-label.orange-border
{
    border: 3px solid #d58c4d;
    border-right: 0px;
}

.tab-label .small-tag
{
    position: absolute;
    top: 0;
    right: 0;
    color: white;
    padding: 2px 5px;
    padding-left: 10px;
    border-bottom-left-radius: 10px;
}

.tab-label.orange-border .small-tag
{
    background-color: #d58c4d;
}

.tab-label.green-border .small-tag
{
    background-color: #7AD54D;
}

.disabled .tab-label
{
    left: 20px;
    pointer-events: none;
}

.tab-label-lower
{
    top: 200px;
}

.tab.dragging .tab-label
{
    z-index: 0 !important;
}

.tab.right .tab-label
{
    left: 0;
    border-bottom-left-radius: 50px;
    box-shadow: -8px 3px 8px rgba(0,0,0,0.06);
}

.tab.left .tab-label
{
    right: -77px;
    border-bottom-right-radius: 50px;
    box-shadow: 8px 3px 8px rgba(0,0,0,0.06);
}

.with-selector .tab-label
{
    top: 80px;
}

.hidden
{
    opacity: 0;
    pointer-events: none;
}

.linked-company
{
    padding-left: 10px;
    padding-right: 10px;
    border-radius: 20px;
    padding-top: 3px;
    background-color: #F5F5F5;
    position: relative;
    top: -3px;
}

.table-icon
{
    position: relative;
    top: 2px;
    margin-left: 10px;
    width: 15px;
    height: auto;
}

.underline, .underline-value .value
{
    text-decoration: underline;
    text-decoration-style: dashed;
    text-decoration-color: #D58C4D;
}

.underline:hover, .underline-value .value:hover
{
    text-decoration-style: solid;
}

md-switch.md-checked .md-thumb, md-switch.md-checked .md-thumb
{
    background-color: #D58C4D !important;
}

md-switch.md-checked .md-bar, md-switch.md-checked .md-bar
{
    background-color: #D58C4D !important;
    opacity: 0.5;
}

.drivers-list .under-driver
{
    margin-right: 20px;
    /* opacity: 0.7; */
    background-color: #EEE;
    margin-top: -1px;
}

.drivers-list .under-driver.company-truck
{
    /* background-color: #ffe4cc; */
    border: 1px solid #64899A;
}

.active-transport
{
    background-color: #ffe4ce !important;
}

.drivers-list.recommended-driver
{
    border: 1px solid #CCC;
    padding: 5px;
    margin-bottom: 20px;
}

.drivers-list .drivers-list-card
{
    height: 40px;
}

.drivers-list .last-driver, .last-driver
{
    background-color: #ffeedf;
    height: 50px;
    border: 1px solid #D58C4D;
}

.drivers-list .last-driver-text
{
    position: absolute;
    right: 10px;
    bottom: 3px;
    font-size: 12px;
}

.drivers-list.recommended-driver.driver1
{
    border: 1px solid #D58C4D;
}

.drivers-list .recommended.under-driver
{
    margin-right: 0px;
    opacity: 1;
}

.tab-label img
{
    margin-bottom: 5px;
}

.tab-content
{
    position: absolute;
    z-index: 1;
    top: 0;
    left: 77px;
    background-color: white;
    width: 600px;
    height: 100%;
    padding: 20px;
    box-sizing: border-box;

    padding-bottom: 200px;

    box-shadow: -8px 3px 8px rgba(0,0,0,0);

    transition: all 0.3s;
}

.tab.dragging .tab-content
{
    box-shadow: none !important;
}

.tab.narrow .tab-content
{
    width: 300px;
}

.tab.wide .tab-content
{
    width: 1424px;
}

.tab.right.open .tab-content, .tab.right.open .tab-label
{
    box-shadow: -8px 3px 8px rgba(0,0,0,0.16);
}

.tab.left.open .tab-content, .tab.left.open .tab-label
{
    box-shadow: 8px 3px 8px rgba(0,0,0,0.16);
}

.tab-content md-content
{
    padding-bottom: 100px;
}

.quick-finish-done md-card, .quick-finish-done transport-card > div
{
    border: 2px solid #d58c4d;
}

.summary .row-index
{
    width: 0% !important;
    padding-left: 20px;
}

.hidden-order
{
    pointer-events: none;
    position: relative;
}

.hidden-order md-card
{
    filter: blur(5px);
}

.hidden-order::after
{
    content: "הובלה זו נעולה לצפייה";
    position: absolute;
    width: 100%;
    filter: none !important;
    z-index: 2;
    text-align: center;
    font-size: 20px;
    padding-top: 80px;
    background-image: url(http://localhost:21702/client/css/../img/icon-lock.svg);
    background-repeat: no-repeat;
    background-size: 50px;
    background-position: center 25px;
    top: 0px;
}

.admin-quick-orders
{
    position: fixed;
    width: 30px;
    height: 138px;
    bottom: 60px;
    right: 0;
    z-index: 1;
    border-top: 5px solid #d58c4d;
    box-shadow: 0px 0px 20px rgba(0,0,0,0.2);

    transition: all 0.3s;
}

.admin-quick-orders .quick-tab
{
    position: absolute;
    left: -40px;
    z-index: 1;
    background-color: white;
    height: 138px;
    padding: 20px 10px;
    box-sizing: border-box;
    top: -5px;
    border-top: 5px solid #d58c4d;;
    border-left: 5px solid #d58c4d;;
    border-top-left-radius: 20px;
    border-bottom-left-radius: 20px;
    width: 80px;
}

.admin-quick-orders.open
{
    width: 96%;
}

.admin-quick-orders article
{
    width: 98%; 
    white-space: nowrap; 
    margin-top: -5px;
    padding-right: 10px;
    padding-left: 10px;
    box-sizing: border-box;
    opacity: 0;

    overflow-x: hidden;
    overflow-y: hidden;
    
    transition: all 0.3s;
}

.admin-quick-orders.open article
{
    overflow-x: auto;
    opacity: 1;
}

.admin-quick-orders article > div, .admin-quick-orders2 ul li > div
{
    display: inline-block; 
    vertical-align: top; 
    width: 50px; 
    height: 40px;
    margin-top: 10px;
    background-position: center;
    border: 3px solid transparent;
    border-radius: 5px;
}

.admin-quick-orders article > div.selected, .admin-quick-orders2 ul li > div.selected
{
    border: 3px solid #d58c4d;
}

.bk-table h1
{
    color: #D58C4D;
    display: inline-block;
    font-size: 16px;
    margin-bottom: 30px;
    vertical-align: top;
}

input:not(.with-arrows)::-webkit-outer-spin-button,
input:not(.with-arrows)::-webkit-inner-spin-button
{
  -webkit-appearance: none;
  appearance: none;
  margin: 0;
}

input[type=number]:not(.with-arrows)
{
  -moz-appearance: textfield;
  appearance: textfield;
}

.number-field:not(.with-arrows), input[type=number]:not(.with-arrows)
{
    direction: ltr;
    display: inline-block;
    text-align: right;
}

.coin-popup-header
{
    background-color: #E56060;
    width: 100%;
    padding: 30px 50px;
    box-sizing: border-box;
    color: white;
    text-align: center;
    font-size: 16px;
}

.coin-popup-header h2
{
    color: white;
}

.coin-popup-amount
{
    margin-top: 10px;
    color: #ffdd00;
    font-size: 37px;
    font-weight: bold;
    text-shadow: 3px 3px 0px rgba(0, 0, 0, 0.3);
    padding-bottom: 40px;
}

.coin-popup-amount img
{
    position: relative;
    top: 13px;
}

.lottie
{
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 100;
    pointer-events: none;
}

.take-photo-anim
{
    width: 85px;
    height: 85px;
    position: relative;
    left: 15px;
    top: -10px;
}

.round-borders-20 > div
{
    border-radius: 20px;
}

.progress-bar-text
{
    position: absolute; 
    width: 100%; 
    text-align: center; 
    margin-top: -6px; 
    color: white; 
    text-shadow: 0px 0px 2px black;
}

.finished-button .status-circle
{
    background-repeat: no-repeat;
    background-position: center;
    background-size: 80%;
}

.finished-button .status-circle-60
{
    background-image: url(/client/img/icon-clear-white.svg);
}

.finished-button .status-circle-100
{
    background-image: url(/client/img/icon-check-white.svg);
}

.finished-button
{
    position: absolute;

    opacity: 0;
    top: 0px;
    right: 0px;

    width: 40px;

    transition: all 0.3s;
    pointer-events: none;
}

transport-card:hover .finished-button
{
    opacity: 1;
    pointer-events: all;
}

transport-card .finished-button > div
{
    width: 20px;
    height: 20px;
    position: absolute;
    right: 0px;

    transition: all 0.3s;
}

transport-card:hover .finished-button .finished-button-finish
{
    right: -40px;
    width: 20px;
}

transport-card:hover .finished-button .finished-button-cancel
{
    right: -20px;
    width: 20px;
}

.take-photo-text
{
    font-size: 18px;
    background-color: #64899a;
    padding: 5px 20px;
    border-radius: 20px;
    color: white;
    margin-top: 8px;
    border: 3px solid #465e69;
}

.take-photo-text2
{
    position: absolute;
    width: 100%;
    bottom: 0px;
    left: 0px;
    background-color: #D58C4D;
    color: white;
    font-size: 12px;
    font-weight: normal;
    padding: 5px 10px;
    border-bottom-left-radius: 5px;
    border-bottom-right-radius: 5px;
}

md-menu-content md-menu-item button:hover
{
    background-color: #ECECEC !important;
}

.mdtp__wrapper
{
    direction: ltr;
}

.offers-view ng-map
{
    height: 200px;
}

.offers-view .offer-body
{
    padding: 10px; 
    width: 100%;
    position: relative;
}

.offers-view .offer-button
{
    display: inline-block;
    font-size: 16px;
    line-height: 16px;
    text-align: center;
    background-color: #D68C4D;
    color: white;
    border-top-left-radius: 5px;
    border-bottom-left-radius: 5px;
    width: 80px;
    padding-top: 23px;
    box-sizing: border-box;
}

.admin-offer-buttons .offer-button
{
    color: #D58C4D;
    border: 1px solid #D58C4D;
    border-radius: 8px;
    text-align: center;
    background-color: white;
    height: 30px;
    line-height: 10px;
    margin-top: -6px;
}

.offers-view .offer-button.small
{
    padding: 10px;
    min-width: 150px;
    margin-top: -8px;
    border-radius: 8px;
    margin-right: 100px;
}

.admin-offer-line.selected .admin-offer-buttons .offer-button
{
    background-color: #D58C4D;
    color: white;
}

.offers-view .four-lines .offer-button
{
    padding-top: 32px;
}

.offers-view .offer-button.pending
{
    background-color: #B1B1B1;
}

.offers-view .offer-button.cancel
{
    background-color: transparent;
    border: 1px solid #E85656;
    color: #E85656;
    
}

.offers-view .offer-button.accept
{
    background-color: #ADCE6B;
}

.offers-view .offer-line > div
{
    display: inline-block;
    font-size: 12px;
}

.offers-view .offer-line > div:first-child
{
    color: white;
    background-color: #E2AE82;
    border-radius: 20px;
    padding: 0px 10px;
    min-width: 23px;
    margin-left: 3px;
}

.offers-view .offer-line.distance
{
    position: absolute;
    left: 8px;
    bottom: 10px;
}

.offers-view .offer-line.distance > div:first-child
{
    background-color: #AECE6D;
    min-width: auto;
    padding: 0px 5px;
}

.offers-view hr
{
    border: 1px solid #EBEBEB;
}

.offer-line-mini-icon img, .mini-icon
{
    vertical-align: middle;
    width: 16px;
    height: 16px;
}

.tiny-icon
{
    vertical-align: middle;
    width: 6px;
    height: 10px;
}

.offer-line-mini-icon img
{
    margin-inline-end: 8px;
}

.offer-line-mini-icon
{    
    margin-block-end: 12px;
}

.offer-details-button
{
    position: absolute; 
    bottom: 0; 
    left: 0;
    color: white;
    background-color: #CE7D4D;
    border-radius: 4px;
    margin-inline: 4px;

    line-height: 0px !important;
    min-height: 0px !important;
    min-width: 0px !important;
    padding: 7px;
}

.offer-details-button-mobile
{
    margin-inline-start: auto;
    margin-inline-end: 0px;
    margin-block: 0px;

    color: white;
    background-color: #CE7D4D;
    border-radius: 4px;
    
    line-height: 0px !important;
    min-height: 0px !important;
    min-width: 0px !important;
    padding: 7px;
}

.center-div {
    display: flex;
    justify-content: center;
    align-items: center;
}

.contact-info {
    direction: ltr;
    display: flex;
    align-items: center;
    justify-content: flex-start;
    gap: 16px;
    margin-block: 20px;
    margin-inline-start: 20px;
}

.contact-info img {
    width: 40px;
    height: 40px;
}

.offers-subheader
{
    text-align: center;
    border-radius: 24px;
    margin-block: 12px;
    display: table;
    margin-inline: auto;
    padding-inline: 8px;
    padding-block: 4px;
    background-color: #5B818D33;
    color: #1E1E1E;
    font-size: 10px;
}

.offers-view #offer-details
{
    position: fixed;
    z-index: 3;
    left: 0;
    bottom: 0;
    width: 100%;
    margin: 0;
    padding: 20px;
    box-sizing: border-box;
    box-shadow: 0px -2px 20px rgba(0, 0, 0, 0.3);
}

.map-container-mobile
{
    position: fixed;
    z-index: 3;
    left: 0;
    top: 0;
    width: 100%;

    transform: translateY(0);
    opacity: 1;
}

.map-container-mobile.ng-hide {
    transform: translateY(-100%);
    opacity: 0;
    transition: transform 0.3s ease-in-out, opacity 0.3s ease-in-out;
}  

.offers-view.offers-desktop
{
    position: relative;
}

.offers-view.offers-desktop #offer-details
{
    position: fixed;
    bottom: -350px;
    left: 0;

    transition: bottom 0.3s;
}

.offers-view.offers-desktop.open #offer-details
{
    bottom: -10px;
}

md-select-menu
{
    z-index: 100;
}

.offers-view #offer-details .offer-main-button
{
    margin: 0;
    width: calc(100% - 20px);
    color: white;
    border-radius: 8px;
}

.offers-view #offer-details .offer-main-button.offer-interested-button
{
    background-color: #AD7546;
}

.offers-view #offer-details .offer-main-button.offer-waiting-button
{
    background-color: #2e2e2e;
}

.offers-view #offer-details .offer-main-button.offer-accept-button
{
    background-color: #ADCE6B;
}

.offers-view #offer-details #offer-close-button
{
    position: absolute;
    top: 15px;
    left: 5px;
    z-index: 1;
}

.offers-view #offer-details #price
{
    position: absolute;
    left: 30px;
    top: 50px;
    text-align: center;
    border-bottom: 1px solid rgb(96, 125, 139);
}

.offers-view .offers-warning
{
    color: white;
    background-color: #EC8181;
    font-size: 12px;
    padding: 10px;
    border-radius: 8px;
    box-sizing: border-box;
    width: calc(100% - 20px);

    padding-right: 15px;
    padding-left: 30px;

    background-image: url(/client/img/icon-info-white.svg);
    background-repeat: no-repeat;
    background-position: left 10px center;
}

.report-graph
{
    transition: width 0.3s;
}

.white-box
{
    background-color: white;
}

.white-box .bk-table
{
    background-color: white;
    padding: 20px;
    box-shadow: 0px 1px 10px rgba(0,0,0,0.06);
}

.table-lines tr:not(.last) td
{
    border-bottom: 1px solid #D7D7D7;
}

.table-lines td.first
{
    padding-right: 10px;
}

thead .md-column
{
    color: #64899A !important;
}

[dir=rtl] .md-chips 
{
    padding: 0px;
}

.floating-tab-button
{
    position: absolute;
    left: 0px;
    bottom: 60px;
    z-index: 2;
    background-color: rgba(255,255,255,0.8);
    border-radius: 100px;
    padding: 10px 20px;
    text-align: center;
}

md-input-container:not(.no-style) .md-select-value>span:not(.md-select-icon)
{
    max-width: 85%;
}

.md-datepicker-button
{
    position: absolute !important;
    top: 0 !important;
    left: 0 !important;
    width: 100% !important;
    height: 100% !important;
    border-radius: 0 !important;
    margin-top: 0px !important;
    opacity: 0 !important;
    z-index: 2 !important;
}

.md-datepicker-input
{
    max-width: 100%;
    pointer-events: none;
}

@keyframes fade-in
{
    0% { opacity: 0; }
    100% { opacity: 1; }
}

@keyframes fade-out
{
    0% { opacity: 1; }
    100% { opacity: 0; }
}

.splash-view
{
    opacity: 0;
    
    background-image: linear-gradient(204deg, #2792BB, #2C4550);
    color: white;

    animation: 0.5s fade-in forwards 0.2s;
}

.splash-view-truck
{
    background-image: url(/client/img/splash-logo.svg);
    background-repeat: no-repeat;
}

.splash-view.cid-9 .splash-view-truck
{
    background-image: url(/client/img/ashtrum-truck.png);
    background-size: contain;
    background-repeat: no-repeat;
}

.splash-view.cid-9 .splash-view-extra
{
    background-image: url(/client/img/ashtrum-logo.png);
    background-repeat: no-repeat;
    width: 180px;
    height: 190px;
    background-size: contain;
    background-position: center;
    position: fixed;
    top: 280px;
    left: calc(50vw - 90px);
}

.splash-view.cid-9
{
    background-image: url(/client/img/ashtrum-bg.svg);
    background-repeat: no-repeat;
    background-size: cover;
}

.splash-view.out
{
    opacity: 1;
    animation: 0.5s fade-out forwards 0.2s;
}

.splash-view *
{
    backface-visibility: hidden;
    transform: scale(1);
    transform: translate3D(0, 0, 0); 
    transform-style: preserve-3d;
}

.orders-closed
{
    filter: grayscale() brightness(1.4);
}

.order-button.orders-timed::after
{
    content: "";
    position: absolute;
    top: -9px;
    right: 5px;
    background-image: url(/client/img/icon-clock.svg);
    background-repeat: no-repeat;
    width: 24px;
    height: 24px;
}

.order-button.orders-closed::after
{
    background-image: url(/client/img/icon-lock.svg);
    filter: brightness(0.7);
}

@keyframes splash-logo-animation
{
    0% { right: 100% }
    100% { right: -120%; }
}

@keyframes splash-logo-animation2
{
    0% { left: 130% }
    100% { left: -80%; }
}

/*
@keyframes splash-logo-exit-animation
{
    0% { right: 94px; }
    100% { right: -200%; }
}

@keyframes splash-logo-exit-animation2
{
    0% { left: 94px; }
    100% { left: 40%; }
}
*/

.splash-view .logo
{
    position: absolute;
    top: 224px;

    width: 386px;
    height: 119px;

    right: 100%;

    animation: splash-logo-animation 0.9s forwards linear;
    animation-delay: 0.3s;
}

.splash-view.cid-9 .logo
{
    right: auto;
    left: 100%;
    animation: splash-logo-animation2 0.9s forwards linear;
    animation-delay: 0.3s;
}

.splash-view .full-trailer
{
    width: 100%;
    display: block;
    margin: 0 auto;
    margin-top: 390px;
    text-align: center;
}

.splash-view .full-trailer img
{
    width: 152px;
}

.splash-view.cid-9 .full-trailer
{
    position: fixed;
    bottom: 20px;
}

.splash-view .tag-line
{
    margin-top: -4px;
    display: block;
    width: 100%;
    text-align: center;
}

.button-bottom-center
{
    position: absolute;
    bottom: 42px;
    left: 50%;
    width: 200px;
    margin-left: -100px;
}

hr
{
    width: 100%;
    padding: 0px;
    border: none;
    border-bottom: 1px solid #D58C4D;
}

hr.blue
{
    border-color: #707070;
}

hr.dashed
{
    border-bottom-style: dashed;
}

.coins
{
    font-size: 18px;
    font-weight: bold;
    color: #ffdd00;
}

.sidebar-content .coins
{
    font-size: 14px;
    color: white;
    background-color: #AEC1CA;
    border-radius: 15px;
    float: left;
    padding-right: 11px;
    height: 31px;
    margin-top: 5px;
}

.sidebar-content .coins img
{
    margin-top: 4px;
    margin-left: 4px;
}

.leaderboard-card
{
    padding: 10px 15px; 
    color: #64899A; 
    min-height: auto;
}

.leaderboard-card.me
{
    background-color: #FFDD00;
}

.store-header
{
    position: relative;
    width: 100%;
    height: 268px;
    /* height: 296px; */
    /* height: 180px; */
    background-color: #64899A;
    border-bottom-right-radius: 45px;
    border-bottom-left-radius: 45px;
    padding-top: 65px;
    box-sizing: border-box;
    text-align: center;
}

md-date-range-picker
{
    direction: ltr;
}

#zoom .zoom-comments
{
    position: fixed;
    bottom: 0px;
    left: 0px;
    text-align: center;
    color: white;
    width: 100%;
    z-index: 2;
    background-color: rgba(0,0,0,0.8);
    padding: 20px 60px;
    box-sizing: border-box;
    border-radius: 0px;

    transition: bottom 0.3s;
}

#zoom .zoom-comments.hide-comment
{
    bottom: -60px;
}

.driver-header
{
    position: relative;
    margin-top: 55px; 
    background-color: #64899A;
    color: white;
    box-shadow: 0px 3px 6px #00000029;
    border-bottom-left-radius: 50px;
    border-bottom-right-radius: 50px;
    z-index: 3;
}

.driver-header .md-subheader-inner
{
    font-weight: normal;
    font-size: 12px;
    background-color: #8BA7B4;
    border-radius: 10px;

}

.driver-header .count
{
    background-color: #D58C4D;
    width: 25px;
    height: 25px;
    border-radius: 100px;
    border: 3px solid #64899A;
    display: inline-block;
    font-size: 18px;
    position: absolute;
    bottom: -10px;
    left: calc(50% - 10px);
    z-index: 1;
    background-image: url(/client/img/tiny-arrow-down.svg);
    background-repeat: no-repeat;
    background-position: bottom -3px center;
    line-height: 22px;
    text-align: center;
    box-shadow: 0px 2px 4px #00000029;
}

.driver-header .count.expanded
{
    background-image: none;
    background-color: #64899A;
}

.driver-header md-card
{
    background-color: transparent;
    box-shadow: none;
    color: white;
    min-height: auto;
    border-top: 1px solid #83A1AF;
    border-radius: 0px;
    padding-left: 0px; 
    padding-right: 10px; 
    box-sizing: border-box;
}

.driver-header-transports
{
    /* max-height: 288px; */
    max-height: 80vh;
    overflow-y: auto;
}

.driver-header-transports > div:first-child md-card
{
    border-top: none;
}

.driver-page-transport
{
    min-height: auto; 
    padding-left: 0px;
}

.driver-page-transport.unavailable .dimmable
{
    opacity: 0.5;
}

.driver-page-transport .count
{
    background-color: #D58C4D;
    width: 20px;
    height: 20px;
    border-radius: 100px;
    color: white;
    border: 3px solid white;
    display: inline-block;
    font-size: 12px;
    position: absolute;
    bottom: -10px;
    left: calc(50% - 15px);
    z-index: 1;
    line-height: 20px;
    text-align: center;
    box-shadow: 0px 2px 4px #00000029;
}

.driver-page-transport .count.expanded
{
    background-color: white;
}

.driver-page-transport-list md-card
{
    box-shadow: none;
    padding: 0px;
    border-top: 1px solid #83A1AF;
    padding-top: 10px;
    border-radius: 0px;
}

.driver-page-transport-list md-card md-card-actions
{
    margin-top: -20px;
}

.driver-page-transport-list:first-child md-card
{
    border-top: none;
}

button.toggle-button2.selected
{
    background-color: #64899A !important;
    color: white !important;
}

md-card.group.general-orders
{
    background-color: #eafaff;
}

#side-image
{
    position: fixed;
    top: 195px;
    left: 0;
    width: 100%;
    height: calc(100vh - 195px);
    z-index: 20;
    background-color: rgba(0,0,0,0.6);
    padding: 25px;
    box-sizing: border-box;
    overflow: auto;
    cursor: pointer;

    background-image: url(/client/img/icon-close.svg);
    background-repeat: no-repeat;
    background-position: top right;
}

#side-image img
{
    width: 100%;
    height: auto;
}

.no-trucks
{
    color: #64899A;
    text-align: center;
    font-size: 15px;
}

.no-trucks img
{
    padding: 20px;
    border: 1px dashed #64899A;
    border-radius: 12px;
}

.rating-stars
{
    position: relative;
    margin: 10px auto;
    background-image: url(/client/img/rating-stars-white.png);
    background-repeat: no-repeat;
    background-position: center;
    width: 194px;
    height: 77px;

    color: #FFDD00;
    font-size: 40px;
    font-weight: bold;
    padding-top: 50px;
    box-sizing: border-box;
    text-shadow: 3px 3px 0px rgba(0, 0, 0, 0.3);
}

.rating-stars > div
{
    background-image: url(/client/img/rating-stars-gold.png);
    background-repeat: no-repeat;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}

.store-header span
{
    position: relative; 
    top: -12px;
    color: #FFDD00;
    font-size: 37px;
    font-weight: bold;
}

.prizes
{
    padding: 11px;
    box-sizing: border-box;
}

.prize
{
    padding: 10px;
    padding-bottom: 0px;
    background-color: white;
    border-radius: 5px;
    box-shadow: 0px 2px 4px #00000029;
    margin-bottom: 10px;
    color: #64899a;
}

.purchased
{
    background-image: url(/client/img/roadmap-bg.png);
    background-repeat: no-repeat;
    background-position: bottom;
}

.purchased > div
{
    color: #334750;
    border-radius: 7px;
    text-align: center;
    padding: 20px;
    box-sizing: border-box;
}

.multi-route-route
{
    font-size: 12px;
}

.multi-route-route .multi-route-route-second-line
{
    margin-top: -20px;
}

.md-select-value .multi-route-route-second-line
{
    display: none;
}

.origin-marker
{
    opacity: 0.5;
}

button.md-button.default-button{
    background-color: #D58C4D;
    color: white;
}

button.md-button.large-button
{
    display: inline-block;
    padding: 10px 30px;
    color: white;
    background-color: #D58C4D !important;
    font-weight: bold;
    font-size: 24px;
    border-radius: 30px;
    box-shadow: 0px 3px 6px rgba(0,0,0,0.5);
    margin-bottom: 20px;
    border: 2px solid white;
    height: 60px;

    transition: all 0.1s;
}

button.md-button.large-button.blue
{
    background-color: #2E5F75 !important;
}

button.md-button.large-button.red
{
    background-color: #E85656 !important;
}

button.md-button.large-button.more-shadow
{
    box-shadow: 3px 10px 15px rgba(0,0,0,0.5);
}

.banner-coins
{
    position: absolute; 
    right: 5px; 
    bottom: 0px;
    pointer-events: none;
    color: white;
    background-color: rgba(0, 0, 0, 0.6);
    padding: 5px 10px;
    font-weight: bold;
}

.banner-coins img
{
    margin-right: 5px;
}

.bg-orange
{
    color: white !important;
    background-color: #D58C4D !important;
}

button.md-button.large-button:active
{
    transform: translateY(3px) scale(0.99);
    box-shadow: 0px 0px 0px rgba(0,0,0,0.5);
}

.radio-button
{
    text-align: right;
    padding: 13px;
    padding-right: 20px;
    box-shadow: 0px 2px 4px #D6D6D6 !important;
    border-radius: 5px;
}

.radio-button.selected
{
    color: white;
    background-color: #D58C4D !important;
}

.with-icon-label
{
    margin-top: -8px;
}

.with-icon-label div
{
    margin-top: -22px;
}

.report-status-icon
{
    display: inline-block;
    vertical-align: top;
    margin-top: 10px;
    margin-right: 10px;
    opacity: 0.2;
}

.report-status-icon.active
{
    opacity: 1;
}

.wide .wide-view-container
{
    width: 320px;
    margin: 0 auto;
    max-width: 100%;
}

.wide .wide-view-container.wider
{
    width: 800px;
}

.wide .truck-left
{
    position: absolute;
    top: 425px;
    left: -200px;
}

.wide .truck-right
{
    position: absolute;
    top: 425px;
    right: -200px;
}

.desktop-menu
{
    position: fixed;
    width: 100%;
    top: 0;
    right: 0;
    z-index: 4;
}

.desktop-menu .desktop-menu-toolbar-tools
{
    color: #2E5F75;
    background-color: white;
    box-shadow: 0px 3px 6px rgba(0,0,0,0.1);
}

.desktop-menu .head
{
    /* text-align: center; */
    text-align: left;
    font-size: 13px;
    position: relative;
    width: 230px;
    height: 56px;
}

.desktop-menu .head .logo
{
    position: absolute;
    top: 5px;
    left: 0;
    width: 53px;
    height: 53px;
}

.desktop-menu .head img
{
    height: 53px;
}

.site-approved-stamp
{
    position: absolute;
    text-align: center;
    border: 2px solid darkslateblue;
    color: darkslateblue !important;
    font-weight: bold;
    border-radius: 5px;
    padding: 5px;
    background-color: rgba(255, 255, 255, 0.5);
    top: 40px;
    left: 20px;
    transform: rotate(25deg);
    font-size: 12px;
    width: 120px;
}

.site-approved-stamp h2
{
    font-size: 14px;
}

.site-approved-stamp .name
{
    width: 120px;
    text-overflow: ellipsis;
    overflow: hidden;
    white-space: nowrap;
}

.desktop-menu .head .text
{
    position: absolute;
    top: 15px;
    left: 60px;
    height: 11px;
}

.desktop-menu .head .text2
{
    position: absolute;
    top: 30px;
    left: 60px;
}

.small-dialog-icon
{
    width: 50px;
    display: block;
}

.virtualRepeatdemoDeferredLoading #vertical-container 
{
    height: 292px;
    width: 100%;
    max-width: 400px; 
}
  
.virtualRepeatdemoDeferredLoading .repeated-item 
{
    border-bottom: 1px solid #ddd;
    box-sizing: border-box;
    height: 40px;
    padding-top: 10px; 
}
  
.virtualRepeatdemoDeferredLoading md-content 
{
    margin: 16px; 
}
  
.virtualRepeatdemoDeferredLoading md-virtual-repeat-container 
{
    border: solid 1px grey; 
}
  
.virtualRepeatdemoDeferredLoading .md-virtual-repeat-container .md-virtual-repeat-offsetter div 
{
    padding-left: 16px; 
}

.select-with-filter-header
{
    position: fixed;
    top: 0;
    right: 0;
    width: 97%;
    height: 60px;
    z-index: 100;
    background-color: white;
}

.select-with-filter-header.multi
{
    height: 80px;
}

.select-with-filter-header md-input-container
{
    width: 90%;
    text-align: right;
    margin-top: 10px;
}

.select-with-filter-optgroup
{
    margin-top: 70px;
}

.select-with-filter-optgroup.multi
{
    margin-top: 90px;
}

.multi-switcher
{
    position: absolute;
    right: -10px;
    top: -10px;
    z-index: 1;
    transform: scale(0.5);
}

.multi-switcher > div
{
    width: 24px;
    height: 24px;
    background-color: white;
}

#loading
{
    opacity: 0;
    pointer-events: none;
    position: fixed;
    z-index: 10000;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(255,255,255,0.3);
    
    transition: opacity 0.3s;
}

#loading.show
{
    pointer-events: all;
    opacity: 1;
}

#loading md-progress-circular
{
    position: fixed;
    top: 50%;
    left: 50%;
    margin-left: -25px;
    margin-top: -25px;
}

#popup md-content .inner-content
{
    padding: 0px 20px;
}

md-content.no-padding
{
    padding: 0px;
}

md-content::-webkit-scrollbar
{
	width: 8px;
}

md-content::-webkit-scrollbar-thumb, .nicescroll-cursors
{
    border-radius: 10px;

    min-height: 100px;

    /* background-color: #D58C4D; */
    /* background-color: #2E5F75; */
    background-color: rgba(46,95,117, 0.6);

    background-image: -webkit-linear-gradient(45deg,
                                               rgba(255, 255, 255, .4) 25%,
                                               transparent 25%,
                                               transparent 50%,
                                               rgba(255, 255, 255, .4) 50%,
                                               rgba(255, 255, 255, .4) 75%,
                                               transparent 75%,
                                               transparent)
}

.chat-list, .messages-list
{
    background-color: white;
    padding: 10px 20px;
    height: 10vh;
    overflow-y: auto;
    border-radius: 10px;
}

.messages-list
{
    margin-top: 30px;
    height: 50vh;
}

.messages-list div.driver .chat-body
{
    background-color: #d9d9d9;
    color: black;
}

.messages-list div.admin .chat-body
{
    background-color: #f5c59a;
    color: black;
}


.chat-list > div
{
    padding: 5px;
}

.chat-list > div.selected
{
    background-color: #6e97a9;
    color: white;
}

.gold .md-bar2
{
    background-color: #FFD700;
}

tr.odd:not(.selected) td, md-list-item.odd
{
    background-color: rgb(245, 245, 245);
}

md-list-item.selected
{
    background-color: #fff0e2;
}

md-list-item.highlighted
{
    font-weight: bold;
    background-color: #e2e6ff;
}

md-list-item.selected:hover
{
    background-color: #ffe6cf;
}

md-list-item.expandable
{
    background-image: url(/client/img/icon-more-light.svg);
    background-repeat: no-repeat;
    background-position: right 5px center;
    /* padding: 10px; */
    /* font-size: 15px; */
    box-shadow: 0px 2px 4px #D6D6D6;
    border-radius: 5px;
    margin: 4px;
    margin-bottom: 5px;
}

md-list-item.expandable > div div:first-child span:first-child
{
    padding-right: 20px;
}

md-list-item.expandable.hide-icon
{
    background-image: none;
    border-top: none;
}

md-list-item.expanded
{
    background-image: url(/client/img/icon-less.svg);
    margin-top: 10px;
    border-top: 1px solid black;
}

/*
md-list-item.accordion-child > div div:first-child span:first-child
{
    padding-right: 30px;
    box-sizing: border-box;
}
*/

md-list-item.accordion-last-child
{
    margin-bottom: 10px;
    border-bottom: 1px solid black;
    border-bottom-left-radius: 5px;
    border-bottom-right-radius: 5px;
}

md-autocomplete[md-floating-label] md-autocomplete-wrap
{
    height: 40px;
}

.virtual-repeat-row
{
    cursor: pointer;
}

.virtual-repeat-col
{
    padding-left: 5px;
}

.virtual-repeat-col span
{
    word-break: break-word;
}

md-content::-webkit-scrollbar-thumb:hover
{
    background-color: rgba(46,95,117, 1);
}

.md-autocomplete-suggestions li
{
    transition: background-color 0.2s;
}

.input-side-button
{
    display: block;
    position: absolute;

    left: 8px;
    right: auto;
    top: 8px;
}

/*
.md-autocomplete-suggestions li.will-select-on-enter
{
    background-color: #fff0e4;
    background-image: url(/client/img/icon-enter.png);
    background-repeat: no-repeat;
    background-size: 20px;
    background-position: left 10px center;
}
*/

md-nav-bar.md-default-theme.md-accent>.md-nav-bar .md-button._md-nav-button, md-nav-bar.md-accent>.md-nav-bar .md-button._md-nav-button
{
    color: rgba(0,0,0,0.54);
}

#popup.chat .close
{
    background-color: transparent !important;
}

.chat-message
{
    clear: both;
}

.chat-message .chat-body
{
    padding: 10px 20px;
    border-radius: 20px;
    box-shadow: 0px 3px 6px #00000029;
    font-size: 15px;
    margin-bottom: 16px;
}

.chat-message .chat-time
{
    font-size: 10px; 
    margin-top: 10px;
    float: left;
}

.chat-message.driver .chat-body
{
    background-color: #D9FDD3;
    border-bottom-right-radius: 0px;
}

.chat-message.admin
{
    float: left;
}

.chat-message.admin .chat-body
{
    background-color: white;
    color: #0D2033;
    border-bottom-left-radius: 0px;
}

.chat-message.admin .chat-time
{
    text-align: left;
}

.chat-input
{
    margin-top: 10px;
    width: 100%;
    max-width: 800px;
    padding-left: 16px;
    padding-right: 16px;
    box-sizing: border-box;
}

.chat-input > div
{
    padding: 6px 9px;
    box-sizing: border-box;
    background-color: white;
    border-radius: 30px;
}

.earning-block
{
    min-height: auto;
}

.earning-block h3
{
    margin: 0;
    padding: 0;
}

.earning-block h4
{
    margin: 0;
    margin-bottom: 5px;
}

.earning-block .percentage-display
{
    position: relative; 
    top: 10px; 
    text-align: center; 
    display: inline-block; 
    width: 100%; 
    font-weight: bold;
}

md-input-container.no-line input
{
    border-bottom: 1px solid transparent !important;
}

#popup .chat-input md-input-container
{
    margin-bottom: 0px;
}

#popup .chat-input md-input-container, #popup .chat-input md-input-container.md-input-focused
{
    background-color: transparent !important;
}

#popup .chat-input md-input-container input
{
    border-bottom: 1px solid transparent !important;
    font-size: 15px;
    font-weight: bold;
    color: #44444F !important;
}

#popup .chat-input .md-placeholder
{
    font-size: 15px;
    font-weight: bold;
    color: #44444F !important;
}

.chat-read
{
    position: relative;
    text-align: center;
}

.chat-read img
{
    position: absolute;
    bottom: 13px;
    width: 15px;
}

.box-select {

    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0,0,0,0.8);
    overflow: hidden;
    z-index: 100;
    text-align: left;
}

.box-select img {

    position: relative;
    width: auto;
    height: 100%;
    cursor: crosshair;
}

.box-select .selector {

    display: none;
    position: absolute;
    border: 1px solid #999999;
    background-color: rgba(255,255,255, 0.3);
}

.reset {float:left;}
.info {float:right;}

.box-select .info
{
    position: fixed;
    top: 30px;
    right: 30px;
    background-color: white;
    color: black;
    padding: 50px;
    font-size: 30px;
    text-align: center;
    box-shadow: 10px 20px 20px rgb(0 0 0 / 50%);
}

.box-select .info button
{
    margin-top: 30px;
}

.quick-pay
{
    background-color: #d58c4d;
    color: white;
    padding: 0px 10px;
    border-radius: 20px;
}

.contact-container {
    display: flex;
    justify-content: center;
    align-items: center;
    padding-block: 1vh 2vh;
    gap: 1vh; /* Space between the two sections */
    flex-wrap: wrap; /* Ensure the layout adjusts on smaller screens */
    text-align: center;
}

.contact-item {
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: x-large;
    font-weight: bold;
    gap: 10px;
}

.red-counter {
    position: absolute;
    top: 5px;
    left: 5px;
    background-color: red;
    color: white;
    border-radius: 50%;
    width: 12px;
    height: 12px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 8px;
    font-weight: bold;
    box-shadow: 0 0 5px rgba(0, 0, 0, 0.3);
}

@media (max-width: 768px) {
    .contact-container {
        flex-direction: column; /* Stack items vertically */
        align-items: center; /* Ensure the items stay centered */
    }
}

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

    ._md-nav-button.md-active .counter
    {
        color: #334750;
        background-color: #FFF;
    }

    #popup-back
    {
        display: none;
    }

    #popup .view.mobile-popup md-content
    {
        background-color: white !important;
        padding: 20px !important;
    }

    .truck-selector
    {
        position: fixed;

        top: 20px !important;
        left: 20px !important;
        max-width: 400px;
        width: calc(100% - 40px);
        height: calc(100% - 40px);
        min-width: auto !important;

        background-color: white;
    }

    .materials-summary-list
    {
        width: 100%;
        text-align: center;
        margin-top: 10px !important;
    }

    .map-card
    {
        font-size: 11px !important;
    }

    .animate-slide
    {
        transition: transform 0.3s;
    }

    .animate-slide-left.ng-enter
    {
        transform: translateX(100%);
    }

    .animate-slide-right.ng-enter
    {
        transform: translateX(-100%);
    }
    
    .animate-slide.ng-enter-active, .animate-slide.ng-leave 
    {
        transform: translateX(0%);
    }

    .animate-slide-left.ng-leave-active 
    {
        transform: translateX(-100%);
    }

    .animate-slide-right.ng-leave-active 
    {
        transform: translateX(100%);
    }

    #popup, #popup-system
    {
        width: 100%;
        height: 100%;
        padding: 0px !important;
        z-index: 20;
    }

    #popup, #popup-system
    {
        padding: 0px;
        margin-top: 0px;
    }

    #popup .view, #popup-system .view
    {
        padding: 0px;
        border-radius: 0px;
        
    }

    #popup md-toolbar,  #popup-system md-toolbar
    {
        box-shadow: 0px 2px 1px #00000026;
    }

    #popup md-content, #popup-system md-content
    {
        max-height: 70vh;
        background-color: #F3F2F2 !important;
    }

    #popup .close, #popup-system .close
    {
        top: 7px;
        left: 7px;
        background-color: transparent;
        width: 24px;
        right: auto;
    }

    .order-button.orders-timed::after
    {
        top: 40px;
        right: 4px;
    }

    @keyframes pop-in 
    {
        0% 
        {
            transform: translateX(-100%);
        }
        100% 
        {
            transform: translateX(0);
        }
    }

    @keyframes pop-out
    {
        0% 
        {
            transform: translateX(0);
        }
        100% 
        {
            transform: translateX(-100%);
        }
    }
}

@media only print
{
    .print
    {
        display: block;
    }
    
    body
    {
        display: none;
    }

    table
    {
        direction: ltr;
        width: 100%;
        overflow: visible;
    }

    td, tr, th
    {
        font-size: 10px;
    }

    tr td, tr th
    {
        border-bottom: 1px solid black;
    }

    .export-report tr td
    {
        border-left: 1px solid lightgray;
        border-right: 1px solid lightgray;
        font-size: 10px !important;
    }

    table.md-table
    {
        overflow: visible !important;
    }

    table.md-table td.first, table.md-table th.first
    {
        padding-right: 0px !important;
    }

    .no-export
    {
        display: none;
    }

    hr
    {
        border-bottom: 1px solid black;
    }

    a
    {
        color: black;
        text-decoration: none;
        font-weight: normal !important;
    }
}