@import url('https://fonts.googleapis.com/css?family=Roboto:300,400,500,700');

:root{
--el-accent:#fff;
--el-accentDark:#0077c2;
--el-accentLight:#000000;
--el-accent-trans:rgba(89, 198, 237, 1);
--el-background:#F5F5F6;
--el-backgroundShadow:#d0d0d0;
--el-text:rgba(43, 43, 43, 1);
--el-lightgray:rgba(155,155,155,1);
--el-medgray:rgba(125,125,125,1);


--el-font-regular:'Roboto', sans-serif;

/*--Status Colors--*/
--el-red:#ff3816;
--el-gold:#FF9914;
--el-orange:#FFC000;
--el-green:#4EAB1C;



/*----Page Color Variations---*/

/*--tracker--*/
--el-tracker-ar:#b71c1c;
--el-tracker-ad:#7f0000;
--el-tracker-al:#f05545;

/*--insights--*/
--el-insights-ar:#42a5f5;
--el-insights-ad:#0077c2;
--el-insights-al:#80d6ff;

/*--health inspections--*/
--el-inspections-ar:#7b1fa2;
--el-inspections-ad:#4a0072;
--el-inspections-al:#ae52d4;

/*--heatmaps--*/
--el-heatmap-ar:#ff8f00;
--el-heatmap-ad:#c56000;
--el-heatmap-al:#ffc046;

/*--heatmap v2--*/
--el-heatmapv2-ar:#ef6c00;
--el-heatmapv2-ad:#b53d00;
--el-heatmapv2-al:#ff9d3f;


/*--locations--*/
--el-locations-ar:#d81b60;
--el-locations-ad:#a00037;
--el-locations-al:#ff5c8d;

/*--allergens--*/
--el-allergy-ar:#00838f;
--el-allergy-ad:#005662;
--el-allergy-al:#4fb3bf;

/*--neighbourhoods--*/
--el-hoods-ar:#689f38;
--el-hoods-ad:#387002;
--el-hoods-al:#99d066;

/*--admin--*/
--el-admin-ar:#606060;
--el-admin-ad:#474747;
--el-admin-al:#808080;

/*--product info--*/
--el-products-ar:#56732E;
--el-products-ad:#425823;
--el-products-al:#83AF46;

/*--cash out--*/
--el-cashout-ar:#4285F4;
--el-cashout-ad:#004ba0;
--el-cashout-al:#63a4ff;


/*--events out--*/
--el-events-ar:#455a64;
--el-events-ad:#718792;
--el-events-al:#1c313a;
}
/*--------------------------------------------------------------------------------------*/
/*---------------------------------------------------------------------Universal Rules--*/

html, body {
    height:100%;
    width:100%;
    margin: 0;
    padding: 0;
    font-size:16px;
    -webkit-text-size-adjust: none;
    }

body{
    font-family:var(--el-font-regular);
    text-rendering: optimizeLegibility;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    }

tr,td,pre{
    font-family:var(--el-font-regular) !important;

}

#mod-dashboard body,
#mod-insights body,
#mod-inspections body,
#mod-allergy body,
#mod-products body,
#mod-admin body,
#mod-cashout body,
#mod-events body{
    background-color:var(--el-background);
}
/*--------------------------------------------------------------------------------------*/
/*--Utility Classes--*/

.pointer{
    cursor:pointer;
}

.sticky {
    position: -webkit-sticky;
    position: -moz-sticky;
    position: -ms-sticky;
    position: -o-sticky;
    position:sticky;
    top: 55px;
    }

.pac-container {
    z-index: 9999;
}
.fixedSearch {
    width: 100%;
    position: sticky;
    top: -10px;
    padding: 10px;
    border-radius: 2px;
    -webkit-box-shadow: 0px 3px 5px 0px rgba(0, 0, 0, 0.25);
    -moz-box-shadow: 0px 3px 5px 0px rgba(0, 0, 0, 0.25);
    box-shadow: 0px 3px 5px 0px rgba(0, 0, 0, 0.25);
}
/*--------------------------------------------------------------------------------------*/
/*--Universal Architecture--*/

.maxWidth{
    max-width:1197px !important;
    }

.navMargin{
    margin-top:59px;
}
div.elSection{
    background-color:#fff;
    padding:7px;
    -webkit-box-shadow: 0px 3px 5px 0px rgba(0,0,0,0.25);
    -moz-box-shadow: 0px 3px 5px 0px rgba(0,0,0,0.25);
    box-shadow: 0px 3px 5px 0px rgba(0,0,0,0.25);
    border-radius:3px;

    }

div.elSectionLimited{
    padding:10px;
    margin-top:59px;
    border-radius:2px;
    background-color:#fff;
    -webkit-box-shadow: 0px 3px 5px 0px rgba(0,0,0,0.25);
    -moz-box-shadow: 0px 3px 5px 0px rgba(0,0,0,0.25);
    box-shadow: 0px 3px 5px 0px rgba(0,0,0,0.25);
    }

div.materialHeader{
    position:absolute;
    width:100%;
    height: 500px;
    z-index:-5;
    }

#mod-insights div.materialHeader{
    background-color:var(--el-insights-ad);
    }
#mod-inspections div.materialHeader{
    background-color:var(--el-inspections-ad);
    }
#mod-allergy div.materialHeader{
    background-color:var(--el-allergy-ad);
    }
#mod-products div.materialHeader{
    background-color:var(--el-products-ad);
    }
#mod-cashout div.materialHeader{
    background-color:var(--el-cashout-ad);
    }
/*--------------------------------------------------------------------------------------*/
/*--Universal Typography--*/

ul,li{
    list-style:none;
    }

h1,h2,h3,h4, legend{
    font-weight:300;
    }

