﻿body {
    padding: 0;
    width: 100%;
    margin: 0 auto;
    font-size: 12px;
    line-height: 12px;
    height: 100%;
    direction: ltr;
    color: #787878;
    font-family: Roboto,Arial,Helvetica,sans-serif;
    background: #fff;
    text-transform: none;
    min-height: 100%;
    position: relative;
    
}

body, div
{
	--scrollbar-border-thickness: 0px;
    --show-double-buttons: none;
    --scrollbar-width: 10px;
    --scrollbar-height: 10px;
    --scrollbar-border-radius: 6px;
}
    body::-webkit-scrollbar-button, div::-webkit-scrollbar-button {
        background: var(--scrollbar-button-color, #3F3F46);
        border: var(--scrollbar-border-thickness, 3px) solid var(--scrollbar-border-color, rgb(255, 255, 255));
        border-radius: var(--scrollbar-border-radius, 4px);
    }

    body::-webkit-scrollbar {
        width: var(--scrollbar-width, 20px);
        height: var(--scrollbar-height, 20px);
    }

    div::-webkit-scrollbar {
        width: var(--scrollbar-width, 20px);
        height: 4px;
    }

    body::-webkit-scrollbar-thumb, div::-webkit-scrollbar-thumb {
        background: var(--scrollbar-thumb-color, #5A64D8);
        border: var(--scrollbar-border-thickness, 3px) solid var(--scrollbar-border-color, rgb(255, 255, 255));
        border-radius: var(--scrollbar-border-radius, 4px);
    }

    body::-webkit-scrollbar-track, div::-webkit-scrollbar-track {
        background: var(--scrollbar-track-color, #FFFFFF);
    }

    body::-webkit-scrollbar-corner, div::-webkit-scrollbar-corner {
        background: var(--scrollbar-corner-color, #FFFFFF);
        border: var(--scrollbar-border-thickness, 3px) solid var(--scrollbar-border-color, rgb(255, 255, 255));
        border-radius: var(--scrollbar-border-radius, 4px);
    }

    body::-webkit-scrollbar-button:vertical:start:increment, div::-webkit-scrollbar-button:vertical:end:decrement, div::-webkit-scrollbar-button:horizontal:start:increment, div::-webkit-scrollbar-button:horizontal:end:decrement {
        display: var(--show-double-buttons, none);
    }


input[type="file"] {
    display: none;
}
.custom-file-upload {
    border: 1px solid #ccc;
    display: inline-block;
    padding: 8px 12px 8px 30px;
    cursor: pointer;
    border-radius: 5px;
    background-image: url(../images/fileUpload.png);
    background-repeat: no-repeat;
    background-position: 12px 7px;
    background-size: 14px 14px;
    background-color: #787878;
    color: #fff;
    text-align: center;
}

/* The switch - the box around the slider */
.switch {
    position: relative;
    display: inline-block;
    width: 31px;
    height: 16px;
}

.switchLabel {
    display: inline-block;
    padding: 0px 2px;
    max-width: 200px;
    position: relative;
    vertical-align: text-top;
    top: 3px;
    line-height:14px;
}
.editUserFieldDoubleWide .switchLabel{
    max-width:450px;
}
/* Hide default HTML checkbox */
.switch input {
    opacity: 0;
    width: 0;
    height: 0;
}

/* The slider */
.slider {
    position: absolute;
    cursor: pointer;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: #ccc;
    -webkit-transition: .4s;
    transition: .4s;
}

.slider:before {
    position: absolute;
    content: "";
    height: 10px;
    width: 10px;
    left: 4px;
    bottom: 3px;
    background-color: white;
    -webkit-transition: .4s;
    transition: .4s;
}

input:checked + .slider {
    background-color: #5A64D8;
}

input:focus + .slider {
    box-shadow: 0 0 1px #5A64D8;
}

input:checked + .slider:before {
    -webkit-transform: translateX(12px);
    -ms-transform: translateX(12px);
    transform: translateX(12px);
}

/* Rounded sliders */
.slider.round {
    border-radius: 34px;
}

.slider.round:before {
    border-radius: 50%;
}

.clickable {cursor:pointer;}
#wrapper {text-align:center; padding:0px 16px 16px 16px;position:relative;min-height:900px;width: 97%;margin:0 auto;}
#content {position:relative;}
#leftPane {
    display: none;
    float: left;
    width: 10.5%;
    margin-top: 8px;
    min-height: 258px;
    padding: 8px;
    background: #F5F5FF;
}
#leftPane.horizontal {
    display: none;
}
#centerPane.horizontal {width:99%;}
#retailersSelector {
    display: none;
    cursor: pointer;
    margin-left: 24px;
    vertical-align: top;
    margin-top: -2px;
}
    #retailersSelector select {
        border: 1px solid #2D2D4F;
        border-radius: 5px;
        padding: 6px
    }
#header #menuSwitcher {
    display: block;
    position: absolute;
    left: 0;
    right: 0;
    z-index: 2;
    top: 16px;
}
#menuSwitcher.vertical, #menuSwitcher.horizontal {cursor:pointer;position: relative;display: inline-block;width:25px;height:25px;background-image: url(../images/menuList.png);background-repeat: no-repeat;background-position: 0px 0px;background-size: 20px 20px;}
 
#leftMenu {float:left; width:100%; }
#generalMenu {display:none;}
#leftMenu #generalMenu li {
    white-space: nowrap;
    position: relative;
    padding: 16px;
    font-size: 22px;
    color: #2D2D4F;
    line-height: 32px;
    border-bottom: 1px solid #ededed;
    cursor: pointer;
    text-align: center;
}
#leftMenu #generalMenu li a {display: block;}
#leftMenu #generalMenu li a span {display: block;}
#leftMenu #generalMenu li:hover, #leftMenu ul li.selected {background:#62cf73;color:#fff !important;}
#leftMenu #wasteMenu li .demo {display: inline-block;font-size: 8px;color: red;position: absolute;top: -5px;left: 4px;font-weight: bold;}
#leftMenu #wasteMenu li {
    position: relative;
    padding: 8px;
    font-size: 15px;
    color: #2D2D36;
    line-height: 26px;
    border: 1.5px solid #2D2D4F;
    cursor: pointer;
    text-align: center;
    border-radius: 24px;
    margin-bottom: 12px;
    word-wrap: break-word;
    width:110px;
}
    #leftMenu #wasteMenu li.adminPanel {
        position: fixed;
        bottom: 0;
        background: #5A64D8;
        color: #fff;
    }
#leftMenu #wasteMenu li a {display: block;}
#leftMenu #wasteMenu li a span {display: block;}
#leftMenu #wasteMenu li:hover{background:#62cf73;color:#fff;}
#wasteMenu{color:#62cf73;} 
#centerPane{width:87%;float: left; }
#centerPane.login {width:100%;float:none;border:none;}
#pageTitle {
    display: inline-block;
    padding: 0;
    font-size: 14px;
    color: #2D2D4F;
    text-transform: capitalize;
    line-height: 14px;
    top: 6px;
    left: 420px;
    position: absolute;
    min-width: 250px;
    height: 30px;
}
#compPeriod {position:absolute; font-size: 9px; display:none;min-width:250px;margin-left:0px;margin-top:2px;}
#noData {display:none;padding: 16px;font-size: 24px;color: #62cf73;margin-bottom: 16px;}
.bold {font-weight:bold;}
#version {text-align:center; bottom:8px; display:none;}

