﻿
@charset "UTF-8";
/*----- Web Solutions 3.0 Compatible -----*/



* {margin:0;padding:0;border:0;outline:none;box-sizing: border-box;-webkit-text-size-adjust:none;}
ul li{list-style:none}
html, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, font, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, hr{font-family:inherit; font-size:inherit; font-style:inherit; font-weight:inherit}
table {border-collapse:collapse}
td {vertical-align:top}


/*----- CORE ELEMENTS -----*/
#mainBodyLogin{background:url(../images/login_bg.png) repeat 0 0}
#mainBody{/*background:url(../images/bg.gif) repeat 0 0*/background:#fff url(../images/body_bg.png) repeat-y 0 0}
#mainBody.full{background:#fff}
#loginContainer{width:353px;height:370px;margin:-160px 0 0 -176px;position:absolute;top:50%;left:50%}
.clearFloats {clear:both}
.nobr { white-space: nowrap}
td {empty-cells:show;}
.even{}
.odd{background:#efefef}

/*----- Text Styles -----*/
body, .text, input, textarea{font-family:Helvetica, Helvetica Neue, Arial, sans-serif}
body, .text{font-size:14px;line-height:1.4em;color:#808184;font-style:normal}
body, .text, th{text-align:left}

a:link, a:visited{color: #688f3c;text-decoration:none;-webkit-transition: all 200ms linear;transition: all 200ms linear}
a:hover, a:active{color:#a43538}

p, h1, h2, h3, h4, hr, #content ul, .contentEditor ul, blockquote, dd{margin-bottom:15px}
h1, h2, h3, h4, h5, h6, h7, h8, h9, th{font-weight:300}
h1, h2, h3, h4, h5, h6, h7, h8, h9, th, dt, b, strong{color:#000; font-weight:300}
.textColor{color:#688f3c}
em, i{font-style: italic}
u { text-decoration:none}
hr, .borderTop, dt{border-top:1px solid #ccc;margin-top:10px;padding-top:5px;clear:both}
hr{height:0px;margin:30px 0 20px}
p{font-size:1em}
h1{font-size:1.6em;margin-bottom:25px; line-height:1.15em}
h2{font-size:1.3em;clear:left;line-height:1.15em}
p+h2, ul+h2, ol+h2, p+h3, ul+h3, ol+h3{margin-top:35px}
h3{font-size:1.2em;clear:left;margin-bottom:7px}
h4, th{font-size:1.15em}
p+h4, ul+h4{margin-top:25px}
h4+ul{margin-top:-10px}
h5, h6, h7, h8, h9{font-size:1.1em;margin:0px 0px 0px 0px}
sup, sub { font-size:.6em; line-height:.6em;vertical-align:baseline;position:relative}
sup {bottom:1ex}
sub {top:.5ex}

/*----- Forms -----*/
input[type=submit]{font-size:1em;line-height:1em}
#contentCol.vehicle-wrap input[type=submit] {line-height:1.4em; padding: 10px 15px}
input[type=submit], a.formButton.bulky, label.formButton.bulky, button.formButton.bulky{background:#a43538; -webkit-appearance:none; appearance:none; color:#fff;float:left;padding:6px 15px 4px 7px;border-radius:8px;display:block;box-shadow: inset 0px -1px 0px rgba(0,0,0,0.4);text-shadow: 1px -1px 0 rgba(0,0,0,0.4)}
input[type=submit], a.formButton.bulky{padding:6px 15px 6px 15px;}
input[type=text], input[type=password], input[type=email], input[type=phone], input[type=number], input[type=date], textarea{border:1px solid #cccdce;font-size:1em;color:#666;padding:4px 5px;background:url(../images/formBG.png) repeat-x 0 0}
input[type=text]:focus, input[type=email]:focus, input[type=phone]:focus{background:#FFFFCC}
input#filter[type=text]:focus, input#filter[type=email]:focus, input#filter[type=phone]:focus{background:#ffffff}
a#ReSort span{background-position:-54px -386px}
a#ViewRoute span{background-position:-54px -64px}
a#Reverse span{background-position:-54px -386px}
a#UpdateOrder span{background-position:-54px -421px}
a.formButton.bulky span{width:16px;height:16px;background-position:-54px -240px;float:left;margin-right:7px}
a.formButton.bulky.right{float:right}
a.formButton.bulky span.print{background-position:-54px -405px}
input[type=submit]:hover, label.formButton.bulky:hover, input[type=submit]:active, input[type=button]:hover, input[type=button]:active, a.formButton.bulky:hover, a.formButton.bulky:active{background:#688f3c;cursor:pointer;-webkit-transition: all 200ms linear;transition: all 200ms linear}
label.formButton.bulky{padding: 4px 7px}
a.formButton.bulky.small {padding:2px 4px;}

input[disabled='disabled'] { opacity:.50; cursor:default;}

/*----- HEADER -----*/
header{position:fixed;z-index:9000;width:100%;height:42px;left:0;top:0;background:url(/images/top_bg.png) repeat-x center top}
.complete, .completeBottom span{width:48px;height:48px;position:absolute;right:10px;top:17px;padding:5px 5px 5px 6px;float:right;background:#97181c;border:3px solid #fff;border-radius: 8px;display:block;box-shadow: inset 0px -1px 0px rgba(0,0,0,0.4);}
.complete.green, .completeBottom.green span{background-color:#519031}
.complete.gray, .completeBottom.gray span{background-color:#cccccc}
.complete.gray span, .completeBottom.gray span span{filter: alpha(opacity=60); opacity: 0.6;}
.completeBottom span{float:left;margin:-10px 10px 0 0}
.complete span, .completeBottom span span{width:30px;height:30px;display:block;overflow:hidden;background-repeat:no-repeat;background-position:0 -30px}
.completeBottom span span{border:0;box-shadow:none;float:none;margin:0}
.completeBottom{float:left;float:left;margin:20px 0 20px 25px;font-size:1.3em;padding-top:12px}
.completeBottom span{position:static;}
#mainBodyLogin #brand{width:353px;height:88px;margin-bottom:140px;background:url(../images/bioserv_login.png) no-repeat 0 0}
#mainBody #brand{width:148px;height:42px; background-image: url(../images/bioserv.svg), linear-gradient(180deg, #FFFFFF 73%, #E8E8E8 100%); background-repeat: no-repeat; background-position: center;}
#complete{width:48px;height:48px;background:#a5383b;border:3px solid #a5383b;}

.incompleteBottom span{width:48px;height:48px;position:absolute;right:10px;top:17px;padding:5px 5px 5px 6px;float:right;background:#97181c;border:3px solid #fff;border-radius: 8px;display:block;box-shadow: inset 0px -1px 0px rgba(0,0,0,0.4);}
.incompleteBottom.green span{background-color:#519031}
.incompleteBottom.gray span{background-color:#cccccc}
.incompleteBottom.gray span span{filter: alpha(opacity=60); opacity: 0.6;}
.incompleteBottom span{float:left;margin:-10px 10px 0 0}
.incompleteBottom span span{width:30px;height:30px;display:block;overflow:hidden;background-image: url("/images/icons/icon_sprites.png");background-repeat:no-repeat;background-position:0 -30px}
.incompleteBottom span span{border:0;box-shadow:none;float:none;margin:0}
.incompleteBottom{float:left;float:left;margin:20px 0 20px 25px;font-size:1.3em;padding-top:12px}
.incompleteBottom span{position:static;}

#sidenav ul li.on a span, .login span, .greenButton em, .complete span, .completeBottom span span, #summary ul li span, #topBar ul li span, #notes ul li span, .mIcon span.greenCheck, .mIcon span.redCheck, .mIcon span.arwDwn, .mIcon span.arwUp, .plus, .mIcon span, .searchBTN span, a.formButton.bulky span, .leftSearch span, #topBar #summary div+div a span, #topBar a.editBTN span, #topBar #summary div+div+div span, .manage th span, #tabs span, .icon{background-image:url(../images/icons/icon_sprites.png);background-repeat:no-repeat;display:block}


#t1 {width:calc(100% - 148px);min-width:750px;position:absolute;left:148px;top:0px;height:42px}
#t1 > ul {box-sizing: border-box; display: flex; overflow: auto;}
#t1 > ul * {box-sizing: border-box;}
#t1 li{position: relative; float:left;-webkit-text-size-adjust: none;border-right: 1px solid rgba(0, 0, 0, .1); font-size:16px}
#t1 li a {padding: 0 16px; font-size: 14px; transition:ease all 100ms; height: 42px; min-width:60px; border-right: 1px solid rgba(255, 255, 255, .2);display: flex;flex-direction: row;flex-wrap: nowrap;-webkit-justify-content: center;-ms-flex-pack: center;justify-content: center;align-content: center;align-items: center;}
#t1 li a:hover {background:#2d5c0e;}
#t1 li.on a {background:#23480A; color:#fff; border-top:0}
#t1 li a span {opacity:0.85; height: 42px; padding-top: 5px; display: flex; flex-direction: row; flex-wrap: nowrap; -webkit-justify-content: center; -ms-flex-pack: center; justify-content: center; align-content: center;  align-items: center;}
#t1 li a:hover span {opacity:1}
#t1 li.on a span{opacity:1; margin-right:7px}
	#t1 li.dashboard a span:before {content:url(../images/navigation/dashboard.svg)}
	#t1 li.sales a span:before {content:url(../images/navigation/sales-tracking.svg)}
	#t1 li.clients a span:before {content:url(../images/navigation/clients.svg)}
	#t1 li.schedules a span:before {content:url(../images/navigation/schedules.svg)}
	#t1 li.accounting a span:before {content:url(../images/navigation/accounting.svg)}
	#t1 li.management a span:before {content:url(../images/navigation/management.svg)}
	#t1 li.routes a span:before {content:url(../images/navigation/route.svg)}
	#t1 li.todo a span:before {content:url(../images/navigation/events.svg)}
	#t1 li.logout a span:before {content:url(../images/navigation/logout.svg)}
	#t1 li.reports a span:before {content:url(../images/navigation/reports.svg)}
	#t1 li.calendar a span:before {content:url(../images/navigation/weekly-schedules.svg)}
	#t1 li.renewal a span:before {content:url(../images/navigation/renewals.svg)}
	#t1 li.incomplete a span:before {content:url(../images/navigation/incomplete.svg)}
	#t1 li.sds a span:before {content:url(../images/navigation/sds.svg)}
	#t1 li.compliance a span:before {content:url(../images/navigation/tracking.svg)}
	#t1 li.dotLogs a span:before {content:url(../images/navigation/dot-logs.svg)}
	#t1 li.driverNotes a span:before {content:url(../images/navigation/driver-notes.svg)}
	#t1 li.inventory a span:before {content:url(../images/navigation/inventory.svg)}
	#t1 li.manual a span:before {content:url(../images/navigation/employee-manual.svg)}
	#t1 li.transfer-station a span:before {content:url(../images/navigation/transfer-station.svg)}
	#t1 li.vehicles a span:before {content:url(../images/navigation/vehicles.svg)}

#t1 li .counter {position: absolute; text-shadow: 0px 2px 0px #621f21; color: #fff; bottom: 1px; right: 1px; font-size: 10px; padding: 0 4px; background: #A43538; border-radius: 3px 0 0 0; line-height: 16px;}


/*----- Left Column -----*/
#leftCol{width:202px;padding-top:10px;margin-top:42px;z-index:900;position:absolute;left:0;top:0;float:left}
#sidenav{width:200px;overflow:hidden;border-top:1px solid #cccdce}
#sidenav li{display:inline}
#sidenav ul{margin-bottom:40px;}
#sidenav ul li a{width:200px;padding:4px 15px;text-decoration:none;color:#666;display:block;background:#e9e9e9 url(../images/shadow.png) repeat-y right top;font-size:.84em;line-height:1.2em;border-top:1px solid #f4f4f4;border-bottom:1px solid #cccdce}
#sidenav ul li a:hover, #sidenav li a:active{background:#b4b4b4 url(../images/shadow.png) repeat-y right top;color:#fff}
#sidenav ul li.onGray a{color:#97181c;background:#b4b4b4 url(../images/navigation/texture_overlay.png) no-repeat 0 0;text-shadow: 1px -1px 0 #ccc;border-top:0;border-bottom:1px solid #9a9a9a}

/* t2 */
#sidenav .over a{border:2px dotted #97181c;padding:3px 13px}
#sidenav a{-webkit-transition-property: background-color,background,color;-moz-transition-property: background-color,background,color}
#sidenav ul li a, #sidenav ul li>span{width:200px;padding:4px 15px;text-decoration:none;color:#000;display:block;border-top:1px solid #f4f4f4;border-bottom:1px solid #cccdce;background:url(../images/navigation/texture_overlay.png) no-repeat 0 0, url(../images/shadow.png) repeat-y right top, #fff;font-size:.84em;line-height:1.2em}
#sidenav ul li a span, #sidenav ul li>span span{width:16px;height:16px;overflow:hidden;float:right;background-repeat:no-repeat;margin-top:-2px;margin-right:-5px;filter: alpha(opacity=70); opacity: 0.7;}
#sidenav ul li a span.value, #sidenav ul li>span span.value{width:auto;height:auto; font-size:1em; overflow:visible;background-color:#b3b3b5;background-image:none;margin-top:-1px;margin-right:-12px;padding:3px 3px 1px;line-height:1em;filter:alpha(opacity=100);opacity:1;font-weight:bold;color:#fff;border-radius: 3px;display:block;box-shadow: inset 0px 1px 0px rgba(0,0,0,0.4), 0px 1px 0px rgba(255,255,255,1);
	-webkit-text-shadow: 0px 1px 0 rgba(0,0,0,0.4);-moz-text-shadow: 0px 1px 0px rgba(0,0,0,0.4);text-shadow: 0px 1px 0px rgba(0,0,0,0.4);
}
#sidenav ul li a:hover span.value{background-color: #666}
#sidenav ul li a span.route{background-position:-54px 0}
#sidenav ul li a span.location{background-position:-54px -16px}
#sidenav ul li a span.completed{background-position:-54px -32px}
#sidenav ul li a span.company{background-position:-54px -48px}

#sidenav h3 {margin:0; padding:0 0 0 15px;}

/* t3 */
#sidenav ul li ul{margin-bottom:0}
#sidenav ul li ul li a{width:200px;padding:4px 15px;text-decoration:none;color:#666;display:block;background:#e9e9e9 url(../images/shadow.png) repeat-y right top;text-shadow:none}
#sidenav ul li ul li a:hover, #sidenav li ul li a:active{background:#b4b4b4 url(../images/shadow.png) repeat-y right top;color:#fff}
#sidenav ul li ul li.on a{color:#97181c;background:#b4b4b4 url(../images/navigation/texture_overlay.png) no-repeat 0 0;text-shadow: 1px -1px 0 #ccc;border-top:0;border-bottom:1px solid #9a9a9a}
#sidenav ul li ul li.on a span.location{background-position:-54px -80px}
#sidenav ul li ul li a span.value,#sidenav ul li ul li a:hover span.value{ color:#999a9d; background:none;box-shadow: none;
	-webkit-text-shadow: 0px 1px 0px rgba(255,255,255,1);-moz-text-shadow: 0px 1px 0px rgba(255,255,255,1);text-shadow: 0px 1px 0px rgba(255,255,255,1);
}
#sidenav ul li ul li a:hover span.value{color:#333;
	-webkit-text-shadow: 0px 1px 0px rgba(255,255,255,.6);-moz-text-shadow: 0px 1px 0px rgba(255,255,255,.6);text-shadow: 0px 1px 0px rgba(255,255,255,.6);
}
#sidenav ul li ul li.on a span.value{color:#fff;
	-webkit-text-shadow: 0px 1px 0px rgba(0,0,0,.4);-moz-text-shadow: 0px 1px 0px rgba(0,0,0,.4);text-shadow: 0px 1px 0px rgba(0,0,0,.4);
}

/* t4 */
#sidenav ul li ul li.on ul li a{width:200px;padding:4px 15px 4px 25px;text-decoration:none;color:#000;display:block;background:#b4b4b4;border-top:1px solid #dbdbdb;border-bottom:1px solid #9a9a9a;}
#sidenav ul li ul li.on ul li a:hover, #sidenav li ul li.on ul li a:active{color:#97181c;background:#fff;text-shadow:none}
#sidenav ul li ul li.on ul li.on a{color:#97181c;background:#fff;background:#fff;text-shadow:none}

#sidenav ul + ul{border-top:1px solid #cccdce}



/*----- Content -----*/
#contentBkg{background:#fff; height:auto}
#contentCol{width:100%;min-width:1000px;min-height:500px;margin-top:42px;position:absolute;left:0;top:0;padding-left:201px;/*background:#fff url(../images/body_bg.png) repeat-y 0 0;-webkit-box-shadow: 0px 10px 10px rgba(0,0,0,0.15);-moz-box-shadow: 0px 10px 10px rgba(0,0,0,0.15);box-shadow: 0px 10px 10px rgba(0,0,0,0.15)*/}
.full #contentCol{padding-left:0;text-align:center;}
.full #contentCol #summmary strong{font-weight:normal;color:#333}
.ssShadow{box-shadow: 0px 3px 3px rgba(0,0,0,0.3)}
#topBar{position:relative;z-index:1;font-size:1.15em;padding:20px 30px;background:#fff;margin-bottom:0px;width:100%;float:left;clear:both;box-shadow: 0px 10px 10px rgba(0,0,0,0.15);}
#topBar div{width:40%;float:right}
#topBar div.welcome{float:left;width:45%}
#topBar div.welcome em{font-style:normal}
#topBar div#summary{float:left;width:100%}
#topBar.noShadow{margin-bottom:0}
#topBar .search { width:90%;}
#topBar .manage-fleet-buttons {float:right; width:auto; font-size: 0.875em}
#topBar .manage-fleet-buttons  a+a {margin-left: 0.5em;}
.search input{border:1px solid #909194;color:000;font-size:1em;padding:5px 8px;width:50%}
.search select{border:1px solid #909194;color:000;font-size:1em;padding:5px 0;}
.search a{color:#688f3c;padding-top:7px;font-style:italic;font-size:.9em}
input[type=submit].searchBTN,input[type=button].searchBTN{width:30px;height:30px;padding:7px;background:#688f3c url(../images/icons/16x16/search.png) no-repeat center center;border-radius: 8px;display:block;box-shadow: inset 0px -1px 0px rgba(0,0,0,0.4);}
#topBar span{float:left;margin:5px 0 0 0;display:block}
#topBar .formButton span{float:left;margin:0 7px 0 0;display:block}
.full #contentCol #topBar span{display:block;padding-top:6px;text-align:center;margin:0 auto;float:none}
#topBar .searchBTN span, .smallPad .searchBTN span{background-position:-54px -224px;width:16px;height:16px;margin:0;float:none}
.search input, .search a, .search select{float:right;margin-right:5px}
.smallPad .searchBTN, .smallPad .search a, .smallPad .search input{float:left;margin-right:5px}
.smallPad div.search{float:left;width:50%}
.leftSearch{background:#fff;width:190px;float:left;clear:both;margin:0px 5px 5px 5px;border-radius: 16px;padding:2px 3px 2px 8px;border:1px solid #acaca2;box-shadow: inset 0 1px 1px rgba(0,0,0,0.9);}
#leftCol .leftSearch{margin-top:-5px}
.leftSearch input, .leftSearch span{float:left}
.leftSearch input{font-size:1em;line-height:1em;width:130px;border:0;padding:5px 0 4px 5px;background:none}
.leftSearch span{width:16px;height:16px;background-position:-54px -256px;margin-top:5px}
.leftSearch span+input+span{width:24px;height:24px;background-position:-30px -624px;float:right;margin-top:0}
a.greenButton{display:table;width:370px;margin-bottom:4px;float:left;clear:both;background:#e5ecdd url(../images/greenBTN_bg.png) repeat-y 0 0;font-size:14px;line-height:1.3em;color:#2a500e;border-radius: 8px;box-shadow: 0px 1px 0px rgba(0,0,0,0.4);}
a.greenButton:hover{background-color:#eef7e4}
a.greenButton.changeLogin{float:right;clear:none;font-size:1em}
#topBar .greenButton span, #summary .greenButton span{display:table-row;width:auto;margin:0}
#topBar .greenButton span span, #summary .greenButton span span{display:table-cell;width:34px;padding-left:11px;margin:0;vertical-align:middle;float:none}
#topBar .greenButton span span+span, #summary .greenButton span span+span{width:325px;padding:10px 10px 10px 15px}
#topBar a.company span+span, #summary a.company span+span{font-size:1.2em}
.changeLogin{float:none;clear:none}
.changeLogin span em{width:30px;height:30px;display:block;background-position:0 -90px}
#topBar a.company span span em, #summary a.company span span em{width:24px;height:24px;background-position:-30px -504px}
#topBar a.location span em, #summary a.location span em{width:24px;height:24px;background-position:-30px -528px}
#topBar a.history span em, #summary a.history span em{width:24px;height:24px;background-position:-30px -552px}
a.greenButton:hover, a.greenButton:active{color:#a43538}
#topBar div.filters{width:24%}
#topBar .filters span, #topBar .filters select {float:right}

em.bioserv {background-image:url(/images/icons/icon-bioserv@2x.png); background-position:0 0 !important; background-size:contain; }
em.shredsmart {background-image:url(/images/icons/icon-shred-smart@2x.png); background-position:0 0 !important; background-size:contain; }

#dashboardContent{padding-left:30px;}
#dashboardContent ul{margin:0;padding:0;}
#dashboardContent ul li{padding:10px 0 0 0;list-style:none;background:none;margin:0 0 10px 0;border-top:1px solid #d9d9d9}
#dashboardContent ul li:first-child{border-top:none}
#dashboardContent ul li img{float:right;margin:0 0 10px 30px}
#left, #right{width:50%;float:left;padding:30px 30px 30px 0}

#summary{padding:10px;}
#topBar #summary{padding:0}
#summary div{float:left;margin-right:20px}
#summary div+div{margin-right:0;width:265px}
#topBar #summary div{width:370px}
#topBar #summary div+div{padding-top:15px;width:270px;margin:0}
#topBar #summary div+div+div{float:right;width:130px}
#topBar a.editBTN, #topBar a.addBTN, #topBar a.printBTN{width:140px;background:#e5ecdd;font-size:.85em;line-height:1.3em;color:#2a500e;display:block;padding:5px 8px 4px 11px;margin-left:-6px;margin-bottom:5px;border-radius: 8px;box-shadow: 0px 1px 0px rgba(0,0,0,0.4)}
 #topBar a.printBTN{font-size:.80em;}
#topBar a.editBTN span{width:16px;height:16px;margin:0 10px 0 0;float:left;background-position:-54px -272px}
#topBar a.editBTN span.convert{width:16px;height:16px;margin:0 10px 0 0;float:left;background-position:-70px -432px}
#topBar a.editBTN span.pending{width:16px;height:16px;margin:0 10px 0 0;float:left;background-position:-70px -456px}
#topBar a.editBTN.red span.pending{width:16px;height:16px;margin:0 10px 0 0;float:left;background-position:-70px -528px}
#topBar a.editBTN span.approve{width:16px;height:16px;margin:0 10px 0 0;float:left;background-position:-70px -480px}
#topBar a.editBTN.red span.approve{width:16px;height:16px;margin:0 10px 0 0;float:left;background-position:-70px -552px}
#topBar a.addBTN span{width:16px;height:16px;margin:0 10px 0 0;float:left;background-position:-54px -320px}
#topBar a.printBTN span{width:16px;height:16px;margin:0 10px 0 0;float:left;background-position:-54px -405px}
#summary .title{font-size:1.25em;color:#000;border-bottom:1px solid #cccdce;display:block;padding:14px 0 8px 0;margin-bottom:10px}
#summary ul, #topBar ul{margin:0;padding:0}
#summary ul li, #topBar ul li, #notes ul li{list-style:none;padding:0;margin:0 0 4px 0;background:none;font-size:14px;line-height:18px;float:left;clear:both}
#summary ul li span, #topBar ul li span{background-repeat:no-repeat;height:16px;width:16px;display:block;float:left;margin:2px 8px 0 4px}
#summary ul li span.contact, #topBar ul li span.contact{background-position:-54px -128px}
#summary ul li span.phone, #topBar ul li span.phone{background-position:-54px -144px}
#summary ul li span.fax, #topBar ul li span.fax{background-position:-54px -160px}
#summary ul li span.hours, #topBar ul li span.hours{background-position:-54px -176px}
#summary ul li span.frequency, #topBar ul li span.frequency{background-position:-54px -192px}
#summary ul li span.inactive, #topBar ul li span.inactive{background-position:-54px -304px}
#summary ul li span.activeClient, #topBar ul li span.activeClient{background-position:-54px -128px}
#summary ul li span.activeProspect, #topBar ul li span.activeProspect{background-position:-74px -219px}
#summary ul li span.pending, #topBar ul li span.pending{background-position:-54px -352px}
#summary ul li span.owner, #topBar ul li span.owner{background-position:-54px -128px}
#summary ul li span.date, #topBar ul li span.date{background-position:-54px -336px}
#summary ul li span.refresh2, #topBar ul li span.refresh2{background-position:-74px -76px}
#summary ul li span.arrow2, #topBar ul li span.arrow2{background-position:-74px -100px}
#summary ul li span.dollarSign, #topBar ul li span.dollarSign{background-position:-74px -148px}
#topBar a.editBTN:hover, #topBar a.editBTN:active, #topBar a.addBTN:hover, #topBar a.editBTN:active, #topBar a.printBTN:hover{color:#a43538;background-color:#eef7e4}
#summary ul li span+span, #topBar ul li span+span{width:220px;height:auto;display:block;background:none;float:left;margin:2px 0 0 0}
#topBar a.editBTN.red, #topBar a.addBTN.red{background:#a43538;color:#fff;box-shadow: inset 0px -1px 0px rgba(0,0,0,0.4);text-shadow: 1px -1px 0 rgba(0,0,0,0.4)}
#topBar a.editBTN.red:hover, #topBar a.addBTN.red:hover, #topBar a.editBTN.red:active, #topBar a.addBTN.red:active{background:#688f3c;cursor:pointer;-webkit-transition: all 200ms linear;transition: all 200ms linear}
#topBar a.editBTN.red span.convert{background-position:-70px -504px}
#topBar a.addBTN.red span{background-position:-54px -240px}

#twoColContainer{width:100%;float:left;background:#fff url(../images/twoColBG.gif) repeat-y 50% 0;padding-bottom:30px;position:relative;border-bottom:1px solid #ccc}
#oneColContainer{width:100%;float:left;background:#fff;padding-bottom:30px;position:relative}
#shadow{display:block;box-shadow: inset 0px 10px 10px rgba(0,0,0,0.15);height:20px;position:absolute;left:0;top:0;width:100%}
#twoColContainer div{width:50%;float:left;padding-right:5px}
#twoColContainer div+div{padding-left:5px;padding-right:0}

#notes{float:left;clear:both;width:100%;padding:12px 10px 20px 20px}
#notes ul li span{width:24px;height:24px;display:block;margin-right:10px;float:left;background-position:-30px -576px}
#notes ul li{color:#97181c}
#notes div{background:#f5f5df;padding:5px;min-height:42px;margin-left:35px;float:left;clear:both;width:96%}
#notes div p{color:#d0c386;font-size:1.125em;font-style:italic}

.smallPad {float:left;clear:both;padding:5px 10px 5px 5px;width:100%;display:block}
.manage+.smallPad, .manage+.manage{margin-top:30px}
hr+.smallPad{margin-top:-20px}
#oneColContainer hr,#twoColContainer hr {float:left;width:100%}
#contentCol a.formButton+hr,#twoColContainer a.formButton+hr {margin-top:0}
#contentCol .smallPad a.formButton.bulky{margin-top:0;margin-bottom:0}
#contentCol .smallPad a.formButton.bulky.right{float:right}
#contentCol .smallPad a.toggleButton.formButton.bulky {margin: 0 0 0 5px; background: #86796a url("../images/navigation/texture_overlay.png") repeat-x scroll 0 0;}
#contentCol .smallPad a.toggleButton.formButton.bulky.on {background:#4B443C}
.smallPadTabs {float:left;clear:both;padding:5px 10px 1px 10px;width:100%}
#topBar.smallPad{float:left;clear:both;padding:10px;width:100%}
.largePad{float:left;clear:both;padding:20px 30px;width:100%}
.editBTN.formButton.bulky span{background-position:-54px -370px}

#topPag, #bottomPag{float:right;text-align:right;margin-top:5px;font-size:.85em}
#topPag a, #bottomPag a{padding:3px 7px;border-radius: 3px}
#topPag a:hover, #bottomPag a:hover{background:#e1e9d8}
#topPag a.on, #bottomPag a.on{color:#000}
#topPag span, #bottomPag span{color:#000}
#topPag p, #bottomPag p{margin-bottom:0}
.smallPad #bottomPag{margin-top:-20px}

#tabs ul{margin:0}
#tabs ul li{margin:0 1px 0 0;list-style:none;background:none;float:left}
#tabs ul li a{background:#aab99f;display:block;color:#2a500e;border-radius: 8px 8px 0 0;padding:8px 20px 5px 8px}
#tabs ul li a span{width:24px;height:24px;float:left;margin-top:-3px;margin-right:5px}
#tabs ul li a span.history{background-position:-94px -96px}
#tabs ul li a span.upcoming{background-position:-94px -0px}
#tabs ul li a span.recurring{background-position:-94px -24px}
#tabs ul li a span.active{background-position:-94px -240px}
#tabs ul li a span.won{background-position:-94px -288px}
#tabs ul li a span.lost{background-position:-94px -264px}
#tabs ul li a span.completed{background-position:-94px -312px}
#tabs ul li a span.overdue{background-position:-94px -336px}
#tabs ul li a span.toDos{background-position:-94px -360px}
#tabs ul li a span.notes{background-position:-94px -384px}
#tabs ul li a:hover, #tabs ul li a:active{color:#a43538;background-color:#c2d3b6}
#tabs ul li.on a{background:#86796a url(../images/navigation/texture_overlay.png) no-repeat 0 0;color:#fff;text-shadow: 1px -1px 0 rgba(0,0,0,0.4);box-shadow: inset 0px -8px 8px rgba(0,0,0,0.25);}

#dragSort{padding:10px 20px 0;width:100%}
#dragSort div{/*border-top:3px dotted rgba(164, 53, 46, 0);margin-top:8px;*/min-height:15px}
/*#dragSort div.dragOver{border-top-color: rgba(164, 53, 46, 1)}
#dragSort div.dragItem{filter: alpha(opacity=50);opacity:.5}*/
#dragSort .dragItemLast { height:50px;}
#dragSort .dragItem { padding:10px 0;}
#dragSort .dragItem>div{
border-top: #edeae8 solid 1px;
cursor:move;
margin-top:10px;
background-color:#edeae8;
padding:8px 10px 12px;
box-shadow: 0px 4px 10px -3px rgba(0, 0, 0, .3), inset 0px 40px 40px -40px rgba(255, 255, 255, 1);
/*-webkit-transition: all 100ms;
-moz-transition: all 100ms;
-o-transition: all 100ms;
transition: all 100ms;*/
}
/*#dragSort>div:hover, #dragSort>div:active{
background-color:#e7e3e0;
}
#dragSort div:active, #dragSort div:focus{outline:0}
[draggable=true] {
  -khtml-user-drag: element;
}*/
#dragSort table{width:100%}
#dragSort td{padding:0 0 0 5px}
#dragSort .print td:first-child{padding-left:0}
#dragSort .companyText{color:#000;padding-top:5px}
#dragSort .locationText{color:#333;font-size:.9em;line-height:1.25em;padding-top:7px}
#dragSort .hours{color:#333;font-size:.9em;line-height:1.25em;padding-top:7px}
#dragSort span{display:block;height:24px;width:24px}
  #dragSort .refresh2 span{background-position: -70px -72px}
  #dragSort .arrow2 span {background-position: -70px -96px}
  #dragSort .company span{background-position: -70px -192px}
  #dragSort .location span {background-position: -70px -168px}

.full #contentCol.dashboard #topBar {box-shadow: none; line-height: 2.5em; color:#666; text-align: left; background: #e3e3e3 url(/images/navigation/texture_overlay.png) repeat-x 0 0}
.full #contentCol.dashboard #topBar #vehicle-search{float: left; width: auto}
.full #contentCol.dashboard #topBar #vehicle-search input[type="text"] {height: 2.5em; margin-right:1em; border-radius: 2em; padding: 0 1em; background: #fff; border: 1px solid #ccc}
.full #contentCol.dashboard #topBar #vehicle-search input[type="checkbox"] {display: none}
.full #contentCol.dashboard #topBar #vehicle-search input[type="checkbox"]+label {display: inline-block; font-size: 0.875em; color:#333; cursor: pointer; padding: 0 0.5em 0 2em;margin-right: 0.5em; position: relative;}
.full #contentCol.dashboard #topBar #vehicle-search input[type="checkbox"]+label:before {content: ""; display: block; height: 1em; width: 1em; background: #fff; border: 1px solid #ccc; background: #fff; border-radius: 3px; position: absolute; left: 0.5em; top: 0.6em; box-shadow: 0 1px 0px 0 rgba(0,0,0,0.25);}
.full #contentCol.dashboard #topBar #vehicle-search input[type="checkbox"]:checked+label:before {box-shadow: none; background: url(/images/icons/custom/checkbox-check.svg) no-repeat center / 70% auto #a43538; border-color: #a43538}
.full #contentCol.dashboard #topBar .formButton {padding: 0 15px 0 15px}
.full #contentCol.dashboard #topBar .formButton span {display: inline-block; margin: 0 7px 0 0; vertical-align:middle}
.full #contentCol.dashboard #topBar.smallPad .formButton {font-size: 1em}
.full #contentCol.dashboard #vehicle-list {width: 100%; min-height: calc(100vh - 9em); clear: both; text-align: left; float: left; padding: 2em 1em;  display: flex; flex-direction: row; flex-wrap: nowrap; -webkit-justify-content: flex-start; -ms-flex-pack: start; justify-content: flex-start; -webkit-align-content: stretch; -ms-flex-line-pack: stretch; align-content: stretch;}
.full #contentCol.dashboard #vehicle-list > div {padding: 0 3%; -webkit-flex: 1 1 auto;-ms-flex: 1 1 auto;flex: 1 1 auto;}
.full #contentCol.dashboard #vehicle-list > div+div {border-left: 1px solid #ccc;}
.full #contentCol.dashboard #vehicle-list h2 {font-size: 1.5em; margin-bottom: 1em; text-align: left}
.full #contentCol.dashboard #vehicle-list h2:before {content: ""; width: 1.75em; height: 1.5em; margin-right: 0.25em; display: inline-block; vertical-align: bottom}
	.full #contentCol.dashboard #vehicle-list .available h2:before {background: url(/images/icons/custom/status-available.svg) no-repeat center}
	.full #contentCol.dashboard #vehicle-list .flagged h2:before {background: url(/images/icons/custom/status-flagged.svg) no-repeat center}
	.full #contentCol.dashboard #vehicle-list .unavailable h2:before {background: url(/images/icons/custom/status-unavailable.svg) no-repeat center}
.full #contentCol.dashboard #vehicle-list ul li {padding-left: 1em;}
.full #contentCol.dashboard #vehicle-list ul li a {display: block; border-radius: 5px; position: relative; padding: 0.5em 0.5em 0.5em 2em; font-size: 1.125em}
.full #contentCol.dashboard #vehicle-list ul li a:hover {background-color: #ececec}
.full #contentCol.dashboard #vehicle-list ul li.bioserv a:before {content:""; position: absolute; top:0.55em; left:0.65em; width:1em; height:1em; background: url(/images/bioserv-icon.svg) no-repeat center / 1em auto}
.full #contentCol.dashboard #vehicle-list ul li.shredsmart a:before {content:""; position: absolute; top:0.55em; left:0.65em; width:1em; height:1em; background: url(/images/shredsmart-icon.svg) no-repeat center / 1em auto}
.full #contentCol.dashboard #vehicle-list ul li li {font-size: 0.875em; color: #666; padding-left: 1.5em; position: relative}
.full #contentCol.dashboard #vehicle-list ul li li:before {content: "\2022"; position: absolute; left: 0.75em;}

#contentCol.vehicle-wrap #topBar h1 {margin-bottom: 0; font-weight:400}
#contentCol.vehicle-wrap #topBar div {width: auto; font-weight:300; color:#000; font-size: 1.35em}
#contentCol.vehicle-wrap #topBar div:before {content: ""; width: 1.125em; height: 1.125em; margin-right: 0.25em; display: inline-block; vertical-align: bottom}
	#contentCol.vehicle-wrap #topBar div.available:before {background: url(/images/icons/custom/status-available.svg) no-repeat center / 100% auto}
	#contentCol.vehicle-wrap #topBar div.flagged:before {background: url(/images/icons/custom/status-flagged.svg) no-repeat center / 100% auto}
	#contentCol.vehicle-wrap #topBar div.unavailable:before {background: url(/images/icons/custom/status-unavailable.svg) no-repeat center / 100% auto}
#contentCol.vehicle-wrap #oneColContainer {color:#323232; min-height: calc(100vh - 9em);   display: flex; flex-direction: row; flex-wrap: nowrap; -webkit-justify-content: flex-start; -ms-flex-pack: start; justify-content: flex-start; -webkit-align-content: stretch; -ms-flex-line-pack: stretch; align-content: stretch;}
#contentCol.vehicle-wrap #oneColContainer h2 {font-size: 1.5em; font-weight:400}
#contentCol.vehicle-wrap #oneColContainer strong {font-weight: 600; color:inherit}
#contentCol.vehicle-wrap #oneColContainer .half {padding: 2em; width:50%}
#contentCol.vehicle-wrap #oneColContainer .two-thirds {padding: 2em; width:75%}
#contentCol.vehicle-wrap #oneColContainer .full-width {padding: 2em; width:100%}
#contentCol.vehicle-wrap #oneColContainer .container+.container {margin-top: 2em; padding-top: 2em; border-top:1px solid #ccc}
#contentCol.vehicle-wrap #oneColContainer .half+.half {border-left: 1px solid #ccc}
#contentCol.vehicle-wrap #oneColContainer .half .container {width: 100%; position: relative; clear: both; overflow: auto}
#contentCol.vehicle-wrap #oneColContainer .half .container .formButton {margin: 0; font-size: 1em}
#contentCol.vehicle-wrap #oneColContainer .half .container .highlighted {padding: 1em; border-radius: 3px; background:#ececec}
#contentCol.vehicle-wrap #oneColContainer .half .container .brand {position: relative; font-weight: 600; color: #000; display: block}
#contentCol.vehicle-wrap #oneColContainer .half .container .brand:before {content: ""; display: inline-block; vertical-align: bottom; width: 1.75em; height: 1.75em;}
#contentCol.vehicle-wrap #oneColContainer .half .container .brand.bioserv:before {margin-right: 0.25em; background: url(/images/bioserv-icon.svg) no-repeat center / contain}
#contentCol.vehicle-wrap #oneColContainer .half .container .brand.shredsmart:before {margin-right: 0.25em; background: url(/images/shredsmart-icon.svg) no-repeat center / contain}

.icon-header:before {content: ""; display: inline-block; vertical-align: top; margin-right: 0.25em; width: 1em; height:1em; background-size: contain; background-position:center; background-repeat: no-repeat}
	.icon-header.truck:before {background-image: url(/images/icons/custom/icon-truck.svg)}
	.icon-header.flagged:before {background-image: url(/images/icons/custom/status-flagged.svg)}
	.icon-header.unavailable:before {background-image: url(/images/icons/custom/status-unavailable.svg)}
	.icon-header.file:before {background-image: url(/images/icons/custom/icon-file.svg)}
	.icon-header.oil-change:before {background-image: url(/images/icons/custom/icon-oil-change.svg)}
	.icon-header.general-service:before {background-image: url(/images/icons/custom/icon-general-service.svg)}
	.icon-header.brakes-service:before {background-image: url(/images/icons/custom/icon-brakes-service.svg)}
	.icon-header.tire-rotation:before {background-image: url(/images/icons/custom/icon-tire-rotation.svg)}
	.icon-header.tire-change:before {background-image: url(/images/icons/custom/icon-tire-change.svg)}
	.icon-header.spark-plug:before {background-image: url(/images/icons/custom/icon-spark-plug.svg)}
	.icon-header.body-work:before {background-image: url(/images/icons/custom/icon-crash.svg)}

.anchored-icon {width: 1.125em; height: 1.125em; position: absolute; right:0.5em; top:0.5em; z-index: 2; background-size: contain; background-repeat: no-repeat; background-position: center;}
.anchored-icon+.anchored-icon {right: 2em}
.anchored-icon+.anchored-icon+.anchored-icon {right: 3.5em}
a.anchored-icon:hover {cursor: pointer; opacity: 0.5}
.anchored-icon.edit {background-image: url(/images/icons/custom/icon-edit.svg)}
.anchored-icon.delete {opacity:0.5; filter: grayscale(1); background-image: url(/images/icons/custom/icon-delete.svg)}
.anchored-icon.delete:hover {opacity:1; filter: grayscale(0);}
.anchored-icon.zoom {background-image: url(/images/icons/custom/icon-zoom.svg)}
.anchored-icon.schedule {background-image: url(/images/icons/custom/icon-add-calendar.svg)}
.anchored-icon.check {background-image: url(/images/icons/custom/icon-check.svg)}
.anchored-icon.right-arrow {top:0; height: 100%; background: url(/images/icons/custom/icon-right-arrow.svg) no-repeat center / 0.75em auto}
.anchored-icon.add {background: url(/images/icons/custom/icon-add.svg) no-repeat center / contain}
.anchored-icon.office-staff-only {background: url(/images/icons/custom/icon-user-alert.svg) no-repeat center / contain}
.container+.container > .anchored-icon {top: 2em}

.regular-list {margin-bottom: 2em; padding-left: 2em; list-style: circle}
.regular-list > li {line-height: 1.25em; margin-bottom: 1em;}
	ul.regular-list > li {list-style: circle}
	ol.regular-list > li {list-style: decimal}
.icon-list {margin-bottom: 2em}
.icon-list > li {position: relative; transition: ease all 200ms; border-radius: 4px; line-height: 1.25em; padding: 0.5em 2.25em;}
.icon-list > li:hover {background: #ececec}
.icon-list > li li {font-size: 0.875em; color: #666; padding-left: 1.5em; position: relative}
.icon-list > li li:before {content: "\2022"; position: absolute; left: 0.75em;}
.icon-list > li:before {content: ""; width: 1.3em; height: 1.25em; position: absolute; left:0.5em; top:0.5em; display:block; background-position: center; background-repeat: no-repeat; z-index: 1; background-size: contain}
	.icon-list > li.flagged:before {background-image: url(/images/icons/custom/status-flagged.svg)}
	.icon-list > li.unavailable:before {background-image: url(/images/icons/custom/status-unavailable.svg)}
	.icon-list > li.file:before {background-image: url(/images/icons/custom/icon-file.svg)}
	.icon-list > li.file-pdf:before {background-image: url(/images/icons/custom/icon-file-pdf.svg)}
	.icon-list > li.file-image:before {background-image: url(/images/icons/custom/icon-file-image.svg)}
	.icon-list > li.oil-change:before {background-image: url(/images/icons/custom/icon-oil-change.svg)}
	.icon-list > li.general-service:before {background-image: url(/images/icons/custom/icon-general-service.svg)}
	.icon-list > li.brakes-service:before {background-image: url(/images/icons/custom/icon-brakes-service.svg)}
	.icon-list > li.tire-rotation:before {background-image: url(/images/icons/custom/icon-tire-rotation.svg)}
	.icon-list > li.tire-change:before {background-image: url(/images/icons/custom/icon-tire-change.svg)}
	.icon-list > li.spark-plug:before {background-image: url(/images/icons/custom/icon-spark-plug.svg)}
	.icon-list > li.body-work:before {background-image: url(/images/icons/custom/icon-crash.svg)}
.icon-list > li span.date {display: inline-block; font-style: italic; font-size: 0.875em; color: #666}
.icon-list > li span.date.expiring {color:red;}

.button-inputs input {display: none}
.button-inputs label {display: inline-block; margin-right: 0.25em; border-radius: 4px; cursor:pointer; padding: 0 1em; line-height: 34.5px; background: #ececec; box-shadow: inset 0 0 0 1px rgba(0,0,0,0.125)}
.button-inputs label:hover {box-shadow: inset 0 0 0 1px rgba(0,0,0,0.25)}
.button-inputs :checked+label {color: #fff; background: #68A622;}

.hide {display: none; margin-top: 1em}
.remove {display: none; cursor: pointer; border-radius: 4px; box-shadow:inset 0 0 0 1px rgba(0,0,0,0.125); float: right; background: #ececec; padding: 0.25em 0.5em; font-size: 0.875em}
.show+.remove {display: inline-block;}
.no-margins {margin: 0	}
.center {text-align: center}
.center input[type="submit"] {float: none; display: inline-block}
textarea.tall {min-height: 10em}
.cloned-section {overflow: auto}
.cloned-section + .cloned-section {padding-top: 1em; margin-top: 1em; border-top: 1px dashed #ccc}
.addFile{position:absolute; top: -1000px;}
.notes {margin-top: 1em}

.input-tag {display: flex;flex-direction: row;flex-wrap: nowrap;justify-content: flex-start;align-content: center;align-items: center;}
.input-tag input {margin-right: 0.5em; text-align: right; -webkit-flex: 1 1 auto; -ms-flex: 1 1 auto; flex: 1 1 auto;}
.input-tag input[name="months"] {max-width: 4em}
.input-tag input[name="miles"] {max-width: 6em}
.input-tag .icon {display: block; width: 1.5em; height: 1.5em; background-position: center; background-repeat: no-repeat; background-size: contain}
	.input-tag .icon.calendar {background-image: url(/images/icons/custom/icon-add-calendar.svg)}
	.input-tag .icon.time {background-image: url(/images/icons/custom/icon-clock.svg)}

.select-icon button {display: inline-block; cursor: pointer; background-color: #ececec; padding: 0.55em; border-radius: 4px; box-shadow: inset 0 0 0 1px rgba(0,0,0,0.125)}
.select-icon button:hover {box-shadow: inset 0 0 0 1px rgba(0,0,0,0.25)}
.select-icon button.active {box-shadow: inset 0 0 0 2px #68A622; background: #fff}
.select-icon button:before {content: ""; float: left; display: inline-block; width: 2em; height: 2em; background-position: center; background-repeat: no-repeat; background-size: contain}
	.select-icon .oil-change:before {background-image: url(/images/icons/custom/icon-oil-change.svg)}
	.select-icon .general-service:before {background-image: url(/images/icons/custom/icon-general-service.svg)}
	.select-icon .brakes-service:before {background-image: url(/images/icons/custom/icon-brakes-service.svg)}
	.select-icon .tire-rotation:before {background-image: url(/images/icons/custom/icon-tire-rotation.svg)}
	.select-icon .tire-change:before {background-image: url(/images/icons/custom/icon-tire-change.svg)}
	.select-icon .spark-plug:before {background-image: url(/images/icons/custom/icon-spark-plug.svg)}
	.select-icon .body-work:before {background-image: url(/images/icons/custom/icon-crash.svg)}

.formTable, .formTable table{width:100%; line-height: 1.75em}
.formTable input[type="text"],
.formTable input[type="password"],
.formTable input[type="tel"],
.formTable input[type="number"],
.formTable input[type="email"],
.formTable input[type="url"],
.formTable input[type="search"],
.formTable input[type="time"],
.formTable input[type="date"],
.formTable select,
.formTable textarea {font-size: 1em; text-align: left; height: 2.5em; border: 1px solid #3f3f3f; padding: 0 0.5em; border-radius: 4px; box-shadow: none; background: #fff; appearance:none; -webkit-appearance:none; -moz-appearance:none; width:100%}
.formTable textarea {height: auto; padding: 0.5em}
.formTable table td,.formTable table td:first-child{padding-bottom:0}
.formTable.right td:first-child{text-align:right;width:1%}
.formTable.right td{width:auto}
.formTable td{width:50%}
.formTable td{padding:0 0 1em .75em}
.formTable td:first-child{padding:0 .75em 1em 0}
.formTable td[colspan="2"]{padding-right:0}
.formTable.formLoose,.formTable.formLoose td{width:auto}

.files {margin-bottom: 1em; display: flex; flex-direction: row; -webkit-flex-wrap: wrap; -ms-flex-wrap: wrap; flex-wrap: wrap; -webkit-justify-content: flex-start; -ms-flex-pack: start; justify-content: flex-start; -webkit-align-content: stretch; -ms-flex-line-pack: stretch; align-content: stretch; -webkit-align-items: stretch; -ms-flex-align: stretch; align-items: stretch;}
.files .file {display: inline-block; text-align: center; margin: 0 0.125em 0.5em 0; width: 12em; position: relative;}
.files .file .view-file {display: block; height: 100%; padding: 0.5em 0.5em 1em; border: 1px solid #ececec;}
.files .file .view-file:hover {border-color: #a43538}
.files .file .fileimage {display: block; position: relative; margin-bottom: 1em; padding-bottom: 100%}
.files .file .fileimage img {position: absolute; top: 50%; left: 50%; max-height: 100%; max-width:100%; height:auto; width: auto; transform: translate(-50%, -50%)}
.files .file .filetype,
.files .file .filename,
.files .file .filedate {display: block; color: #666; font-size: 0.75em; line-height: 1.25em}
.files .file .filetype {font-size: 1em;}

#file-upload {display: none}
.inputfile + label {color: #333; cursor: pointer; margin-bottom: 1em; border-radius: 8px; overflow: auto; border: 1px solid #ccc; display: block; background-color: #ececec;padding: 0;}
.inputfile:focus + label,
.inputfile.has-focus + label,
.inputfile + label:hover {border-color: #526c35;}
.inputfile + label span,
.inputfile + label strong {padding: 0 1.25rem; line-height: 40px; display: block; font-size: 1rem;}
.inputfile + label span {width: 20em; display: block; float: left; text-overflow: ellipsis;white-space: nowrap;overflow: hidden;}
.inputfile + label strong {float: right; font-weight: 400; color: #fff; text-shadow: 1px -1px 0 rgba(0,0,0,0.4); background-color: #688f3c;}
.inputfile + label svg path {fill: #fff}
.inputfile:focus + label strong,
.inputfile.has-focus + label strong,
.inputfile + label:hover strong {background-color: #526c35;}

:root {
	--text-gray: rgba(0,0,0,0.7);
	--light-grey: #F7F7F7;
	--grey: #666666;
	--dark-grey: #333333;
	--light-red: #F9E8E8;
	--red: #A43538;
	--dark-red:#772022;
	--green: #68A622;
	--dark-green: #49800C;
	--light-blue: #EBF3FD;
	--bright-blue: #0267DE;
	--blue: #CBE2FF;
	--dark-blue: #004eaa;
	--highlight-blue: #DEF1FF;
	--shredsmart-blue: #00A9E0;
	--alert: #FF9F00;
	--light-orange:#FFF5E3;
	--orange: #BC7500;
	--light-yellow: #ffffea;
	--dotted-line: 1px dashed #e3e3e3;
}

#inventory-tool * {box-sizing: border-box;}
#inventory-tool .flex-apart {display: flex; flex-direction: row; flex-wrap: nowrap;  justify-content: space-between; align-content: center;  align-items: center;}
#inventory-tool .flex-start {display: flex;flex-direction: row;flex-wrap: nowrap;justify-content: flex-start;align-content: center;align-items: center;}
#inventory-tool .flex-end {display: flex;flex-direction: row;flex-wrap: nowrap;justify-content: flex-end;align-content: center;align-items: center;}
#inventory-tool .flex-top {align-items: flex-start;}
#inventory-tool .justify-center {display: flex; align-items:center; justify-content: center}
#inventory-tool .align-center {align-items: center;}
#inventory-tool .align-center input[type=radio] {margin:0}
#inventory-tool .flex-stretch {align-content: stretch;align-items: stretch;}
#inventory-tool .flex-fill {flex: 1 1 auto}
#inventory-tool .avoid-shrink {flex-shrink: 0}
#inventory-tool .gap-5 {gap: 5px;}
#inventory-tool .gap-8 {gap: 8px;}
#inventory-tool .gap-12 {gap: 12px;}
#inventory-tool .gap-20 {gap: 20px;}
#inventory-tool .gap-40 {gap: 40px;}

#inventory-tool .small-red-button {text-shadow:none !important; box-shadow:none !important; display: inline-block; cursor:pointer; border-radius: 2px; background: var(--red); color: #fff; font-size:12px; line-height: 26px; padding: 0 12px}
#inventory-tool .small-red-button:hover {background: var(--dark-red)}
#inventory-tool .large-red-button {text-shadow:none !important; box-shadow:none !important; display: inline-block; cursor:pointer; border-radius: 2px; background: var(--red); color: #fff; font-size:14px; line-height: 30px; padding: 0 14px}
#inventory-tool .large-red-button:hover {background: var(--dark-red)}
#inventory-tool .large-submit-button {padding: 0 4em; white-space:nowrap; background: var(--red); border-radius: 9px; box-shadow: inset 0 -1px 0 0 rgba(0,0,0,0.4); display: inline-block; line-height: 43px;  font-weight: 500; font-size: 14px; color: #fff; text-shadow: 1px 1px 0px rgba(0, 0, 0, 0.4); }
#inventory-tool .large-submit-button:hover {background: var(--green)}
#inventory-tool .small-green-button {text-shadow:none !important; box-shadow:none !important; display: inline-block; cursor:pointer; border-radius: 2px; background: var(--green); color: #fff; font-size:12px; line-height: 26px; padding: 0 12px}
#inventory-tool .small-green-button:hover {background: var(--dark-green)}
#inventory-tool .small-blue-button {text-shadow:none !important; box-shadow:none !important; display: inline-block; cursor:pointer; border-radius: 2px; background: var(--bright-blue); color: #fff; font-size:12px; line-height: 26px; padding: 0 12px}
#inventory-tool .small-blue-button.on,
#inventory-tool .small-blue-button:hover {background: var(--dark-blue)}
#inventory-tool .small-light-blue-button {text-shadow:none !important; box-shadow:none !important; display: inline-block; cursor:pointer; border-radius: 2px; background: var(--light-blue); color: var(--bright-blue); font-size:12px; line-height: 26px; padding: 0 12px}
#inventory-tool .small-light-blue-button.on,
#inventory-tool .small-light-blue-button:hover {background: var(--bright-blue); color:#fff}
#inventory-tool .large-button {text-shadow:none !important; font-weight:400; box-shadow:none !important; display: inline-block; cursor:pointer; border-radius: 7px; font-size:14px; line-height: 40px; padding: 0 18px}
	#inventory-tool .large-button.blue {background: var(--bright-blue); color:#fff}
	#inventory-tool .large-button.blue:hover {background: var(--dark-blue);}
	#inventory-tool .large-button.green {background: var(--green); color:#fff}
	#inventory-tool .large-button.green:hover {background: var(--dark-green);}
	#inventory-tool .large-button.light-blue {background: var(--light-blue); color:var(--bright-blue)}
	#inventory-tool .large-button.light-blue:hover {background: var(--blue);}
	#inventory-tool .large-button.cancel {background: none; color:#8B8B8B}
	#inventory-tool .large-button.cancel:hover {background: var(--light-grey); color: var(--gray);}
	#inventory-tool .large-button.pdf:before {content:""; padding-left: 17px; background: url(/images/inventory-tool/blue-pdf-icon.svg) no-repeat center left}
	#inventory-tool .large-button.check:before {content:""; padding-left: 17px; background: url(/images/inventory-tool/white-check.svg) no-repeat center left}
	#inventory-tool .large-button.cancel:before {content:""; padding-left: 17px; background: url(/images/inventory-tool/grey-x.svg) no-repeat center left}
#inventory-tool a,
#inventory-tool button,
#inventory-tool input[type="submit"] {transition:ease all 100ms; float:none; cursor:pointer;}
#inventory-tool .search-products {position:relative}
#inventory-tool .search-products input {border-radius: 2px; width:100%; font-size: 14px; color:#333; padding: 0 30px 0 10px; background: #fff; height: 30px; border: 1px solid #ccc;}
#inventory-tool .search-products input:focus {border-color:var(--grey)}
#inventory-tool .search-products button {position:absolute; outline:none; border:0; top:1px; right:1px; border-radius:2px; width: 28px; height: 28px; background: url(/images/inventory-tool/red-search.svg) no-repeat center}
#inventory-tool .search-products button:hover {background-color: var(--light-grey)}
#inventory-tool .add-a-product .select-product {margin-right:5px}
#inventory-tool .add-a-product .select-product select {height: 30px;}
/*#inventory-tool .order-top .add-a-product {width: 340px;}*/
#inventory-tool .order-top .add-a-product select {width: auto; max-width: 200px; text-overflow: ellipsis;}
#inventory-tool select {color:#333; cursor: pointer; border-radius: 2px; padding: 0 20px 0 5px; background: #fff url(/images/inventory-tool/select-arrow.svg) no-repeat calc(100% - 7px) 50%; border: 1px solid #ccc; appearance:none; -webkit-appearance:none; -moz-appearance:none}
#inventory-tool input[type="tel"],
#inventory-tool input[type="text"],
#inventory-tool input[type="number"] {color:#333; padding-top:0; padding-bottom:0; background:#fff; box-shadow:none; outline:none; border-radius: 2px; border: 1px solid #ccc;}
#inventory-tool table {width:100%}
#inventory-tool .products-table {margin-top:40px}
#inventory-tool .products-table table {width:100%;}
#inventory-tool .products-table table th,
#inventory-tool .products-table table td {padding:8px 12px; text-align:center}
#inventory-tool .products-table table th:first-child,
#inventory-tool .products-table table td:first-child {text-align: left;}
#inventory-tool .products-table table th:last-child,
#inventory-tool .products-table table td:last-child {text-align: right; padding-right: 18px}
#inventory-tool .products-table table label {cursor:pointer}
#inventory-tool .products-table table select,
#inventory-tool .products-table table input[type="number"],
#inventory-tool .products-table table input[type="text"],
#inventory-tool .single-vendor .products-table table textarea {height: 28px; width:67px; color:#333; font-size:12px; border-radius: 2px; box-shadow: none; background:#fff; appearance:none; -webkit-appearance:none; -moz-appearance:none}
#inventory-tool .products-table .textarea {height: 28px; max-width: 250px; min-width: 100%; resize: vertical; color:#333; font-size:12px; border-radius: 2px; box-shadow: none; background:#fff; appearance:none; -webkit-appearance:none; -moz-appearance:none}
#inventory-tool .products-table table input[type="number"],
#inventory-tool .products-table table input[type="text"] {text-align:center; -moz-appearance: textfield;}
#inventory-tool .single-vendor .products-table table input[type="number"] {margin-left:5px; text-align: left;}
#inventory-tool .single-vendor .products-table table input[type="text"],
#inventory-tool .single-vendor .products-table table textarea {width:100%; text-align: left;}
#inventory-tool .single-vendor .products-table table textarea {padding: 8px}
#inventory-tool #bottom .single-vendor .associated-products .products-table table tbody td:last-child {text-align: right;}
#inventory-tool .products-table table input::-webkit-outer-spin-button,
#inventory-tool .products-table table input::-webkit-inner-spin-button { -webkit-appearance: none; margin: 0;}
#inventory-tool .products-table table .price,
#inventory-tool .products-table table .quantity,
#inventory-tool .products-table table .location {line-height: 28px; color:#000; font-size:14px}
#inventory-tool .products-table table thead th {font-size: 14px; white-space:nowrap; font-weight: 600; color:#333;}
#inventory-tool .products-table table thead th .checkbox {display: block; position:relative; display: block; padding-left:22px}
#inventory-tool .products-table table thead th .checkbox:hover,
#inventory-tool .products-table table thead .selected .checkbox {color:var(--bright-blue)}
#inventory-tool .products-table table thead th .checkbox input {position:absolute; top:1px; left:0}
#inventory-tool .products-table table tbody tr {border-top: var(--dotted-line)}
#inventory-tool .products-table.with-highlight table tbody tr:hover,
#inventory-tool .products-table.with-checkboxes table tbody tr:hover {background: var(--light-yellow)}
#inventory-tool .products-table.with-checkboxes table tbody tr.selected {background: var(--light-blue)}
#inventory-tool .products-table.with-checkboxes table tbody tr.selected:hover {background: var(--highlight-blue)}
#inventory-tool .products-table table tbody tr:last-child {border-bottom: var(--dotted-line)}
#inventory-tool .products-table table tbody td .product {display: block; padding: 6px 0; position:relative}
#inventory-tool .products-table table tbody td .product .returning-product {position: absolute; top:0.3125rem; left:0; opacity:0; pointer-events:none}
#inventory-tool .products-table table tbody td .product.start-return {padding-left: 1.5rem}
#inventory-tool .products-table table tbody td .product.start-return .returning-product {pointer-events: all; opacity:1;}
#inventory-tool .products-table:not(.with-checkboxes) table tbody td .product {cursor:text}
#inventory-tool .products-table table tbody td .product.with-checkbox {display: block; padding-left:22px}
#inventory-tool .products-table table tbody td .product.with-checkbox input {position:absolute; top:8px; left:0}
#inventory-tool .products-table table tbody td .product .product-name {display: block; color:#000000; font-size:14px; line-height: 16px;}
#inventory-tool .products-table table tbody td .product .vendor {display: block; margin-top: 7px; color:#484848; font-size:12px; line-height: 14px}
#inventory-tool .products-table table tfoot {position: sticky;bottom: 0;background: linear-gradient(rgba(255, 255, 255, 0) 0, rgba(255, 255, 255, 0.95) 50px);}
#inventory-tool .products-table table tfoot tr td {text-align: right;}
#inventory-tool .products-table table tfoot tr:first-child td {padding-top:55px}
#inventory-tool .products-table table tfoot tr.totals td {font-size:18px; font-weight:600; text-align: right; color:#000}
#inventory-tool .products-table table tfoot tr.totals td span {margin-right: 10px;}
#inventory-tool .products-table table tfoot tr.totals .total-details > *:not(.order-total) {
    font-size: 14px;
    font-weight: 400;
    line-height: 1.4em;
}
#inventory-tool .products-table table tfoot tr.totals .total-details select {
    background: #fff url(/images/inventory-tool/select-arrow.svg) no-repeat calc(100% - 7px) 50%;
    font-size: 14px;
    font-weight: 400;
    height: 30px;
    padding: 0 20px 0 5px;
    width: auto;
}
#inventory-tool .products-table .submit .submission-notes textarea {
    width:100%;
	max-width: 644px;
	border-radius: 2px;
	padding: 10px 8px;
	background:#fff;
}
#inventory-tool .products-table table tfoot tr.disclaimer td {padding-top: 10px}
#inventory-tool .products-table table tfoot tr.disclaimer td span {font-size:12px; color:var(--alert)}
#inventory-tool .products-table table tfoot tr.disclaimer td span:before {content:""; padding-left:18px; background: url(/images/inventory-tool/orange-alert-small.svg) no-repeat center left}
#inventory-tool .products-table table tfoot tr.submit td {padding-top: 20px}
#inventory-tool .products-table table tfoot tr.submit td input {display: block}
#inventory-tool .products-table table tfoot tr.submit td .save-as-draft {margin-right:20px; background:none; color:var(--red); text-decoration: underline; padding: 10px}
#inventory-tool .products-table table tfoot tr.submit td .save-as-draft:hover {color:var(--bright-blue);}
#inventory-tool .products-table.wishlist-table th,
#inventory-tool .products-table.wishlist-table td {text-align:left; width:33%; vertical-align: middle;}
#inventory-tool .products-table.wishlist-table td .item-image {display: flex;flex-direction: row;flex-wrap: nowrap;justify-content: flex-start;align-content: center;align-items: center;}
#inventory-tool .products-table.wishlist-table td .item-image .image {max-width: 3.125rem; margin-right: 0.125rem; height:auto;}
#inventory-tool .products-table.wishlist-table td .item-image .image a {display: block; cursor:pointer;}
#inventory-tool .products-table.wishlist-table td .item-image .image img {pointer-events:none; display: block; max-width: 3.125rem; max-height: 3.125rem; width:auto; height:auto;}
#inventory-tool .products-table.wishlist-table td .item-image .image:hover img {transform: scale(2.5)}
#inventory-tool .products-table.wishlist-table td .item-image .delete {width:1.75rem; line-height: 1.75rem; border-radius: 3px; display: inline-block; color:var(--red); background:none;}
#inventory-tool .products-table.wishlist-table td .item-image .delete:hover {background:var(--light-red)}
#inventory-tool .products-table.wishlist-table td .remove-item {display: inline-block; padding: 0 0.5rem; border-radius: 3px; line-height:1.75rem; background:var(--light-red); color:var(--red)}
#inventory-tool .products-table.wishlist-table td .remove-item:hover {background:var(--red); color:#fff}
#inventory-tool .products-table.wishlist-table tr.add-another td {text-align:left;}
#inventory-tool .products-table.wishlist-table tr.add-another td .add-item {display: inline-block; padding: 0 0.5rem; border-radius: 3px; line-height:1.75rem; background:var(--bright-blue); color:#fff}
#inventory-tool .products-table.wishlist-table tr.add-another td .add-item:hover {background:var(--dark-blue)}
#inventory-tool .products-table.wishlist-table td input[type=text] {width:100%; text-align:left}
#inventory-tool .header {font-weight: 300; font-size: 21px; text-align: left; color: #000;}
#inventory-tool .header.icon-header {padding-left:40px; line-height:31px; position:relative}
#inventory-tool .header.icon-header:before {content:""; width: 37px; height:27px; display: block; position:absolute; top:0; left:0}
	#inventory-tool .low-stock .header.icon-header:before {background: url(/images/inventory-tool/heading-icon-blue-alert.svg) no-repeat center}
	#inventory-tool .waiting-approval .header.icon-header:before {background: url(/images/inventory-tool/heading-icon-ornange-hourglass.svg) no-repeat center}
	#inventory-tool .current-order-status .header.icon-header:before {background: url(/images/inventory-tool/heading-icon-blue-checklist.svg) no-repeat center}
	#inventory-tool .drafts .header.icon-header:before {background: url(/images/inventory-tool/heading-icon-green-pencil.svg) no-repeat center}
	#inventory-tool .view-order .header.icon-header:before {background: url(/images/inventory-tool/heading-icon-blue-checklist.svg) no-repeat center}
	#inventory-tool .place-an-order .header.icon-header:before {background: url(/images/inventory-tool/heading-icon-blue-plus.svg) no-repeat center}
	#inventory-tool .completed-orders .header.icon-header:before {background: url(/images/inventory-tool/heading-icon-green-check.svg) no-repeat center}
    #inventory-tool .completed-orders.recurring .header.icon-header:before {background: url(/images/inventory-tool/refresh-red.svg) no-repeat center / 1em auto}
	#inventory-tool .manage-vendors .header.icon-header {display: inline-block; margin-right:20px; padding-left:47px}
	#inventory-tool .manage-vendors .header.icon-header:before {background: url(/images/inventory-tool/heading-icon-dark-green-people.svg) no-repeat center left}
	#inventory-tool .single-vendor .header.icon-header {padding-left: 34px}
	#inventory-tool .single-vendor .header.icon-header:before {background: url(/images/inventory-tool/heading-icon-dark-green-user.svg) no-repeat center left}
	#inventory-tool .wish-list .header.icon-header:before {background: url(/images/inventory-tool/heading-icon-wishlist.svg) no-repeat center left}
	#inventory-tool .backordered .header.icon-header:before {background: url(/images/inventory-tool/heading-icon-red-refresh.svg) no-repeat center}
	#inventory-tool .orders-received .header.icon-header:before {background: url(/images/inventory-tool/heading-icon-received.svg) no-repeat center}
	#inventory-tool .orders-returned .header.icon-header:before {background: url(/images/inventory-tool/heading-icon-blue-arrows.svg) no-repeat center}
	#inventory-tool .completed-orders.canceled-orders .header.icon-header:before {background: url(/images/inventory-tool/heading-icon-red-x.svg) no-repeat center}

#inventory-tool .vendor-payment-types {
	margin: 0 0 2em;
	text-align: left;
}


#inventory-tool .header span {font-weight: normal; font-weight:300; font-size: 14px;text-align: left;color: rgba(0, 0, 0, 0.7);}
#inventory-tool #top {background:#E3E3E3; padding: 9px 30px; display: flex; flex-direction: row; flex-wrap: nowrap;  justify-content: space-between; align-content: center;  align-items: center;}
#inventory-tool #top h1 {font-weight: 300; margin:0; font-style: italic;font-size: 16px;text-align: left;color: rgba(0,0,0,0.46);}
#inventory-tool #top .jump-links {display: flex;flex-direction: row;flex-wrap: nowrap;justify-content: flex-end;align-content: center;align-items: center;}
#inventory-tool #top .jump-links ul {display: flex;flex-direction: row;flex-wrap: nowrap;justify-content: flex-end;align-content: center;align-items: center;}
#inventory-tool #top .jump-links ul li {padding: 0 15px; border-right:1px solid  rgba(0,0,0,0.15)}
#inventory-tool #top .jump-links ul li {padding: 0 15px; border-right:1px solid  rgba(0,0,0,0.15)}
#inventory-tool #top .jump-links ul li a {color: var(--red)}
#inventory-tool #top .jump-links ul li a:hover {color: var(--green)}
#inventory-tool #top .jump-links .place-an-order {padding: 0 1em; white-space:nowrap; margin-left: 15px; background: var(--red); border-radius: 9px; box-shadow: inset 0 -1px 0 0 rgba(0,0,0,0.4); display: inline-block; line-height: 39px;  font-weight: 500; font-size: 14px; color: #fff; text-shadow: 1px 1px 0px rgba(0, 0, 0, 0.4); }
#inventory-tool #top .jump-links .place-an-order:before {content:""; padding-left:18px; background: url(/images/inventory-tool/plus-place-an-order.svg) no-repeat center left}
#inventory-tool #top .jump-links .place-an-order:hover {background: var(--green)}
#inventory-tool #bottom {padding: 30px 30px 60px}
#inventory-tool #status-popover {display: none; position: fixed; z-index: 9999999; top: 0; left:0; width:100%; height: 100%; padding: 1em; background:rgba(0, 0, 0, 0.8); flex-direction: row; flex-wrap: nowrap; -webkit-justify-content: center; -ms-flex-pack: center; justify-content: center; align-content: center;  align-items: center;}
#inventory-tool #status-popover .container {position: relative}
#inventory-tool #status-popover .container .popover-wrap {padding: 50px 67px 30px; text-align: center; background:#fff; border-radius: 4px; max-width: 525px; border-radius: 5px}
#inventory-tool #status-popover .container .popover-wrap h2 {font-weight: 300; margin-bottom: 10px; font-size: 21px;color: #000;}
#inventory-tool #status-popover .container .popover-wrap .order-total {font-weight: bold;font-size: 15px;color: #000; display: block; margin-bottom:33px}
#inventory-tool #status-popover .container .popover-wrap label {display: block; color:#000}
#inventory-tool #status-popover .container .popover-wrap label textarea{width:100%; color:#333; padding: 10px; height: 65px; min-height: 65px; min-width: 100%; border-radius: 2px; background: #fff; border: 1px solid #ccc;}
#inventory-tool #status-popover .container .popover-wrap .actions {margin-top:40px; -webkit-flex-wrap: wrap;-ms-flex-wrap: wrap;flex-wrap: wrap;}
#inventory-tool #status-popover .container .popover-wrap .actions .large-button {padding: 0 23px; margin:0 2px 6px}

/* dashboard */
#inventory-tool #bottom .inventory-dashboard-links {display: grid;grid-template-columns: repeat(5, 1fr);grid-template-rows: repeat(2, 1fr);grid-column-gap: 20px;grid-row-gap: 20px;}
#inventory-tool #bottom .inventory-dashboard-links a {display: block; text-align:center; padding: 2rem 2rem 3rem; border: 1px solid #EEF4F3;box-shadow: inset 0 0 20px 0 #EEF4F3;border-radius: 4px; font-weight: 600; font-size: 1.125rem; color: #155896; line-height: 1.5rem;}
#inventory-tool #bottom .inventory-dashboard-links a:before {content:""; display: block; height:5rem; margin-bottom:1.5rem}
#inventory-tool #bottom .inventory-dashboard-links a:hover {border-color:var(--green)}
	#inventory-tool #bottom .inventory-dashboard-links .place-an-order:before {background: url(/images/dashboard-icon-place-an-order.svg) no-repeat center}
	#inventory-tool #bottom .inventory-dashboard-links .add-to-wishlist:before {background: url(/images/dashboard-icon-add-to-wishlist.svg) no-repeat center}
	#inventory-tool #bottom .inventory-dashboard-links .view-order-status:before {background: url(/images/dashboard-icon-view-order-status.svg) no-repeat center}
	#inventory-tool #bottom .inventory-dashboard-links .current-inventory:before {background: url(/images/dashboard-icon-current-inventory.svg) no-repeat center}
	#inventory-tool #bottom .inventory-dashboard-links .low-stock-items:before {background: url(/images/dashboard-icon-low-stock-items.svg) no-repeat center}
	#inventory-tool #bottom .inventory-dashboard-links .usage-report:before {background: url(/images/dashboard-icon-usage-report.svg) no-repeat center}
	#inventory-tool #bottom .inventory-dashboard-links .manage-vendors:before {background: url(/images/dashboard-icon-manage-vendors.svg) no-repeat center}
	#inventory-tool #bottom .inventory-dashboard-links .manage-inventory-products:before {background: url(/images/dashboard-icon-manage-inventory-products.svg) no-repeat center}
	#inventory-tool #bottom .inventory-dashboard-links .manage-inventory-categories:before {background: url(/images/dashboard-icon-manage-inventory-categories.svg) no-repeat center}
	#inventory-tool #bottom .inventory-dashboard-links .manage-order-types:before {background: url(/images/dashboard-icon-manage-order-types.svg) no-repeat center}
#inventory-tool #bottom .low-stock h2 {margin:0}
#inventory-tool #bottom .low-stock .locations {margin-top: 20px; position:relative}
#inventory-tool #bottom .low-stock .location {width:25%}
#inventory-tool #bottom .low-stock .location + .location {margin-left: 16px}
#inventory-tool #bottom .low-stock .location .heading {padding: 0 10px; position:sticky; top:42px; z-index:2; background: var(--light-blue); line-height:31px; font-weight: 500; font-size: 15px; text-align: left; color: #000; }
#inventory-tool #bottom .low-stock .locations.overflowing .heading {position:relative; top:auto}
#inventory-tool #bottom .low-stock .locations.overflowing.showing-more .heading {position:sticky; top:42px; z-index:2; }
#inventory-tool #bottom .low-stock .location .heading label {font-size: 12px; cursor:pointer; text-align: left;color: rgba(0, 0, 0, 0.7);}
#inventory-tool #bottom .low-stock .location .heading label input {margin-left: 5px}
#inventory-tool #bottom .low-stock .location .product {display: block; cursor:pointer; line-height: 1.5em; position:relative; padding: 10px 0 10px 33px; font-weight: 500;font-size: 12px;text-align: left;color: rgba(0, 0, 0, 0.7); border-bottom: var(--dotted-line)}
#inventory-tool #bottom .low-stock .location .product:hover {background: var(--light-yellow)}
#inventory-tool #bottom .low-stock .location .product input {position:absolute; top:11px; left:10px;}
#inventory-tool #bottom .low-stock .location .product .product-name {display: block}
#inventory-tool #bottom .low-stock .location .product em {font-weight:300}

/* orders */
#inventory-tool #bottom .orders {}
	#inventory-tool #bottom .completed-orders .orders {margin-top: 20px}
	#inventory-tool #bottom .dashboard .orders {border-top: 1px solid #E3E3E3}
#inventory-tool #bottom .orders > * {width:50%; padding: 0 14px 30px}
#inventory-tool #bottom .orders > *+* {border-left: 1px solid #E3E3E3}
#inventory-tool #bottom .orders > *:first-child {padding-left:0}
#inventory-tool #bottom .orders > *:last-child {padding-right:0}
#inventory-tool #bottom .orders .header {position: sticky;top: 42px;background: #fff;padding: 1rem 0 0 40px;margin: 0 0 1em;z-index:1}
#inventory-tool #bottom .orders .header:before {top:15px}
#inventory-tool #bottom .orders .header:after {content:""; pointer-events: none; display: block; height: 20px; width:100%; position:absolute; bottom:-20px; left:0; background:linear-gradient(0deg, rgba(255,255,255,0) 0%, rgba(255,255,255,1) 30%)}
#inventory-tool #bottom .orders .header .item-count {font-weight: 600;}
#inventory-tool #bottom .orders .filter {font-weight: 500;font-size: 12px;text-align: left;color: #333;}
#inventory-tool #bottom .orders .filter select {width:203px; margin:0 0 28px 5px; height: 24px;}
#inventory-tool #bottom .orders .order-box {background: #f7f7f7; width:100%; border: 1px solid #e3e3e3;}
#inventory-tool #bottom .orders .order-box + .order-box {border-top:0}
#inventory-tool #bottom .orders .order-box:hover {background: var(--light-yellow)}
#inventory-tool #bottom .orders .order-box td {padding: 2px 14px; position:relative; font-weight: 500; font-size: 12px; text-align: left; color: rgba(0, 0, 0, 0.7);}
#inventory-tool #bottom .orders .order-box tr:last-child td {padding-bottom: 25px;}
#inventory-tool #bottom .orders .order-box td:first-child {font-weight: 300; white-space:nowrap; font-style: italic;font-size: 11px;text-align: left;color: rgba(0, 0, 0, 0.7);}
#inventory-tool #bottom .orders .order-box td + td {padding-left: 0; width: 100%}
#inventory-tool #bottom .orders .order-box .order-number td {padding-top: 25px; padding-bottom: 11px; font-style:normal; font-weight: bold;font-size: 14px;color: #000;}
#inventory-tool #bottom .orders .order-box .order-number td a:not(.small-red-button) {color: var(--red);}
#inventory-tool #bottom .orders .order-box .order-number td a:not(.small-red-button):is(:hover, :focus-visible) {color: var(--dark-red);}
#inventory-tool #bottom .orders .order-box .order-number td .small-red-button {position:absolute; top:17px; right:14px; line-height: 21px; padding: 0 8px; font-weight: 400; text-transform: lowercase;}
#inventory-tool #bottom .orders .order-box .order-total td {font-weight:700; font-style: normal;}
#inventory-tool #bottom .orders .order-box .priority td:first-child {padding-right: 0;}
#inventory-tool #bottom .orders .order-box .priority td:last-child {padding-left: 0;}
#inventory-tool #bottom .orders .order-box .priority td span {display: block; line-height: 1.25rem;}
#inventory-tool #bottom .orders .order-box .priority td:first-child span {padding-left: 0.5em; margin-left: -0.5em; width:calc(100% + 0.5em); border-radius: 3px 0 0 3px;}
#inventory-tool #bottom .orders .order-box .priority td:last-child span {border-radius: 0 3px 3px 0;}
#inventory-tool #bottom .orders .order-box .priority-high td span {background: red; color:#fff;}
#inventory-tool #bottom .orders .order-box .priority-medium td span {background: #FFEF00;}
#inventory-tool #bottom .orders .order-box .priority-low td span {background: #9EFF95;}
#inventory-tool #bottom .orders .order-box td .status {position:relative;}
#inventory-tool #bottom .orders .order-box td .update-status {font-size: 10px; cursor:pointer; border:0; outline:none; background:none; text-align: left;color: var(--red); line-height: 16px; display: inline-block}
#inventory-tool #bottom .orders .order-box td .update-status:hover {color:var(--dark-red)}
#inventory-tool #bottom .orders .order-box td .update-status:before {content:""; padding-left:16px; background: url(/images/inventory-tool/refresh-red.svg) no-repeat center left}
#inventory-tool #bottom .orders .order-box td .status-box {display: none; z-index:1; position:absolute; padding: 15px; top:26px; left:0; width:245px; background:#fff; border-radius: 5px; background: #fff; box-shadow: 0px 4px 24px rgba(0, 0, 0, 0.31);}
#inventory-tool #bottom .orders .order-box td .status-box:before {content:""; width:16px; height: 7px; display: block; position:absolute; top:-7px; left:6px; background: url(/images/inventory-tool/white-triangle.svg) no-repeat center}
#inventory-tool #bottom .orders .order-box td .status-box .title {display: block; margin-bottom:5px; font-size: 14px; text-align: left; color: #000;}
#inventory-tool #bottom .orders .order-box td .status-box input[type="text"],
#inventory-tool #bottom .orders .order-box td .status-box select {width:100%; font-size: 12px; color: #333; padding: 0 5px; margin: 0 0 5px; height: 24px; border-radius: 2px; background: #fff; border: 1px solid #ccc; appearance: none; -webkit-appearance: none; -moz-appearance: none;}
#inventory-tool #bottom .orders .order-box td .status-box select {margin-bottom:8px; background:#fff url(/images/inventory-tool/select-arrow.svg) no-repeat calc(100% - 7px) 50%}
#inventory-tool #bottom .orders .order-box td .status-box .cancel {text-shadow: none !important;box-shadow: none !important;display: inline-block;cursor: pointer;border-radius: 2px;background: #fff;color: #b4b4b4;font-size: 12px;line-height: 26px;padding: 0 12px;}
#inventory-tool #bottom .orders .order-box td .status-box .cancel:hover {color: var(--grey)}
#inventory-tool #bottom .orders .order-box td .combine {font-style: normal; cursor:pointer; display:block; padding:5px 0; font-weight:500; font-size:12px}
#inventory-tool #bottom .orders .order-box td .combine:hover {color:var(--bright-blue)}
#inventory-tool #bottom .orders .order-box.selected {border:1px solid var(--bright-blue); background:var(--light-blue)}
#inventory-tool #bottom .orders .orders-total {
	position: sticky;
	bottom:0;
	text-align: right;
	color:#000;
	width: 100%;
	border: 0;
	font-size: 18px;
  	font-weight: 600;
	padding: 30px 14px;
	background: linear-gradient(rgba(255, 255, 255, 0) 0, rgba(255, 255, 255, 0.95) 50px);
}
#inventory-tool #bottom .orders .orders-total span {
	margin-right: 10px;
}
#inventory-tool #bottom .orders .order-column .sticky-action-panel {opacity:0; pointer-events:none; transition:ease all 200ms; position: sticky;bottom: 0;width: 100%;padding: 0.5em 0 2em;background: #fff;text-align: center;margin-top: 2em;}
#inventory-tool #bottom .orders .order-column.show-action-panel .sticky-action-panel {opacity:1; pointer-events:all}
#inventory-tool #bottom .orders .order-column .sticky-action-panel:before {content: "";pointer-events: none;display: block;height: 20px;width: 100%;position: absolute;top: -20px;left: 0;background: linear-gradient(180deg, rgba(255,255,255,0) 0%, rgba(255,255,255,1) 100%);}
#inventory-tool #bottom .orders .order-column .sticky-action-panel button {background:var(--bright-blue); color:#fff; display: block; border-radius: 2px; width:100%; line-height: 30px; padding: 0 8px; font-weight: 400;}
#inventory-tool #bottom .orders .order-column .sticky-action-panel button:hover {background:var(--dark-blue);}
#inventory-tool #bottom .search-and-add-products .search-products {width:242px; margin-right:12px}
#inventory-tool #bottom .view-order .search-and-add-products .large-red-button {white-space:nowrap}
#inventory-tool #bottom .view-order .order-brief span {display: inline-block; font-weight:400; color:#666; font-size: 14px; padding-right: 14px}
#inventory-tool #bottom .view-order .order-brief span em {font-size: 12px; font-weight:300}
#inventory-tool #bottom .view-order .order-brief .status {position:relative; margin-top:12px; display: flex; flex-direction: row; flex-wrap: nowrap; -webkit-justify-content: flex-start; -ms-flex-pack: start; justify-content: flex-start; -webkit-align-content: flex-start; -ms-flex-line-pack: start; align-content: flex-start;  align-items: flex-start;}
#inventory-tool #bottom .view-order .order-brief .status > div {padding-top: 4px; position:relative}
#inventory-tool #bottom .view-order .order-brief .status .status-text > em {margin-right: 5px}
#inventory-tool #bottom .view-order .order-brief .status .status-box {top: 29px; z-index:2; left: 40px;}
#inventory-tool #bottom .view-order .order-brief .status .small-red-button {margin-left: 20px}
#inventory-tool #bottom .view-order .order-brief .status .small-red-button:before {content:""; padding-left:16px; background: url(/images/inventory-tool/small-white-check.svg) no-repeat center left}
#inventory-tool #bottom .view-order .order-brief .status .small-blue-button.order-complete:before {content:""; padding-left:16px; background: url(/images/inventory-tool/small-white-check.svg) no-repeat center left}
#inventory-tool #bottom .view-order .order-brief .status .small-blue-button.uncancel-order:before {content:""; filter: brightness(100); padding-left:16px; background: url(/images/inventory-tool/smal-red-x.svg) no-repeat center left}
#inventory-tool #bottom .view-order .order-brief .update-status {font-size: 10px; margin:0 0 0 5px; cursor:pointer; border:0; outline:none; background:none; text-align: left;color: var(--red); line-height: 16px; display: inline-block}
#inventory-tool #bottom .view-order .order-brief .update-status:hover {color:var(--dark-red)}
#inventory-tool #bottom .view-order .order-brief .update-status:before {content:""; padding-left:16px; background: url(/images/inventory-tool/refresh-red.svg) no-repeat center left}
#inventory-tool #bottom .view-order .order-brief .status-box {display: none; position:absolute; padding: 15px; top:3px; left:0; width:365px; background:#fff; border-radius: 5px; background: #fff; box-shadow: 0px 4px 24px rgba(0, 0, 0, 0.31);}
#inventory-tool #bottom .view-order .order-brief .status-box:before {content:""; width:16px; height: 7px; display: block; position:absolute; top:-7px; left:6px; background: url(/images/inventory-tool/white-triangle.svg) no-repeat center}
#inventory-tool #bottom .view-order .order-brief .status-box .title {display: block;  font-size: 14px; text-align: left; color: #000;}
#inventory-tool #bottom .view-order .order-brief .status-box input[type="text"] {width:100%; font-size: 12px; color: #333; padding: 0 5px; margin: 5px 0 8px; height: 24px; border-radius: 2px; background: #fff; border: 1px solid #ccc; appearance: none; -webkit-appearance: none; -moz-appearance: none;}
#inventory-tool #bottom .view-order .order-brief .status-box .cancel {text-shadow: none !important;box-shadow: none !important;display: inline-block;cursor: pointer;border-radius: 2px;background: #fff;color: #b4b4b4;font-size: 12px;line-height: 26px;padding: 0 12px;}
#inventory-tool #bottom .view-order .order-brief .status-box .cancel:hover {color: var(--grey)}
#inventory-tool #bottom .view-order .order-brief .associated-files {position:relative; margin-top:12px; display: flex; flex-direction: row; flex-wrap: nowrap; -webkit-justify-content: flex-start; -ms-flex-pack: start; justify-content: flex-start; -webkit-align-content: flex-start; -ms-flex-line-pack: start; align-content: flex-start;  align-items: flex-start;}
#inventory-tool #bottom .view-order .order-brief .associated-files em {font-size: 12px;font-weight: 300;}
#inventory-tool #bottom .view-order .order-brief .associated-files .file-list {margin-left:10px; position:relative}
#inventory-tool #bottom .view-order .order-brief .associated-files .file-list ul {margin-top:10px}
#inventory-tool #bottom .view-order .order-brief .associated-files .file-list ul li:before {content:"\-"; margin-right:5px;}
#inventory-tool #bottom .view-order .order-brief .associated-files .file-list ul li .small-grey-link {color:var(--grey); margin-left:0.5rem; font-style:italic; font-size: 12px}
#inventory-tool #bottom .view-order .order-brief .associated-files .file-list ul li .small-grey-link:hover {color:var(--red)}
#inventory-tool #bottom .view-order .order-brief .associated-files .file-list ul li .small-grey-link span {margin:0; padding:0; color:var(--red); font-style: normal;}
#inventory-tool #bottom .view-order .order-brief .associated-files .file-upload-box {display: none; z-index:2; position: absolute; padding: 15px; left: 0; width: 265px; background: #fff; border-radius: 5px; background: #fff; box-shadow: 0px 4px 24px rgba(0, 0, 0, 0.31);}
#inventory-tool #bottom .view-order .order-brief .associated-files .file-upload-box label {font-size:12px; margin-bottom:10px; display: flex;flex-direction: row;flex-wrap: nowrap;-webkit-justify-content: center;-ms-flex-pack: center;justify-content: center;align-content: center;align-items: center;}
#inventory-tool #bottom .view-order .order-brief .associated-files .file-upload-box label input[type="text"],
#inventory-tool #bottom .view-order .order-brief .associated-files .file-upload-box label input[type="file"] {width:100%; margin-left: 10px; font-size: 12px; color: #333; padding: 0 5px; height: 24px; border-radius: 2px; background: #fff; border: 1px solid #ccc; appearance: none; -webkit-appearance: none; -moz-appearance: none;}
#inventory-tool #bottom .view-order .order-brief .associated-files .file-upload-box label input[type="file"] {height:auto; border:0}
#inventory-tool #bottom .view-order .order-brief .associated-files .file-upload-box .cancel {text-shadow: none !important;box-shadow: none !important;display: inline-block;cursor: pointer;border-radius: 2px;background: #fff;color: #b4b4b4;font-size: 12px;line-height: 26px;padding: 0 12px;}
#inventory-tool #bottom .view-order .order-brief .associated-files .file-upload-box .cancel:hover {color: var(--grey)}
#inventory-tool #bottom .view-order .order-brief .add-a-return-note {position:relative; margin-top:12px; display: flex; flex-direction: row; flex-wrap: nowrap; -webkit-justify-content: flex-start; -ms-flex-pack: start; justify-content: flex-start; -webkit-align-content: flex-start; -ms-flex-line-pack: start; align-content: flex-start;  align-items: flex-start;}
#inventory-tool #bottom .view-order .order-brief .add-a-return-note em {font-size: 12px;font-weight: 300;}
#inventory-tool #bottom .view-order .order-brief .add-a-return-note .add-a-note {margin-left:10px; position:relative}
#inventory-tool #bottom .view-order .order-brief .add-a-return-note .add-a-note ul {margin-top:10px}
#inventory-tool #bottom .view-order .order-brief .add-a-return-note .add-a-note ul li:before {content:"\-"; margin-right:5px;}
#inventory-tool #bottom .view-order .order-brief .add-a-return-note .add-a-note ul li .small-grey-link {color:var(--grey); margin-left:0.5rem; font-style:italic; font-size: 12px}
#inventory-tool #bottom .view-order .order-brief .add-a-return-note .add-a-note ul li .small-grey-link:hover {color:var(--red)}
#inventory-tool #bottom .view-order .order-brief .add-a-return-note .add-a-note ul li .small-grey-link span {margin:0; padding:0; color:var(--red); font-style: normal;}
#inventory-tool #bottom .view-order .order-brief .add-a-return-note .add-a-note-box {display: none; z-index:2; position: absolute; padding: 15px; left: 0; width: 265px; background: #fff; border-radius: 5px; background: #fff; box-shadow: 0px 4px 24px rgba(0, 0, 0, 0.31);}
#inventory-tool #bottom .view-order .order-brief .add-a-return-note .add-a-note-box textarea {width:100%; height:5.5rem;}
#inventory-tool #bottom .view-order .order-brief .add-a-return-note .add-a-note-box .cancel {text-shadow: none !important;box-shadow: none !important;display: inline-block;cursor: pointer;border-radius: 2px;background: #fff;color: #b4b4b4;font-size: 12px;line-height: 26px;padding: 0 12px;}
#inventory-tool #bottom .view-order .order-brief .add-a-return-note .add-a-note-box .cancel:hover {color: var(--grey)}

#inventory-tool #bottom .place-an-order .order-for strong {font-weight:600; color:#333333}
#inventory-tool #bottom .place-an-order .order-for label {margin-left: 10px; font-weight:600; cursor:pointer}
#inventory-tool #bottom .place-an-order .order-for label.bioserv {color:var(--green)}
#inventory-tool #bottom .place-an-order .order-for label.shredsmart {color:var(--shredsmart-blue)}
#inventory-tool #bottom .place-an-order .order-for select {margin:0 20px; height:30px}
#inventory-tool #bottom .place-an-order .order-for .order-title {font-weight: 400; color:#333333}
#inventory-tool #bottom .place-an-order .order-for .order-title input,
#inventory-tool #bottom .place-an-order .add-a-product input {border-radius: 2px; width: 200px; font-size: 14px; color: #333; padding: 0 30px 0 10px; background: #fff; height: 30px; border: 1px solid #ccc;}
#inventory-tool #bottom .place-an-order .add-a-product {color:#333;}
#inventory-tool #bottom .place-an-order .add-a-product input {color:#333; cursor: pointer; background: #fff url(/images/inventory-tool/select-arrow.svg) no-repeat calc(100% - 1em) center;}
#inventory-tool #bottom .place-an-order .add-a-product ::-webkit-input-placeholder {color: #333; opacity: 1;}
  #inventory-tool #bottom .place-an-order .add-a-product ::-moz-placeholder {color: #333; opacity: 1;}
  #inventory-tool #bottom .place-an-order .add-a-product :-ms-input-placeholder {color: #333; opacity: 1;}
  #inventory-tool #bottom .place-an-order .add-a-product :-moz-placeholder {color: #333; opacity: 1;}
#inventory-tool #bottom .completed-orders .header .filter {font-size:12px; color:#333333; font-weight:400}
#inventory-tool #bottom .completed-orders .header .filter select {height:24px; margin-left: 5px}
#inventory-tool #bottom .view-order-pdf .header {margin:0}
#inventory-tool #bottom .view-order-pdf .order-brief {margin-top: 30px}
#inventory-tool #bottom .view-order-pdf .order-brief span {display: inline-block; line-height: 30px; font-weight: 400;color: #666;font-size: 14px;padding-right: 14px;}
#inventory-tool #bottom .view-order-pdf .order-brief span em {font-size: 12px;font-weight: 300;}
#inventory-tool #bottom .view-order-pdf .products-table {margin-top: 30px}
#inventory-tool #bottom .view-order-pdf .products-table th:first-child,
#inventory-tool #bottom .view-order-pdf .products-table td:first-child {padding-left:0}
#inventory-tool #bottom .view-order-pdf .products-table th:last-child,
#inventory-tool #bottom .view-order-pdf .products-table td:last-child {padding-right:0}

#inventory-tool #bottom .completed-orders .multiple-filters > *+* {margin-left: 1rem}
#inventory-tool #bottom .completed-orders .multiple-filters input[type=date] {border-radius:2px; background:#fff; box-shadow: none; height:24px}


/* recurring orders */
#inventory-tool #bottom .recurring .orders .order-grid {
    display: grid;
    gap: 1em;
    grid-template-columns: repeat( auto-fit, minmax(350px, 1fr) );
    padding: 0;
    width: 100%;
}

#inventory-tool #bottom .recurring .orders .order-grid table {
	border: 1px solid #e3e3e3;
	width: 100%;
}

#inventory-tool #bottom .recurring .orders .orders-total {
	padding: 0;
	position: relative;
}

#inventory-tool #bottom .recurring-options {
    align-items: center;
    border-top: 1px dashed #ccc;
    color:#000;
    display: flex;
    flex-wrap:wrap;
    gap: 1em 2em;
    justify-content: flex-end;
    padding: 2em 0;
}

#inventory-tool #bottom .recurring-options strong {
    font-weight: 700;
}

#inventory-tool #bottom .recurring-options .full-width,
#inventory-tool #bottom .recurring-options .repeatWeekly,
#inventory-tool #bottom .recurring-options .checkbox-list,
#inventory-tool #bottom .recurring-options .recurring-repeats,
#inventory-tool #bottom .recurring-options .recurring-frequency,
#inventory-tool #bottom .recurring-options .recurring-time-group,
#inventory-tool #bottom .recurring-options .recurring-time-group > * {
	display: flex;
	justify-content: flex-end;
	align-items: center;
}

#inventory-tool #bottom .recurring-options .full-width {
	gap:2em;
	width: 100%;
}

#inventory-tool #bottom .recurring-options .repeatWeekly,
#inventory-tool #bottom .recurring-options .checkbox-list {
	gap:0.5em;
}


#inventory-tool #bottom .recurring-options .recurring-repeats,
#inventory-tool #bottom .recurring-options .recurring-frequency {
	gap: 0.25em;
}

#inventory-tool #bottom .recurring-options .recurring-time-group{
	gap: 0.5em;
}


#inventory-tool #bottom .recurring-options .recurring-time-group .radio,
#inventory-tool #bottom .recurring-options .recurring-time-group > *{
	display: flex;
	justify-content: flex-end;
	align-items: center;
	gap:0.125em;
}

#inventory-tool #bottom .recurring-options .recurring-time-group .radio {
	margin-right: 0.25em;
}

#inventory-tool #bottom #recurring-fields .summary {
	display: inline-block;
  	padding: 1em 2em;
  	color: #000;
  	background: var(--light-grey);
  	border-radius: 10px;
}

#inventory-tool #bottom #recurring-fields + .submit .vendor-payment-types {
	margin-bottom: 1em;
}



/* vendors */
#inventory-tool #bottom .manage-vendors .vendors-list thead th {padding: 8px 18px; font-style: italic;font-size: 12px;text-align: left;color: rgba(0, 0, 0, 0.7);}
#inventory-tool #bottom .manage-vendors .vendors-list tbody tr {background: #f7f7f7; border: 1px solid #e3e3e3;}
#inventory-tool #bottom .manage-vendors .vendors-list tbody tr:hover {background: var(--light-yellow)}
#inventory-tool #bottom .manage-vendors .vendors-list tbody tr + tr {border-top:0}
#inventory-tool #bottom .manage-vendors .vendors-list tbody tr td {padding: 16px 18px; font-weight:500; vertical-align: middle; font-size: 12px; text-align: left; color: rgba(0, 0, 0, 0.7);}
#inventory-tool #bottom .manage-vendors .vendors-list tbody tr td:first-child {font-size: 14px; font-weight:600; color:#000}
#inventory-tool #bottom .manage-vendors .vendors-list tbody tr td:last-child {text-align: right;}
#inventory-tool #bottom .single-vendor .budget-disclaimer {font-size: 12px; border-radius: 3px; text-align: left;color: var(--orange);background: var(--light-orange); padding: 0 20px; line-height: 37px;}
#inventory-tool #bottom .single-vendor .budget-disclaimer strong {font-size: 14px; font-weight:600; color:var(--orange)}
#inventory-tool #bottom .single-vendor .vendor-contact-info {margin-top: 20px}
#inventory-tool #bottom .single-vendor .vendor-contact-info .title {display: block; color:#333; font-weight: 600; font-size:14px; margin-bottom: 12px}
#inventory-tool #bottom .single-vendor .vendor-contact-info label {font-style: italic; line-height:1.25em; font-size: 12px;text-align: left;color: #666}
#inventory-tool #bottom .single-vendor .vendor-contact-info input,
#inventory-tool #bottom .single-vendor .vendor-contact-info select {height: 28px; font-size: 14px; color:#333; width:100%}
#inventory-tool #bottom .single-vendor .vendor-contact-info input {padding-left: 5px; padding-right:5px}
#inventory-tool #bottom .single-vendor .vendor-contact-info table td {width:1%; padding: 0 10px 10px 0}
#inventory-tool #bottom .single-vendor .vendor-contact-info table td:nth-child(even) {padding: 0 0 10px 10px}
#inventory-tool #bottom .single-vendor .vendor-contact-info table td td {padding-bottom:0}
#inventory-tool #bottom .single-vendor .vendor-contact-info table tr td[colspan="2"] {text-align: right; padding-top: 15px; padding-right:0}
#inventory-tool #bottom .single-vendor .vendor-contact-info table tr td[colspan="2"] button {line-height:30px; width:108px}
#inventory-tool #bottom .single-vendor .associated-products {margin-top:50px; padding-top:50px; border-top:1px solid #E3E3E3}
#inventory-tool #bottom .single-vendor .associated-products .header {margin:0}
#inventory-tool #bottom .single-vendor .associated-products .add-a-product label {display: block; line-height: 28px}
#inventory-tool #bottom .single-vendor .associated-products .add-a-product em {font-size: 14px; font-weight:300; margin-right: 10px; text-align: left;color: #333;}
#inventory-tool #bottom .single-vendor .associated-products .add-a-product select {height:30px; font-size: 14px; width:242px; margin-right: 10px}
#inventory-tool #bottom .single-vendor .associated-products .add-a-product button {line-height:30px; width:108px}
#inventory-tool #bottom .single-vendor .associated-products .products-table th,
#inventory-tool #bottom .single-vendor .associated-products .products-table td {text-align: left; padding-left: 23px; padding-right:23px}
#inventory-tool #bottom .single-vendor .associated-products .products-table th:first-child,
#inventory-tool #bottom .single-vendor .associated-products .products-table td:first-child {padding-left: 10px}
#inventory-tool #bottom .single-vendor .associated-products .products-table td {font-size: 12px; padding-top: 16px; padding-bottom:16px; line-height: 14px}
#inventory-tool #bottom .single-vendor .associated-products .products-table td:first-child {font-size: 14px; line-height: 16px; color:#000}
#inventory-tool #bottom .single-vendor .associated-products .products-table td .remove-product {display:  inline-block; background:none; outline:none; box-shadow:none; font-size: 12px; line-height: 16px; text-align: left; color: #a43538;}
#inventory-tool #bottom .single-vendor .associated-products .products-table td .remove-product:before {content:""; padding-left: 14px; background: url(/images/inventory-tool/smal-red-x.svg) no-repeat center left}
#inventory-tool #bottom .single-vendor .associated-products .products-table td .remove-product:hover {color:var(--grey)}
#inventory-tool #bottom .single-vendor .associated-products .products-table tfoot .totals td {text-align: right;}


@media screen and (max-width: 50em) {
	.inputfile + label strong {
		display: block;
	}
}




/* Route Control */
#contentCol:has(#route-control) {
    font-size: 1rem;
    height: calc(100vh - 2.625em);
    height: calc(100dvh - 2.625em);
    overflow: hidden;
}

#route-control {

	--green: #47812A;
	--greige: #E9E9E9;
	--light-blue: #A8CCF6;
	--dark-blue: #002B5E;


	background: var(--greige);
	font-size: 1rem;
	display: flex;
	height: 100%;
	width: 100%;
}

#route-control .sidebar {
	display: flex;
	flex-direction: column;
	overflow: auto;
	width: 22.5em;
}

#route-control .sidebar-header {
	background: linear-gradient(0deg, rgba(233,233,233,0.00) 0%, var(--greige) 12px);
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	padding: 1em 1em 0.5em;
	position: sticky;
	top: 0;
	z-index: 2;
}

#route-control .sidebar-header span {
    color: #000;
    font-size: 0.875em;
    font-weight: 700;
}

#route-control .sidebar-header span i {
	color: #595959;
	font-weight: 400;
}


#route-control #stopList {
	counter-reset: stops;
	display: flex;
	flex-direction: column;
	flex-shrink: 0;
	padding: 0 1em;
	position: relative;
	overflow-x:hidden;
}

#route-control #stopList:before {
	content: "";
	display:block;
	position: absolute;
	top: 1.5em;
	left: 1.75em;
	border-right: 1px solid #ccc;
	bottom: 1.5em;
}

#route-control #stopList li {
	align-items: center;
	counter-increment: stops;
	display: flex;
	flex-shrink: 0;
	gap: 0.375em;
	overflow: hidden;
	padding: 0.25em 0;
	position: relative;
}

#route-control #stopList li .grabber {
	background: url(/images/icons/icon-grabber.svg) no-repeat center;
	background-color: var(--greige);
	display: block;
	flex: 1 0 auto;
	height: 1.5em;
	position: relative;
	width: 1.5em;
	z-index: 1;
}

#route-control #stopList li .counter:before {
	color: #666;
	content: counters(stops, ".") ".";
	display: block;
	font-size: 0.875em;
	min-width: 1.375em;
}

#route-control #stopList li .address {
    align-items: center;
    align-items: flex-start;
    background: #fff;
    border: 1px solid #D2D2D2;
    border-radius: 0.625em;
	color:#000;
    display: flex;
    flex: 1 1 auto;
    flex-direction: column;
    font-size: 0.875em;
    line-height: 1.25em;
    min-height: 2.5em;
    padding: 0.45em 0.625em;
    text-align: left;
    width: 100%;
}

#route-control #stopList li .address span {
	color:#000;
}


#route-control #stopList li .gps {
    aspect-ratio: 1/1;
    background: url(/images/icons/icon-arrow-dark-blue.svg) no-repeat center;
    background-color: var(--light-blue);
	box-shadow: 0 1px 0 0 #789BC3;	
    border-radius: 50%;
    display: block;
    flex-shrink: 0;
    width: 2.625em;
}

#route-control .sidebar-footer {
	background: linear-gradient(180deg, rgba(233,233,233,0.00) 0%, #E9E9E9 12px);
	display: flex;
	bottom: 0;
	margin-top: auto;
	padding: 1em;
	justify-content: space-between;
	gap: 0.5em;
	position: sticky;
	z-index: 1;
}

#route-control .sidebar-footer button {
	border-radius: 0.5em;
	display: block;
	font-size: 1em;
	font-weight: 700;
	flex: 1 1 auto;
	padding: 0.3125em 0.65em;
}

#route-control .sidebar-footer button.reset {
	color: #666666;
	text-decoration: underline;
}

#route-control .sidebar-footer button.reset:is(:hover, :focus-visible) {
	text-decoration: none;
}

#route-control .sidebar-footer button.blue {
	background: var(--light-blue);
	box-shadow: 0 1px 0 0 #789BC3;	
	color: var(--dark-blue);
}