.nameFormat{
    text-transform:capitalize;
    }

a{
    transition: all 0.3s ease;
}

/*--------------------------------------------------------------------------------------*/
/*--Variable Link Colors---*/

#mod-tracker a, #mod-admin a{
    color:var(--el-tracker-ar);
    }

#mod-tracker a:hover,#mod-tracker a:focus,#mod-tracker a:active{
    color:var(--el-tracker-al);
    }

#mod-insights a{
    color:var(--el-insights-ar);
    }

#mod-insights a:hover,#mod-insights a:focus,#mod-insights a:active{
    color:var(--el-events-al);
    }

#mod-events a{
    color:var(--el-events-ad);
    }

#mod-events a:hover,#mod-events a:focus,#mod-events a:active{
    color:var(--el-events-ar);
    }
/*--------------------------------------------------------------------------------------*/
/*--Universal Input Fields--*/

.form-control{
    border-radius:2px;
    border:none;
    -webkit-box-shadow: inset 0px 2px 10px 1px rgba(0,0,0,0.25);
    -moz-box-shadow: inset 0px 2px 10px 1px rgba(0,0,0,0.25);
    box-shadow: inset 0px 2px 10px 1px rgba(0,0,0,0.25);
    transition: all 0.5s ease;
    }

.form-control:focus{
    border-radius:2px;
    border:none;
    -webkit-box-shadow: inset 0px 2px 10px 1px rgba(0,0,0,0.15);
    -moz-box-shadow: inset 0px 2px 10px 1px rgba(0,0,0,0.15);
    box-shadow: inset 0px 2px 10px 1px rgba(0,0,0,0.15);
}


.dropdown-content .select-dropdown .active:hover{
    background-color:#00CCFF;
}

/*---Select2 Inputs---*/

.select2-container--default .select2-selection--single, .select2-container--default .select2-selection--multiple, .bootstrap-tagsinput{
    border-radius:2px;
    border:none;
    width:100%;
    -webkit-box-shadow: inset 0px 2px 10px 1px rgba(0,0,0,0.25);
    -moz-box-shadow: inset 0px 2px 10px 1px rgba(0,0,0,0.25);
    box-shadow: inset 0px 2px 10px 1px rgba(0,0,0,0.25);
    }

.select2-container--default .select2-results__option--highlighted[aria-selected]{
    -webkit-box-shadow: 0px 3px 14px 0px rgba(0,0,0,0.25);
    -moz-box-shadow: 0px 3px 14px 0px rgba(0,0,0,0.25);
    box-shadow: 0px 3px 14px 0px rgba(0,0,0,0.25);
    }
.select2-container--default .select2-search--dropdown .select2-search__field{
    border:none;
    }

span#select2-selection__rendered{
    width:100%;
    }

.select2-container--default .select2-selection--multiple .select2-selection__choice{
    border:none;
    -webkit-box-shadow: 0px 3px 5px 0px rgba(0,0,0,0.25);
    -moz-box-shadow: 0px 3px 5px 0px rgba(0,0,0,0.25);
    box-shadow: 0px 3px 5px 0px rgba(0,0,0,0.25);
    }

.select2-container--default .select2-selection--multiple .select2-selection__rendered{
    padding:5px;
    }

.select2-container--default .select2-selection--multiple .select2-selection__choice__remove{
    .trans;
    margin-right:7px;
    font-size:1.1em;
    }

.select2-container--default.select2-container--focus .select2-selection--multiple{
    border:0;
    }
.select2-container--default .select2-selection--multiple .select2-selection__choice{
    border:none;
    -webkit-box-shadow: 0px 3px 5px 0px rgba(0,0,0,0.25);
    -moz-box-shadow: 0px 3px 5px 0px rgba(0,0,0,0.25);
    box-shadow: 0px 3px 5px 0px rgba(0,0,0,0.25);
    }



#mod-tracker .select2-container--default .select2-results__option--highlighted[aria-selected]{
    background-color:var(--el-tracker-ar);
    color:#fff;
}
#mod-insights .select2-container--default .select2-results__option--highlighted[aria-selected]{
    background-color:var(--el-insights-ar);
    color:#fff;
}
#mod-heatmap .select2-container--default .select2-results__option--highlighted[aria-selected]{
    background-color:var(--el-heatmap-ar);
    color:#fff;
}
#mod-heatmapv2 .select2-container--default .select2-results__option--highlighted[aria-selected]{
    background-color:var(--el-heatmapv2-ar);
    color:#fff;
}
/*-Dropdowns---------------*/

.dropdown-toggle::after {
    display: none;
    }

div.dropdown-menu{
    border-radius:0px;
    -webkit-box-shadow: 0px 3px 14px 0px rgba(0,0,0,0.25);
    -moz-box-shadow: 0px 3px 14px 0px rgba(0,0,0,0.25);
    box-shadow: 0px 3px 14px 0px rgba(0,0,0,0.25);
    }


/*--------------------------------------------------------------------------------------*/
/*--Universal Buttons--*/

.btn:hover, .btn:active{
    cursor: pointer;
}

.btn-outline-primary, .btn-primary{
    border:none;
    border-radius:2px;
    -webkit-box-shadow: 0px 3px 5px 0px rgba(0,0,0,0.25);
    -moz-box-shadow: 0px 3px 5px 0px rgba(0,0,0,0.25);
    box-shadow: 0px 3px 5px 0px rgba(0,0,0,0.25);
    }

.btn-outline-primary:hover,.btn-outline-primary:focus,
.btn-primary:hover, .btn-primary:focus{
    -webkit-box-shadow: 0px 3px 14px 0px rgba(0,0,0,0.25);
    -moz-box-shadow: 0px 3px 14px 0px rgba(0,0,0,0.25);
    box-shadow: 0px 3px 14px 0px rgba(0,0,0,0.25);
    }

