/* ------------------
   Zoom Roses
   Main Styles
--------------------- */

/* Begin Reset */

html, body, 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
{
	margin: 0;
	padding: 0;
	border: none;
	text-decoration: none;
}

ul {
	list-style: none;
}

/* End Reset */

/* Begin Common */

html, body {
	height: 100%;
}

body {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 13px;
	background-color: #fff;
	color: #333;
	margin-bottom: 50px;
}

a:link, a:visited {
	color: #1b438b;
}

a:hover, a:active {
	color: #000;
	text-decoration: underline;
}

img {
	border: 0;
}

h1 {
	font-size: 18px;
	margin-bottom: 1em;
}

h2 {
	font-size: 16px;
	margin-bottom: .25em;
}

h3 {
	font-size: 14px;
	margin-bottom: .25em;
}

h4 {
	font-size: 13px;
}

h5 {
	font-size: 14px;
	margin: 0;
}

blockquote { margin-bottom: 1.5em; }

tr, th, td { page-break-inside: avoid; }

.nowrap { white-space: nowrap; }

.small, table.small, table.small th, table.small td { font-size: .85em !important; }
.small2, table.small2, table.small2 th, table.small2 td { font-size: .9em !important; }

.large, table.large, table.large th, table.large td {
	font-size: 1.1em !important;
	font-weight: bold !important;
}

acronym, abbr { border-bottom: none; }

.admin-field {
	border-bottom: 1px dotted black;
	background-color: #DDDDDD;
	padding: 1px;
}

.floatright { float: right; }

.floatleft { float: left; }

.textright { text-align: right; }

.padright { padding-right: 10px; }

.alignleft, .imgleft {
	float: left;
	margin: 0 20px 25px 0;
}

.alignright, .imgright {
	float: right;
	margin: 0 0 25px 20px;
}

.center { text-align: center; }

.clearleft { clear: left; }

.clearright { clear: right; }

.clear { clear: both; }

.clearfix:after {
	content: ""; 
	display: table; 
	clear: both;
}

.required {
	color: red;
}
.error {
	color: red !important;
}
.input-error {
	/* border-color: red !important; */
	border-width: 2px !important;
}
.span-error {
	color: red !important;
	font-weight: bold !important;
}
.input-error {
	background-color: red !important;
	color: white !important;
}
.discount {
	color: red !important;
}
label {
	font-weight: bold;
}
td.margin-l {
	margin-left: 10px;
}
td.margin-r {
	margin-right: 10px;
}
table td.narrow {
	width: 350px;
}

span.jewelCount {
	-moz-border-radius: 2px 2px 2px 2px;
	-webkit-border-radius: 2px 2px 2px 2px;
	border-radius: 2px 2px 2px 2px;
	background-color: #F03D25;
	border: 0;
	display: inline;
	padding: 1px 2px;
	color: #FFFFFF;
	font-size: 11px;
	font-weight: bold;
	margin: 0;
}

span.jewelCountLarge {
	-moz-border-radius: 2px 2px 2px 2px;
	-webkit-border-radius: 2px 2px 2px 2px;
	border-radius: 2px 2px 2px 2px;
	background-color: #F03D25;
	border: 0;
	display: inline;
	padding: 1px 2px;
	color: #FFFFFF;
	font-size: 13px;
	font-weight: bold;
	margin: 0;
}

span.icn-nav-notice {
	color: #F03D25;
	font-size: 16px;
}

#loading {
	position: absolute;
	top: 8px;
	right: 10px;
}

.unconfirmed-awb {
	background-color: #FFB746 !important;
}

ul.bullet {
	list-style: disc;
}

.hidden {
	display: none;
}

/* End Common */

/* Begin page layout */

#wrapper {
	height: 100%;
}

#header {
	height: 60px;
	width: 96%;
	padding: 0 2% 0 2%;
	border-bottom: 1px solid #aaa;
	color: #666;

	/* http://www.colorzilla.com/gradient-editor/ */
	background: #d7d7d7; /* Old browsers */
	background: -moz-linear-gradient(top,  #f0f0f0 0%, #d7d7d7 100%); /* FF3.6+ */
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#f0f0f0), color-stop(100%,#d7d7d7)); /* Chrome,Safari4+ */
	background: -webkit-linear-gradient(top,  #f0f0f0 0%,#d7d7d7 100%); /* Chrome10+,Safari5.1+ */
	background: -o-linear-gradient(top,  #f0f0f0 0%,#d7d7d7 100%); /* Opera 11.10+ */
	background: -ms-linear-gradient(top,  #f0f0f0 0%,#d7d7d7 100%); /* IE10+ */
	background: linear-gradient(to bottom,  #f0f0f0 0%,#d7d7d7 100%); /* W3C */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f0f0f0', endColorstr='#d7d7d7',GradientType=0 ); /* IE6-9 */
}

.header-demo {
	/* http://www.colorzilla.com/gradient-editor/ */
	background: #fca6a6 !important; /* Old browsers */
	background: -moz-linear-gradient(top,  #ffe3e3 0%, #fca6a6 100%) !important; /* FF3.6+ */
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#ffe3e3), color-stop(100%,#fca6a6)) !important; /* Chrome,Safari4+ */
	background: -webkit-linear-gradient(top,  #ffe3e3 0%,#fca6a6 100%) !important; /* Chrome10+,Safari5.1+ */
	background: -o-linear-gradient(top,  #ffe3e3 0%,#fca6a6 100%) !important; /* Opera 11.10+ */
	background: -ms-linear-gradient(top,  #ffe3e3 0%,#fca6a6 100%) !important; /* IE10+ */
	background: linear-gradient(to bottom,  #ffe3e3 0%,#fca6a6 100%) !important; /* W3C */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffe3e3', endColorstr='#fca6a6',GradientType=0 ) !important; /* IE6-9 */
}

#header #branding {
	float: left;
	font-size: 24px;
	font-weight: bold;
	margin-top: 16px;
}

#header #sync-image {
	float: left;
	margin-left: 80px;
}

#header #sync-text {
	float: left;
	margin: 9px 0 0 10px;
}

#header .sync-text-good {
	padding: 2px;
	border: 1px solid #bbb;
	background-color: #00ff00;
	color: #000000;
	font-weight: bold;
}

#header .sync-text-bad {
	padding: 2px;
	border: 1px solid #bbb;
	background-color: #FFFF80;
	color: #ff0000;
	font-weight: bold;
}

#header .sync-text-bad.line-two {
	margin-top: 2px;
}

#header #header-utility {
	float: right;
	text-align: right;
	width: 50%;
	margin-top: 9px;
}

#header #header-utility a {
	color: #666;
	text-decoration: underline;
}

#header #header-utility a:hover {
	color: #000;
}

