body, html { font-family: 'Fira Sans', sans-serif; font-size: 16px; }

h1, h2, h3, h4, h5, h6 { font-family: 'Basic'; }
a { color: #111111; }
a:hover { color: #212121; text-decoration: none; }
p { line-height: 1.5; }

header a,
nav a { text-decoration: none; }
header a:hover,
nav a:hover { text-decoration: underline; }

.disclaimer { font-size: 10px; padding: 1rem; font-style: italic; }

.nowrap { white-space: nowrap; }

.admin-icon { margin: 0 2px; }

.form { font-size: 16px; padding: 4px 8px; margin: 8px 0; font-family: inherit; }
.form-widget { clear: both; }
.form-widget .tinywrapper { float: left; }
.form-widget-radio-wrapper { float: left; }
.form-widget .switch { margin: 8px; }
.form .tinywrapper,
.form .file-drop-wrapper,
.form-widget .file-moxie-wrapper,
.form .advanced-list-wrapper { float: left; }
label + .advanced-list-wrapper,
label + .file-drop-wrapper { float: left; }
label.form { float: left; clear: both; padding-left: 0; }
input.form,
textarea.form,
select.form { float: left; border: 1px solid #999; border-radius: 5px; }
textarea.form { height: 8em; }
input.form:focus,
textarea.form:focus,
select.form:focus { box-shadow: 0 0 5px #048a93; }

textarea.form:read-only,
input.form:read-only { border-color: #eee; background-color: #f3f3f3; cursor: default; }
textarea.form:-moz-read-only,
input.form:-moz-read-only { border-color: #eee; background-color: #f3f3f3; cursor: default; }
input.form:read-only:focus { box-shadow: none; }

input.inplaceeditor { width: calc(100% - 50px); }
input.inplaceeditor:disabled { border: 1px solid white; background-color: #fff; color: #000; }
input.inplaceeditor + button > span { display: none; }
input.inplaceeditor + button > span + span { display: inline; }
input.inplaceeditor:disabled + button > span { display: inline; }
input.inplaceeditor:disabled + button > span + span { display: none; }

.form-widget-required label:after { content: "*"; color: #900; }
.form-widget-required input[type="checkbox"] + label:after,
.form-widget-required input[type="radio"] + label:after { content: ""; }
.form-widget-inputnumber input { text-align: right; }
.form-widget-inputmoney input { background-image: url(../img/currency-dollar.svg); background-repeat: no-repeat; background-position: 5px center; background-size: 7px; padding-left: 16px; text-align: right; }
.form-widget-inputpercentdecimal input,
.form-widget-inputpercent input { background-image: url(../img/percent.svg); background-repeat: no-repeat; background-position: right 5px center; background-size: 12px; padding-right: 16px; text-align: right; }
.form-widget-inputcolor input { height: 50px; box-sizing: content-box; }

.form-widget-inputpasswordtoggle button { margin: 8px; padding: 6px 8px; border-radius: 5px; border: 1px solid #ccc; cursor: pointer; }

.form-widget-imagemoxie input,
.form-widget-filemoxie input { border-top-right-radius: 0; border-bottom-right-radius: 0; border-right: 0; }
button.moxie-picker { margin: 8px 0; padding: 4px 8px; float: left; font-size: 16px; box-sizing: border-box; border: 1px solid #999; cursor: pointer; border-top-right-radius: 5px; border-bottom-right-radius: 5px; }

.tiny-label { width: 80px; }
.tiny-input:not([type=checkbox]):not([type=radio]) { width: 80px; }
.short-label { width: 120px; }
.short-input:not([type=checkbox]):not([type=radio]) { width: 200px; }
.long-label { width: 200px; }
.long-input:not([type=checkbox]):not([type=radio]) { width: 300px; }

.chosen-error-message { color: #900; font-size: 11px; font-weight: bold; text-transform: uppercase; }
label.chosen-validation-error { color: #600; background-color: #ffd3d3; }

.dbform-buttons { padding: 40px 0; }
.chosen-error-message.for-tiny-label,
.dbform-buttons.for-tiny-label { padding-left: 88px; }
.chosen-error-message.for-short-label,
.dbform-buttons.for-short-label { padding-left: 128px; }
.chosen-error-message.for-long-label,
.dbform-buttons.for-long-label { padding-left: 208px; }

.form-widget-radio-wrapper br { clear: left; }
.form-widget-radio-wrapper input + label { margin: .3em .5em; display: inline-block; }

/* chosen adjustments for consistency */
.form-widget select.chosen-select.tiny-input { width: 96px !important; }
/*this increases the width so that the chosen widget is correctly sized*/
.form-widget select.chosen-select.short-input { width: 216px !important; }
/*this increases the width so that the chosen widget is correctly sized*/
.form-widget select.chosen-select.long-input { width: 316px !important; }
/*this increases the width so that the chosen widget is correctly sized*/
.form-widget .chosen-container-single .chosen-single { height: 29px; background: #fff; }
.form-widget .chosen-container-single .chosen-single span { line-height: 27px; margin-right: 15px; }
.form-widget .chosen-container-single,
.form-widget .chosen-container-multi { font-size: 16px; margin: 8px 0; }
.chosen-container-multi .chosen-choices li.search-choice { line-height: 16px; }


/*page forms */
.template-custom-layout input:not([type=checkbox]):not([type=radio]):not([type=hidden]),
.template-custom-layout textarea,
.template-custom-layout select { font-size: 16px; padding: 4px 8px; border: 1px solid #999; border-radius: 5px; width: 100%; box-sizing: border-box; }
.template-custom-layout input:not([type=checkbox]):not([type=radio]):not([type=hidden]):focus,
.template-custom-layout textarea:focus,
.template-custom-layout select:focus { box-shadow: 0 0 5px #048a93; }
.template-custom-layout .field-wrapper { padding: .5em; box-sizing: border-box; background-color: #f3f3f3; margin-bottom: 1em; border: 1px solid #c6cacc; position: relative; clear: both; overflow: auto; width: 100%; }
.template-custom-layout div.label { margin: -.6em -.5em .5em; background-color: #ddd; padding: 0em .5em .2em; }
.template-custom-layout div.label label,
.template-custom-layout div.label small { font-size: 10px; text-transform: uppercase; }
.template-custom-layout .bulk-checkbox-select { display: block; float: right; margin-top: -.5em; }
.template-custom-layout div.label label { font-weight: bold; float: none; }
.template-custom-layout .page-url-btn { float: right; padding: 8px 16px; }
.template-custom-layout .input-pretext { display: inline-block; font-size: 11px; line-height: 28px; margin-right: 1em; color: #333; }
.template-custom-layout .input-pretext .input-pretext { display: inline; margin: 0; }
.template-custom-layout .tinywrapper,
.template-custom-layout .file-moxie-wrapper,
.template-custom-layout .file-drop-wrapper small { width: 100%; }
.template-custom-layout .file-drop-wrapper input { margin: .5em 0; opacity: .7; }

.template-custom-layout .page-url .form-widget { display: inline-block; }
.template-custom-layout .page-url select { display: inline-block; width: 200px; }

.template-custom-layout button.moxie-picker { position: absolute; bottom: 0; right: .5em; }

/* advanced list */
.advanced-list-wrapper .tinywrapper { float: none; }
.advanced-list-wrapper .form-widget > label { display: block; box-sizing: border-box; padding: 2px 5px; font-weight: bold; font-size: 10px; text-transform: uppercase; background-color: #9e9e9e; }
.advanced-list-wrapper input { }
.advanced-list-wrapper input:not([type=checkbox]):not([type=radio]):not([type=hidden]),
.advanced-list-wrapper textarea,
.advanced-list-wrapper select { width: 100%; padding: 4px 8px; border: 1px solid #9e9e9e; }
.advanced-list-item { margin-bottom: 1em; border: 1px solid #e3e3e3; padding: 1em; width: 100%; }
.advanced-list-item .form-widget { margin-bottom: 1em; }

/* dropzone uploads */
.file-drop-wrapper div { width: 185px; height: 110px; max-width: 45%; display: inline-block; vertical-align: top; }
.file-drop-wrapper div.upload-box { background: url(../img/upload-file-button.png) no-repeat; background-size: 100%; position:relative; }
.file-drop-wrapper div.upload-box.uploading::after { content:" "; position:absolute; left:0; top:0; background-image:url(../img/spinners/bars-scale-middle.svg); background-size:contain; width:100%; height:90%; background-repeat:no-repeat; background-position:center center; opacity:.1; }
.file-drop-wrapper div.preview-box { background: transparent url(../img/blank.gif) no-repeat center; background-size: contain; }
.file-drop-wrapper div.preview-box p { margin: 0; color: #fff; font-weight: bold; font-size: 12px; }
.file-drop-wrapper p span.error { margin: 0; color: #fff; font-weight: bold; font-size: 12px; padding: 2px; background-color: #900; display: inline-block; }
.file-drop-wrapper input { width: 370px; font-size: 12px !important; }
.file-drop-wrapper small { float: left; width: 370px; color: #666; font-size: 10px; text-transform: uppercase; margin-top: .2em; }

.file-moxie-wrapper div.preview-box { width: 185px; height: 110px; background: transparent url(../img/blank.gif) no-repeat center; background-size: contain; }
/*
.file-moxie-wrapper div { width:185px; height:110px; max-width:45%; display:inline-block; vertical-align:top; }
.file-moxie-wrapper div.upload-box { background:url(../img/upload-file-button.png) no-repeat; background-size:100%; }
.file-moxie-wrapper input { width:370px; font-size:12px!important; }
.file-moxie-wrapper small { float:left; width:370px; color:#666; font-size:10px; text-transform:uppercase; }
.file-moxie-wrapper div.preview-box p { margin:0; color:#fff; font-weight:bold; font-size:12px; }
.file-moxie-wrapper div.preview-box p span.error { padding:2px; background-color:#900; display:inline-block; }
*/


.green-text { color: #4a0; }
.red-text { color: #ed1b2e; }
.aqua-text { color: #048a9d; }
.dark-red-text { color: #212121; border: 1px solid #212121; }

.switch { display: inline-block; text-decoration: none; min-width: 70px; height: 26px; background: url(../img/icon-switch.png) 0 -26px no-repeat; text-indent: 76px; color: #000; line-height: 26px; font-size: 14px; }
button.switch { border: none; padding: 0; cursor: pointer; }
.form-widget-yesno .switch { background-image: url(../img/icon-switch-yesno.png); }
.form-widget-truefalse .switch { background-image: url(../img/icon-switch-truefalse.png); }
.form-widget-togglecheckbox .switch { background-image: url(../img/icon-switch-checkbox.png); }
.form-widget-toggleradio .switch { background-image: url(../img/icon-switch-radio.png); }
.switch-on { background-position: 0 0; }
.switch:hover { color: #000; }

.input-long { width: 280px; height: 26px; border: 1px solid #d7d7d7; font-size: 12px; text-indent: 4px; }

.handle { display: inline-block; cursor: move; width: 33px; height: 20px; vertical-align: middle; background: url(../img/grip.png) center bottom no-repeat; }
.handle-blank { display: inline-block; width: 33px; height: 26px; }

hr { border: none; height: 1px; background: #d7d7d7; margin: 20px 0; clear: both; }

#overlay { position: fixed; width: 0; height: 0; z-index: 300; background: #212121; opacity: 0; transition: opacity .5s; }
#overlay.open { width: 100%; height: 100%; opacity: .75; }

#popup { position: fixed; width: 0; height: 0; z-index: 301; font-size: 16px; }
#popup.open { min-width: 780px; width: 50%; height: auto; top: 20%; left: 50%; margin-left: -25%; padding: 20px; border: 2px solid #0e1550; background: #fff; border-radius: 5px; }
#popup-content { overflow-y: auto; overflow-x: visible; }




header { width: 100%; height: 50px; position: fixed; z-index: 200; background: #eee; }

body.logged-in header { height: 90px; }

header > .top { height: 50px; background: #dddad0; }
body.context-admin header > .top { background: #000; }
body.context-reps header > .top { background: #006341; }


.login-type { color: #fff; margin: 12px 0 0 0; font-size: 1.2em; font-family: 'Basic'; }
.top .logout { background: url(../img/icon-logout.svg) 72px 0 no-repeat; position: absolute; top: 0; right: 0; color: #fff; width: 108px; height: 21px; margin: 15px 0 0 0; font-size: 14px; }
.top .logged-in { background: url(../img/icon-user.svg) left center no-repeat; color: #fff; position: absolute; top: 0; right: 125px; margin: 0; padding: 15px 25px; font-size: .9em; }
.top .logged-in:after { content: ""; display: block; width: 2px; background-color: #fff; margin: 12px 0 0; height: 24px; position: absolute; top: 0; right: 0; }
.top .logged-in strong { color: #f7975b; }
.top .logged-in a { text-transform: uppercase; letter-spacing: 1px; font-size: .8em; border-radius: 5px; color: #fff; padding: .1em .5em; background-color: rgba(255,255,255,.3); }
.top a:hover { opacity: .8; }
.frame-logo { width: 273px; position: relative; margin-right: 2.5%; }
.frame-logo:after { content: ""; display: block; width: 2px; background-color: #fff; margin: 12px 0 0; height: 24px; position: absolute; top: 0; right: 0; }
.frame-logo img { height: 37px; margin: 10px 1rem -5px; }

/* per user logout */
.top ul.logout { background-position: top right 10px; }
.top ul.logout li { position: relative; margin: 0; list-style-type: none; padding: 0; }
.top ul.logout > li a { padding: .5em; }
.top ul.logout > li > a { padding-top: 0; padding-bottom: 1em; }

.top ul.logout a { color: #fff; display: block; }
.top ul.logout ul { display: none; background-color: #112d41; color: #fff; position: absolute; margin: 0; list-style-type: none; padding: 0; }
.top ul.logout li:hover > ul { display: block; }

/* per user login switch */
.top ul.logged-in { background: none; padding: 0; margin: 0; }
.top ul.logged-in li { position: relative; margin: 0; list-style-type: none; padding: 0; }
.top ul.logged-in > li > .logged-in-user { display: inline-block; padding: 15px 25px; background: url(../img/icon-user.svg) left center no-repeat; }
.top ul.logged-in > li a { padding: .5em; }
.top ul.logged-in > li > a { padding-top: 0; padding-bottom: 1em; }

.top ul.logged-in a { color: #fff; display: block; background: none; text-transform: none; font-size: 1em; letter-spacing: normal; }
.top ul.logged-in ul { display: none; background-color: #112d41; color: #fff; position: absolute; margin: 0; list-style-type: none; padding: 0; }
.top ul.logged-in li:hover > ul { display: block; }




.searchcrumb-wrapper,
.main-wrapper { display: flex; justify-content: space-between; border-bottom: 1px solid #c6cacc; transition: width,left ease-in-out .3s; }
.main-wrapper { padding-top: 90px; }

.searchcrumb-wrapper .search-box { min-width: 240px; padding: 0 1rem; height: 40px; position: relative; border-right: 1px solid #c6cacc; }
.searchcrumb-wrapper .search-box input { box-sizing: border-box; border: none; font-size: 13px; width: 100%; height: 100%; padding-left: calc(1em + 25px); background: #fff url(../img/icon-search.svg) 1em center no-repeat; position: absolute; top: 0; right: 0; left: 0; bottom: 0; background-color: #fff; }

.searchcrumb-wrapper .breadcrumbs { flex-basis: 100%; line-height: 40px; padding-left: 2.5%; }
.searchcrumb-wrapper .breadcrumbs a:hover { text-decoration: underline; }

.documentation { font-size: .8em; line-height: 1.4; }
.documentation.collapsing { overflow: hidden; max-height: 2.5em; transition: .25s ease-in-out; position: relative; }
.documentation.collapsing:after { content: ""; font-size: 8px; text-transform: uppercase; text-align: center; padding-top: 1em; color: #ccc; display: block; opacity: 1; transition: .25s ease-in-out; position: absolute; width: 100%; bottom: 0; height: 2em; background: -moz-linear-gradient(top, rgba(243,243,243,0) 0%, rgba(243,243,243,1) 100%); background: -webkit-linear-gradient(top, rgba(243,243,243,0) 0%,rgba(243,243,243,1) 100%); background: linear-gradient(to bottom, rgba(243,243,243,0) 0%,rgba(243,243,243,1) 100%); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00ffffff', endColorstr='#ffffff',GradientType=0 ); }
.documentation.collapsing:hover { max-height: 20em; }
.documentation.collapsing:hover:after { opacity: 0; }


nav.main-nav { min-width: 240px; max-width: 240px; padding: 0 1rem; border-right: 1px solid #c6cacc; padding-bottom: 2em; border-top: 4px solid #111111; }
main { flex-basis: 100%; max-width: calc(100% - 275px); }
.mod-heading,
.nav-heading { text-transform: uppercase; padding: 16px 0 10px 0; border-bottom: 1px solid #d7d7d7; font-size: 1.1em; }
.mod-heading { font-family: 'Fira Sans'; font-size: 1em; font-weight: normal; }
nav.main-nav .nav-arrow { float: right; display: block; width: 12px; height: 15px; text-indent: -10000px; background: url(../img/nav-arrow.svg) center center no-repeat; }
nav.main-nav .nav-collapsed { }
nav.main-nav .nav-expanded { transform: rotate(90deg); }
nav.main-nav ul { margin: 0; padding: 3px 0 0 0; }
nav.main-nav li { list-style: none; font-size: .9em; padding: 3px 0; }
nav.main-nav hr { border: none; height: 20px; background: none; border-bottom: 4px solid #111111; }

nav.main-nav h3 { font-size: .9em; }
nav.main-nav address { font-style: normal; padding-bottom: 8px; font-size: .9em; }


nav.main-nav dl { width: 228px; color: #111111; padding-bottom: 20px; margin: .5em 0; }
nav.main-nav dt { float: left; clear: left; text-indent: -10000px; display: block; width: 20px; height: 15px; }
nav.main-nav dd { float: left; width: 200px; margin: 0 0 2px 0; font-size: .9em; }

nav.main-nav .dealer-phone { background: url(../img/icon-phone.svg) 0 center no-repeat; }
nav.main-nav .dealer-email { background: url(../img/icon-email.svg) 0 center/13px no-repeat; }
nav.main-nav .dealer-website { background: url(../img/icon-website.svg) 0 center no-repeat; }
nav.main-nav .dealer-contact { background: url(../img/icon-contact.svg) 0 center no-repeat; }
nav.main-nav .dealer-rep { background: url(../img/icon-sales-rep.svg) 0 center no-repeat; }
nav.main-nav .dealer-loc { background: url(../img/icon-home.svg) 0 center/13px no-repeat; }
nav.main-nav .dealer-locsub { background: url(../img/nav-arrow.svg) center/4px no-repeat; }


#stage { padding: 3em 3em 0; }

#mod-title { font-weight: normal; font-size: 28px; }

/* jQuery UI Tooltip */
html body .ui-tooltip { background: #333; border: 2px solid white; padding: .5em; color: white; border-radius: 3px; font-size: 10px; font-weight: bold; box-shadow: 0 0 7px black; }

.tabs { height: 41px; background: -webkit-repeating-linear-gradient(#fff, #fff 40px, #d7d7d7 41px); background: -moz-repeating-linear-gradient(#fff, #fff 40px, #d7d7d7 41px); background: -o-repeating-linear-gradient(#fff, #fff 40px, #d7d7d7 41px); background: repeating-linear-gradient(#fff, #fff 40px, #d7d7d7 41px); }
.tabs li { margin: 0 0 0 -5px; }
.tabs li:first-child { margin: 0 0 0 10px; }

.tabs a { display: inline-block; height: 40px; padding: 0 24px; font-size: 14px; line-height: 40px; border-left: 1px solid #d7d7d7; border-right: 1px solid #d7d7d7; border-top: 1px solid #d7d7d7; border-top-left-radius: 5px; border-top-right-radius: 5px; text-decoration: none; color: #999; }
.tabs a:hover,
.tabs a.active-tab { color: #000; background: -webkit-repeating-linear-gradient(#048a93, #048a93, #fff 5px, #fff 40px); background: -moz-repeating-linear-gradient(#048a93, #048a93, #fff 5px, #fff 40px); background: -o-repeating-linear-gradient(#048a93, #048a93, #fff 5px, #fff 40px); background: repeating-linear-gradient(#048a93, #048a93, #fff 5px, #fff 40px); border-bottom: 1px solid #fff; }


.paging { padding: 16px 0 26px 0; }
.paging .record-count { float: left; padding: 8px 0 0 20px; color: #999; font-size: 12px; }
.paging .select { float: right; padding: 8px 0 0 0; color: #999; font-size: 12px; margin-left: 15px; }
.paging .select select { border: 1px solid #999; padding: 0 4px; margin-left: 5px; }
.list-nav { float: left; display: inline-block; height: 24px; border: 1px solid #d7d7d7; font-size: 12px; }
.list-nav > div.pagination { float: left; padding-top: 4px; }
.list-nav > div.pagination > input.page-num { border: none; width: 30px; text-align: right; }
.list-nav > div.pagination > span.page-total { padding-right: 16px; }
.list-nav > a { float: left; }
.nav-arrows { display: inline-block; width: 28px; height: 24px; text-indent: -1000px; margin: 0; padding: 0; position: relative; background-image: linear-gradient(#fff,#eee); }
.nav-arrows:after { content: ""; display: block; position: absolute; top: 0; right: 0; width: 100%; height: 100%; opacity: .5; }
.nav-prev:after { background: url(../img/nav-arrow.svg) no-repeat center center/8px; transform: rotate(180deg); }
.nav-next:after { background: url(../img/nav-arrow.svg) no-repeat center center/8px; }
.nav-arrows:hover:after { opacity: 1; }
.list-nav input { font-size: 12px; }
.list-nav input:hover { background: #212121; color: #fff; }

.list-popup { display: none; position: absolute; background: #fff; z-index: 5; box-shadow: 0 0 8px rgba(0, 0, 0, 0.3); white-space: normal; }
.list-popup.visible { display: block; }

.main-table { border-collapse: collapse; width: 100%; }
.main-table-header, .main-table th { font-weight: bold; text-transform: uppercase; background: #f5f5f5; border-top: 1px solid #d7d7d7; }
.main-table-header, .main-table th, .main-table td { text-align: left; font-size: 14px; padding: calc(.5% + 5px); border-bottom: 1px solid #d7d7d7; border-top: 1px solid #d7d7d7; }
.main-table th.aright, .main-table td.aright { text-align: right; }
.main-table th.aright > input, .main-table td.aright > input{ float: right; }

.main-table-sm th, .main-table-sm td { font-size: 12px; padding: 8px 16px; }

.main-table-wrap { overflow: auto; }
#list-stage > .main-table-wrap { min-height: 50vh; }
.main-table td .edit { display: none; }
.main-table td.tracking > div { width: 215px; }
.main-table .tracking input, .main-table .tracking select { padding: 1px; }
#i_ship_tracking { width: 140px; }
a.edit-cell { vertical-align: middle; display: inline-block; }
#stage h1 { margin-top: 0; }
#stage > .subcategories, #stage > .products { margin-bottom: 50px; }
.product-categorization ul { margin: 0; padding: 0; list-style: none; }
.product-categorization ul ul { padding-left: 18px; }
.product-categorization li { margin-bottom: 7px; }

.orders-list .filter.select { display: none; }
.filter-table { width: 100%; margin: 10px 0; }
.filter-table th { text-align: left; font-size: 14px; text-transform: uppercase; }
.filter-table th, .filter-table td { padding: 6px 0; }

.sort-icon { display: none; }

.cell-active { color: #6c0; }
.cell-inactive { color: #f00; }

.border-table { border-collapse: collapse; }
.border-table th,
.border-table td { padding: .25em; border: 1px solid #c6cacc; text-align: left; }

.mod-stage-header { font-weight: normal; }

.product-upload-container { float: left; margin: 0 10px 10px 0; padding: 5px; border: 1px solid #f2f2f2; width: 140px; height: 170px; overflow: hidden; }
.product-upload-container:hover { background: #f2f2f2; border: 1px solid #212121; }

#drag-upload, .drag-upload { width: 185px; height: 110px; background: url(../img/upload-file-button.png); }
#man-uploader { display: none; }


.page-table { border-collapse: collapse; width: 100%; margin: 0; }
.page-table-header { font-weight: bold; text-transform: uppercase; background: #f5f5f5; border-top: 1px solid #d7d7d7; }
.page-table-header, .page-table td { text-align: left; font-size: 14px; padding: 16px 0; border-bottom: 1px solid #d7d7d7; }

.status { display: inline-block; text-decoration: none; min-width: 24px; height: 24px; text-indent: 24px; line-height: 18px; font-size: 14px; }

.form-message { font-size: .8em; border: 1px solid #aaa; padding: .5em 1em; background-color: #f3f3f3; margin-bottom: 2em; }
.form-message.error { border-color: #900; color: #600; background-color: #ffd3d3; }
.form-message.success { border-color: #090; color: #060; background-color: #e8ffe8; }
.form-message.warning { border-color: #009; color: #009; background-color: #d3d7ff; }
.form-message.notice { border-color: #990; color: #440; background-color: #fcfcd1; }

.dir-listing li { font-size: 16px; margin: 10px; border-radius: 5px; }
.dir-listing a { display: inline-block; border: 1px solid #ddd; height: 100px; width: 140px; text-align: center; margin: 10px; padding: 30px 10px 10px 10px; overflow: hidden; }
.dir-listing a:hover { box-shadow: 0 0 5px #048a93; }

.img-listing li { margin: 10px; float: left; }
.img-listing .img-wrapper { margin: 10px; padding: 0 auto; width: 160px; height: 190px; border: 1px solid #ddd; position: relative; text-align: center; }
.img-listing .img-wrapper:hover { box-shadow: 0 0 5px #048a93; }
.img-listing .img-wrapper img { margin: 5px 0; max-height: 130px; }
.img-listing .img-info { position: absolute; bottom: 5px; width: 160px; text-align: center; font-size: 12px; }

/* extra action interface */
.main-table tr.extra-actions small.actions,
.main-table tr .action-extra { display: none; }
.main-table tr.addnote form.action-extra.addnote,
.main-table tr.changemodel form.action-extra.modelswitcher,
.main-table tr.dealertransfer form.action-extra.dealertransfer { display: block; }

/* table filters */
.table-filters-top { padding: 16px 0 26px 0; }
.table-filters-bottom { padding: 26px 0; }
.table-filters-span { padding: 0; margin-left: 1em; margin-bottom: .5em; color: #999; font-size: 12px; }
label.table-filters-span { padding-top: 6px; }
.table-filters-inline { padding: 8px 0 0 20px; color: #999; font-size: 12px; }
.table-filters-select,
.table-filters-textinput { border: 1px solid #aaa; font-size: 10px; background-image: linear-gradient(#eee 1%,#fff 15%); }
.table-filters-select { padding: 5px; height: 28px; }
.table-filters-textinput { padding: 5px; }

/* chosen adjustments for consistency */
.table-filters .chosen-container-single .chosen-single { border-radius: 0; height: 29px; background-image: linear-gradient(#eee 1%,#fff 15%); }
.table-filters .chosen-container-single .chosen-single span { line-height: 27px; margin-right: 15px; }
.table-filters .chosen-container-single,
.table-filters .chosen-container-multi { font-size: 10px; font-family: Arial; }
.table-filters .chosen-container-multi .chosen-choices li.search-choice span { word-wrap: normal; }

/* WARRANTY STYLES */
#reg-log-info,
#claim-detailed-info,
#claim-log-info { display: none; }
#reg-log-info.show-details,
#claim-detailed-info.show-details,
#claim-log-info.show-details { display: block; }
.hide-unless-parts { display: none; }

/* SUBPAGE LISTS */
ul.subpage-list { border-top: 1px solid #c6cacc; margin: 0; padding: 0; }
ul.subpage-list li { border-bottom: 1px solid #c6cacc; font-size: 1.2em; padding: .5em 0; margin: 0; list-style-type: none; }

/* TRACKING STYLES */
.tracking-details img { }
.tracking-btn { display: inline-block; background: #f7f7f7; border: 1px solid #d9d9d9; border-radius: 5px; font-size: 14px; font-weight: 600; line-height: normal; padding: 6px 20px; text-decoration: none; }
.tracking-btn.small { font-size: 13px; padding: 4px 10px; }
#tracking-panel tr.locator_id, #tracking-panel tr.parent_id, #tracking-panel tr.action, #tracking-panel tr.jquery_action, #tracking-panel tr.uri { display: none; }

.login-container { width: 370px; max-width: 100%; padding-top: 150px; }

.menu-anchor { display: none; width: 50px; height: 50px; position: relative; cursor: pointer; background-color: #000; }
.menu-anchor > span { background-color: #fff; display: block; position: absolute; height: 4px; width: 25px; opacity: 1; left: 12px; transition: .25s ease-in-out; transform: rotate(0deg) }
.menu-anchor > span:nth-child(1) { top: 14px; }
.menu-anchor > span:nth-child(2),
.menu-anchor > span:nth-child(3) { top: 24px; }
.menu-anchor > span:nth-child(4) { top: 34px; }
.menu-active .menu-anchor > span:nth-child(1),
.menu-active .menu-anchor > span:nth-child(4) { top: 24px; width: 0; left: 50%; }
.menu-active .menu-anchor > span:nth-child(2) { transform: rotate(45deg); }
.menu-active .menu-anchor > span:nth-child(3) { transform: rotate(-45deg); }


/* responsive */
@media (max-width: 1250px) { /* 17px discrepancy */
    #bw-logo, #sw-logo { width: 108px; margin: 7px 0 0 0; }
}

@media (max-width: 1157px) { /* 17px discrepancy */
    body.logged-in { background-image: none; }
    body.logged-in header { height: auto; position: relative; }
    .main-wrapper { padding-top: 0; }

    body { overflow-x: hidden; }
    .searchcrumb-wrapper,
    .main-wrapper { width: calc(100% + 273px); position: relative; left: -273px; }
    body.menu-active .searchcrumb-wrapper,
    body.menu-active .main-wrapper { left: 0; }

    #stage { padding: 1em 1em 0; }
    h1 { font-size: 1.7em; }
    .searchcrumb-wrapper .breadcrumbs { padding-left: 1em; }

    /*
    #top {height: auto;}
    body > #search-box {width: 100%; box-sizing: border-box;}
    #left-col {display: none; padding: 0 15px; width: 100%; box-sizing: border-box; margin: 0;}
    #left-col hr {padding: margin: 0 -15px;}
    #right-col {float: none; padding: 0; width: auto;}
    #breadcrumb {padding: 13px 12px; text-indent: 0;}
    #logout {width: 0; background-position: left center; padding-left: 35px; overflow: hidden;}
    */
    .top .logout { width: 0; background-position: left center; padding-left: 35px; overflow: hidden; }
    .top .logged-in { right: 60px; }
    .menu-anchor { display: block; }

    input, select, textarea { max-width: 100%; }
    #search_keywords { max-width: 52%; }

    .login-container { padding-right: 3%; padding-left: 3%; box-sizing: border-box; }
    .login-container .short-label { padding: 0; margin: 0; }

    /* tables, in conjunction with tablesaw plugin */
    /* clearfix rules for tablesaw-stack rows */
    .tablesaw-stack tr:before, .tablesaw-stack tr:after { content: " "; display: table; }
    .tablesaw-stack tr:after { clear: both; }
    .tablesaw-stack tr { padding-bottom: 10px; margin-bottom: 10px; }
    .tablesaw-stack th, .tablesaw-stack td { border-bottom: none; padding: 5px calc(.5% + 5px); }
    .tablesaw-stack td .tablesaw-cell-label,
    .tablesaw-stack th .tablesaw-cell-label { width: 40%; }
}

@media (max-width: 1024px) { /* 17px discrepancy */
    .top .logged-in, .dev-log { display: none; }
}

@media (max-width: 600px) { /* 17px discrepancy */
    .frame-logo:after,
    .login-type { display: none; }
}


/*default print styles */
@media print {
    body, html { font-size: 12px; }
    header, .main-nav { display: none !important; }

    /* list tables */
    #list-stage > * { display: none; }
    #list-stage > .main-table { display: table; }
    .main-table-header, .main-table th, .main-table td { font-size: 11px; padding: 2px; }

    .form, input.form, textarea.form, select.form { font-size: 11px; padding: 2px; margin: 2px 0; }

    hr { margin: 2px 0; }

    h1, h2, h3, h4, h5, h6 { margin: .25em 0; }

    .main-wrapper { border-bottom: none; }

    #stage { padding: 0 !important; }

    .searchcrumb-wrapper, .main-wrapper { position: static !important; left: 0 !important; width: 100% !important; }

    #Labor-row-ctrls,
    #Parts-row-ctrls,
    #Sublet-row-ctrls { display: none; }
    /* unfortunately, also hides last row on read-only versions
    .Labor-rows:last-of-type,
    .Labor-rows:nth-last-of-type(2),
    .Parts-rows:last-of-type,
    .Sublet-rows:last-of-type { display: none; }
    */
}

/* colored sidebar
nav.main-nav { border-right-color: #111111; border-top: none; background-color: #111111; color: #fff; }
.context-admin nav.main-nav { background-color: #484c5b; border-right-color: #484c5b; }
.context-reps nav.main-nav { background-color: #0e5472; border-right-color: #0e5472; }
nav.main-nav dl,
nav.main-nav a { color: #fff; }
nav.main-nav .nav-collapsed { background-image: url(../img/nav-arrow-white.svg); }
nav.main-nav hr { border-bottom-color:#fff; }
nav.main-nav .dealer-phone { background: url(../img/icon-phone-white.svg) 0 center no-repeat; }
nav.main-nav .dealer-email { background: url(../img/icon-email-white.svg) 0 center no-repeat; }
nav.main-nav .dealer-website { background: url(../img/icon-website-white.svg) 0 center no-repeat; }
nav.main-nav .dealer-contact { background: url(../img/icon-contact-white.svg) 0 center no-repeat; }
nav.main-nav .dealer-rep { background: url(../img/icon-sales-rep-white.svg) 0 center no-repeat; }
 */
/* adjusted colors */
header { background-color: #ddd; }
.context-admin header { background-color: #ddd; }
.context-reps header { background-color: #ddd; }

.searchcrumb-wrapper,
.main-wrapper { border-bottom-color: #6F6F6F; }
.context-admin .searchcrumb-wrapper,
.context-admin .main-wrapper { border-bottom-color: #5e6a7f; }
.context-reps .searchcrumb-wrapper,
.context-reps .main-wrapper { border-bottom-color: #5c6d5e; }

header > .top { background-color: #1B365D; }
/*see CSS in reps/admin folders for additional settings*/

nav.main-nav { border-top: none; background-color: #eee; border-right-color: #ccc; }
.context-admin nav.main-nav { background-color: #eee; border-right-color: #ccc; }
.context-reps nav.main-nav { background-color: #eee; border-right-color: #ccc; }
.mod-heading,
.nav-heading { border-bottom-color: #111111; }

.drag-icon {
    padding:2px 8px;
    margin:2px;
    border-radius:2px;
    background-color: #f0f0f0;
    border: 1px solid #ccc;
    text-decoration: none;
    font-size:14pt;
    cursor:move;
}
.drag-item {
    padding: 8px;
    margin: 4px 0;
    background-color: #fff;
    border: 1px solid #ddd;
    border-radius: 4px;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);
    position:absolute;
    z-index:1000000;
}
.drop-location.active {
    background-color: rgba(0, 123, 255, 0.1);
}
.drop-location.active.bottom {
    box-shadow: inset 0 -2px 0 rgba(0, 123, 255, 0.4);
} 
.drop-location.active.top {
    box-shadow: inset 0 2px 0 rgba(0, 123, 255, 0.4);
}