.btn-primary:not([disabled]):not(.disabled).active, .btn-primary:not([disabled]):not(.disabled):active, .show>.btn-primary.dropdown-toggle{
    border:none;
    box-shadow:none;
}
/*--------------------------------------------------------------------------------------*/
/*--Page Specific Buttons--*/

#mod-login .btn-primary,
#mod-admin .btn-primary{
    color:#fff;
    background-color:var(--el-tracker-ad);
}
#mod-login .btn-primary:hover,
#mod-login .btn-primary:focus,
#mod-login .btn-primary:active,
#mod-admin .btn-primary:hover,
#mod-admin .btn-primary:focus,
#mod-admin .btn-primary:active{
    color:#fff;
    background-color:var(--el-tracker-ar);
}

/*--tracker--*/
#mod-tracker .btn-primary{
    color:#fff;
    background-color:var(--el-tracker-ad);
}
#mod-tracker .btn-primary:hover,
#mod-tracker .btn-primary:focus,
#mod-tracker .btn-primary:active{
    color:#fff;
    background-color:var(--el-tracker-ar);
}
/*---insights---*/
#mod-insights .btn-primary{
    color:#fff;
    background-color:var(--el-insights-ad);
}
#mod-insights .btn-primary:hover,
#mod-insights .btn-primary:focus,
#mod-insights .btn-primary:active{
    color:#fff;
    background-color:var(--el-insights-ar);
}
/*---inspections---*/
#mod-inspections .btn-primary{
    color:#fff;
    background-color:var(--el-inspections-ad);
}
#mod-inspections .btn-primary:hover,
#mod-inspections .btn-primary:focus,
#mod-inspections .btn-primary:active{
    color:#fff;
    background-color:var(--el-inspections-ar);
}

/*---heatmap---*/
#mod-heatmap .btn-primary{
    color:#fff;
    background-color:var(--el-heatmap-ad);
}
#mod-heatmap .btn-primary:hover,
#mod-heatmap .btn-primary:focus,
#mod-heatmap .btn-primary:active{
    color:#fff;
    background-color:var(--el-heatmap-ar);
}

/*---heatmap---*/
#mod-heatmapv2 .btn-primary{
    color:#fff;
    background-color:var(--el-heatmap-ad);
}
#mod-heatmapv2 .btn-primary:hover,
#mod-heatmapv2 .btn-primary:focus,
#mod-heatmapv2 .btn-primary:active{
    color:#fff;
    background-color:var(--el-heatmapv2-ar);
}

/*---allergy---*/
#mod-allergy .btn-primary{
    color:#fff;
    background-color:var(--el-allergy-ad);
}
#mod-allergy .btn-primary:hover,
#mod-allergy .btn-primary:focus,
#mod-allergy .btn-primary:active{
    color:#fff;
    background-color:var(--el-allergy-ar);
}

/*---neighbourhoods---*/
#mod-hoods .btn-primary{
    color:#fff;
    background-color:var(--el-hoods-ad);
}
#mod-hoods .btn-primary:hover,
#mod-hoods .btn-primary:focus,
#mod-hoods .btn-primary:active{
    color:#fff;
    background-color:var(--el-hoods-ar);
}

/*---events---*/
#mod-events .btn-primary{
    color:#fff;
    background-color:var(--el-events-ad);
}
#mod-events .btn-primary:hover,
#mod-events .btn-primary:focus,
#mod-events .btn-primary:active{
    color:#fff;
    background-color:var(--el-events-ar);
}
/*--------------------------------------------------------------------------------------*/
/*-------------------------------------------------------------------------Navbars------*/
nav.navbar{
    -webkit-box-shadow: 0px 3px 14px 0px rgba(0,0,0,0.25);
    -moz-box-shadow: 0px 3px 14px 0px rgba(0,0,0,0.25);
    box-shadow: 0px 3px 14px 0px rgba(0,0,0,0.25);
}

a.navbar-brand{
    text-transform:uppercase;
    float:left;
}



div.nav-luca{
    width:30px;
    height:30px;
    display:block;
    background-repeat:no-repeat;
    float:right;
    margin-left:5px;
    margin-top:3px;
}
.navbar-dark .navbar-nav .nav-link{
    transition: all 0.5s ease;
}


#mod-dashboard div.nav-luca,
#mod-admin div.nav-luca{
    background-image:url("/images/lucaRed.svg");
}
#mod-tracker div.nav-luca,
#mod-insights div.nav-luca,
#mod-inspections div.nav-luca,
#mod-heatmap div.nav-luca,
#mod-heatmapv2 div.nav-luca,
#mod-allergy div.nav-luca,
#mod-hoods div.nav-luca,
#mod-locations div.nav-luca,
#mod-products div.nav-luca,
#mod-cashout div.nav-luca,
#mod-events div.nav-luca{
    background-image:url("/images/lucaWhite.svg");
}

/*dashboard*/

#mod-dashboard nav.navbar{
    background-color:#fff;
}
#mod-dashboard nav.navbar .navbar-toggler{
    background-color:rgba(0,0,0,0.2);

}


#mod-dashboard .navbar-dark .navbar-brand{
    color:var(--el-medGray);
}

#mod-dashboard .navbar-dark .navbar-nav .nav-link,
#mod-dashboard .navbar-dark .navbar-nav .nav-link{
    color:var(--el-lightgray);
}

#mod-dashboard .navbar-dark .navbar-nav .nav-link:focus,
#mod-dashboard .navbar-dark .navbar-nav .nav-link:hover{
    color:var(--el-medgray);
}
/*tracker*/

#mod-tracker nav.navbar{
    background-color:var(--el-tracker-ar);
    }

