:root {
    /*colors -> primary, secondary and accent*/
    --p-color: #bf1e2e; /*primary*/
    --s-color: #393939; /*secondary*/
    --t-color: #969696; /*tertiary*/
    --a-color: #393939; /*accent*/
    --e-color:#c8102e; /*error*/
    --ea-color: #ab2121; /*error accent*/
    --g-color:#c4d600; /*good/correct*/
    --ga-color: #167107; /*good/correct accent*/
    /*///////////////////DASHBOARD/////////////////////*/
    /*header heights*/
    --head--db-h: 180px; /*header height*/
    --head--db-ph: 80px; /*primary header height*/
    --head--db-sh: 100px; /*secondary header height*/
    --head--db-m-h: 160px; /*header height*/
    --head--db-m-ph: 60px; /*primary header height*/
    --head--db-m-sh: 100px; /*secondary header height*/
    --head--db-th: 50px; /*tertiary header height*/
    /*header colors*/
    --head--db-pc: #ffffff; /*primary header color*/
    --head--db-pca: #ffffff; /*primary header color*/
    --head--db-pmc: #ffffff; /*primary menu header color*/
    --head--db-pmca: #ffffff; /*primary menu header color*/
    --head--db-sc: var(--s--db-color); /*secondary header color*/
    --head--db-tc: var(--t-color); /*tertiary header color*/
}
#loading {background-size: 150px;}
/*Dashbaord Navigation*/
#navbar.dashboard {height:var(--head--db-m-h);}
#nav-wrapper.dashboard {max-width:100%;padding:0;margin:0;}
#nav-wrapper.nav-primary.dashboard {position:relative;display:block;width:100%;margin:0 auto;height:var(--head--db-m-ph);padding:0;background-color:var(--head--db-pc);z-index:100;}
#nav-wrapper.nav-primary.dashboard.maxed {max-width:var(--inner-max);}
#nav-location.dashboard {color:var(--db--temp);padding: var(--p-e);font-family: var(--font-r),arial narrow, arial;letter-spacing: .05em;padding-top: 11px;}
#nav-user.dashboard {padding-right:var(--p-p);margin-right:var(--p-p)}
#nav-user.dashboard span {display:block;text-align:right;font-size: var(--f-3);color: var(--txt-sub-color);padding: var(--p-s) 0 0 0;}
#nav-user.dashboard span.padded-s {margin:var(--p-s) 0}
#nav-user.dashboard span.padded-p {margin:var(--p-mp) 0}
#nav-user.dashboard span.company {font-size:12px;}
#nav-nav.dashboard {height:var(--head--db-m-ph);}
#nav-nav.dashboard .icon img {display:block;float:right;height:var(--head--db-m-ph);padding:19px var(--p-mp) 19px 0px;margin:0;}
#nav-nav.dashboard .icon.menu img {padding:17px 0 17px var(--p-mp);}
#nav-nav.dashboard .icon.left img {padding-right:12px;}
#nav-nav.dashboard .icon.right img {padding-left:12px;}
#nav-image.dashboard {position:absolute;height:30px;width:200px;top:25px;left:50%;margin-left:-100px;}
.nav-account span.user-name {display:block;float:right;font-size: 18px;color: #072c4c;padding: 28px 3px;}


/*DASHBOARD NAVIGATION SECONDARY*/
#nav-secondary.dashboard {position:relative;display:block;width:100%;height:var(--head--db-m-sh);background-color:var(--head--db-sc);z-index:99;}
#nav-apps {position:absolute;left:0;right:0;top:0;bottom:0;width:auto;max-width:var(--inner-max);margin:0 auto;overflow-x:hidden;overflow-y:hidden;}
#nav-apps-inner {position:relative;height:100%;width:auto;min-width:100%;text-align:center;white-space:nowrap;padding:0 var(--p-mp);float:left;}
#nav-apps div.menu-circle {border-radius:50%;}
#nav-apps .menu-circle a {z-index:500;cursor:pointer;}
.menu-circle {position:relative;display:inline-block;width:50px;height:50px;margin:25px 7px; background-color:var(--p-color);background-image: url('');background-repeat: no-repeat;background-position: center;background-size: 24px;}
.menu-circle.grey {background-color:#838383;}
.menu-circle.add {background-color:transparent;border:1px solid #fff;}
.menu-circle.active::before {transform: translateX(-50%);border-radius: 100%;position: absolute;background: var(--p-color);top: 63px;height: 4px;content: '';width: 4px;left: 50%;}


/*DASHBOARD NAVIGATION TERTIARY*/
#nav-tertiary.dashbaord {position:relative;display:block;width:100%;height:var(--head--db-th);background-color:var(--head--db-tc);-webkit-transition: all .3s ease;-moz-transition: all .3s ease;-o-transition: all .3s ease;}
#nav-tert-inner {position:relative;display:block;width:100%;max-width:var(--inner-max);margin:0 auto; padding: 0 var(--p-mp);}
#nav-tert-title {position:relative;display:block;float:left;color:var(--txt-color);font-family:var(--font-h);font-size:19px;padding:15.5px 0;}


/*DASHBOARD NAVIGATION SCROLLBAR*/
#page-content #nav-secondary ::-webkit-scrollbar {width: 5px; height:5px;}
/* Track */
#page-content #nav-secondary ::-webkit-scrollbar-track {background: var(--head--db-pc);}
/* Handle */
#page-content #nav-secondary ::-webkit-scrollbar-thumb {background: var(--head--db-sc);}
/* Handle on hover */
#page-content #nav-secondary ::-webkit-scrollbar-thumb:hover {background: var(--head--db-sc);}
#secondary-scroll {position:absolute;bottom:-2px;left:0;right:0;height:0;width:100%;background-color:var(--p-color);overflow:hidden}
#secondary-scrollbar {position:relative;float:left;height:5px;width:200px;background-color:var(--head--db-sc);}

@media only screen and (min-width: 570px) {
    #nav-primary.dashboard {height:var(--head--db-ph);}
    #nav-secondary.dashboard {height:var(--head--db-sh);}
    #nav-location.dashboard {padding-top: 17px;}
    #nav-buttons div {padding:var(--p-s);}
    #nav-buttons {padding:var(--p-p)}
}
@media only screen and (min-width: 700px) {
    #nav-nav.dashboard {height:var(--head--db-ph);}
    #navbar.dashboard {height:var(--head--db-h);}
    #nav-wrapper.nav-primary.dashboard {height:var(--head--db-ph);}
    #nav-wrapper.nav-primary.dashboard {height:var(--head--db-ph);}
    #nav-nav.dashboard .icon img {height:var(--head--db-ph);padding:29px var(--p-mp) 29px 0px;}
    #nav-nav.dashboard .icon.menu img {height:var(--head--db-ph);padding:27px 0 27px var(--p-mp);}
}