#header {height:54px; position:relative;border-bottom:1px solid #ededed;}
#headerLeft {
    float: left;
    position: absolute;
    top: 14px;
    z-index: 1;
    left:40px;
}
#headerCenter {width:100%;position:absolute;top:8px;}
#headerRight {position: relative;float:right;margin-top:14px;}
#header #headerLeft img {height: 24px;}
#header #headerCenter #topLogo {display:none; height:40px;}
#header #headerRight img {width:60px; height:20px;}
#user {
    margin-top: 0px;
    display: inline-block;
    float: right;
    text-align: right;
    margin-left: 16px;
}
/*.panel {display:none;}*/
#loginPanel {display:block;}
#loginLogo {
    margin-bottom: 8px;
}
#loginLogo img{
    width:200px;
}
.panelTitle {
    color: #2D2D4F;
    font-weight: bold;
    font-size: 16px;
    padding: 22px 0px 22px 0px;
    display: inline-block;
    width: 248px;
    text-align: left;
}
.panelContent {text-align:center;}
.field {margin:0px 0px 24px 0px;}
.fieldTitle {color:#000;font-size:12px; padding:8px;text-align:center;}
#store {padding:0px 0px 12px 24px; display:none; text-align:left; line-height:24px;position: relative; display:none;}
#storeName {color:#2D2D4F;font-size:24px;}
#storeAddress {font-size:12px; margin-top:8px;}
#filters {text-align:left; margin:8px 24px 8px 24px;display:none;}
#filters .filter{margin-right:12px; float:left;}

#fixDates .fixDate{display:block; text-align:center;padding:16px;background: #2D2D4F;color: #fff; cursor:pointer;width: 153px;border-bottom:1px solid #fff;}
#fixDates .fixDate.selected {background-color:#2D2D4F;color:#62cf73;}

#datesFilter {display:inline-block;margin-bottom:0px;margin-top:0px;position:relative;}
#datesFilter #selectDates {position:relative; display:inline-block; border:1px solid #ededed;padding:14px;width: 155px;text-align: center;color: #2D2D4F;font-weight: bold;font-size: 12px;background-image: url('../images/calendario.gif');background-repeat: no-repeat;background-position: 14px 9px;background-size: 20px 20px;cursor:pointer;}
#datesFilter #fixDates {display:none; position:absolute; z-index:2;background: #2D2D4F; top:33px;}


#dateSelector.fixDate {position: relative;background-image: url('../images/calendario.gif');background-repeat: no-repeat;background-position: 24px 12px;background-size: 20px 20px;}
#dateSelector.fixDate span {padding-left:3px;}
#hiddenDates {visibility:hidden; position:absolute;left:21px;top:42px;z-index: 3;background: #ededed;padding: 8px;border: 1px solid #d4d4d4;}
#hiddenDates #fromDate, #hiddenDates #toDate {display:inline-block;}
#wasteTypesFilter {display:inline-block;width: 180px;margin-top:0px;}
#wasteTypesFilter #wasteTypes {height:35px; width:157px;}
#wasteTypesFilter .ui-widget.ui-widget-content {height:40px;color:#2D2D4F;font-weight: bold;width:100%; text-indent:4px; border:1px solid #ededed; background:#fff;outline: none;}
#productsFilter {display:none;width: 180px;margin-top:0px;}
#productsFilter #products {height:35px; width:157px;}
#productsFilter .ui-widget.ui-widget-content {height:40px;color:#2D2D4F;font-weight: bold;width:100%; text-indent:4px; border:1px solid #ededed; background:#fff;outline: none;}
#storesFilter, #categoriesFilter, #grindSpeciesFilter {display:inline-block;width: 189px;}
#storesFilter #products {height:35px; width:157px;}
#storesFilter .ui-widget.ui-widget-content {height:40px;color:#2D2D4F;font-weight: bold;width:100%; text-indent:4px; border:1px solid #ededed; background:#fff;outline: none;}
#storeSearch, #categoriesSearch, #grindSpeciesSearch {
    position: relative;
    display: inline-block;
    border: 1px solid #ededed;
    padding: 14px;
    width: 160px;
    text-align: center;
    color: #2D2D4F;
    font-weight: bold;
    font-size: 12px;
    height: 13px;
    border-radius: 0px !important;
}
#storesSearchListWrapper, #categoriesSearchListWrapper, #grindSpeciesSearchListWrapper {
    margin: 0 auto;
    display: none;
    min-width: 188px;
    border: 1px solid #2D2D4F;
    position: absolute;
    z-index: 2;
    background: #2D2D4F;
    max-width: 270px;
    max-height: 350px;
    overflow-y: auto;
}
#storesSelectAllWrapper, #categoriesSelectAllWrapper, #grindSpeciesSelectAllWrapper {
    cursor: pointer;
    height: 12px;
    display: flex;
    align-items: center;
    color: #fff;
    font-weight: bold;
    font-size: 12px;
    padding: 8px;
    border-bottom: 1px solid #fff;
    margin-top: 4px;
}
    #storesSelectAllWrapper label, #categoriesSelectAllWrapper label, #grindSpeciesSelectAllWrapper label {
        margin-left: 8px;
    }
.storesList, .categoriesList, .grindSpeciesList {
    max-height: 120px;
    overflow-y: auto;
    margin-top: 4px;
    border-bottom: 1px solid #fff;
    border-right: 1px solid #fff;
    border-left: 1px solid #fff;
    display: none;
}
.selectedStoresList, .selectedCategoriesList, .selectedGrindSpeciesList {
    overflow-y: auto;
    margin-top: 4px;
    border-bottom: 1px solid #fff;
    border-right: 1px solid #fff;
    display: none;
    min-height: 15px;
    max-height: 150px;
    padding-left: 42px;
}
.selectedCategoriesList, .selectedGrindSpeciesList {
    padding-left: 0px;
}

    .storesList li, .selectedStoresList li, #storesSelectAllWrapper, .storesRegionAll, .categoriesList li, .selectedCategoriesList li, .grindSpeciesList li, .selectedGrindSpeciesList li {
        cursor: pointer;
        height: 12px;
        display: flex;
        align-items: center;
        color: #fff;
        font-weight: bold;
        font-size: 12px;
        padding: 8px;
    }
        .storesList li label, .selectedStoresList li label, .storesRegionAll label, .categoriesList li label, .selectedCategoriesList li label, .grindSpeciesList li label, .selectedGrindSpeciesList li label {
            margin-left: 8px;
        }

.storesRegion {
    float: left;
    width: 253px;
    /*border-right: 1px solid #fff;*/
}
.storesRegionAll{border-bottom:1px solid #fff; margin-bottom:4px;}
.storesRegionMenu {
    display: inline-block;
    width: 12px;
    background-image: url(../images/menuRight.png);
    background-repeat: no-repeat;
    background-position: 0px 0px;
    background-size: 12px 12px;
    vertical-align: top;
    height: 12px;
    margin-right: 12px;
}
.storesRegionMenu.open {
    display: inline-block;
    width: 12px;
    background-image: url(../images/menuDown.png);
    background-repeat: no-repeat;
    background-position: 0px 0px;
    background-size: 12px 12px;
    vertical-align: top;
    height: 12px;
    margin-right: 12px;
}

.storesSearchNoStoreSelected, .categoriesSearchNoCategorySelected, .grindSpeciesSearchNoCategorySelected {
    width: 100%;
    text-align: center;
}

ul .ui-menu {
    max-height: 350px;
    overflow: auto;
    width: 180px !important;
    overflow-x: hidden;
}
ul.ui-menu .ui-menu-item {color:#2D2D4F;line-height: 16px;padding:8px 0; border-top:1px solid #ededed;}
a.ui-button {height: 33px; display: inline-block;border: none;margin-top: -55px; margin-left:157px;}
.ui-button:hover {border:none !important;}
#dateSelectorBottom {text-align:right;}
#dateSelectorBottom #dateApply {float:right;text-align: right; margin-top: 8px;display: inline-block;padding: 8px;background: #2D2D4F;color: #fff; cursor:pointer;font-weight: bold;}
#dateSelectorBottom #dateClose {float:left; margin-top:16px;color: #2D2D4F;cursor:pointer;}
.select {margin: 0px 0px 0px;padding: 2px 0;width: 48px;height: 100%;/*-webkit-appearance: none;*/-moz-appearance: none;-ms-appearance: none;appearance: none;text-indent: 2px;background-color: #fff;border: 1px solid #dedede;color:#787878;outline:none;}
input[type="text"], input[type="password"], input[type="number"] {
margin: 0px 0px 0px;
padding: 4px 0;
width: 250px;
height: 20px;
-webkit-appearance: none;
-moz-appearance: none;
-ms-appearance: none;
appearance: none;
text-indent: 8px;
background-color: #fff;
border: 1px solid #dedede;
color:#787878;
outline:none;
-webkit-border-radius: 5px;-moz-border-radius: 5px;border-radius: 5px;
}
input.disabled {
    border:none;
    text-indent:0;
}
input.smallInput {
    width: 125px;
    height: 24px;
    position: relative;
}
input.verySmallInput {
    width: 50px;
    height: 24px;
    position: relative;
}
input.smallInputLow {width:125px; height:16.5px;position:relative;}
input.bigInput {
    width: 561px;
    position: relative;
}
input.OverTwoSmallFields {
    width: 298px;
}
span.price {padding-right:4px;}
input[type="button"]{
margin: 0px 0px 0px;
width: 250px;
height: 42px;
-webkit-appearance: none;
-moz-appearance: none;
-ms-appearance: none;
appearance: none;
text-indent: 2px;
background-color:#2D2D4F;
border: 1px solid #dedede;
color:#fff;
border: 1px solid #d9d9d9;
font-size:14px;
cursor:pointer;
outline:none;
-webkit-border-radius: 5px;-moz-border-radius: 5px;border-radius: 5px;
font-size:16px;
}
input[type="number"] {
    width:15%;
    text-align:center;
    text-indent: 0px;
}
input[type="date"] 
{
    height: 22px;
    /* display: block; */
    font-size: 14px;
    border: 1px solid;
    background: #fff;
    outline:none;
}
#logout {
    cursor: pointer;
    display: inline-block;
    border-radius: 24px;
    border: 1px solid;
    padding: 8px;
    background: #2D2D4F;
    color: #fff;
}
#hello {display: inline-block;margin-right: 16px;}

#userLang{
    cursor: pointer;
    display: inline-block;
    margin-right: 24px;
    vertical-align: middle;
}

#loginUserLang {
    cursor: pointer;
    display: block;
    margin-right: 24px;
    vertical-align: middle;
    margin-top: 0px;
}