#route-control .sidebar-footer button.blue:is(:hover, :focus-visible) {
	background: var(--dark-blue);
	box-shadow: 0 1px 0 0 var(--dark-blue);	
	color: #fff;
}

#route-control .sidebar-footer button.save {
	background: var(--green);
	box-shadow: 0 1px 0 0 #23480A;	
	color: #fff;
	text-shadow: 0 1px 0 #23480A;
}

#route-control .sidebar-footer button.save:is(:hover, :focus-visible) {
	background: #23480A;
	color: #fff;
}

#route-control #map-container {
	background: #FFFFFF;
	box-shadow: -1px 0 0 0 rgba(180, 180, 182, 0.25), -4px 0 8px 0 rgba(0, 0, 0, 0.25);
	flex: 1 1 auto;
	position: relative;
}

#route-control #map-container .route-time {
    background: #fff;
    border-radius: 8px;
    bottom: 1em;
    box-shadow: 0 1px 0 0 rgba(0,0,0,0.125), 0 5px 10px -5px rgba(0,0,0,0.5);
    color: #000;
    font-size: 0.875em;
    left: 50%;
    padding: 0.3125em 0.65em;
    position: absolute;
    transform: translateX(-50%);
    z-index: 1;
}


#route-control #map-container #map {
	height: 100%;
	left: 0;
	position: absolute;
	top: 0;
	width: 100%;
}