#main {
	margin-left: 156px;
	padding: 10px;
	position: relative;
}

#footer {
  position: fixed;
	left: 0;
	bottom: 0;
	width: 96%;
	padding: 15px 2%;
	text-align: left;
	border-top: 1px solid #ddd;
	border-bottom: 1px solid #aaa;
	font-size: .85em;
	color: #666;

	/* http://www.colorzilla.com/gradient-editor/ */
	background: #d7d7d7; /* Old browsers */
	background: -moz-linear-gradient(top,  #f0f0f0 0%, #d7d7d7 100%); /* FF3.6+ */
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#f0f0f0), color-stop(100%,#d7d7d7)); /* Chrome,Safari4+ */
	background: -webkit-linear-gradient(top,  #f0f0f0 0%,#d7d7d7 100%); /* Chrome10+,Safari5.1+ */
	background: -o-linear-gradient(top,  #f0f0f0 0%,#d7d7d7 100%); /* Opera 11.10+ */
	background: -ms-linear-gradient(top,  #f0f0f0 0%,#d7d7d7 100%); /* IE10+ */
	background: linear-gradient(to bottom,  #f0f0f0 0%,#d7d7d7 100%); /* W3C */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f0f0f0', endColorstr='#d7d7d7',GradientType=0 ); /* IE6-9 */
}

#footer #copyright {
	float: left;
	width: 50%;
}

#footer #meta {
	float: right;
	text-align: right;
	width: 50%;
}

/* End page layout */

/* Begin Collapsible Menu */

.collapsible-menu {
	vertical-align: top;
	width: 136px;

	clear: left;
	float: left;
	list-style: none outside none;
	padding: 2px 10px 0 10px;
	position: relative;
	width: 136px;
}
.collapsible-menu ul {
	display: none;
}
.collapsible-menu li {
	background-image: none;
	margin: 0;
	padding: 0;
}
.collapsible-menu ul ul {
	display: block;
}
.collapsible-menu ul ul li a {
	padding-left: 20px;
	width: 109px;
}
.collapsible-menu a {
	color: #000;
	cursor: pointer;
	display: block;
	font-weight: bold;
	margin-left: 0;
	padding: 2px 2px 2px 17px;
	width: 112px;
}
.collapsible-menu a.expanded {
	background: #bbb url('../images/collapsible-menu/collapse.gif') no-repeat 3px 50%;
}
.collapsible-menu a.collapsed {
	background: #bbb url('../images/collapsible-menu/expand.gif') no-repeat 3px 50%;
}
.collapsible-menu a:hover {
	text-decoration: none;
}
.collapsible-menu ul a {
	background: #e8e8e8;
	border-top: 2px solid #fff;
	color: #000;
	display: block;
	font-weight: normal;
	padding: 2px 2px 2px 10px;
	width: 119px;
}
.collapsible-menu ul a:link {
	font-weight: normal;
}
.collapsible-menu ul a:hover {
	background : #f5f5f5;
	text-decoration: underline;
}
.collapsible-menu li.active a {
	background : #f5f5f5;
	font-weight: bold;
}
.collapsible-menu li.active li a {
	background: #e8e8e8;
}
.collapsible-menu .footer {
	background: transparent url('../images/collapsible-menu/footer.jpg') no-repeat 0 0;
	border-top: 2px solid #fff;
	height: 9px;
	line-height: 15px;
	margin: 0 0 10px 0;
	width: 131px;
}
.collapsible-menu .footer span {
	display: none;
}

/* End Collapsible Menu */

/* Begin icons */

.info-error {
	background-color: #fef2f2;
	color: #831819;
	border: 1px solid #831819;
	padding: 10px;
	margin-bottom: 1em;
}
.info-msg {
	background-color: #ebecff;
	color: #333;
	border: 1px solid #7485a4;
	padding: 10px;
	margin-bottom: 1em;
}
.info-reminder {
	background-color: #E1FFE1;
	color: #333;
	border: 1px solid #008600;
	padding: 10px;
	margin-bottom: 1em;
}
.variety-info-icon {
	cursor: pointer;
	vertical-align: top;
	width: 18px;
	height: 18px;
}
.mix-box-info-icon {
	cursor: pointer;
	vertical-align: top;
	width: 18px;
	height: 18px;
	padding: 1px 0 1px 0;
}
a.icon {
	font-weight: bold;
	text-transform: uppercase;
	font-size: .85em;
	border: 1px solid #666;
	margin: .5em .5em .5em 0;
	-moz-border-radius: 5px;
	-webkit-border-radius: 5px;
	border-radius: 5px;
	padding: 4px 6px 4px 23px;
}
a.icon:hover {
	text-decoration: underline;
}
a.refresh {
	background: URL(../images/icn_refresh.png) no-repeat 4px 50%;
}
a.add {
	background: URL(../images/icn_add.png) no-repeat 4px 50%;
}
a.settings {
	background: URL(../images/icn_settings.png) no-repeat 4px 50%;
}
a.date {
	background: URL(../images/icn_date.png) no-repeat 4px 50%;
}
a.search {
	background: URL(../images/icn_search.png) no-repeat 4px 50%;
}
a.key {
	background: URL(../images/icn_key.png) no-repeat 4px 50%;
}
a.wrench {
	background: URL(../images/icn_wrench.png) no-repeat 4px 50%;
}
a.accept {
	background: URL(../images/icn_accept.png) no-repeat 4px 50%;
}
a.reject {
	background: URL(../images/icn_cancel.png) no-repeat 4px 50%;
}
a.menu-button {
	background: URL(../images/menu.png) no-repeat 4px 50%;
}
a.pdf {
	background: URL(../images/icn_page_white_acrobat.png) no-repeat 4px 50%;
	padding-right: 30px;
}
a.word {
	background: URL(../images/icn_page_white_word.png) no-repeat 4px 50%;
	padding-right: 30px;
}
a.text {
	background: URL(../images/icn_page.png) no-repeat 4px 50%;
	padding-right: 30px;
}
a.image {
	background: URL(../images/icn_image.png) no-repeat 4px 50%;
	padding-right: 30px;
}

/* End icons */

/* Begin icon backgrounds */

.dollar {
	background: URL(../images/icn_dollar.png) no-repeat 50% 50%;
	cursor: pointer;
}
.dollar-disabled {
	background: URL(../images/icn_dollar_disabled.png) no-repeat 50% 50%;
	cursor: pointer;
}

/* End icon backgrounds */

/* Begin form tables */

table.form {
	background-color: #f3f3f3;
	border: 1px solid #ccc;
	-moz-border-radius: 5px;
	-webkit-border-radius: 5px;
	border-radius: 5px;
}
table.form td {
	padding: 5px;
}
table.form td.label {
	font-weight: bold;
	vertical-align: top;
}
table.form a.add, table.text a.add, table.plain a.add, table.tablesorter a.add, table.form a.wrench, table.text a.wrench, table.plain a.wrench, table.tablesorter a.wrench, table.form a.accept, table.text a.accept, table.plain a.accept, table.tablesorter a.accept {
	font-weight: normal;
	text-transform: none;
	font-size: 1em;
	border: 0;
	margin: 0;
	padding-left: 23px;
	color: #333;
}
img.menu-button {
	width: 20px;
	height: 20px;
	vertical-align: middle;
	margin-left: 2px;
	cursor: pointer;
}
table.form td.tight {
	padding-top: 0; 
}
table.form td span.left-indent {
	margin-left: 20px;
}
table.form td span.left-indent2 {
	margin-left: 40px;
}

div.form, li.form {
	background-color: #f3f3f3;
	border: 1px solid #ccc;
	-moz-border-radius: 5px;
	-webkit-border-radius: 5px;
	border-radius: 5px;
	padding: 5px;
	margin-bottom: 5px;
}
/* End form tables */

/* Begin list tables */

table.tablesorter {
	border-collapse: collapse;
	border-left: 1px solid #999 !important;
	border-top: 1px solid #999 !important;
	background-color: #CDCDCD;
	margin:10px 0pt 15px;
	/* font-size: 8pt; */
	/* width: 100%; */
	text-align: left;
}
table.tablesorter th, table.tablesorter td {
	border-right: 1px solid #999 !important;
	border-bottom: 1px solid #999 !important;
	padding: 0 2px 0 2px;
}
table.tablesorter thead tr th, table.tablesorter tfoot tr th {
	background-color: #dadada;
	text-align: center;
	/* border: 1px solid #FFF; */
	/* font-size: 8pt; */
	font-size: 13px;
	/* padding: 4px; */
	padding: 4px 22px 4px 4px;
}

table.tablesorter thead tr .header {
	background-image: url(bg.gif);
	background-repeat: no-repeat;
	background-position: center right;
	cursor: pointer;
}
table.tablesorter thead tr .headerSortUp {
	background-image: url(asc.gif);
}
table.tablesorter thead tr .headerSortDown {
	background-image: url(desc.gif);
}
table.tablesorter thead tr .headerSortDown, table.tablesorter thead tr .headerSortUp {
	background-color: #b8b9dc;
}

table.tablesorter tbody tr.alt td {
	background-color:#DCDCE9;
	color: inherit;	
}
table.tablesorter tbody tr.over td {
	background-color: #F7F7C5;
	color: inherit;	
}
table.tablesorter tbody tr.highlight td {
	background-color: #F7F7C5;
}
table.tablesorter tbody tr.highlight2 td {
	background-color: #FFFF80;
}
table.tablesorter tbody tr.highlight-ok td {
	background-color: #9DD692;
}
table.tablesorter tbody tr.highlight-error td {
	background-color: #FFC5C5;
}
table.tablesorter tbody tr.highlight-error2 td {
	background-color: red;
	color: white;
}
table.tablesorter tbody tr.disabled td, table.tablesorter tbody td.disabled {
	background-color: #DADADA;
}
table.tablesorter tbody tr.total td {
	background-color: #DADADA;
	font-weight: bold;
}

table.tablesorter tbody td {
	color: #3D3D3D;
	padding: 4px;
	background-color: #FFF;
	vertical-align: top;
}
table.tablesorter tbody td.highlight {
	background-color: #F7F7C5;
	color: inherit;	
}
table.tablesorter tbody td.highlight2 {
	background-color: #FFFF80;
}
table.tablesorter tbody td.highlight-ok {
	background-color: #9DD692;
}
table.tablesorter tbody td.highlight-error {
	background-color: #FFC5C5;
}
table.tablesorter tbody td.highlight-error2 {
	background-color: red;
	color: white;
}
table.tablesorter tbody td.box_inventory_highlight_remote {
	background: #00F5FF !important;
}

/* End list tables */

/* Begin simple list tables */

table.simplelist {
	border-collapse: collapse;
	border-top: 2px solid #999 !important;
	border-bottom: 2px solid #999 !important;
	background-color: #DCDCE9;
	margin:10px 0pt 15px;
	/* font-size: 8pt; */
	/* width: 100%; */
	text-align: left;
}
table.simplelist th, table.simplelist td {
	border: 0;
	padding: 0 2px 0 2px;
}
table.simplelist thead tr th, table.simplelist tfoot tr th {
	background-color: #dadada;
	text-align: center;
	/* border: 1px solid #FFF; */
	/* font-size: 8pt; */
	font-size: 13px;
	/* padding: 4px; */
	padding: 4px 4px 4px 4px;
}
table.simplelist thead tr .header {
	background-image: url(bg.gif);
	background-repeat: no-repeat;
	background-position: center right;
	cursor: pointer;
}
table.simplelist tbody td {
	color: #3D3D3D;
	padding: 4px;
	background-color: #FFF;
	vertical-align: top;
}
table.simplelist tbody tr.alt td {
	background-color:#DCDCE9;
	color: inherit;	
}
table.simplelist tbody td.highlight {
	background-color: #F7F7C5 !important;
	color: inherit;	
}
table.simplelist tbody td.highlight2 {
	background-color: #FFFF80 !important;
}
table.simplelist tbody td.highlight-ok {
	background-color: #9DD692 !important;
}
table.simplelist tbody td.highlight-error {
	background-color: #FFC5C5 !important;
}
table.simplelist tbody td.highlight-error2 {
	background-color: red !important;
	color: white !important;
}
table.simplelist tbody tr.over td {
	background-color: #F7F7C5 !important;
	color: inherit;	
}
table.simplelist thead tr .headerSortUp {
	background-image: url(asc.gif);
}
table.simplelist thead tr .headerSortDown {
	background-image: url(desc.gif);
}
table.simplelist thead tr .headerSortDown, table.simplelist thead tr .headerSortUp {
	background-color: #b8b9dc;
}
table.simplelist tbody tr.highlight td {
	background-color: #F7F7C5;
}
table.simplelist tbody tr.highlight2 td {
	background-color: #FFFF80 !important;
}
table.simplelist tbody tr.highlight-ok td {
	background-color: #9DD692 !important;
}
table.simplelist tbody tr.highlight-error td {
	background-color: #FFC5C5 !important;
}
table.simplelist tbody tr.highlight-error2 td {
	background-color: red !important;
	color: white !important;
}

/* End simple list tables */


/* Begin text tables */

table.text td {
	padding: 0;
}
table.text td.label {
	vertical-align: top;
	padding-right: 10px !important;
}

/* Plain, no padding or borders on cells. */

table.plain td {
	padding: 0 !important;
	border: 0 !important;
}
table.plain td.label {
	vertical-align: top;
	padding-right: 10px !important;
}

/* End text tables */

/* Begin misc tables */

/* Remove right-padding and up-down arrows on table header cells in "nosort" tablesorter tables */
table.tablesorter.nosort thead tr th, table.tablesorter.nosort tfoot tr th {
	padding-right: 4px !important;
	background-image: none !important;
}

th.narrow-pad, td.narrow-pad {
	padding-right: 4px !important;
}

/* End misc tables */

/* Begin thumbnail tables */

table.thumbs td {
	padding: 5px;
}

/* End thumbnail tables */

/* Begin Forms */

form {
	margin: 0 0 1em 0;
}
input[type=text], textarea, input[type=password] {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 13px;
	vertical-align: middle;
	background-color: #fff;
	color: #333;
	border: 1px solid #999;
	padding: 2px 4px;
}
input[type=text]:hover, input[type=text]:focus {
	border: 1px solid #005597;
}
input[type=submit], input[type=reset], input[type=button], button {
	font-weight: bold;
	text-transform: uppercase;
	font-size: .85em;
	color: #fff;
	border: 1px solid #8E8D8D;
	-moz-border-radius: 5px;
	-webkit-border-radius: 5px;
	border-radius: 5px;
	padding: 4px 6px;
	cursor: pointer;

	/* http://www.colorzilla.com/gradient-editor/ */
	background: #6b77a3; /* Old browsers */
	background: -moz-linear-gradient(top,  #afb7d4 0%, #6b77a3 100%); /* FF3.6+ */
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#afb7d4), color-stop(100%,#6b77a3)); /* Chrome,Safari4+ */
	background: -webkit-linear-gradient(top,  #afb7d4 0%,#6b77a3 100%); /* Chrome10+,Safari5.1+ */
	background: -o-linear-gradient(top,  #afb7d4 0%,#6b77a3 100%); /* Opera 11.10+ */
	background: -ms-linear-gradient(top,  #afb7d4 0%,#6b77a3 100%); /* IE10+ */
	background: linear-gradient(to bottom,  #afb7d4 0%,#6b77a3 100%); /* W3C */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#afb7d4', endColorstr='#6b77a3',GradientType=0 ); /* IE6-9 */
}
input[type=submit].disabled, input[type=reset].disabled, input[type=button].disabled, button.disabled {
	/* http://www.colorzilla.com/gradient-editor/ */
	background: #666666; /* Old browsers */
	background: -moz-linear-gradient(top,  #bbbbbb 0%, #666666 100%); /* FF3.6+ */
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#bbbbbb), color-stop(100%,#666666)); /* Chrome,Safari4+ */
	background: -webkit-linear-gradient(top,  #bbbbbb 0%,#666666 100%); /* Chrome10+,Safari5.1+ */
	background: -o-linear-gradient(top,  #bbbbbb 0%,#666666 100%); /* Opera 11.10+ */
	background: -ms-linear-gradient(top,  #bbbbbb 0%,#666666 100%); /* IE10+ */
	background: linear-gradient(to bottom,  #bbbbbb 0%,#666666 100%); /* W3C */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#bbbbbb', endColorstr='#666666',GradientType=0 ); /* IE6-9 */
	cursor: auto;
}
input[type=submit].active, input[type=reset].active, input[type=button].active, button.active {
	border: 1px solid #acdd4a !important;
	background: #6eac2c url(//ajax.googleapis.com/ajax/libs/jqueryui/1.10.3/themes/start/images/ui-bg_gloss-wave_50_6eac2c_500x100.png) 50% 50% repeat-x !important;
	color: #ffffff !important;
}
input[type=submit].highlight, input[type=reset].highlight, input[type=button].highlight, button.highlight {
	color: #333;
	/* http://www.colorzilla.com/gradient-editor/ */
	background: #ffff80; /* Old browsers */
	background: -moz-linear-gradient(top,  #ffffaa  0%, #ffff80 100%); /* FF3.6+ */
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#ffffaa ), color-stop(100%,#ffff80)); /* Chrome,Safari4+ */
	background: -webkit-linear-gradient(top,  #ffffaa  0%,#ffff80 100%); /* Chrome10+,Safari5.1+ */
	background: -o-linear-gradient(top,  #ffffaa  0%,#ffff80 100%); /* Opera 11.10+ */
	background: -ms-linear-gradient(top,  #ffffaa  0%,#ffff80 100%); /* IE10+ */
	background: linear-gradient(to bottom,  #ffffaa  0%,#ffff80 100%); /* W3C */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffaa ', endColorstr='#ffff80',GradientType=0 ); /* IE6-9 */
}
input[type=button].menu-button {
	width: 20px;
	height: 22px;
	padding: 2px;
	background-image: url(../images/icn_down_arrow_white.gif);

	/* http://www.colorzilla.com/gradient-editor/ */
	background: url(../images/icn_down_arrow_white.gif) no-repeat center center #6b77a3; /* Old browsers */
	background: url(../images/icn_down_arrow_white.gif) no-repeat center center -moz-linear-gradient(top,  #afb7d4 0%, #6b77a3 100%); /* FF3.6+ */
	background-image: url(../images/icn_down_arrow_white.gif),-moz-linear-gradient(top,  #afb7d4 0%, #6b77a3 100%); /* FF recent? */
	background: url(../images/icn_down_arrow_white.gif) no-repeat center center -webkit-gradient(linear, left top, left bottom, color-stop(0%,#afb7d4), color-stop(100%,#6b77a3)); /* Chrome,Safari4+ */
	background-image: url(../images/icn_down_arrow_white.gif),-webkit-linear-gradient(top,  #afb7d4 0%,#6b77a3 100%); /* Chrome10+,Safari5.1+ */
	background: url(../images/icn_down_arrow_white.gif) no-repeat center center -o-linear-gradient(top,  #afb7d4 0%,#6b77a3 100%); /* Opera 11.10+ */
	background: url(../images/icn_down_arrow_white.gif) no-repeat center center -ms-linear-gradient(top,  #afb7d4 0%,#6b77a3 100%); /* IE10+ */
	background: url(../images/icn_down_arrow_white.gif) no-repeat center center linear-gradient(to bottom,  #afb7d4 0%,#6b77a3 100%); /* W3C */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#afb7d4', endColorstr='#6b77a3',GradientType=0 ), progid:DXImageTransform.Microsoft.AlphaImageLoader(src="../images/icn_down_arrow_white_gradient.gif"); /* IE6-9 */
}
input[type=button].good-button {
	border: 4px solid #17B717 !important;
}
input[type=button].bad-button {
	border: 4px solid #F16565 !important;
}
input[type=button].short-button {
	padding-top: 0 !important;
	padding-bottom: 0 !important;
}
.good-button-text {
	color: #17B717 !important;
	font-weight: bold;
	border: 1px solid #666;
	padding: 1px;
	vertical-align: middle;
	margin-left: 3px;
}
.good-button-text-reverse {
	color: #FFF !important;
	background-color: #17B717 !important;
	font-weight: bold;
	border: 1px solid #666;
	padding: 1px;
	vertical-align: middle;
	margin-left: 3px;
}
.good-label-text {
	color: #17B717 !important;
	font-weight: bold;
}
.bad-button-text {
	color: #F16565 !important;
	font-weight: bold;
	border: 1px solid #666;
	padding: 1px;
	vertical-align: middle;
	margin-left: 3px;
}
.bad-button-text-reverse {
	color: #FFF !important;
	background-color: #F16565 !important;
	font-weight: bold;
	border: 1px solid #666;
	padding: 1px;
	vertical-align: middle;
	margin-left: 3px;
}
.bad-label-text {
	color: #F16565 !important;
	font-weight: bold;
}
.highlight-button-text {
	background-color: #FFFF80 !important;
	color: #333;
	font-weight: bold;
	border: 1px solid #666;
	padding: 1px;
	vertical-align: middle;
	margin-left: 3px;
}
.pointer {
	cursor: pointer;
}
.menu-button-container {
	z-index: 1;
	position: absolute;
	background-color: white;
	border: 2px
	solid #aaa;
	cursor: pointer;
	padding: 5px;
	text-align: left;
	margin-top: 1px;
	white-space: nowrap;
}
.menu-button-item.disabled
{
	color: #999;
	cursor: default;
}
.confirm-button {
	/* http://www.colorzilla.com/gradient-editor/ */
	background: #17b717 !important; /* Old browsers */
	background: -moz-linear-gradient(top,  #89d789 0%, #17b717 100%) !important; /* FF3.6+ */
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#89d789), color-stop(100%,#17b717)) !important; /* Chrome,Safari4+ */
	background: -webkit-linear-gradient(top,  #89d789 0%,#17b717 100%) !important; /* Chrome10+,Safari5.1+ */
	background: -o-linear-gradient(top,  #89d789 0%,#17b717 100%) !important; /* Opera 11.10+ */
	background: -ms-linear-gradient(top,  #89d789 0%,#17b717 100%) !important; /* IE10+ */
	background: linear-gradient(to bottom,  #89d789 0%,#17b717 100%) !important; /* W3C */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#89d789', endColorstr='#17b717',GradientType=0 ) !important; /* IE6-9 */
}
.reject-button {
	/* http://www.colorzilla.com/gradient-editor/ */
	background: #f16565 !important; /* Old browsers */
	background: -moz-linear-gradient(top,  #f6acac 0%, #f16565 100%) !important; /* FF3.6+ */
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#f6acac), color-stop(100%,#f16565)) !important; /* Chrome,Safari4+ */
	background: -webkit-linear-gradient(top,  #f6acac 0%,#f16565 100%) !important; /* Chrome10+,Safari5.1+ */
	background: -o-linear-gradient(top,  #f6acac 0%,#f16565 100%) !important; /* Opera 11.10+ */
	background: -ms-linear-gradient(top,  #f6acac 0%,#f16565 100%) !important; /* IE10+ */
	background: linear-gradient(to bottom,  #f6acac 0%,#f16565 100%) !important; /* W3C */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f6acac', endColorstr='#f16565',GradientType=0 ) !important; /* IE6-9 */	
}
.product-type-group-button {
	margin-top: 2px;
}
input[type=reset] {
	background-color: #ccc;
	color: #333;
}
input, select, button {
	vertical-align: middle;
}
input[type=text].highlight2 {
	background-color: #FFFF80 !important;
}
input[type=text].override {
	background-color: yellow;
}
.highlight {
	background-color: #F7F7C5 !important;
}
.highlight2 {
	background-color: #FFFF80 !important;
}
.loading-text {
	background-color: #F9EDBE;
	font-weight: bold;
	border: 1px solid #F0C36D;
	padding: 3px;
}
.deliver-date-header
{
	margin: 10px 0 5px 0;
	padding: 3px 5px;
	background-color: #E1E1FF;
}
.selling-to-header
{
	font-weight: bold;;
	background-color: #FFFF80;
	border: 1px solid #999;
	padding: 3px;
	margin-bottom: 15px;
}
.sold-to-header
{
	font-weight: bold;;
	background-color: #DDFFDD;
	border: 1px solid #999;
	padding: 3px;
	margin-bottom: 15px;
}
.override {
	background-color: yellow !important;
}
.box-owner-username {
	background-color: yellow !important;
}
.disabled {
	background: #ddd !important;
	background-color: #ddd !important;
}
.disabled-text {
	color: #999 !important;
}
.button-disabled {
	color: #999 !important;
	background: #ddd !important;
	background-color: #ddd !important;
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#dddddd', endColorstr='#dddddd',GradientType=0 ) !important; /* IE6-9 */
}
.button-group {
	padding-top: 10px !important;
	text-align: right;
}
.button-group a {
	color: #666;
	text-decoration: underline;
}
.button-group a:hover {
	color: #000;
}

.command-link {
	color: #666;
	text-decoration: underline;
}
.command-link hover {
	color: #000;
}

.ship-date {
	margin-top: 20px;
	padding: 2px;
	width: 100%;
}
.ship-date.open {
	background-color: #E1E1FF;
}
.ship-date.closed {
	background-color: #FFC5C5;
}

/* End Forms */

.confirm {
	color: #17B717;
	font-weight: bold;
}
.reject {
	color: #F16565;
	font-weight: bold;
}
.pending {
	color: #666;
}
.confirm-box {
	border: 2px solid #17B717 !important;
}
.confirm-box-row {
	background-color: #DDFFDD !important;
}
.confirm-deleted-box-row {
	background-color: #ddd !important;
}
.reject-box {
	border: 2px solid #F16565 !important;
}
.reject-box-row {
	background-color: #FFDDDD !important;
}
.updated-box {
	border: 2px solid #FB1DDE !important;
}
.deleted-box {
	background-color: #FFC5C5 !important;
}
.inventory-box {
	background-color: #00F5FF !important;
}
.ha-scanned-box {
	background-color: #DDFFDD !important;
}
.ha2-scanned-box {
	background-color: #FFDDDD !important;
}
.deleted-box-status {
	color: red;
	font-weight: bold;
	border: 1px solid #999;
	padding: 2px;
}
.confirm-reject-status {
	border: 1px solid #999;
	padding: 2px;
}
.confirm-reason {
	border: 1px solid #17B717 !important;
	width: 490px;
	margin-left: 5px;
	padding: 2px;
}
.reject-reason {
	border: 1px solid #F16565 !important;
	width: 503px;
	margin-left: 5px;
	padding: 2px;
}
.inventory-box-status {
	color: #666;
	background-color: #00F5FF;
	font-weight: bold;
	border: 1px solid #999;
	padding: 2px;
}
.box-owner-status {
	font-weight: bold;
	border: 1px solid #999;
	padding: 2px;
}
.complete-text {
	color: #ffffff;
	background-color: #17B717;
	padding: 1px;
}

/* jQueryUI Datepicker */
.datepicker {
	width: 11ch;	/* Width of "0000-00-00" +1 */
}
/* jQueryUI Datepicker hidden div */
#ui-datepicker-div {
	display: none;
}

/* Change settings on jQueryUI dialogs. */
.ui-widget {
	font-size: 13px !important;
	font-family: Arial, Helvetica, sans-serif !important;
}
.ui-widget .ui-widget {
	font-size: 13px !important;
	font-family: Arial, Helvetica, sans-serif !important;
}
.ui-widget input, .ui-widget select, .ui-widget textarea, .ui-widget button {
	font-size: 13px !important;
	font-family: Arial, Helvetica, sans-serif !important;
}
.ui-widget input[type=button] {
	font-size: .85em !important;
	padding: 4px 6px !important;
}
.ui-widget input[type=button].short-button, .ui-widget button.short-button {
	font-size: .85em !important;
	padding-top: 0 !important;
	padding-bottom: 0 !important;
}
.ui-front {
	/* Use a high z-index to make the dialog be visible over frozen table rows (tablesorter widget "staticRow" uses z-index: 1001). */
	z-index: 2000 !important;
}
.ui-dialog {
	/* The normal position value is "absolute" but that causes the dialog to jump down when dragged on a page with a vertical scrollbar. */
	position: fixed !important;
}

/* Expandable orders/boxes/bunches lists. */
.expand-list-boxes {
	background-color: #FEFFD1 !important;
}
.expand-list-bunches{
	background-color: #E1E1FF !important;
}

/* Background colors for boxes and bunches. */
.cost-price {
	background-color: #FFDDDD !important;
}
.cost-price-date-range {
	background-color: #E0A6A6 !important;
}
.sell-price {
	background-color: #DDFFDD !important;
}
.sell-price-date-range {
	background-color: #A6DFA6 !important;
}
.sold {
	background-color: #FFDDDD !important;
}
.section-title {
	background-color: #00CCFF;
	font-weight: bold;
	width: 100%;
	padding-left: 2px;
	font-weight: bold;
}
.box-gpm-low {
	background-color: #FF0000 !important;
	color: #FFFFFF !important;
	font-weight: bold;
	padding: 1px;
}
.box-gpm-high {
	background-color: #FFFF80 !important;
	font-weight: bold;
	padding: 1px;
}
.box-profit-fb-low {
	background-color: #FF0000 !important;
	color: #FFFFFF !important;
	font-weight: bold;
	padding: 1px;
}
.box-profit-fb-high {
	background-color: #FFFF80 !important;
	font-weight: bold;
	padding: 1px;
}

/* Background color for notes: */
.notes-container {
	background-color: #FEFFD1 !important;
}

/* Background color for blocked customers: */
.blocked-customer {
	background-color: #FFC5C5;
}

/* ******************************************************************************************
 * This poorly-named class is ONLY used for the colored rectangles that display the bunches
 * in a box. The rest of the styles used on the rectangles are included in the html elements
 * with inline attributes, because the values are dynamically generated by the CGI.
 */
.box {
	border: 1px solid #666;
	max-width: 400px;
	float: left;
	min-height: 18px;
	margin: 2px 2px 0 0;
	padding: 0 1px 0 1px;
}

.mix-box-name {
	border: 1px solid #666;
	max-width: 400px;
	min-height: 18px;
	margin: 2px 2px 0 0;
	padding: 0 1px 0 1px;
	background-color: #85ff00;
}

.white-on-black, table.tablesorter td.white-on-black {
	color: white !important;
	background-color: #AAA !important;
	background: #AAA !important;
	-webkit-print-color-adjust: exact !important;
	print-color-adjust: exact !important;
	font-weight: bold !important;
}
.white-on-black2, table.tablesorter td.white-on-black2 {
	color: white !important;
	background-color: #000 !important;
	background: #000 !important;
	-webkit-print-color-adjust: exact !important;
	print-color-adjust: exact !important;
	font-weight: bold !important;
}
.resolution-vendor {
	background-color: #FFDDDD !important;
}
.resolution-customer {
	background-color: #DDFFDD !important;
}

/* Thumbnails */
.thumb {
	max-height: 75px;
	border: 1px solid #bbb;
	padding: 3px;
	-moz-border-radius: 5px;
	-webkit-border-radius: 5px;
	border-radius: 5px;
	background-color: #fff;
}
.thumb-wrap .thumb:hover, .thumb-wrap .thumb:focus {
	background-color: #6c78a4;
}
.thumb-wrap {
	position: relative;
	display: inline-block;
	margin: 5px;
}
.thumb-wrap-selectable {
	border: 1px solid #AAA;
	padding: 5px;
}
.thumb-wrap-selected {
	background-color: #FFFF80;
}
.thumb-wrap-inline {
	float: left;
}
.thumb-wrap .delete {
	display: none;
}
.thumb-wrap:hover .delete, .thumb-wrap:focus .delete {
	display: block;
	position: absolute;
	right: 14px;
	top: 10px;
}
/* End Thumbnails */

.document-wrap {
	position: relative;
	display: inline-block;
	margin: 15px 0 0 5px;
}
.document-wrap .delete, .document-wrap .rename {
	display: none;
}
.document-wrap:hover .delete, .document-wrap:focus .delete,
.document-wrap:hover .rename, .document-wrap:focus .rename {
	display: inline-block;
	position: absolute;
	top: 50%;
	transform: translateY(-50%);
}
.document-wrap:hover .rename, .document-wrap:focus .rename {
	right: 40px;
}
.document-wrap:hover .delete, .document-wrap:focus .delete {
	right: 12px;
}
.document-wrap.document-link {
	position: relative;
	display: table;
}
.document-wrap.document-link a.icon {
	padding-right: 6px;
	transition: padding-right 0.15s ease;
	text-transform: none;
}
.document-wrap.document-link:hover a.icon {
	padding-right: 68px;
}
.video-play-button {
	background: url(../images/video_play.png) no-repeat 0 0;
	position: absolute;
	bottom: 5px;
	left: 5px;
	width: 35px;
	height: 26px;
}

/* Drag and drop */
#drop_zone {
	display: none;
	margin-left: 40px;
	border: 2px dashed #bbb;
	border-radius: 5px;
	width: 500px;
	height: 50px;
	line-height: 50px;
	text-align: center;
	font-size: 11px;
	font-weight: bold;
	color: #bbb;
	background-color: #fff;
}
.drop-zone-dragover {
	background-color: #ddd !important;
}

/* Simple table with each row outlined */
table.rowlist {
	border-collapse: collapse;
	border-left: 1px solid #999 !important;
	border-right: 1px solid #999 !important;
	border-bottom: 1px solid #999 !important;
	margin:10px 0pt 15px;
}
table.rowlist tbody td {
	border-top: 1px solid #333 !important;
	padding: 5px 20px 5px 5px;
	vertical-align: top;
}

/* Progress bar */

progress {
	/* Turn off styling */
	-webkit-appearance: none;
	-moz-appearance: none;
	appearance: none;
	/* No default border in FF and Opera */
	border: none;
	/* Dimensions */
	width: 100px;
	height: 10px;
}

/* Firefox */
progress {
	background: #fff;
	border: 1px solid #333;
}
progress::-moz-progress-bar {
	background: #F87500;
}
progress:not([value])::-moz-progress-bar {
	background: #fff;
}

/* Chrome */
progress::-webkit-progress-bar {
	background: #fff;
}
progress::-webkit-progress-value {
	background: #F87500;
}
progress:not([value])::-webkit-progress-bar {
	background: #fff;
}

/* Autocomplete */
.ui-button {
	margin-left: -1px !important;
}
.ui-button-icon-only .ui-button-text {
	padding: 2px !important;
} 
.ui-autocomplete-input {
	margin: 0 !important;
	border: 1px solid #2E90BD !important;
}
button.ui-button-icon-only {
	width: 20px !important;
}
/* Vertical scrollbar on autocomplete results list: */
.ui-autocomplete {
	max-height: 280px !important;
	overflow-y: auto !important;
	overflow-x: hidden !important;
	padding-right: 20px !important;
	/* Use a high z-index to make the autocomplete list be above any dialog it's contained by. */
	z-index: 3000 !important;
}

/* Fixed header: when an element is about to be scrolled off the top, this class is applied to fix it at the top: */
.fixed-header {
	position: fixed;
	top: 0;
	z-index: 200;
}

/* Split-pane mode for the vendor bill reconciliation page: the .split-active class on
   <html> and <body> divides the viewport into two independently scrollable halves of
   exactly 50vh each. Top half = body's normal content (page header, search form, button
   bar, summary tables, AI Invoice Comparison). Bottom half = #vendor_bill_results_boxes,
   which is floated out of flow with position: fixed. No document-level scrollbar. */
html.split-active
{
	overflow: hidden;
}
body.split-active
{
	height: 50vh;
	overflow-y: auto;
	margin: 0;
}
body.split-active #vendor_bill_results_boxes
{
	position: fixed;
	top: 50vh;
	left: 0;
	right: 0;
	bottom: 0;
	overflow-y: auto;
	background: #fff;
	border-top: 2px solid #1565c0;
	z-index: 100;
	padding: 10px;
	box-sizing: border-box;
}

/* Inventory deliver date highlighted: */
.deliver-date-highlight {
	background-color: #FFFF80;
	border: 1px solid #CCC;
	padding: 1px;
}

/* Inventory count of selected boxes and bunches: */
.inventory-checked-count {
	background-color: #FFFF80;
	border: 1px solid #CCC;
	display: none;
	font-weight: bold;
	margin-top: 3px;
	padding: 2px;
	text-align: center;
	white-space: nowrap;
}

/* Inventory red/color ratio of selected boxes and bunches: */
.inventory-red-color-ratio {
	border: 1px solid #CCC;
	display: none;
	font-weight: bold;
	margin-top: 3px;
	padding: 2px;
	text-align: left;
	white-space: nowrap;
}
.inventory-red-color-ratio-bad {
	background-color: #FF9999 !important;
	border: 1px solid #FF0000 !important;
}

/* COD Logs: */
.cod-logs-low-days {
	background-color: #FFFF80 !important;
}
.cod-logs-medium-days {
	background-color: #FFC47E !important;
}
.cod-logs-high-days {
	background-color: #F8B2B2 !important;
}

/* Profit per piece and GPM color limits: */
.profit-limit-1 { background-color: #FF4A4A !important; }
.gpm-limit-1 { background-color: #FF4A4A !important; }
.gpm-limit-2 { background-color: #FF9999 !important; }
.gpm-limit-3 { background-color: #FFC47E !important; }
.gpm-limit-4 { background-color: #FFFF80 !important; }

/* Red/Color Ratio color limits: */
.red-color-ratio-limit-1 { background-color: #FFFF80 !important; }
.red-color-ratio-limit-2 { background-color: #FFC47E !important; }
.red-color-ratio-limit-3 { background-color: #FF9999 !important; }
.red-color-ratio-limit-4 { background-color: #FF4A4A !important; }

/* Quality Report customer delay days: */
.problem-report-delay-days-low {
	background-color: #FFFF80;
	padding: 3px;
	border: 1px solid #999;
}
.problem-report-delay-days-medium {
	background-color: #FFC47E;
	padding: 3px;
	border: 1px solid #999;
}
.problem-report-delay-days-high {
	background-color: #FF4A4A;
	padding: 3px;
	border: 1px solid #999;
	color: white;
}

/* Mail Logs: */
.mail-logs-success {
	background-color: #9DD692 !important;
}
.mail-logs-persistent-fail {
	background-color: #FFFF80 !important;
}
.mail-logs-permanent-fail {
	background-color: #F8B2B2 !important;
}

/* Expand/collapse buttons: */
.button-expand-toggle {
	background: url('../images/collapsible-menu/expand.gif') no-repeat 50% 1px;
	width: 11px;
	height: 11px;
	padding-bottom: 1px;
	display: inline-block;
	text-indent: -999em;
}
.button-expand-toggle.expanded {
	background: url('../images/collapsible-menu/collapse.gif') no-repeat 50% 1px;
}

/* Input field widths */
.input-username {
	width: 30ch;
}
.input-name {
	width: 30ch;
}
.input-email {
	width: 30ch;
}
.input-phone {
	width: 15ch;
}
.input-address {
	width: 30ch;
}
.input-address {
	width: 17ch;
}
.input-city {
	width: 17ch;
}
.input-state-short {
	width: 3ch;
}
.input-state-long {
	width: 13ch;
}
.input-zip {
	width: 6ch;
}
.input-note {
	width: 40ch;
}
.input-keywords {
	width: 40ch;
}
.input-price {
	width: 7ch;		/* Width of "000.00" + 1. */
}
.input-price-large {
	width: 9ch;		/* Width of "00000.00" + 1. */
}
.input-percent {
	width: 6ch;		/* Width of "00.00" + 1. */
}
.input-max-rows {
	width: 5ch;		/* Width of "0000" + 1. */
}
.input-qty {
	width: 5ch;		/* Width of "000" + 1 (or "Bunch"). */
}
.input-order-id {
	width: 8ch;		/* Width of "0000000" + 1. */
}
.input-box-id {
	width: 8ch;		/* Width of "0000000" + 1. */
}
.input-box-id-multiple {
	width: 24ch;		/* Width of "0000000,0000000,0000000" + 1. */
}
.input-misc-id {
	width: 8ch;		/* Width of "0000000" + 1. */
}
.input-manifest-num {
	width: 8ch;
}
.input-class {
	width: 8ch;		/* Width of "0000000" + 1. */
}
.input-pull-code {
	width: 11ch;	/* Width of "0000-00000" + 1. */
}
.input-awb {
	width: 14ch;	/* Width of "000-0000-0000" + 1. */
}
.input-invoice-num {
	width: 15ch;
}
.input-vendor-autocomplete {
	width: 280px;
}
.input-customer-autocomplete {
	width: 280px;
}
.input-product-autocomplete {
	width: 150px;
}
.input-color-autocomplete {
	width: 14ch;
}
.input-ip-address {
	width: 14ch;	/* Width of "000000000000" + 2. */
}
.input-blanket-size {
	width: 5ch;		/* Width of '000"' + 1. */
}
.input-check-number {
	width: 12ch;
}
.input-2fa-code {
	width: 7ch;		/* Width of "000000" + 1. */
}
.select-multiple {
	width: 250px;
}
.select-tall {
	height: 155px;
}
.select-extra-tall {
	height: 295px;
}
.select-extra-wide {
	min-width: 600px;
}
.textarea-45ch {
	width: 45ch;
}

/* Media queries */

/* Narrow screen */
.mix-name-column {
	display: none;
}

/* Wide screen */
@media screen and (min-width: 1601px) {
	.mix-name-column {
		display: table-cell;
	}
	.box-contents-mix-name {
		display: none;
	}
	.wide-screen-nowrap {
		white-space: nowrap;
	}
}

/* Help pages: */
#help_content {
	width: 640px;
}

#help_content p {
	margin: 17px 0 17px 0;
	font-family: Georgia,serif;
	font-size: 17px;
	line-height: 27px;
	background-color: #F7F7C5;
	border: 1px solid #7485a4;
	padding: 4px;
}

#help_content .extra-image {
	margin-bottom: 15px;
}

/* Screensaver */
#screensaver_background {
	position: absolute;
	width: 100%;
	height: 100%;
	left: 0px;
	top: 0px;
	background-color: #fff;
	z-index: 9999;
	opacity: 0.85;
	display: none;
}
#screensaver_background_content {
	position: relative;
	text-align: center;
	margin-top: 300px;
	font-size: 16px;
}
#screensaver_background .title {
	font-weight: bold;
	font-size: 20px !important;
	margin-bottom: 15px;
}

/* Message Dialog - Make a div use the full height and width, and center the text in it vertically and horizontally.
 * Create an inner text div inside a middle div, which is inside an outer div.
 * https://stackoverflow.com/a/6182661/204842
 */
.center-both-outer {
	display: table;
	position: absolute;
	top: 0;
	left: 0;
	height: 100%;
	width: 100%;
}

.center-both-middle {
	display: table-cell;
	vertical-align: middle;
}

.center-both-inner {
	margin-left: auto;
	margin-right: auto;
	text-align: center;
}

/* QBO Invoices. */
.invoice-partially-paid {
	background-color: #FFFF80 !important;
}
.invoice-fully-paid {
	background-color: #90EE90 !important;
	padding: 2px;
}