.userLangLeft {
    display: inline-block;
    width: 16px;
    height: 16px;
    background-image: url(../images/lang.png);
    background-repeat: no-repeat;
    background-position: 0px 0px;
    background-size: 16px 16px;
}
.userLangRight {
    display: inline-block;
    width: 32px;
    background-image: url(../images/langSelector.png);
    background-repeat: no-repeat;
    background-position: 22px 3px;
    background-size: 10px 6px;
    vertical-align: top;
    margin-top: 3px;
    text-align: left;
    margin-left: 8px;
    border-bottom: 1px solid;
    padding-bottom: 2px;
    color: #2D2D4F;
    text-transform:uppercase;
}
#langSelector {
    position: absolute;
    display: none;
    width: 32px;
    min-height: 40px;
    top: 24px;
    left: 141px;
    z-index: 3;
}
.langOption {
    display: block;
    text-align: center;
    padding: 8px 10px;
    background: #2D2D4F;
    color: #fff;
    cursor: pointer;
    width: 16px;
    border-bottom: 1px solid #fff;
    z-index: 2;
}

#forgotPassword {
    margin-top: 24px;
    cursor: pointer;
}
#forgotPasswordBack{margin-top:24px;cursor:pointer;}
#passwordReminderMessage {
    width: 280px;
    display: inline-block;
    text-align: left;
    line-height: 16px;
}
#forgotPasswordBackToLogin {
    margin-top: 24px;
    cursor: pointer;
}


#loginLangSelector {
    text-align: center;
    margin: 8px;
    display: none;
}

    #loginLangSelector .langOption {
        display: inline-block;
        text-align: center;
        padding: 8px;
        background: #2D2D4F;
        color: #fff;
        cursor: pointer;
        /* width: 16px; */
        border-bottom: 1px solid #fff;
        z-index: 2;
        /* text-align: center; */
        margin-right: 4px;
        margin-top: 4px;
    }

    .langOption.selectedLang, #loginLangSelector .langOption.selectedLang {
        background: #62cf73;
    }

#alertsWrapper {
    display: inline-block;
    float: left;
}

#alerts {cursor:pointer;position: relative;display: inline-block;width:25px;height:25px;background-image: url(../images/alert.png);background-repeat: no-repeat;background-position: 0px 0px;background-size: 25px 25px;}
.circle {
    border: 1px solid #2D2D4F;
    border-radius: 100%;
    height: 16px;
    width: 16px;
    text-align: center;
    position:absolute;
    top:-8px;
    left:14px;
    background: #fff;
}
.circle p {
	margin-top: 3px;
    font-size: 10px;
    font-weight: bold;
    color: #2D2D4F;
}
#loadingPanel {
    display:none;
    position: absolute;
    z-index: 2;
    width:250px;
    /*max-width: 200px;*/
    /*min-width: 200px;*/
    height: 32px;
    overflow: hidden;
    background: #fff;
    margin: 0 auto;
    left: 0;
    right: 0;
    font-size: 16px;
    color: #99ff99;
    padding: 4px;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    border-radius: 5px;
    border: 1px solid;
}

#loadingPanel div{padding: 10px;}
.errorMessage {padding:12px; font-size:14px; color:red;display:none;}

div.back
{
    float:left;
    margin: 0px 0px 0px;
    padding: 0 0;
    width: 42%;
    height: 32px;
    background:#a9a9a9;
    border: 1px solid #dedede;
    color:#fff;
    border: 1px solid #d9d9d9;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    border-radius: 5px;
    cursor:pointer;
    font-size:14px;
}
div.back.center
{
    margin-top:8px;
    width:100%;
}
div.ok
{
    float:right;
    margin: 0px 0px 0px;
    padding: 0 0;
    width: 42%;
    height: 32px;
    -webkit-appearance: none;
    -moz-appearance: none;
    -ms-appearance: none;
    appearance: none;
    background:#51bf33;
    border: 1px solid #dedede;
    color:#fff;
    border: 1px solid #d9d9d9;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    border-radius: 5px;
    font-size:14px;
    cursor:pointer;
}

div.back div, div.ok div 
{
    padding-top:10px;
    height: 22px;
}

#successPanel {
    display:none;
}

#successMessage 
{
    color:#51bf33;
    font-size:18px;
    padding: 0 16px;
    padding-top: 24px;
    line-height:24px;
}
#failMessage 
{
    color:#df3b29;
    padding: 0 16px;
    padding-top: 24px;
    font-size:18px;
    line-height:24px;
}
.finishButtons {padding: 14px;}

.finalButton.cancel {
    background:#df3b29;
    display:none;
}
.finalButton.continue {
    background:#006dae;
}
.finalButton.retry {
    background:#51bf33;
}
.finalButton
{
    margin: 0px 0px 14px;
    padding: 12px;
    -webkit-appearance: none;
    -moz-appearance: none;
    -ms-appearance: none;
    appearance: none;
    background:#51bf33;
    border: 1px solid #dedede;
    color:#fff;
    border: 1px solid #d9d9d9;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    border-radius: 5px;
    font-size:14px;
    cursor:pointer;
}
.numberSelector {
}
.numberSelector .plus {
    margin-right:8px;
    display: inline-block;
    height: 18px;
    border-radius: 16px;
    padding: 4px;
    background: #51bf33;
    color: #fff;
    vertical-align: middle;
    cursor:pointer;
}
.numberSelector .minus{
    margin-left:8px;
    display: inline-block;
    height: 18px;
    border-radius: 16px;
    padding: 4px;
    background: #df3b29;
    color: #fff;
    vertical-align: middle;
    cursor:pointer;
}
.numberSelector .minus span {
    font-size: 32px;
    width: 18px;
    display: block;
    margin-top: 1px;
}
.numberSelector .plus span
{
    font-size: 24px;
    width: 18px;
    display: block;
    margin-top: 3px;
}
#shelfState{
    width:100%;
    font-size:14px;
    margin-bottom:16px;
}
#shelfState th {
    vertical-align:middle;
    text-align:center;
    padding:4px;
    width:90px;
    border-bottom: 1px solid #ededed;
    padding-bottom: 8px;
}
#shelfState th.left, #shelfState td.left {
    text-align:left;
}
#shelfState td {
    vertical-align:middle;
    text-align:center;
    padding:6px;
    border-bottom: 1px solid #ededed;
}
#shelfState td input {
    width:25%;
    height: 24px;
    margin: 0 10px;
    text-indent:0px;
}

#homeCubes, #productCubes {
    text-align: center;
    padding: 10px;
    position: relative;
    vertical-align: top;
    margin-top: 12px;
    display: inline-block;
    
    height: 130px;
    white-space: nowrap;
    overflow-x: auto;
    overflow-y: hidden;
    white-space: nowrap;
}