#mod-tracker nav.navbar a{
    color:#fff;
    }
#mod-tracker nav.navbar a:hover,
#mod-tracker nav.navbar a:focus,
#mod-tracker nav.navbar a:active{
    color:rgba(255,255,255,0.5);
    }
/*insights*/

#mod-insights nav.navbar{
    background-color:var(--el-insights-ar);
    }

#mod-insights nav.navbar a{
    color:#fff;
    }
#mod-insights nav.navbar a:hover,
#mod-insights nav.navbar a:focus,
#mod-insights nav.navbar a:active{
    color:rgba(255,255,255,0.5);
    }

/*-health inspections*/
#mod-inspections nav.navbar{
    background-color:var(--el-inspections-ar);
    }

#mod-inspections nav.navbar a{
    color:#fff;
    }
#mod-inspections nav.navbar a:hover,
#mod-inspections nav.navbar a:focus,
#mod-inspections nav.navbar a:active{
    color:rgba(255,255,255,0.5);
    }

/*-heatmaps*/
#mod-heatmap nav.navbar{
    background-color:var(--el-heatmap-ar);
    }

#mod-heatmap nav.navbar a{
    color:#fff;
    }
#mod-heatmap nav.navbar a:hover,
#mod-heatmap nav.navbar a:focus,
#mod-heatmap nav.navbar a:active{
    color:rgba(255,255,255,0.5);
    }

/*-heatmap v2*/
#mod-heatmapv2 nav.navbar{
    background-color:var(--el-heatmapv2-ar);
    }

#mod-heatmapv2 nav.navbar a{
    color:#fff;
    }
#mod-heatmapv2 nav.navbar a:hover,
#mod-heatmapv2 nav.navbar a:focus,
#mod-heatmapv2 nav.navbar a:active{
    color:rgba(255,255,255,0.5);
    }

/*-allergy*/
#mod-allergy nav.navbar{
    background-color:var(--el-allergy-ar);
    }

#mod-allergy nav.navbar a{
    color:#fff;
    }
#mod-allergy nav.navbar a:hover,
#mod-allergy nav.navbar a:focus,
#mod-allergy nav.navbar a:active{
    color:rgba(255,255,255,0.5);
    }

/*-neighbourhoods*/
#mod-hoods nav.navbar{
    background-color:var(--el-hoods-ar);
    }

#mod-hoods nav.navbar a{
    color:#fff;
    }
#mod-hoods nav.navbar a:hover,
#mod-hoods nav.navbar a:focus,
#mod-hoods nav.navbar a:active{
    color:rgba(255,255,255,0.5);
    }

/*-locations*/
#mod-locations nav.navbar{
    background-color:var(--el-locations-ar);
    }

#mod-locations nav.navbar a{
    color:#fff;
    }
#mod-locations nav.navbar a:hover,
#mod-locations nav.navbar a:focus,
#mod-locations nav.navbar a:active{
    color:rgba(255,255,255,0.5);
    }

/*-products*/
#mod-products nav.navbar{
    background-color:var(--el-products-ar);
    }

#mod-products nav.navbar a{
    color:#fff;
    }
#mod-products nav.navbar a:hover,
#mod-products nav.navbar a:focus,
#mod-products nav.navbar a:active{
    color:rgba(255,255,255,0.5);
    }

/*-cashout*/
#mod-cashout nav.navbar{
    background-color:var(--el-cashout-ar);
    }

#mod-cashout nav.navbar a{
    color:#fff;
    }
#mod-cashout nav.navbar a:hover,
#mod-cashout nav.navbar a:focus,
#mod-cashout nav.navbar a:active{
    color:rgba(255,255,255,0.5);
    }

/*-events*/
#mod-events nav.navbar{
    background-color:var(--el-events-ar);
    }

#mod-events nav.navbar a{
    color:#fff;
    }
#mod-events nav.navbar a:hover,
#mod-events nav.navbar a:focus,
#mod-events nav.navbar a:active{
    color:rgba(255,255,255,0.5);
    }
/*-----------------------------------------------------------------------Bootboxes------*/

.modal-header{
    display: block!important;
    }

.modal-body{
    overflow:auto;

    }

.modal-content{
    height:100%;
    .shadowSoft;
    }

button.close{
    opacity:1;
    text-shadow:none;
    font-size:2.5em;
    }

@media (min-width: 1px){
    .w-100 .modal-dialog{
    width:100%!important;
    height:85vh;
    max-width:1024px!important;
    }
}

/*--------------------------------------------------------------------------------------*/
/*-------------------------------------------------------------------------Login Page--*/

/*--Vertical Center--*/
.el-vcWrap{
    display: table;
    position: relative;
    width: 100%;
    height: 100%;
    }

.el-vc{
    display: table-cell;
    vertical-align: middle;
    }

form#signin{
    margin-left:30px;
    margin-right:30px;
    max-width:400px;
    margin:0 auto;
}

/*--SVG Settings--*/

div#animate{
    max-width:500px;
    margin:0 auto;
}

