input[readonly] { color: #333 !important; }
textarea[readonly] { color: #333 !important; }
div.disabled label { color: #999 !important; }
.label-default { background-color: #EEE; color: #666 !important; }

.b-darker { border-color: #CCC; }

.text-master-lighter { color: #828282 !important; }

li.dropdown { padding: 0 !important; }

a.dropdown-toggle:hover, .navbar-form > .form-group > input:hover, .navbar-form > .form-group > button:hover { background-color: #F8F8F8 !important; }

.navbar-form { height: 60px; align: center; padding: 5px !important; margin: 0 !important; display: flex; align-items: center; justify-content: center;}

.mouse-pointer, .filter-hover
{
    cursor: pointer;
}

.filter-hover:hover
{
    background-color: #F8F8F8;
}

tr.filter-hover:hover > td
{
    background-color: #F8F8F8 !important;
}

.btn-warning
{
    background-color: #fab233;
}

.vh100
{
    height: 100vh;
    height: calc(100vh - var(--vh-offset, 0px));
}

h1, h2, h3, h4, h5, h6 
{
    font-weight: 400 !important;
}

.d32.circular span
{
    font-size: 14px !important;
    font-weight: bold !important;
}

/* inner shadow for map */
#map
{
   position: relative;
   z-index: 0;
}

#map > .map-wrapper
{
    position: relative;
    z-index: 5;
}

#map:before
{
    content: '';
    position: absolute;
    top:0;
    left: 0;
    right: 0;
    bottom: 0;
    display: block;
    z-index: 10;
    pointer-events: none;
    box-shadow: inset 0px 0px 6px 3px rgba(0,0,0,0.15);
}


@media (max-width: 1023px)
{
    #map:before
    {
        box-shadow: inset 0px 0px 12px 1px rgba(0,0,0,0.1);        
    }
}

.scrollable-menu
{
    height: auto;
    max-height: 50vh;
    overflow-x: hidden;
}

.drop-shadow-1
{
    box-shadow: 0 1px 3px rgba(0,0,0,0.25), 0 1px 3px rgba(0,0,0,0.25) !important;
}

.drop-shadow-1:hover
{
    box-shadow: 0 3px 6px rgba(0,0,0,0.25), 0 3px 6px rgba(0,0,0,0.25) !important;
    /* position: relative; top: -1px; left: -1px; */
    -border-color: #FFF !important;
}

.drop-shadow-2
{
    box-shadow: 0 6px 6px 0px rgba(0,0,0,0.25) !important;
}

.tab-content-scrolling
{
    max-height: calc(100vh - 260px) !important;
    max-height: calc(100vh - 260px - var(--vh-offset, 0px));
    overflow-y: scroll !important;
}

.dialog-1
{
    box-shadow: 0px 3px 6px 0px rgba(0,0,0,0.1) !important;
    padding: 25px;
    background-color: rgba(250, 250, 250, 0.95);
}

.header-inner
{
    display: flex !important;
    align-items: center !important;
    white-space: nowrap !important;
}

.modal-xl { width: 100vw; height: 100vh; height: calc(100vh - var(--vh-offset, 0px));  margin: 0px !important; pointer-events: all; }

@media (min-width: 1024px)
{
    .modal-xl { width: 1024px; height: 99vh; height: calc(99vh - var(--vh-offset, 0px)); margin: -5px auto auto auto !important; }
}

#task-footer
{
    position: absolute;
    z-index: 2;
    left: 0; right: 0; bottom: 0;
    border-top: 1px solid #CCC !important; text-align: center !important; padding: 0px 30px 0px 30px !important;
}

@media (max-width: 767px)
{
    .modal-header { padding: 5px 0 5px 0 !important; }
    .modal-body, .modal-footer { padding: 0 !important; }

    .nav-tabs > li > a { padding: 10px 10px !important; min-width: unset !important; }

    .task-nav-tabs { width: 100%; overflow: scroll; }

    .tab-content { padding-top: 0 !important; }
}

@media (max-width: 479px)
{
    .nav-tabs > li > a { padding: 5px 8px !important; min-width: unset !important; }
}

.layout-filter { position: absolute; top: 60px; z-index: 100; width: 100% !important; height: 60px !important; border: none !important; background: none !important; }
.layout-below-filter { padding-top: 60px !important; }

@media (max-width: 767px)
{
    .layout-below-filter { padding-top: 0px !important; }

    .layout-filter
    {
        top: 45px;
        left: unset !important;
        right: 0;
        width: 300px !important;
    }

    .layout-filter > .navbar-collapse
    {
        background-color: #FFF !important; overflow-y: scroll;
        box-shadow: 0px 3px 6px 0px rgba(0,0,0,0.1) !important;
        max-height: calc(100vh - 60px) !important;
        max-height: calc(100vh - 60px - var(--vh-offset, 0px));
    }
}

.hide-map { display: block; }
.show-list { display: block; }

.map-layout-map     { position: relative; float: left; width: calc(100% - 320px); height: 100%; }
.map-layout-list    { position: relative; float: left; width: 320px; height: 100%; }

.map-layout-toggle  { position: absolute; z-index: 999; right: 15px; bottom: 15px; display: none; }

.map-layout-list-datebox    { width: 70px; padding: 10px 10px; }
.map-layout-list-title-text { width: 230px !important; }

.assignment .map-layout-map { width: calc(100% - 400px); }
.assignment .map-layout-list { width: 400px; }

@media (min-width: 1400px)
{
    .map-layout-map     { position: relative; float: left; width: calc(100% - 400px); height: 100%; }
    .map-layout-list    { position: relative; float: left; width: 400px; height: 100%; }    

    .map-layout-list-title-text { width: 320px !important; }
}

/* V1 */
@media (max-width: 799px)
{
    .dashboard .map-layout-map     { width: 100%; height: 100%; }
    .dashboard .map-layout-list    { width: 100%; height: 100%; display: none; }

    .dashboard .hide-map { display: none; }
    .dashboard .show-list { display: block; }

    .map-layout-toggle  { display: block; }
}

/* V2 */
/*
@media (max-width: 799px)
{
    .map-layout-map     { width: 100%; height: 80vh; height: calc(80vh - var(--vh-offset, 0px)); }
    .map-layout-list    { width: 100%; height: 100%; -display: none; }

    .hide-map { display: none; }
    .show-list { display: block; }

    .map-layout-toggle  { display: block; }
}
*/

@media (max-width: 799px)
{
    #route-buttons
    {
        left: 3px !important;
        bottom: 3px !important;
    }

    .route-button-day, .route-button-day:hover
    {
        background-color: #FFF !important;
        margin: 0px 3px 0px 0px !important;
        -border-radius: 0;
        -box-shadow: unset !important;
        -border: 1px solid #DDD !important;
    }

    .route-button-day-indicator 
    {
        position: absolute;
        margin: 0px 4px 0px 1px !important;
        bottom: 0px;
        left: 0px;
        right: 0px;
        height: 10px;
        z-index: 3;
    }
}

.fc-list-table td
{
  border-width: 1px 0 0;
  padding: 8px 14px !important;
}

.fc-time-grid-event
{    
    box-shadow: 0px 3px 6px 0px rgba(0,0,0,0.1) !important;
    padding: 25px;
    margin: 3px;
    background-color: #FFF;
    border-left: 4px solid #666;
}

.fc-day-grid-event
{    
    box-shadow: 0px 3px 6px 0px rgba(0,0,0,0.1) !important;
    -padding: 25px;
    padding-left: 4px;
    padding-right: 4px;
    margin: 1px;
    background-color: #FFF;
    border-left: 4px solid #333;
}

.fc-time-grid .fc-slats td
{
    -height: 5px !important;
    padding-top: 0px;
    padding-bottom: 0px;
}

.fc-bgevent
{
    opacity: 1 !important;
    padding-left: 4px;
    padding-right: 4px;
    border-top: 2px dotted #D0D0D0 !important;
    border-bottom: 2px dotted #D0D0D0 !important;
    -text-shadow: 0 0 3px #FFF !important;
    vertical-align: bottom !important;
}

.fc-bottom
{
    position: absolute;
    bottom: 2px;
}

.fc-addToCalendar-button
{
    background-color: #e95555 !important;
    border-color: #e95555 !important;
    color: #FFFFFF !important;
}

a.fc-event:hover
{
    color: #333 !important;
}

/* DataTables ... */

.dataTables_scrollBody
{
    background: repeating-linear-gradient(45deg, #F8F8F8, #F8F8F8 10px, #fff 10px, #fff 20px) !important;
}

.filter_toolbar
{
    padding: 0 !important;
    border: none;
}

.table.dataTable
{
    border-collapse: collapse !important;
}

table.dataTable.table-condensed .sorting::after, table.dataTable.table-condensed .sorting_asc::after, table.dataTable.table-condensed .sorting_desc::after
{
    top: unset;
}

/* Menu */

.page-sidebar .sidebar-header
{
    padding: 0 20px !important;
}

.page-sidebar a,
.page-sidebar button,
.page-sidebar a:visited,
.page-sidebar button:visited,
.page-sidebar a:focus,
.page-sidebar button:focus
{
  color: #C0C8CF !important;
}

.page-sidebar a:hover,
.page-sidebar button:hover,
.page-sidebar a:active,
.page-sidebar button:active
{
  color: #FFF !important;
}

/* Pages Quick-Fix */
@media only screen and (min-width: 980px)
body.menu-pin .page-container .page-content-wrapper .content
{
    padding-left: 180px;
}

body.menu-pin .page-container .header
{    
    padding-left: 180px;
}