#productCubes .cubeWrapper .cubeTitle {
    font-size: 13.5px;
}

.cubeWrapper {
    position: relative;
    text-align: center;
    width: 150px;
    margin-right: 16px;
    display: inline-block;
    border: 1px solid #2D2D4F;
    padding: 6px 6px;
    min-height: 94px;
    vertical-align: top;
    float:none;
}
.cubeWrapper.catalogCube{cursor:pointer;}
    .cubeWrapper.catalogCube.selected {
        background: #F5F5FF;
    }

.cubeWrapper.selected {
    background: #F5F5FF;
}

    .cubeWrapper:hover {
        background: #F5F5FF;
    }

    .cubeWrapper:last-child {
        margin-right: 0;
    }

    .cubeWrapper .cubeData {
        font-size: 22px;
        color: #2D2D4F;
        line-height: 32px;
        position: absolute;
        top: 41%;
        left: 0%;
        text-align: center;
        width: 100%;
    }

    .cubeWrapper .worseCube {
        top: 30%;
    }

    .cubeWrapper .worseCubeLongTitle {
        font-size: 16px;
    }

    .cubeWrapper .worseUnits {
        color: #2D2D4F;
        padding-bottom: 11px;
        font-size: 16px;
    }

    .cubeWrapper .cubeTitle {
        font-size: 14px;
        /*overflow: hidden;
    padding-top: 8px;
    white-space: nowrap; */
        text-transform: capitalize;
        line-height: 16px;
    }

    .cubeWrapper .cubeSubTitle {
        font-size: 12px;
        /* color: #2D2D4F; */
        position: absolute;
        bottom: 4%;
        left: 0%;
        text-align: center;
        width: 100%;
    }

    .cubeWrapper.chartCube {
        width: 400px;
        min-height: 212px;
    }

    .cubeWrapper .cubeChartContainer {
        width: 100%;
        height: 200px;
    }

    .cubeWrapper .info {
        display: none;
        position: absolute;
        left: -10px;
        top: -8px;
        border-radius: 50%;
        width: 16px;
        height: 16px;
        padding: 1px;
        background: #2D2D4F;
        border: 1px solid #666;
        color: #fff;
        text-align: center;
        cursor: pointer;
    }

        .cubeWrapper .info .infoSign {
            margin-top: 3px;
            display: block;
            font-weight: bold;
        }

    .cubeWrapper .infoText {
        position: absolute;
        display: none;
        border: 1px solid #2D2D4F;
        padding: 8px;
        color: #2D2D4F;
        min-width: 210px;
        text-align: left;
        background: #d4cceb;
        z-index: 1;
        line-height: 14px;
        top: 8px;
        left: 8px;
        border-left: 6px solid #2D2D4F;
        text-wrap: auto;
        overflow-y: auto;
    }

    .cubeWrapper .infoText.leftText {
        top: 8px;
        left: -245px;
        max-width:210px;
    }


#peTopCubes {text-align:center; padding:8px;}


.storeChampion .cubeTitle {
    border: 1px solid #2D2D5C;
    background: #F5F5FF;
    padding: 4px;
    color: #2D2D5C;
    border-radius:15px;
}
        .cubeMask {position: absolute;width: 188px;height: 108px;background-image: url('../images/ajax-loader.gif');background-repeat: no-repeat;background-size: 25px 25px;background-position: 80px;top: 15px;}
#sales {cursor:pointer;background-image: url('../images/info1.png');background-repeat: no-repeat;background-position: 55px 11px;background-size: 20px 20px;}
#productSales {cursor:pointer;background-image: url('../images/info1.png');background-repeat: no-repeat;background-position: 41px 11px;background-size: 20px 20px;}
#waste {cursor:pointer;background-image: url('../images/info1.png');background-repeat: no-repeat;background-position: 54px 11px;background-size: 20px 20px;}
#productWaste {cursor:pointer;background-image: url('../images/info1.png');background-repeat: no-repeat;background-position: 40px 11px;background-size: 20px 20px;}
#uploads {cursor:pointer;background-image: url('../images/info1.png');background-repeat: no-repeat;background-position: 30px 11px;background-size: 20px 20px;}
#productUploads {cursor:pointer;background-image: url('../images/info1.png');background-repeat: no-repeat;background-position: 15px 11px;background-size: 20px 20px;}
.cubeDataChange {
    font-size: 11px;
    color: #4ecb71;
    font-weight: bold;
    position: absolute;
    bottom: 3%;
    right: 1%;
    width: 48px;
    z-index: 1;
    background-repeat: no-repeat;
    background-position:39px 2px;
    background-size: 9px 9px;
    text-align:center;
}
.cubeWrapper .dataChangeUpGood {
    background-image: url('../images/green-up.png');
}

.cubeWrapper .dataChangeUpWorse {
    color: #F24E1E;
    background-image: url('../images/red-up.png');
}

.cubeWrapper .dataChangeDownGood {
    background-image: url('../images/green-down.png');
}

.cubeWrapper .dataChangeDownWorse {
    color: #F24E1E;
    background-image: url('../images/red-down.png');
}
.graphArea {padding:8px;margin-top:16px;position:relative;}
.homeMiddleArea .halfWidth {display:inline-block; width:50%;}
.homeMiddleArea .twoThirdWidth {display:inline-block; width:67%;}
.homeMiddleArea .oneThirdWidth {display:inline-block; width:33%;}
.fullWidthChart {margin-top:48px;}
.floatRight {float:right;}
.floatLeft {float:left;}
.displayBlock{display:block !important;}
.graphTitle {
    color: #2D2D4F;
    font-size: 12px;
    line-height: 16px;
    margin: 16px 0px 16px 0px;
    text-transform: uppercase;
}
.graphTitle .innerTitle {font-size:16px; margin-top:8px;}
.chartTableView {
    display: none;
    margin-top: 8px;
    height: 95%;
    overflow-y: auto;
}
.bottomTableView {
    margin-top: 10px;
    height: 90%;
    overflow-y: auto;
    width:100%;
}
.bottomTableHeader {
    margin: 0;
    padding: 12px 0 0px 0;
}
.multiView {
    position: absolute;
    top: 8px;
    left: 8px;
}
.multiView div {float:left;width:25px;height:25px;display:inline-block;margin-right:8px;}
.multiView div.tableIcon {cursor:pointer;background-image: url('../images/tableView.png');background-repeat: no-repeat;background-position: 0px 1px;background-size: 25px 25px;}
.multiView div.graphIcon {cursor:pointer;background-image: url('../images/graphView.png');background-repeat: no-repeat;background-position: 0px 0px;background-size: 25px 25px;}
.titleOneThirdWidth {width:100%;}
.titleTwoThirdWidth {width:90%;}
.graphBoxLeft {position:relative;width:95%; float:left;border: 1px solid #ededed;border-top: 2px solid #000;min-height:325px;}
.graphBoxRight {position:relative;width:95%; float:right;border: 1px solid #ededed;border-top: 2px solid #000;min-height:325px;}
.graphBoxRightThirdWidth {width:100%; float:right;}
.graphWrapperLeft {width:100%; height:400px;}
.graphWrapperRight {width:100%; height:400px;}
.graphWrapperFull {
    position: relative;
    width: 100%;
    border: 1px solid #ededed;
    border-top: 2px solid #000;
    height: 485px;
}
.graphWrapperFullContainer {width:100%; height:450px;}
.mapWrapperFull {width:100%; height:500px;}

.graphWrapperLeft.graphHalfHeight {width:100%; height:150px;}
.graphWrapperRight.graphHalfHeight  {width:100%; height:150px;}

.overviewSelected {
    background: #F5F5FF;
}

.overviewGraph .graphWrapperFull {
    height: 416px;
}

    .overviewGraph .graphWrapperFull .graphWrapperFullContainer {
        height: 350px;
    }

.chart {width:100%;height:100%;}

#productData  {display: none;;margin-right: 24px;}

#productImage {width:100px;height:100px;}
#productTitle {padding:16px; color:#62cf73; font-size:24px;}
#productBarcode {padding:8px; color:#2D2D4F; font-size:16px;}



#overlay{display:none;text-align:center;position: absolute;top: 0;left: 0;width: 100%;height: 100%;z-index: 10;background-color: rgba(0,0,0,0.5);}
#overlay .container {
    float: right;
    margin: 0 auto;
    width: 65%;
    border: 1px solid #ededed;
    margin-top: 5%;
    background: #fff;
    z-index: 12;
    height: 65%;
    border-top-left-radius: 5px;
    border-bottom-left-radius: 5px;
}
#overlay .container .overlayHeader {
    padding: 24px 6px 24px 6px;
    position: relative;
}
#overlay .container .overlayHeader .closeOverlay {position:absolute;left:5px;top:4px;font-weight:bold;font-size:16px;cursor:pointer;line-height: 16px;}
#overlay .container .exportOverlay {font-weight:bold;font-size:12px;}
#overlay .container .overlayHeader .overlayTitle {display:inline-block;font-weight:bold;font-size:18px;color: #2D2D4F;line-height:16px;}
#overlay .container .overlayData {
    padding: 0 6px;
    margin: 0;
    
}
#overlay .container .overlayData .overlayLoading {padding:40px;font-size:14px;color:#62cf73;}
#overlay .container .overlayData .tableView {width:96%;border:1px solid #ededed;margin: 0 auto;font-size: 12px;}
#overlay .container .overlayData .tableView.noBorder {border:none;}
#overlay .container .overlayData .tableView.noBorder td {border:none;}
#overlay .container .overlayData .tableView td.hidden{display:none;}
#overlay .container .overlayData .tableView td.titletd{font-size:24px; background:#ededed;}
#overlay .container .overlayData .tableView.leftTable {width:20%; float:left;}
#overlay .container .overlayData .tableView.rightTable {width:78%; float:left;}
#overlay .container .overlayData .tableView.tableData, #overlay .container .overlayData .tableView.tableData td {border:none;}
#overlay .container .overlayData .tableView.rightTable, #overlay .container .overlayData .tableView.rightTable td {border:none;}
#overlay .container .overlayData .scroll{overflow:auto;max-height: 450px; min-height:450px;}
#overlay .container .overlayData .tableView th{width:11.1111%;text-align:center;padding:8px;border: 1px solid #ededed;font-weight:bold;line-height: 18px;}
#overlay .container .overlayData .tableView td{width:11.1111%;text-align:center;padding:7px;border: 1px solid #ededed;line-height: 18px;}
#overlay .container .overlayData .tableView td.topVertical {vertical-align: top;font-weight: bold;padding: 24px;font-size: 24px;cursor:pointer;}
#overlay .container .overlayData .tableView td.topVertical.selected, #overlay .container .overlayData .tableView td.topVertical:hover {background:#dedeee;}
#overlay .container .overlayData .tableView tr.highlightRow {background-color:#fcd202;}
#overlay .container .overlayData .tableView.bold td{font-weight:bold;}
#overlay .container .overlayData #popupListView .popupAddNewPanel {
    margin: 0px 26px 12px 0px;
}
.popupAddNewPanelBottomCenter{margin:32px auto; display:inline-block;}