#topBar + .document-list {padding:2em; width:100%; float:left}
#topBar + .document-list li {display: flex; padding:0.25em 0; justify-content: space-between;}
#topBar + .document-list li:hover {background: var(--light-yellow)}
#topBar + .document-list li + li {border-top: 1px dashed #ccc}
#topBar + .document-list li a {flex: 1 1 auto; width:100%; font-size:1rem; padding:0.25em 0.25em 0.25em 2rem; position:relative; display: block; line-height:1.35em;}
#topBar + .document-list li a:before {position: absolute;top: 5px;left: 11px;width: 1rem;height: 1rem;}
#topBar + .document-list li a[href$=".pdf"]:before {content:""; display: block; background: url(/images/icons/file-pdf.svg) no-repeat center}
#topBar + .document-list li a[href$=".doc"]:before,
#topBar + .document-list li a[href$=".docx"]:before {content:""; display: block; background: url(/images/icons/file-word.svg) no-repeat center}
#topBar + .document-list li a[href$=".xls"]:before,
#topBar + .document-list li a[href$=".xlxs"]:before,
#topBar + .document-list li a[href$=".xlsm"]:before,
#topBar + .document-list li a[href$=".xltx"]:before,
#topBar + .document-list li a[href$=".xltm"]:before  {content:""; display: block; background: url(/images/icons/file-excel.svg) no-repeat center}
#topBar + .document-list li a[href$=".jpg"]:before,
#topBar + .document-list li a[href$=".png"]:before  {content:""; display: block; background: url(/images/icons/file-image.svg) no-repeat center}
#topBar + .document-list li .manage {width:auto; display: flex; justify-content: space-between; align-items: center; align-content: center;}
#topBar + .document-list li .manage button {display: inline-block; white-space: nowrap; cursor: pointer;border-radius: 2px;background: none;font-size: 14px;line-height: 25px;padding: 0 14px;}
#topBar + .document-list li .manage button.edit {color: var(--bright-blue);}
#topBar + .document-list li .manage button.edit:hover {background: var(--bright-blue); color:#fff}
#topBar + .document-list li .manage button.delete {color: var(--red);}
#topBar + .document-list li .manage button.delete:hover {background: var(--red); color:#fff}