.st0{fill:#404040;opacity:0}
.st1{opacity:0;fill:#B71C1C;}
.st2{opacity:0;fill:none;stroke:#B71C1C;stroke-width:9;stroke-miterlimit:10;}


/*--------------------------------------------------------------------------------------*/
/*------------------------------------------------------------------------Landing Page--*/
/*--App Button Architecture--*/
.dash-app{
    display:grid;
    padding:20px;
    -webkit-box-shadow: 0px 3px 5px 0px rgba(0,0,0,0.25);
    -moz-box-shadow: 0px 3px 5px 0px rgba(0,0,0,0.25);
    box-shadow: 0px 3px 5px 0px rgba(0,0,0,0.25);
    text-align:center;
    align-items:center;
    transition: all 0.5s ease;
    height:150px;
    width:150px;
}

.dash-app:hover{
    transform: translateY(-5px);
    -webkit-box-shadow: 0px 3px 14px 0px rgba(0,0,0,0.25);
    -moz-box-shadow: 0px 3px 14px 0px rgba(0,0,0,0.25);
    box-shadow: 0px 3px 14px 0px rgba(0,0,0,0.25);
}

@media only screen and (max-device-width: 600px){
    .dash-app-wrapper{
        display: grid;
        grid-template-columns: repeat(auto-fill, 165px);
        grid-auto-rows: 165px;
        justify-items: center;
        align-items:center;
        justify-content: center;
        grid-gap: 5px;
    }
}

@media only screen and (min-device-width: 600px) {
.dash-app-wrapper{
    display: grid;
    grid-template-columns: repeat(auto-fill, 200px);
    grid-auto-rows: 200px;
    justify-items: center;
    align-items:center;
    justify-content: center;
    grid-gap: 20px;
    }
}

/*--App Button Colors--*/

div.da-tracker a,
div.da-insights a,
div.da-inspections a,
div.da-heatmap a,
div.da-locations a,
div.da-allergy a,
div.da-hoods a,
div.da-products a,
div.da-cashout a,
div.da-admin a{
    color:#fff;
    text-decoration:none;
}

div.da-tracker{
    background-color:var(--el-tracker-ar);
}

div.da-tracker:hover,div.da-tracker:active,div.da-tracker:focus{
    background-color:var(--el-tracker-al);
}

div.da-insights{
    background-color:var(--el-insights-ar);
}

div.da-insights:hover,div.da-insights:active,div.da-insights:focus{
    background-color:var(--el-insights-al);
}

div.da-inspections{
    background-color:var(--el-inspections-ar);
}

div.da-inspections:hover,div.da-inspections:active,div.da-inspections:focus{
    background-color:var(--el-inspections-al);
}

div.da-heatmap{
    background-color:var(--el-heatmap-ar);
}
div.da-heatmap:hover,div.da-heatmap:active,div.da-heatmap:focus{
    background-color:var(--el-heatmap-al);
}

div.da-locations{
    background-color:var(--el-locations-ar);
}

div.da-locations:hover,div.da-locations:active,div.da-locations:focus{
    background-color:var(--el-locations-al);
}

div.da-allergy{
    background-color:var(--el-allergy-ar);
}

div.da-allergy:hover,div.da-allergy:active,div.da-allergy:focus{
    background-color:var(--el-allergy-al);
}

div.da-hoods{
    background-color:var(--el-hoods-ar);
}

div.da-hoods:hover,div.da-hoods:active,div.da-hoods:focus{
    background-color:var(--el-hoods-al);
}

div.da-products{
    background-color:var(--el-products-ar);
}

div.da-products:hover,div.da-products:active,div.da-products:focus{
    background-color:var(--el-products-al);
}

div.da-cashout{
    background-color:var(--el-cashout-ar);
}

div.da-cashout:hover,div.da-cashout:active,div.da-cashout:focus{
    background-color:var(--el-cashout-al;)
}

div.da-admin{
    background-color:var(--el-admin-ar);
}

div.da-admin:hover,div.da-admin:active,div.da-admin:focus{
    background-color:var(--el-admin-al;)
}
/*--------------------------------------------------------------------------------------*/
/*-----------------------------------------------------------------Tracker--------------*/

.grid{
    margin: 0;
    padding: 0;

}

#el-body{
    position: relative;
    background: #C0C0C0;
    width: 100%;
    height: 100%;
    display: grid;
    grid-template-columns: 3fr minmax(300px, 500px);
    grid-template-rows: 59px 70px auto;
    grid-template-areas: "nav nav" "map hud" "map ctt";
}
#el-navbar{
    grid-area: nav;
}

#el-map{
    grid-area: map;
    position: relative;
}

#el-hud{
    grid-area: hud;
}

#el-content{
    grid-area: ctt;
    overflow-y:scroll !important;
    -webkit-overflow-scrolling:touch;

}

#map{
    width:100%;
    height:100%;
    margin:0;
    padding:0;
}

#mapTools{
    position: absolute;
    bottom: 5px;
    left: 20px;
    z-index: 99;
}

@media only screen and (max-device-width: 480px) {
    #el-body{
        grid-template-columns: 1fr;
        grid-template-rows: 55px 50% 70px auto;
        grid-template-areas: "nav"
            "map"
            "hud"
            "ctt";
    }
    #mapTools{
        position: absolute;
        bottom: 45%;
        left: 20px;
        z-index: 99;
    }

}

@media only screen and (max-device-width: 768px) and (orientation:portrait) {
    #el-body{
        grid-template-columns: 1fr;
        grid-template-rows: 55px 50% 75px auto;
        grid-template-areas: "nav"
            "map"
            "hud"
            "ctt";
    }
    #mapTools{
        position: absolute;
        bottom: 45%;
        left: 20px;
        z-index: 99;
    }


}

#headContainer{
    width: 100%;
    height: 100%;
    display: grid;
}

#hudContainer{
    width: 100%;
    height: 100%;
    display: grid;
    grid-template-columns: 3fr 1fr 1fr 1fr 1fr 1fr 1fr;
}

.hudIcon{
    color:#fff;
    text-align:right;
    align-content:center;
    margin-right:5px;
    margin-top:2px;
}



#orderContent{
    height:100%;
    /*---iPhone Scroll Fix---*/

    -webkit-overflow-scrolling: touch;
    }