.overlayNoData {
    font-size: 12px;
    padding: 8px;
}
#overlay .container .overlayPager {padding:0 16px 0 16px;}
#overlay .container .overlayPager .overlayPagerWrapper {width:96%;margin: 0 auto;}
#overlay .container .overlayPager .totalPages{float:left;padding-top: 5px;}
#overlay .container .overlayPager .paging{float:right;}
#overlay .container .overlayPager .paging .pageNo{margin-right:8px;}
#overlay .container .overlayData .bottomButtons div {display: inline-block;padding: 16px 32px;font-size: 16px;background: #dedeee;border-radius: 8px;cursor: pointer;font-weight: bold;}
#overlay .overlaySuccessMessage {padding:24px; font-size:24px;}

#liveData {border-bottom:1px solid #ededed;}
#liveDataStock{width: 96%;margin: 0 auto;font-size: 14px;}
#liveDataStock th{width:20%;text-align: center;padding: 8px;border: 1px solid #ededed;font-weight: bold;line-height: 18px;}
#liveDataStock td {width:20%;text-align: center;padding: 7px;border: 1px solid #ededed;line-height: 18px;}
#stockLevelCube div.title {font-size: 16px;line-height: 16px;margin-bottom: 24px;}
#stockLevelCube div.title span.data {color: #2D2D4F;font-size: 16px;line-height: 16px;}
#stockLevelCube div.stockLevelStatus {font-size: 24px;line-height: 24px;margin-bottom: 24px;}
div.stockLevelStatus.goodStock {color:#62cf73}
div.stockLevelStatus.overStock {color:#FF4136}
div.stockLevelStatus.outOfStock {color:#ff6600}

#liveDataStock .tableView {width:100%;border:1px solid #ededed;margin: 0 auto;font-size: 14px;}
#liveDataStock .scroll{overflow:overlay;max-height: 97px;}
#liveDataStock .tableView th{width:11.1111%;text-align:center;padding:8px;border: 1px solid #ededed;font-weight:bold;line-height: 18px;}
#liveDataStock .tableView td{width:11.1111%;text-align:center;padding:7px;border: 1px solid #ededed;line-height: 18px;}
#liveDataStock .tableView tr.highlightRow {background-color:#fcd202;}

#productRefreshWrapper {display:inline-block;cursor:pointer;}
#productRefreshButton {width:18px;height:18px;border:none;padding:0;margin:0}

#loader{display:none;text-align:center;position: absolute;top: 0;left: 0;width: 100%;height: 100%;z-index: 10;background-color: rgba(0,0,0,0.5);}
#loader .container {margin:0 auto; width:90%;border:1px solid #ededed;margin-top:264px;background: #fff;z-index: 12;}
#loader .container .overlayHeader {padding:16px; position:relative;}
#loader .container .overlayHeader .closeOverlay {position:absolute;right:5px;top:4px;font-weight:bold;font-size:24px;cursor:pointer;line-height: 24px;}
#loader .container .overlayHeader .overlayTitle {display:inline-block;font-weight:bold;font-size:24px;color: #2D2D4F;line-height:24px;}
#loader .container .loaderData {padding:16px;}
#loader .container .loaderData .loaderLoading {padding:40px;font-size:24px;color:#62cf73;}


#failPanel{display:none;text-align:center;position: absolute;top: 0;left: 0;width: 100%;height: 100%;z-index: 10;background-color: rgba(0,0,0,0.5);}
#failPanel .container {margin:0 auto; width:90%;border:1px solid #ededed;margin-top:264px;background: #fff;z-index: 12;}
#failPanel .container .overlayHeader {padding:16px; position:relative;}
#failPanel .container .overlayHeader .closeOverlay {position:absolute;right:5px;top:4px;font-weight:bold;font-size:24px;cursor:pointer;line-height: 24px;}
#failPanel .container .overlayHeader .overlayTitle {display:inline-block;font-weight:bold;font-size:24px;color: #2D2D4F;line-height:24px;}
#failPanel .container .loaderData {padding:16px;}
#failPanel .container .loaderData .loaderLoading img{width:30px;}
#failPanel .container .loaderData .loaderLoading {padding:40px;font-size:24px;color:#62cf73;}
#failPanel .container .loaderData .loaderLoading .finalText{margin-top:24px;}
#failPanel .container .loaderData .loaderLoading .finishButtons{margin-top:24px;display:inline-block;text-align:center;}
#failPanel .container .loaderData .loaderLoading .finishButtons #retry{width:400px;}

#wasteDatesFilter{}
#wasteDateSelector.fixDate {position: relative;background-image: url('../images/calendario.gif');background-repeat: no-repeat;background-position: 8px 9px;background-size: 25px 25px;}
#wasteDateSelector.fixDate span {padding-left:3px;}
#wasteHiddenDates {visibility:visible; position:absolute;left:21px;top:42px;z-index: 1;background: #ededed;padding: 8px;border: 1px solid #d4d4d4;}
#wasteHiddenDates #wasteFromDate, #wasteHiddenDates #wasteToDate {display:inline-block;}
#dateSelectorBottom {text-align:right;}
#wasteDateSelectorBottom #wasteDateApply {text-align: center; margin-top: 8px;display: inline-block;padding: 10px;background: #2D2D4F;color: #fff; cursor:pointer;font-weight: bold; width:158px;border-radius: 5px;}
#wasteDateSelectorBottom #wasteDateClose {display:none;float:left; margin-top:16px;color: #2D2D4F;cursor:pointer;}
#wasteFixDates {display:block;}
#wasteFixDates .fixDate{display:block; width:125px; text-align:center;padding:16px;background: #EEEEEE;color: #2D2D4F; cursor:pointer;}
#wasteFixDates .fixDate.selected {background-color:#2D2D4F;color:#fff;}
#wasteDateSelector .dateInputWrapper {position:relative;padding:8px 0;text-align:left;}
#wasteDateSelector .dateInputWrapper img{position:absolute;width:24px;top:16px;right:0px;}
#wasteDateSelector .dateInputWrapper input {width:145px;}
#wasteFilters {display:none;min-height:470px;background:#EEEEEE;}

#wasteWorseStoreCube, #wasteWorseProductCube, #wasteProductStoresCube, #wasteProductsCube {cursor:pointer;}

#wasteKPICube1 div:first-child {font-size:24px;margin-top:60px;cursor:pointer;}
#wasteKPICube1 div:last-child {font-size:24px;margin-top:64px;cursor:pointer;}

.graphArea .tableView {
    width: 98%;
    border: 1px solid #ededed;
    margin: 0 auto;
    font-size: 12px;
    border-collapse: unset;
}
.graphArea .scroll{overflow:overlay;max-height: 360px;min-height: 360px;}
.graphArea .graphWrapperFull .scroll{max-height: 414px;}
.graphArea .tableView th {
    color: #2D2D4F;
    width: 25%;
    text-align: center;
    padding: 8px;
    border: 1px solid #ededed;
    font-weight: bold;
    line-height: 18px;
    position: sticky;
    top: 0px;
    background-color: #F5F5FF;
    border-top: 1px solid #ededed;
    border-bottom: 1px solid #ededed;
    border-left: 1px solid #ededed;
    z-index: 1;
}
    .graphArea .tableView th:last-child {
        border-right: 1px solid #ededed;
    }
    .graphArea .graphWrapperFull .tableView th.sortable {cursor:pointer;background-image: url('../images/sort.png');background-repeat: no-repeat;background-position: 75% 50%;background-size: 22px 10px;}
.graphArea .tableView th.sortable {cursor:pointer;background-image: url('../images/sort.png');background-repeat: no-repeat;background-position: 105% 50%;background-size: 22px 9px;}
.graphArea .tableView td{width:25%;text-align:center;padding:7px;border: 1px solid #ededed;line-height: 18px;word-break: break-all;}
    .graphArea .tableView td.selected {
        background: #cfffdc
    }
    .graphArea .chartLoading {
        padding: 16px;
        font-size: 14px;
    }

.graphArea .tableView.columns5 th, .graphArea .tableView.columns5 td {width: 20%;}
.graphArea .tableView.columns5 th.sortable {background-position: 103% 50%;background-size: 22px 9px;}

.graphArea .tableView.columns6 th, .graphArea .tableView.columns6 td {width: 15%;}
.graphArea .tableView.columns6 th.sortable {background-position:  101% 50%;background-size: 22px 9px;}

.graphArea .tableView.columns7 th, .graphArea .tableView.columns7 td {width: 12%;}
.graphArea .tableView.columns7 th.sortable {background-position:  100% 50%;background-size: 22px 9px;}

.graphArea .tableView.columns9 th, .graphArea .tableView.columns9 td {width: 10%;}
.graphArea .tableView.columns9 th.sortable {cursor: pointer;background-image: url('../images/sort.png');background-repeat: no-repeat;background-position: 106% 50%;background-size: 22px 9px;}


.graphArea .tableView.columns10 th, .graphArea .tableView.columns10 td {
    width: 10%;
}

    .graphArea .tableView.columns10 th.sortable {
        cursor: pointer;
        background-image: url('../images/sort.png');
        background-repeat: no-repeat;
        background-position: 108% 50%;
        background-size: 22px 9px;
    }

.graphArea .tableView.columns8 th, .graphArea .tableView.columns8 td {width: 12%;}
.graphArea .tableView.columns8 th.sortable {
    cursor: pointer;
    background-image: url('../images/sort.png');
    background-repeat: no-repeat;
    background-position: 105% 50%;
    background-size: 22px 9px;
}

.graphArea .tableView.columns11 th, .graphArea .tableView.columns11 td {
    width: 8%;
}

    .graphArea .tableView.columns11 th.sortable {
        cursor: pointer;
        background-image: url('../images/sort.png');
        background-repeat: no-repeat;
        background-position: 108% 50%;
        background-size: 22px 9px;
    }

#wasteProductProductListWrapper .graphWrapperFull {height:700px;}
#wasteProductProductListWrapper .scroll {max-height:657px;}
.tableView td a{color:#62cf73;}

#alertsListTableHeader th.col1 {width:5% !important;}
#alertsListTableHeader th.col2 {width:8% !important;}
#alertsListTableHeader th.col3 {width:8% !important;}
#alertsListTableHeader th.col4 {width:7% !important;}
#alertsListTableHeader th.col5 {width:37% !important;}
#alertsListTableHeader th.col6 {width:36% !important;}

#alertsListTableData td.col1 {width:5% !important;}
#alertsListTableData td.col2 {width:8% !important;}
#alertsListTableData td.col3 {width:8% !important;}
#alertsListTableData td.col4 {width:7% !important;}
#alertsListTableData td.col5 {width:37% !important;}
#alertsListTableData td.col6 {width:36% !important;}
#alertsListTableData .alertIncrease {color:#FF4136;}
#alertsListTableData .alertItem {color:#2D2D4F;}
.alertTypeTitle {font-size:10px;}

.alertType {}
.alertType_System {display:inline-block;width:20px;height:20px;background-image: url('../images/alertSystem.png');background-repeat: no-repeat;background-position: 0px 0px;background-size: 20px 20px;}
.alertType_Store {display:inline-block;width:20px;height:20px;background-image: url('../images/alertStore.png');background-repeat: no-repeat;background-position: 0px 0px;background-size: 20px 20px;}
.alertType_KPI {display:inline-block;width:20px;height:20px;background-image: url('../images/alertKPI.png');background-repeat: no-repeat;background-position: 0px 0px;background-size: 20px 20px;}
.alertType_Product {display:inline-block;width:20px;height:20px;background-image: url('../images/alertProduct.png');background-repeat: no-repeat;background-position: 0px 0px;background-size: 20px 20px;}
.alertType_Brand {display:inline-block;width:20px;height:20px;background-image: url('../images/alertBrand.png');background-repeat: no-repeat;background-position: 0px 0px;background-size: 20px 20px;}


.graphBoxLeft .graphMask, .graphBoxRight .graphMask {position: absolute;width: 763px;height: 450px;background-image: url('../images/ajax-loader.gif');background-repeat: no-repeat;background-size: 30px 30px;background-position: 370px;}
.graphWrapperFull .graphMask {position: absolute;width: 100%;height: 498px;background-image: url('../images/ajax-loader.gif');background-repeat: no-repeat;background-size: 30px 30px;background-position: 805px;}

.listGroupBy select {
    display: inline-block;
    float: left;
    padding:4px;
    margin-top: -34px;
    margin-left: 126px;
    border-radius:5px;
}
.listGroupBy span {
    display: inline-block;
    float: left;
    margin-top: -28px;
    margin-left: 16px;
    font-size:14px;
}
.listGroupBy input {display: inline-block;float: left;margin-top: -30px;margin-left: 7px;}
.listGroupBy label {display: inline-block;float: left;margin-top: -29px;margin-left:26px;}
.listExport {
    display: inline-block;
    float: right;
    margin-top: -39px;
    cursor: pointer;
    position: relative;
    border-radius: 24px;
    border: 1px solid;
    padding: 8px 16px;
    background: #2D2D4F;
    color: #fff;
}
.listFunctions {display: none;}
.listExportNotification {
    display: none;
    position: absolute;
    max-width: 300px;
    right: 8px;
    padding: 8px;
    top: 17px;
    border-radius: 24px;
    border: 1px solid;
    background: #2D2D4F;
    color: #fff;
    cursor: pointer;
}

.pdfExport {
    display: inline-block;
    float: right;
    margin-top: 7px;
    cursor: pointer;
    position: relative;
    border-radius: 24px;
    border: 1px solid;
    padding: 8px 16px;
    background: #2D2D4F;
    color: #fff;
}

.pdfExportWait {
    display: none;
    position: absolute;
    right: 40px;
    padding: 8px 12px;
    top: 15px;
    border-radius: 24px;
    border: 1px solid;
    background: #2D2D4F;
    color: #fff;
    cursor: pointer;
    width:122px;
}


#totalRows, #totalRowsAll {
    text-transform: capitalize;
    margin: 0 auto;
    display: block;
    width: 300px;
    padding-top: 8px;
}
#totalRows.newLine{padding:0;margin-top:46px;margin-bottom:8px;}
#storesSelectorBottom, #categoriesSelectorBottom {
    text-align: right;
}
    #storesSelectorBottom #storesApply, #categoriesSelectorBottom #categoriesApply, #grindSpeciesSelectorBottom #grindSpeciesApply {
        float: right;
        text-align: right;
        margin-top: 8px;
        display: inline-block;
        padding: 8px;
        background: #2D2D4F;
        color: #fff;
        cursor: pointer;
        font-weight: bold;
    }

    #storesSelectorBottom #storesClose, #categoriesSelectorBottom #categoriesClose, #grindSpeciesSelectorBottom #grindSpeciesClose {
        float: left;
        margin-top: 16px;
        margin-left: 6px;
        color: #fff;
        cursor: pointer;
    }

.ui-widget.ui-widget-content {
    max-height: 350px;
    overflow-y: auto;
    overflow-x: hidden;
}

#content.login #dynamicContent{padding-top:12px;}
#content.login .field{margin-bottom:12px;}
#content.login .field input{height:28px;}
#content.login .field #login {height: 42px;}
#content.login .field #resetPassword {height: 42px;}
    #content.login .field #forgotPasswordBackToLogin {
        height: 42px;
    }