#popover {display: none; position: fixed; z-index: 9999; top: 0; left:0; width:100%; height: 100%; padding: 1em; background:rgba(0,0,0,0.9); flex-direction: row; flex-wrap: nowrap; -webkit-justify-content: center; -ms-flex-pack: center; justify-content: center; align-content: center;  align-items: center;}
#popover .container {max-width: 40em; position: relative}
#popover .container .close {position: absolute; cursor: pointer; transition: ease all 200ms; right: 0; top: -1.5em; width: 1.5em; height: 1.5em; font-size: 2.25em; line-height: 1.5em; text-align: right; color: #fff;}
#popover .container .close:hover {opacity: 0.5}
#popover .container .popover-wrap {padding: 2em; overflow: auto; text-align: left; background:#fff; border-radius: 4px; max-width: 40em}
#popover .container button,
#popover .container [type="submit"] {float: right; padding: 0.75rem 1.25rem; line-height: 1rem; font-size: 1rem}
#popover .container textarea {min-height: 10em; min-width:20em}

/*----- FOOTER -----*/
footer{position:absolute;left:0;bottom:10px;text-align:center;width:100%;color:#2a500e;font-size:.9em}


/*----- login ELEMENTS -----*/
#loginForm{width:308px;margin:0 auto}
#loginForm input{height:49px;width:250px;font-size:22px;padding:10px;margin-bottom:10px;color:#666;background:#fff}
#loginForm input.login{width:48px;height:48px;padding:5px 5px 5px 6px;float:right;cursor:pointer;background:#97181c url(../images/icons/30x30/login.png) no-repeat center center;border:3px solid #fff;border-radius: 8px;display:block;box-shadow: inset 0px -1px 0px rgba(0,0,0,0.4); }
#loginForm input.login span{width:30px;height:30px;display:block;overflow:hidden;background-repeat:no-repeat;background-position:0 0}
#loginForm #lblError{display:block;color:#DEE9D8;padding-bottom:10px}
#loginForm #lblError em{color:#fff}

/*----- Manage -----*/
.manage{width:100%;float:left;clear:both}
.manage th{padding:7px 20px 7px 0;font-size:1em;background:#86796a url(../images/navigation/texture_overlay.png) repeat-x 0 0;color:#fefefe;text-shadow: 1px -1px 0 rgba(0,0,0,0.4)}
.manage tr th:first-child{padding:12px 15px 12px 11px}
.manage th.right, .manageEdit td.right{text-align:right}
.manage th.sort{cursor:pointer}
.manage th.sort img{margin-left:5px}
.manage td{padding:4px 20px 4px 0;border-bottom:1px solid #d0cbc5;color:#000;border-top:1px solid #f6f5f4;background:#edeae8}
.manage tr td:first-child{padding:4px 10px}
.manage img.preload{display: none;position: absolute;z-index: 9900;top: 0px; border: solid 1px #FFFFFF}
.manage td.icons{padding-left:5px;width:45px}
.manage td.icons img{float:left;margin:3px 5px 0 0}
.manage .hidden{font-style:italic;color:red}
.button{text-align:right;padding:10px 0}
.manage .inactive td span.arwDwn, .manage .inactive td span.arwUp{visibility:hidden}
.manage .inactive td{color:#808184}
.manage span.greenCheck, .manage span.redCheck, .manage span.arwDwn, .manage span.arwUp{width:24px;height:24px;display:block}
.manage span.greenCheck{background-position:-30px -456px}
.manage span.redCheck{background-position:-30px -480px}
.manage span.arwDwn{background-position:-30px -432px}
.manage span.arwUp{background-position:-30px -408px}
.options{width:100%;clear:both;float:left;padding-top:20px}
.options select{float:left;margin:0 15px 20px 30px;font-size:1em;border:1px solid #4d4d4d}
.plus{width:24px;height:24px;margin-top:1px;display:block;background-position:-30px -384px;float:left}
.mIcon span{width:16px;height:16px;display:block}
.manage .sub td{background:#f6f5f4}
.manage th span{width:16px;height:16px;}
.manage th span.arrow{background-position:-54px -320px;margin:0 auto}
.manage th span.refresh{background-position:-54px -336px;margin:0 auto}
.manage td.center{text-align:center}
.manage td em{color:#666;font-style:normal}
.manage tr th.mIcon:first-child,.manage tr td.mIcon:first-child{padding:0 5px 0 10px}
.manage tr th.mIcon,.manage tr td.mIcon{padding:0 5px 0 0}
.manage .mIcon span{width:24px;height:24px}
.manage .location span{background-position:-70px -168px}
.manage .company span{background-position:-70px -192px}
.manage .lock span{background-position:-54px -672px}
.manage .contact span{background-position:-94px -120px} /* contact header */
.manage .star span{background-position:-70px 0px} /* primary contact */
.manage .bullet span{background-position:-70px -24px} /* secondary contact */
.manage .checked span{background-position:-94px -48px} /* to-do header */
.manage .unchecked span{background-position:-70px -48px} /* to-do item */
.manage .upcoming span{background-position:-94px 0px} /* upcoming orders header */
.manage .recurring span{background-position:-74px -72px} /* recurring orders header */
.manage .refresh2 span{background-position:-70px -72px} /* repeating service order */
.manage .arrow2 span{background-position:-70px -96px} /* single service order */
.manage .history span{background-position:-94px -96px} /* order history header */
.manage .checkmark span{background-position:-70px -120px} /* completed service order */
.manage .dollarSign span{background-position:-70px -144px} /* invoice link */
.manage th.sales span{background-position:-94px -216px} /* sales header */
.manage td.sales span{background-position:-70px -216px} /* sales opp */
.manage td.due span{background-position:-70px -360px}
.manage td.overdue span{background-position:-70px -336px}
.manage td.future span{background-position:-70px -240px}
.manage td.toDos span{background-position:-70px -48px}
.manage td.date span{background-position:-54px -334px; height:20px; width:20px;}
.manage td.note span{background-position:-71px -408px}
.manage tr:hover td{background:#fff;cursor:pointer}
.manage td .noteClient{font-size:.9em; display:block;line-height:1.25em; font-style:italic}
.manage td .note{font-size:.9em; color:#666;display:block;line-height:1.25em;margin-top:5px}
.manage .completed span{background-position:-70px -382px}
#twoColContainer a{float:left;margin:5px 0 30px 10px;}
a.red{color:#a43538}
a.red:hover, a.red:active{color:#688f3c}
a.edit{font-style:italic}
#twoColContainer a.right{float:right;padding:5px 10px 0 0}
#twoColContainer a.bulky,#oneColContainer a.bulky{color:#fff;float:left;margin:5px 0 30px 5px;}
#twoColContainer .manage a,#oneColContainer .manage a{float:none;margin:0}

.manage td.login span{background: url("/images/icons/icon_badge_yellow.png") no-repeat 4px 5px;}


.manageEdit td{padding:4px 20px 4px 0}
.manageEdit.print td{padding:3px 0}
.manageEdit td.right{vertical-align:middle}
select{border:1px solid #cccdce;font-size:1em;color:#666}
select option{padding:0px 5px}
.manageEdit td.sep{padding:10px 0}
.manageEdit input[type=submit]{float:left;margin-right:10px}
.manageEdit .cancel{float:left;padding-top:3px;font-size:.95em}
.manageEdit td.top{vertical-align:top}
.manageEdit input[type=checkbox]{margin-bottom:8px}
.manageEdit tr td+td label{margin-right:10px}

/* error message */
.formError {
	background-color:#97181c;
	font-size:12px;
	border:0;
	padding: 5px 10px;
	color:#fff;
	display:none;
	margin:0 0 2px;
	z-index:1000;
	border-radius: 10px;

	-moz-box-shadow:0 2px 2px #333;
	-webkit-box-shadow:0 2px 2px #333;
}
.formError p {margin:0; }
.formError em {
	border:10px solid;
	border-color:#97181c transparent transparent;
	bottom:-17px;
	display:block;
	height:0;
	left:60px;
	position:absolute;
	width:0;
}

#filterClear { cursor:pointer;}

#ProductTable { width:98%;}
#ProductTable.print{width:100%}
#ProductTable thead th { font-style:italic; color:#666666; font-size:.9em;}
#ProductTable td{border-top:1px solid #e5e5e5}
#ProductTable.print th{border-bottom:1px solid #e5e5e5}
#ProductTable.print td{border-top:0;padding:3px 0}

#scheduleTable th, #scheduleTable td{font-size:1em;padding:3px 30px 3px 0}
#scheduleTable th{color:#666}
#scheduleTable td{color:#333;border-top:1px solid #D2DECC;}
#scheduleTable tr.thisweek td { color:Red;}

#warnings li{padding-left:30px;background:url(../images/icons/24x24/outstanding_item.png) no-repeat 0 0;margin-bottom:7px}

#route{padding:20px}
#mapContainer, #routeList{float:left}
#routeList{width:250px;color:#000;margin-right:20px}
#routeList li{padding:7px 5px;border-top:1px solid #D9D9D9;list-style-position:inside;clear:both}
#routeList li span{display:inline-block;float:right;width:212px;}
#routeList li em{font-style:normal;color:#808184}

#techStatus{padding:0 20px}
#techStatus .title{color:#000;display:block;padding:15px 10px 5px 10px;font-size:1.25em}
#techStatus div {
width:233px;
float:left;
margin-right:20px;
border-top: #edeae8 solid 1px;
margin-top:10px;
background-color:#edeae8;
box-shadow: 0px 4px 10px -3px rgba(0, 0, 0, .3), inset 0px 40px 40px -40px rgba(255, 255, 255, 1);
margin-bottom:30px;
}
#techStatus ul li{display:inline}
#techStatus ul li a{display:block;padding:7px 10px;width:233px;background:#E5ECDD;color:#2A500E;border-top:1px solid #ccc;float:left;clear:both}
#techStatus ul li.locationComplete a{background-color:#edeae8;color:#666}
#techStatus ul li.locationIncomplete a{background-color:#edeae8;color:#666}
#techStatus ul li a:hover, #techStatus ul li a:active{background-color:#eef7e4;color:#a43538}
#techStatus ul li.locationComplete a:hover, #techStatus ul li.locationComplete a:active{background-color:#ccc;color:#666;}
#techStatus ul li a span{float:left}
#techStatus .icon{width:16px;height:16px;display:block;margin-right:6px;background-position:-74px -568px}
#techStatus ul li.locationComplete .icon{background-position:-74px -385px}
#techStatus ul li.locationComplete a em{color:#a43538;display:block}
#techStatus ul li.locationIncomplete a em{color:#a43538;display:block}

#scheduleCal{padding:10px 20px 20px 20px}
#scheduleCal th{border-bottom:1px solid #ccc;padding:8px 5px 8px 10px;border-left:1px solid #ccc;border-bottom:1px solid #fff}
#scheduleCal .dates td{padding:4px 20px 4px 10px;font-size:1em;background:#86796a url(../images/navigation/texture_overlay.png) repeat-x 0 0;color:#fefefe;text-shadow: 1px -1px 0 rgba(0,0,0,0.4);border-left:1px solid #877969;border-bottom:1px solid #fff}
#scheduleCal td{padding:8px 20px 8px 10px;font-size:12px;border-left:1px solid #ccc;border-top:1px solid #fff;border-bottom:1px solid #fff}
#scheduleCal td.past{background:#f5f5f5}
#scheduleCal td.past a:link, #scheduleCal td.past a:visited{color:#777}
#scheduleCal td.past a:hover, #scheduleCal td.past a:active{color:#a43538}
#scheduleCal ul li{background:url(../images/icons/16x16/bullet.png) no-repeat 0 1px;padding-left:15px;}
#scheduleCal td.bottom{border-bottom:1px solid #ccc;padding:0}

p.word { background:url(/images/icons/16x16/page_word.png) no-repeat 0 4px; padding:4px 0 0 20px;}

.cal div{width:20%;float:left;border-left:1px solid #ccc;text-align:left}
.cal div.odd, .cal div.even{background:none}
.cal div:first-child{border-left:none}
.cal h2{color:#656565;padding:11px 10px 7px 10px;margin:0}
.cal h2 strong{color:#000;padding-right:5px;display:inline-block}
.cal ul{border-bottom:1px solid #d0cbc5;margin-top:10px}
.cal div h2+ul{margin-top:0}
.cal ul li ul{border-bottom:none;margin-top:0;border-top:1px solid #fff}
.cal ul li{font-size:1em;background:#86796a url(../images/navigation/texture_overlay.png) repeat-x 0 0;color:#fefefe;text-shadow: 1px -1px 0 rgba(0,0,0,0.4);border-bottom:1px solid #fff;border-top:1px solid #fff}
.cal ul li span{display:block;padding:3px 8px}
.cal ul li ul li{padding:3px 8px;color:#000;font-size:.8em;line-height:1.2em;text-shadow:none;border-top:1px solid #d1ccc6;border-bottom:1px solid #f6f5f4}
.cal ul li ul li em{float:right;text-align:right;color:#666;margin-left:15px}
.cal .odd ul li ul li{background:#edeae8;}
.cal .even ul li ul li{background:#faf9f8;}
.cal .current ul li ul li{background:#ebefe6;}
.cal .current h2{background:#dde4d6}
.cal .icon.edit{background-position:-97px -408px;width:16px;height:16px;display:block;float:right;margin-top:2px}
.cal .icon.sort{background-position:-97px -429px;width:16px;height:16px;display:block;float:right;margin-top:2px;margin-right:10px}
.cal .even ul.hover li ul li, .cal .odd ul.hover li ul li, .cal .current ul.hover li ul li{background:#e5c5c6;border-top:1px solid #dbaeb0;border-bottom:1px solid #e5c5c6}
.cal ul li ul li.event { background:#A43538; color:#fff; padding:5px 8px}
.cal ul li ul li.event em {float:right;text-align:right;color:#ead1d2;margin-left:15px}
.cal ul li.event span { padding-left:0;color:#ead1d2; font-size:10px}
.cal ul li.event a { color:#fff}
.cal ul li ul li.ClientLocation { background:Orange; color:#000;}
.cal ul li ul li.ClientLocation em { color:#000;}
.cal ul li ul li.ClientLocation span { color:#000;}
.cal ul li ul li.ClientLocation a { color:#000;}
.cal ul li ul li.Facility { background:Yellow; color:#000;}
.cal ul li ul li.Facility em { color:#000;}
.cal ul li ul li.Facility span { color:#000;}
.cal ul li ul li.Facility a { color:#000;}

.cal .icon.select{background-position:-97px -363px;width:16px;height:16px;display:block;float:right;margin-top:2px;margin-right:10px}

#dropzone{background:#ffffcc;margin:30px auto 0 auto; width:500px; height:400px; border:solid 1px; }
#errorBox ul li{margin:0 0 5px 0}
#errorBox ul li a {color:#999}
#errorBox ul li a em{color:#a43538}
#errorBox ul li a:hover, #errorBox ul li a:active, #errorBox ul li a:hover em, #errorBox ul li a:active em{color:#688F3C}
#errorBox ul li a span.icon{width:16px;height:16px;float:left;margin-right:6px;display:block;background-position: -54px -272px;}
#errorBox ul li.inactive{filter:alpha(opacity=30); opacity:.30;}
#errorSample{width:98%;height:400px;border:1px solid #ccc;overflow:scroll}
#errorUpdate{margin:20px 0}
#errorUpdate span, #errorUpdate input{float:left;margin-right:7px}
#errorUpdate .formBox{height:29px}
#errorUpdate span{padding-top:5px;display:inline-block}
#success ul li{margin:0 0 3px 0}
#success ul li a span.icon{width:16px;height:16px;float:left;margin-right:6px;display:block;background-position: -74px -124px;}
#errorUpdate .formButton{font-size:14px;background:#a43538;color:#fff;float:left;padding:6px 7px 4px 7px;border-radius: 8px;display:block;box-shadow: inset 0px -1px 0px rgba(0,0,0,0.4);text-shadow: 1px -1px 0 rgba(0,0,0,0.4)}
#errorUpdate .formButton:hover{background:#688f3c;cursor:pointer;-webkit-transition: all 200ms linear;transition: all 200ms linear}

.status { font-size:.9em; color:#808184 !important;}

.goBack {width:42px;position:absolute;right:0;top:0px;height:42px;z-index:100000;padding:9px}
.goBack span{background:url(../images/icons/icon_sprites.png) no-repeat -30px -672px;width:24px;height:24px;overflow:hidden;float:left;display:block}

.full #contentCol #topBar.monthTitle .eventTitle span {display: inline-block; vertical-align: middle; padding: 10px 0 0; line-height: 100%}
.eventsTop strong {font-size:18px; display: inline-block; border-right:1px solid #ccc; padding:0 15px; margin:0 5px}
.eventsTop .toggleButton {font-size:14px; display: inline-block; text-decoration:none; margin-left:5px;}

.monthRow {width:100% !important; float:left;


    display: flex;
    -webkit-flex-direction: row;
    -ms-flex-direction: row;
    flex-direction: row;
    -webkit-flex-wrap: nowrap;
    -ms-flex-wrap: nowrap;
    flex-wrap: nowrap;
    -webkit-justify-content: flex-start;
    -ms-flex-pack: start;
    justify-content: flex-start;
    -webkit-align-content: stretch;
    -ms-flex-line-pack: stretch;
    align-content: stretch;
}
.monthRow:last-child{border-bottom: 1px solid #d0cbc5}
.monthView .monthRow.weekDays div {font-weight: 100; font-size: 18px; padding:14px 10px 10px; color:#fff; border:0; text-align:right; min-height:0; background:#86796a url("../images/navigation/texture_overlay.png") repeat-x scroll 0 0; border-left: 1px solid rgba(255,255,255,0.22); border-right:1px solid rgba(0,0,0,0.20); border-top:1px solid rgba(0,0,0,0.25)}
.monthView .monthRow h2 {background:#fff; border-bottom: 1px solid #ccc; text-align:right}
.monthView .monthRow b {font-weight: 600}
.monthView .monthRow .current h2, .monthView .monthRow .scheduledPickup h2  {background: #a43538; color:#fff}
.monthView .monthRow .current h2 strong, .monthView .monthRow .scheduledPickup h2 strong {color: #fff}
.monthView .monthRow div {display: inline-block; vertical-align:top; width:100%; float:none; border-top:1px solid #d0cbc5; background:#f5f5f5; padding-bottom: 2em; min-height:210px}
.monthView .monthRow div ul, .monthView .monthRow div ul li {border-bottom: 0}
.monthView ul li {background: #f5f5f5 none repeat scroll 0 0; border-bottom: 1px solid #fff; border-top: 1px solid #ccc; color: #688f3c; font-size: 1em; text-shadow:none;}
.monthView ul li span {padding:8px; line-height: 120%}
.monthView ul li span.on {color:#fff; background-color: #688f3c}
.monthView ul li ul {max-height: 0; overflow:hidden;}
.monthView ul li ul.on {max-height: 99999px; overflow: auto}
.monthView ul li ul li > a {background: #a43538; border-radius: 5px; box-shadow: 0 -1px 0 rgba(0, 0, 0, 0.4) inset;color: #fff; display: block; font-size: 12px; margin: 10px 0 20px; padding: 10px;text-align: center;text-shadow: 0 1px 0 #34471e;}

.monthView .bucket {border:0}
.monthView .bucket > li {border:0}
.monthView .bucket .dropDown {background-color: #e7e7e7; border-bottom: 1px solid #ccc;}
.monthView .bucket .dropDown.on {background-color:#688f3c;}
.monthView .bucket > li ul.on {border-bottom: 1px solid #ccc;}
.monthView .bucket li[title="Event"] {background: #fff !important}
.monthView .monthRow .first {border-left:1px solid #ccc}
.monthView .monthRow .last {border-right:1px solid #ccc}

.monthView .monthRow div.off {background:#fff; border-left:1px solid #ececec}
.monthView .monthRow div.off h2 {border-bottom:1px solid #ececec; color:#ccc}
.monthView .monthRow div.off h2 strong {color: #ccc}
.monthView .monthRow div.off .bucket {opacity:0.25}

.monthView ul li span { color:#b11116; font-weight:bold}

tr.Email td { background-color:#aab99f;}
tr.shredsmart td { background-color:rgba(0,169,224,0.3) !important;}
a.greenButton.shredsmart { background-color:rgba(0,169,224,0.2)}

table.manage td > span.bioserv {background-image:url(/images/icons/icon-bioserv@2x.png); background-size:contain; width:24px; height:24px; display:inline-block; margin-right:2px; }
table.manage td > span.shredsmart {background-image:url(/images/icons/icon-shred-smart@2x.png); background-size:contain; width:24px; height:24px; display:inline-block; }


@media screen and (max-width: 1400px) {
	#inventory-tool #bottom .inventory-dashboard-links {grid-template-columns: repeat(4, 1fr);}
}

@media screen and (max-width: 1200px) {
	#inventory-tool #bottom .inventory-dashboard-links {grid-template-columns: repeat(3, 1fr);}
	#inventory-tool #bottom .inventory-dashboard-links a {font-size:1rem}
}

@media screen and (max-width: 1025px) {
	#contentCol.vehicle-wrap #oneColContainer .two-thirds {width: 100%}
	.button-inputs {white-space: nowrap}
}
@media screen and (max-width:1024px) {
	header {height:auto; background-position: center 42px}
	#mainBody #brand {width:100%;}
	#t1 {position: relative; top:auto; left:auto; width: 100%;}
	#t1 ul {overflow: scroll; display: flex; flex-direction: row; flex-wrap: nowrap; -webkit-justify-content: flex-start; -ms-flex-pack: start; justify-content: flex-start; -webkit-align-content: stretch; -ms-flex-line-pack: stretch; align-content: stretch;}
	#t1 a {white-space: nowrap; display: flex; flex-direction: row; flex-wrap: nowrap; -webkit-justify-content: flex-start; -ms-flex-pack: start; justify-content: flex-start; -webkit-align-content: stretch; -ms-flex-line-pack: stretch; align-content: stretch;}
	#contentCol {
		height: 100%;
		min-height: calc(100vh - 5.25em);
		min-height: calc(100vh - 5.25em);
	}
	#contentCol:has(#route-control) {
		height: calc(100vh - 5.25em);
		height: calc(100dvh - 5.25em);
	}
	.full #contentCol.dashboard #topBar #vehicle-search {width:100%}
	#contentCol, #leftCol {margin-top:85px}
	#inventory-tool #bottom .inventory-dashboard-links {grid-template-columns: repeat(2, 1fr);}
	#inventory-tool #bottom .inventory-dashboard-links a {font-size:0.875rem}
	#route-control {
		height: 100%;
	}
}