div#el-hud{
    background-color:#fff;
    color:#fff;
    -webkit-box-shadow: 0px 3px 5px 0px rgba(0,0,0,0.25);
    -moz-box-shadow: 0px 3px 5px 0px rgba(0,0,0,0.25);
    box-shadow: 0px 3px 5px 0px rgba(0,0,0,0.25);
    }

#hudContainer{
    background-color:var(--el-tracker-ad);
}


div.hudTimestamp{
    font-size:0.65em;
    margin-top:7px;
    margin-left:5px;
}

.hudSelect{
    margin:7px;
    }

div.stats{
    margin:2px;
    border-radius:2px;
    font-weight:400;
    text-shadow: 0px 1px 6px rgba(0, 0, 0, 1);
    -webkit-box-shadow: inset 0px 2px 10px 1px rgba(0,0,0,0.25);
    -moz-box-shadow: inset 0px 2px 10px 1px rgba(0,0,0,0.25);
    box-shadow: inset 0px 2px 10px 1px rgba(0,0,0,0.25);
}

div.stats{
    cursor:default;
}

.el-red{
   color:var(--el-red)!important;
    }

.el-gold{
    color:var(--el-gold) !important;
    }

.el-green{
    color:var(--el-green) !important;
    }

.highlight{
    background-color: @el-gold!important;
    }

.late {
    color: @el-red !important;
    animation: blinker 0.2s cubic-bezier(.5, 0, 1, 1) infinite alternate;
    }

@keyframes blinker { to { opacity: 0; } }

.red{
    border-left-color: var(--el-red) !important;
    }

.orange{
    border-left-color:  var(--el-orange) !important;
    }

.green{
    border-left-color:  var(--el-green) !important;
    }

.futureOrder{
    border-left-color:  var(--el-gold) !important;

}

li.searchList{
    margin:0 !important;
    box-shadow: none !important;
    border:none;
    border-radius:0px;
    border-left:0;
    }

.list-group-item.searchList{
    padding:0px 7px 5px 7px;
}

td.shortTd{
    /*-Reduces height of the tables rows in order tracker*/
    padding:2px 5px 2px 5px;
    }
table.table{
    margin-bottom:3px;
    }

li.el-list{
    border-radius:2px;
    border-width: 1px 1px 1px 10px;
    padding:5px;
    margin:3px;
    -webkit-box-shadow: 0px 3px 5px 0px rgba(0,0,0,0.25);
    -moz-box-shadow: 0px 3px 5px 0px rgba(0,0,0,0.25);
    box-shadow: 0px 3px 5px 0px rgba(0,0,0,0.25);
    }

span.oAddress{
    text-transform:capitalize;
}

.list-group-item.searchList{
    border-radius:0;
    -webkit-box-shadow: 0px 3px 5px 0px rgba(0,0,0,0.25);
    -moz-box-shadow: 0px 3px 5px 0px rgba(0,0,0,0.25);
    box-shadow: 0px 3px 5px 0px rgba(0,0,0,0.25);
    }

ul.list-group .el-list:hover{
    transition: all 0.3s ease;
}

ul.list-group .el-list:hover{
    transform:translate(-10px);
}

/*-----SNAPSHOT RULES---*/

/*---magical colored arrows--*/
.autoNumeric-positive:after,
.autoNumeric-negative:after{
    content: ' ';
    position: relative;
    left: 2px;
    border: 8px solid transparent;
}
.autoNumeric-negative:after{
    top: 10px;
    border-top-color: red;
}
.autoNumeric-positive:after{
    bottom: 15px;
    border-bottom-color: green;
}
.autoNumeric-positive,
.autoNumeric-negative{
    padding-right: 10px;
}

/*--------------------------------------------------------------------------------------*/
/*-----------------------------------------------------------------Insights-------------*/

#chartContainer{
    width:100%;
    height:600px;
    }

.chart{
    width:100%;
    height:600px;
    }

div.canvasjs-chart-toolbar button{
    border:0 !important;
    margin:5px;
    color:#fff;
    border-radius:2px;
    -webkit-box-shadow: 0px 3px 5px 0px rgba(0,0,0,0.25);
    -moz-box-shadow: 0px 3px 5px 0px rgba(0,0,0,0.25);
    box-shadow: 0px 3px 5px 0px rgba(0,0,0,0.25);
    transition: all 0.5s ease;
    }

div.canvasjs-chart-toolbar button:hover{
    -webkit-box-shadow: 0px 3px 14px 0px rgba(0,0,0,0.25);
    -moz-box-shadow: 0px 3px 14px 0px rgba(0,0,0,0.25);
    box-shadow: 0px 3px 14px 0px rgba(0,0,0,0.25);
    }

div.canvasjs-chart-toolbar{
    border:0 !important;
    }

/*-Datepicker-*/

.ranges li{
    border:none !important;
    color:var(--el-insights-ad);

}

.ranges li.active{
    border:none !important;
    color:#fff !important;
    background-color:var(--el-insights-ar)!important;
}
.ranges li:hover{
    border:none !important;
    background-color:var(--el-insights-al)!important;
}

.daterangepicker td.active, .daterangepicker td.active:hover{
    background-color:var(--el-insights-ar) !important;

    }

.daterangepicker td.in-range{
    background-color:var(--el-insights-ar) !important;
    color:#fff !important;

    }

.daterangepicker .input-mini.active,.daterangepicker .input-mini{
    border:none !important;
    border-radius:2px !important;
}

.daterangepicker.ltr .calendar.left .calendar-table,.daterangepicker.ltr .calendar.right .calendar-table{
    border-radius:2px;
   -webkit-box-shadow: 0px 3px 5px 0px rgba(0,0,0,0.25);
    -moz-box-shadow: 0px 3px 5px 0px rgba(0,0,0,0.25);
    box-shadow: 0px 3px 5px 0px rgba(0,0,0,0.25);
}