#content.login .field #newPassword {height: 42px;}


.amcharts-amexport-menu-level-0.amcharts-amexport-top{top:-40px !important;}


.field .info {
    display: inline-block;
    position: absolute;
    right: -26px;
    top: 10px;
    border-radius: 50%;
    width: 16px;
    height: 16px;
    padding: 1px;
    background: #2D2D4F;
    border: 1px solid #666;
    color: #fff;
    text-align: center;
    cursor: pointer;
}

    .field .info .infoSign {
        margin-top: 3px;
        display: block;
        font-weight: bold;
    }

    .field .info .infoText {
        position: relative;
        display: none;
        border: 1px solid #2D2D4F;
        padding: 8px;
        color: #2D2D4F;
        width: 180px;
        text-align: left;
        background: #d4cceb;
        position: relative;
        z-index: 1;
        top: -16px;
        line-height: 14px;
        left: 22px;
        border-left: 6px solid #2D2D4F;
    }
#tableSearcher, #tableSearcherAll {
    width: 260px;
    height: 16px;
    margin-left: 12px;
    float: left;
}
.highNonWaste {
    color: #FF8156 !important;
    
}
.viewGrindLog{text-decoration:underline;cursor:pointer;}
.grindLogWinWrapper {
    margin: 0 auto;
}
.grindLogWin {
    min-height: 300px;
    max-height: 400px;
    overflow: auto;
    display: inline-block;
}
.grindLogWin div.section {
    margin-right: 64px;
    max-height:220px;
}
.grindLogWin div.data {
    padding: 14px;
    display:block;
    text-align:left;
}
.grindLogWin div.data span {
    font-weight: bold;
    color: #2D2D4F;
    display: block;
    max-width: 250px;
    word-break: initial;
    margin-top:4px;
}
.grindBatch {
    color: #2D2D4F;
    font-weight:bold;
    padding:14px 14px 14px 0px;
    text-align:left;
}
.grindBatch div{
    padding:4px;
}
.grindBox {
    padding: 8px;
    border: 1px dashed #787878;
    margin-bottom:8px;
}
.grindBox div {
    padding: 4px;
    text-align:left;
}