.daterangepicker:after{
    border-bottom:6px solid #F5F5F6 !important;

}

th#th-sales,th#th-change{
    cursor:pointer;
    color:#fff;
    background-color:var(--el-insights-ar);
    transition: all 0.5s ease;
}

th#th-sales:hover,th#th-sales:focus,
th#th-change:hover,th#th-change:focus{
    background-color:var(--el-insights-ad);
}

/*-------------------------------------------------------------HeatMaps & Hoods---------*/

#el-body2{
        position: relative;
        width: 100%;
        height: 100%;
        display: grid;
        grid-template-columns: auto minmax(200px, 500px);
        grid-template-rows: 59px auto;
        grid-template-areas: "nav nav" "map ctt" "map ctt";
}


#el-navbar2{
    grid-area: nav;
}

#el-map2{
    grid-area: map;
    position: relative;
}


#el-content2{
    grid-area: ctt;
    overflow:scroll !important;
}

@media only screen and (max-device-width: 480px) {
    #el-body2{
        grid-template-columns: 1fr;
        grid-template-rows: 55px 50% auto;
        grid-template-areas: "nav"
            "map"
            "ctt";
    }


}

@media only screen and (max-device-width: 768px) and (orientation:portrait) {
    #el-body2{
        grid-template-columns: 1fr;
        grid-template-rows: 55px 50% auto;
        grid-template-areas: "nav"
            "map"
            "ctt";
    }


}


/*-------------------------------------------------------------------------heatmap v2---*/

#mapid {
    height: 100vh;
    width:100%;
}
/*-------------------------------------------------------------------------allergens----*/

.allergy-controls-wrapper{
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(100px, 1fr));
    grid-auto-rows: 70px;
    align-content:center;
    grid-gap: 10px;
}

.allergy-controls-wrapper > div{
    border-radius:3px;
    -webkit-box-shadow: 0px 3px 14px 0px rgba(0,0,0,0.25);
    -moz-box-shadow: 0px 3px 14px 0px rgba(0,0,0,0.25);
    box-shadow: 0px 3px 14px 0px rgba(0,0,0,0.25);
    padding:10px;
    text-align:center;
    align-content:center;
}

.good{
    color:rgba(55, 150, 39, 1) !important;
}
.bad{
    color:rgba(238, 58, 66, 1) !important;
}

.icon {
        width:40px;
        height: 40px;
        -webkit-transition: all .2s ease-in;
        -moz-transition: all .2s ease-in;
        transition: all .2s ease-in;
}

.icon:hover{
    -moz-transform: scale(1.1);
    -webkit-transform: scale(1.1);
    -o-transform: scale(1.1);
    -ms-transform: scale(1.1);
    transform: scale(1.1);
}

#mod-allergy label{
    margin:0;
}

/*-----------------Switch color ovverides------*/

/* Bootstrap Toggle v2.2.2 corrections for Bootsrtap 4*/
.toggle-off {
    box-shadow: inset 0 3px 5px rgba(0, 0, 0, .125);
}
.toggle.off {
    border-color: rgba(0, 0, 0, .25);
}

.toggle-handle {
    background-color: white;
    border: thin rgba(0, 0, 0, .25) solid;
}

div.allergyControls{
    margin-top:55px;
    z-index:200;
    position:sticky;
    top:56px;
}
div.stickySearch{
    transition: all 0.5s ease;
    }




/*--------------------------------------------------------------------Neighbourhoods----*/

#mod-hoods blockquote{
    font-style:italic;
    color:var(--el-hoods-ar);
    text-align:right;
}

.hoodNote{
    font-size:1.2em;
    transition: all 0.5s ease;
    margin-top:10px;
    }

.hoodNote:hover, .hoodNote:focus{
    color:@el-accent;
    -ms-transform: rotate(15deg); /* IE 9 */
    -webkit-transform: rotate(15deg); /* Safari 3-8 */
    transform: rotate(15deg);
}
#mod-hoods .btn-outline-primary{
    background-color:rgba(255,255,255,0.3);
    color:var(--el-hoods-ar);
    border:3px solid var(--el-hoods-al);
    transition: all 0.5s ease;
    }

#mod-hoods .btn-outline-primary:hover,
#mod-hoods .btn-outline-primary:focus,
#mod-hoods .btn-outline-primary.active{
    background-color:rgba(255,255,255,1);
    color:var(--el-hoods-ar);
    border:3px solid var(--el-hoods-ar);
}

#mod-hoods button.close{
    color: var(--el-hoods-ar);
    }

#mod-hoods button.close:hover,button.close:focus{
    color: var(--el-hoods-ar);
    }

#mod-hoods .slider-container{
    display:grid;
    grid-template-columns: 80px 1fr 80px;
    grid-row-gap: 3px;
    align-items:center;

}
#mod-hoods div.el-slider{
    margin:10px;
}

#mod-hoods input.start, input.to{
    width:100%;
    padding:3px;
    margin:3px;
    border-radius:2px;
    border:none;
    -webkit-box-shadow: inset 0px 2px 10px 1px rgba(0,0,0,0.25);
    -moz-box-shadow: inset 0px 2px 10px 1px rgba(0,0,0,0.25);
    box-shadow: inset 0px 2px 10px 1px rgba(0,0,0,0.25);
    transition: all 0.5s ease;
}

#mod-hoods div.slider-label{
    grid-column:1/4;
    align-items:center;
    text-align:center;
}
/*-------------------------------------------------------------Products-----------------*/

/*-----Specific----*/
div.productSearch{
    width:100%;
    position:sticky;
    top:59px;
    margin:0;
    border-radius:2px;
    z-index:50;
    padding:20px;
    background-color:#fff;
    -webkit-box-shadow: 0px 3px 5px 0px rgba(0,0,0,0.25);
    -moz-box-shadow: 0px 3px 5px 0px rgba(0,0,0,0.25);
    box-shadow: 0px 3px 5px 0px rgba(0,0,0,0.25);
}