.grindBox div span {
    font-weight: bold;
    color: #2D2D4F;
    max-width: 250px;
    word-break: initial;
}

.tableLink {
    text-decoration: underline;
    cursor: pointer;
    color: #5A64D8;
}

#adminPanel {
    margin: -40px 16px;
}
.adminPanelPage{margin-top:0px;}

.adminPanelGroup {
    width: 500px;
    margin-bottom:24px;
}

.adminPanelGroupTitle {
    padding: 8px 16px;
    font-size: 14px;
    margin-bottom: 8px;
    text-align: left;
}

.adminPanelGroupMenu {
    border: 1px solid #ededed;
    border-radius: 16px;
    text-align: left;
}

.adminPanelGroupMenuItem {
    font-size: 15px;
    color: #000;
    padding: 16px;
    border-bottom: 1px solid #ededed;
    cursor:pointer;
}

.adminPanelGroupMenuItem.lastItem {
    border-bottom: none;
}

#tableSearcherWithPaging {
    width: 150px;
    height: 16px;
    margin-left: 12px;
    float: left;
}


.tableAddNewButton {
    min-width: 64px;
    display: inline-block;
    padding: 5px 12px;
    border-radius: 5px;
    cursor: pointer;
    background: #fff;
    position: relative;
    float: right;
    margin-right: 12px;
    color: #000;
    border: 1px dashed #000;
    top:1px;
}

#tableViewPagerTop {
    margin: 24px;
}
.tableViewPagerBottom {
    margin: 16px 0px;
}
#tableViewPagerTitle{margin:8px;}
.tableViewPagerPage {
    padding: 2px 4px;
    margin: 4px;
    cursor: pointer;
    font-size: 12px;
    
    cursor:pointer;
}
.tableViewPagerPage.currentPage {
    background: #5A64D8;
    color: #fff;
    border-radius: 4px;
    font-weight: bold;
}

.userPanelEditUser {
    text-align: left;
    margin: 0 32px 0 32px;
    position:relative;
}
.editUserTitleWrapper {
    margin-bottom: 36px;
    display: inline-block;
    line-height: 18px;
}
.formButtons {
    position: fixed;
    top: 84px;
    right: 68px;
}

.editUserTitle {
    font-size: 24px;
    color: #000;
    line-height: 18px;
    display: inline-block;
    padding-top: 6px;
}
.editUserFullName {
    font-size: 24px;
    color: #5A64D8;
    margin-left: 8px;
    text-transform:capitalize;
}
.userPanelEditUserWrapper {
    margin-left: 42px;
}
.editUserGroup {
    margin-top: 32px;
    
}
.editUserInnerGroup {
    border: 1px solid #dedede;
    margin-top: 12px;
    border-radius: 5px;
    width:585px;
}
    .editUserInnerGroup .editUserFieldDoubleWide, .editUserInnerGroup .editUserFieldHalfWidth {
        padding: 12px;
    }
.editUserGroupTitle {
    font-size: 14px;
    font-weight: bold;
    color: #000;
    margin-bottom: 0px;
}
.importantNote {
    line-height: 16px;
    padding: 4px;
    background: #FF8156;
    color: #fff;
    border-radius: 5px;
    display: none;
    margin-top: 12px;
}
.editUserField {
    display: inline-block;
    margin-right: 32px;
    margin-bottom: 12px;
    margin-top: 24px;
    width: 280px;
    position: relative;
}
.editUserField.noMargin {
    margin-top: 0px;
    margin-bottom:0px;
}
    .editUserFieldDoubleWide
    {
        width:560px;
    }
        .editUserFieldDoubleWide.noMargin {
            margin-top: 0px;
            margin-bottom: 0px;
        }
.editUserFieldHalfWidth {
    width: 140px;
}
.editUserFieldOverTwoSmallFields {
    width: 310px;
}
input.OverTwoFields{width:297px;}
.editUserFieldTitle {
    display: block;
    margin-bottom: 8px;
    color: #000;
}
.editUserNote{padding:8px 0px;display:block;line-height:16px;}
.usersButton {
    display: inline-block;
    padding: 8px;
    border-radius: 5px;
    background: #5A64D8;
    color: #fff;
    cursor: pointer;
    text-align: center;
    min-width: 100px;
    height: 16px;
    position:relative;
}
.usersButton.disabled {
    background: #d4d4d4;
    color: #000;
    cursor:not-allowed;
}
.usersButton.opposite {
    background: #fff;
    color: #5A64D8;
    border: 1px solid #5A64D8;
    margin-right:16px;
}
.usersButton span {
    display: inline-block;
    line-height: 16px;
}