#mod-products div.card,
#mod-dashboard div.card{
    -webkit-box-shadow: 0px 3px 5px 0px rgba(0,0,0,0.25);
    -moz-box-shadow: 0px 3px 5px 0px rgba(0,0,0,0.25);
    box-shadow: 0px 3px 5px 0px rgba(0,0,0,0.25);
    transition: all 0.5s ease;
    margin:5px;
}

#mod-products div.card:hover,
#mod-dashboard div.card{
    -webkit-box-shadow: 0px 3px 14px 0px rgba(0,0,0,0.25);
    -moz-box-shadow: 0px 3px 14px 0px rgba(0,0,0,0.25);
    box-shadow: 0px 3px 14px 0px rgba(0,0,0,0.25);
}

#mod-products h4.card-title{
    margin:0;
}

#mod-products select.form-control:not([size]):not([multiple]){
    height:2.25rem !important;
}

#mod-products .product-img{
    max-height:300px !important;
    text-align:center
}


/*-------------------------------------------------------------Admin-------------------*/

#mod-admin .list-group-item{
     cursor:pointer;
     transition: all 0.3s ease;
    -webkit-box-shadow: 0px 3px 5px 0px rgba(0,0,0,0.25);
    -moz-box-shadow: 0px 3px 5px 0px rgba(0,0,0,0.25);
    box-shadow: 0px 3px 5px 0px rgba(0,0,0,0.25);
    transition: all 0.5s ease;
    margin:3px;
}
#mod-admin .list-group-item:hover{
    color:var(--el-tracker-ar);
    transform:translate(-10px);
    -webkit-box-shadow: 0px 3px 14px 0px rgba(0,0,0,0.25);
    -moz-box-shadow: 0px 3px 14px 0px rgba(0,0,0,0.25);
    box-shadow: 0px 3px 14px 0px rgba(0,0,0,0.25);
}

#mod-admin div#users,
#mod-admin div#accounts{
    margin-top:80px;
    -webkit-box-shadow: 0px 3px 5px 0px rgba(0,0,0,0.25);
    -moz-box-shadow: 0px 3px 5px 0px rgba(0,0,0,0.25);
    box-shadow: 0px 3px 5px 0px rgba(0,0,0,0.25);
}

div.adminSearch{
    position:sticky;
    top:59px;
    padding:5px;
    z-index:10;
    background-color:#fff;
    -webkit-box-shadow: 0px 3px 5px 0px rgba(0,0,0,0.25);
    -moz-box-shadow: 0px 3px 5px 0px rgba(0,0,0,0.25);
    box-shadow: 0px 3px 5px 0px rgba(0,0,0,0.25);
}

.form-no-margin{
    margin:0;
}

/*----------------------------------------------------------------------cashouts-------*/

.dropdown-danger .dropdown-content li a, .dropdown-danger .dropdown-content li span:hover, .dropdown-danger .dropdown-content li.active{
    background-color:var(--el-cashout-ad);
    color:#fff;
}
/*---------------------------------------------------Dropzone----*/

.dropzone{
    border:none;
    -webkit-box-shadow: 0px 3px 14px 0px rgba(0,0,0,0.25);
    -moz-box-shadow: 0px 3px 14px 0px rgba(0,0,0,0.25);
    box-shadow: 0px 3px 14px 0px rgba(0,0,0,0.25);
    margin:10px;

}

.dropzone .dz-preview .dz-image{
    border-radius:3px;
}

.dropzone .dz-preview .dz-details .dz-filename span, .dropzone .dz-preview .dz-details .dz-size span{
background-color:rgba(255,255,255,0.6);
margin-top:10px;
}

.dropzone .dz-preview .dz-image,
.dropzone .dz-preview.dz-file-preview .dz-image{
    border-radius:3px !important;
}

div.dz-filename{
    display:none;
}

.dropzone .dz-preview .dz-details .dz-size{
display:none;
}

.dropzone .dz-preview .dz-image img{
    transition: all 0.3s cubic-bezier(0.19, 1, 0.22, 1);
    -webkit-box-shadow: 0px 3px 5px 0px rgba(0,0,0,0.25);
    -moz-box-shadow: 0px 3px 5px 0px rgba(0,0,0,0.25);
    box-shadow: 0px 3px 5px 0px rgba(0,0,0,0.25);
}


.dropzone .dz-preview:hover .dz-image img{
    webkit-filter:none;
    filter: none;
    transform:none;
    border-radius:15%;
    -webkit-box-shadow: 0px 3px 14px 0px rgba(0,0,0,0.25);
    -moz-box-shadow: 0px 3px 14px 0px rgba(0,0,0,0.25);
    box-shadow: 0px 3px 14px 0px rgba(0,0,0,0.25);
}



.dropzone .dz-preview.dz-image-preview{
    background-color:transparent;
}



/*------------------------------------------------------Events-------------------------*/

#mod-events div.event{
    cursor:pointer;
}

#mod-events div#eventSite{
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}


.dropzone{
    width:100%
}

img {
    image-orientation: from-image;
}

[data-fn], [data-callback]{
    cursor: pointer;
}

#daily-report-container{
    display:none
}

.dropdown-submenu {
position: relative;
}

.dropdown-submenu a::after {
transform: rotate(-90deg);
position: absolute;
right: 6px;
top: .8em;
}

.dropdown-submenu .dropdown-menu {
top: 0;
left: 100%;
margin-left: .1rem;
margin-right: .1rem;
}

a.dropdown-item{
    color: black!important;
}