.usersButtonSmall {
    padding: 4.5px;
    min-width: 70px;
    top: 1px;
    margin-left:8px;
}

.userSelect {
    display: inline-block;
    border-radius: 5px;
    border: 1px solid #dedede;
    width: 250px;
    height: 34px;
    color: #787878;
}
.userSelect.disabled{
    background:#d4d4d4;
}
.userSelect.small {
    width: 100px;
    height: 26px;
    margin-left: 8px;
    position: relative;
    font-size:12px;
}

.editUserErrorMessage {
    display: none;
    margin: 8px 0;
    color: #FF8156;
}

.editUserErrorMessage.leftAlign {
    margin-top: 16px;
    text-align:left;
}

.editUserErrorMessage.errorSuccess {
    color: #000;
    background: #cfffdc;
    padding: 8px;
}

.editUserBack {
    display: block;
    font-size: 18px;
    font-weight: bold;
    color: #000;
    position: absolute;
    top: 4px;
    left: 12px;
    cursor: pointer;
}
#editUserStoresList {
    max-height: 250px;
    /*min-height: 325px;*/
    padding: 8px 0px;
    overflow: auto;
    width:253px;
    margin-top:4px;
}
#assignedStoresTitle b{
    text-decoration:underline;
    cursor:pointer;
}
#editUserSearchStores{width:253px;}
.adminPanelPage ul {
    border: 1px solid #ededed;
}
.adminPanelPage li {
    padding: 12px 4px;
    color: #000;
    position: relative;
    border-bottom: 1px solid #ededed;
    cursor: pointer;
    line-height: 16px;
}
    .adminPanelPage li:last-child{border:none;}

    .adminPanelPage li.title {
        padding-top: 16px;
    }

.adminPanelPage li label {
    position: relative;
    top: 1px;
    padding-left: 8px;
    float: left;
    display: inline-block;
    width: 140px;
    line-height: 16px;
}
.adminPanelPage li input {
    float: left;
    position:relative;
    top:3px;
}

.adminPanelPage li.title div {
    text-align: center;
    position: relative;
    font-weight: bold;
}
.adminPanelPage li.title span.closePopup {
    font-size: 8px;
    position: absolute;
    right: 1px;
    top: 2px;
    display: inline-block;
    background: #FF8156;
    cursor: pointer;
    font-weight: bold;
    padding: 1px 3px;
    color: #fff;
    border-radius: 5px;
}

.editUserGeneralMessage {
    float: right;
    display: none;
    padding: 10px 8px;
    text-align: center;
    width: 300px;
    height: 13px;
    border-radius: 5PX;
}

.editUserGeneralMessage.success {
    display: block;
    background: #cfffdc;
    color: #000;
}

.editUserGeneralMessage.fail {
    display: block;
    background: #FF8156;
    color: #fff;
}

.userListWait {
    display: none;
    font-size: 32px;
    color: #5A64D8;
    position: relative;
    bottom: 3px;
    line-height:3px;
    text-decoration:none;
}
#editUserGeneratePassword{margin-top:8px;}
#editUserResetPasswordWaiter{display:none;}

.adminPageHeader {
    margin: 0 0 24px 12px;
    text-align: left;
}
.adminPageBack {
    display: block;
    font-size: 18px;
    font-weight: bold;
    color: #000;
    top: 8px;
    cursor: pointer;
    margin-top: 2px;
    float:left;
}
.adminPageTitle {
    float: left;
    font-size: 24px;
    color: #000;
    line-height: 18px;
    margin-left: 8px;
}

.editUserStoreRoles {
    display:none;
    background: #5A64D8;
    float: right;
    position: relative;
    bottom: 0;
    right: 2px;
    font-weight: bold;
    color: #fff;
    padding: 4px;
    border-radius: 5px;
    cursor: pointer;
}
.editUserStoreRolesPopup {
    position: absolute;
    right: 180px;
    overflow: auto;
    display: none;
    max-height: 200px;
    min-height: 100px;
    width: 200px;
    border: 1px solid #dedede;
    border-radius:5px;
}
.editUserRole {display:inline-block;padding:8px;}

#storesList .editStore {
    text-decoration: underline;
    cursor: pointer;
    color: #5A64D8;
}
#editStoreImageWrapper {
    display: inline-block;
    position: absolute;
    left: 135px;
}
#editStoreImage {
    display: inline;
    width: 60px;
    height: 60px;
    float: left;
}
#editStoreImageDelete, #editProductImageDelete {
    position: absolute;
    padding: 4px;
    display: inline-block;
    float: left;
    min-width: 32px;
    line-height: 16px;
    margin-left: 16px;
}
#editProductPriceNote{display:none;}

.storeOpening input[type="checkbox"] {
    position: relative;
    top: 2px;
}
.storeOpening label {
    color: #000;
    padding-left: 2px;
    padding-right: 8px;
    display: inline-block;
    width: 100px;
}
.storeOpening span {
    margin: 0 2px 0 2px;
}
.storeOpening select {
    width: 50px;
    height: 25px;
}

#placesWrapper {
    width: 250px;
    max-height: 155px;
    overflow: auto;
}
#editStoreMap {
    width: 254px;
    height: 180px;
    position: relative;
    overflow: hidden;
    position: absolute;
    top: 20px;
}

#popupListWrapper {
    max-height: 410px;
    overflow: auto;
}
#popupEditView .adminPanelForm {
    height: 380px;
    overflow: auto;
}
#popupEditView .adminPanelForm.fullHeight {
    overflow: auto;
}
#popupEditView {
    margin: 0 16px 0 16px;
}
#popupEditView .popupBack {
    display: block;
    font-size: 18px;
    font-weight: bold;
    color: #000;
    position: absolute;
    top: 4px;
    left: 12px;
    cursor: pointer;
}
#popupEditView .editUserGroup {margin-top:20px;}

#popupEditView .editUserTitleWrapper {margin-bottom:24px;}
#popupEditView .editUserGroupTitle {
    margin-bottom: 8px;
}
#popupEditView .editUserField {
    margin-bottom: 4px;
}

#popupEditView .formButtons {
    position: relative;
    top: 0;
    right: 0;
    float: right;
}

#popupEditView .editUserTitle{font-size:16px;}

#popupEditView .usersButton {
    height: 12px;
    padding: 8px;
    min-width:90px;
}
#popupEditView .usersButton span{line-height:10px;}
#popupEditView .editUserGeneralMessage{width:230px;}

#popupEditView #editGrinderPartsList {
    display:none;
    width: 500px;
    border: 1px solid #dedede;
    margin-top: 24px;
    border-radius: 5px;
    min-height: 20px;
    padding: 4px;
}
    #popupEditView #editGrinderPartsList div.usersButton {
        position: relative;
        float: left;
        min-width: 42px;
        cursor: default;
        height: 8px;
        margin: 4px;
        background: #B6B6FF;
        color: #000;
        padding-right:16px;
    }
#popupEditView #editGrinderPartsList div.usersButton span {
    line-height: 12px;
    position: relative;
    bottom: 3px;
}
#popupEditView #editGrinderPartsList div.delete {
    display: inline-block;
    position: absolute;
    right: 4px;
    top: 5px;
    font-size: 12px;
    font-weight: bold;
    cursor: pointer;
    line-height: 12px;
}

.popupSearcherWrapper {
    width: 96%;
    display: inline-block;
}

.tableSearcherButton {
    float: left;
    margin-left: 8px;
    height: 25px;
    margin-left: 8px;
    display: inline-block;
    border-radius: 5px;
    background: #5A64D8;
    color: #fff;
    cursor: pointer;
    padding: 0;
    position: relative;
    top: 0px;
}

.tableSearcherButton span {
    position: relative;
    top: 4px;
}
.productPriceChangesLogWin {
    min-height: 100px;
    max-height: 400px;
    overflow: auto;
    display: inline-block;
    width: 100%;
    margin-top:12px;
}
.innerTableView{
    width:100% !important;
}
.innerTableView tbody tr th {
    padding: 4px !important;
}

.editProductDiscountCalculation{
    display:block;
    margin-top:12px;
}