@charset "UTF-8";


:root {
	--canvas-workspace-min: 820px;
	--color-redish: #dd4b39;
	--color-orange: #f9edbe;

	--form-group-marginbottom: 1.7em;
}


/*
 * 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, img, ins, kbd, q, s, samp,
small, strike, strong, sub, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed, 
figure, figcaption, footer, header, hgroup, 
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
	margin: 0;
	padding: 0;
	border: 0;
	font-size: 100%;
	font: inherit;
	vertical-align: baseline;
}
b {
	font-weight: bold;
}
article, aside, details, figcaption, figure, 
footer, header, hgroup, menu, nav, section {
	display: block;
}
body {
	line-height: 1;
}
ol, ul {
	list-style: none;
}
blockquote, q {
	quotes: none;
}
blockquote:before, blockquote:after,
q:before, q:after {
	content: '';
	content: none;
}
table {
	border-collapse: collapse;
	border-spacing: 0;
}
button, input, select, textarea {
	font-family: inherit;
	font-size:100%;
	margin:0;
}
button,input{line-height:normal}
button,select{text-transform:none; cursor:pointer;}
button,html input[type="button"],input[type="reset"],input[type="submit"]{-webkit-appearance:button;cursor:pointer}
button[disabled],html input[disabled]{cursor:default}
input[type="checkbox"],input[type="radio"]{box-sizing:border-box;padding:0}

/*
-moz-appearance: initial, enables custom styles for checkboxes, specific to mozilla.
The default color for the checkbox is black, not in line with the rest of the palette
 */
input[type="checkbox"] {
        -moz-appearance: initial;
        border: 1px solid rgba(0,0,0,0.38);
}
input[type="checkbox"]:checked {
	-moz-appearance: auto;
	border: 1px solid black;
}



/*** ***/



html {
        font: 0.753em/1.29 Roboto, Arial, sans-serif;

	text-rendering: optimizeLegibility;
	/* -webkit-font-smoothing: antialiased; */
        //overflow-x: hidden;
	//overflow-y: visible;
	overflow: initial; /* needed for the 'fixed' header */

        min-height: 100%;
	height: 100%;

	-ms-text-size-adjust: 100%;
	-webkit-text-size-adjust: 100%;
	scroll-behavior: smooth;
}
html[lang='ar'] {
/*
        font: 0.84em/1.265 Tahoma, 'Arabic Transparent', Arial, sans-serif;
*/
}
.hide {
        display: none;
}
a, a:visited, a:focus, a:active, a:hover{
	outline: 0 none !important;
}
a:link, a:visited {
	color: #3367d6;
        text-rendering: optimizeLegibility;
	text-decoration: none;
	font-weight: normal;
        transition: background-color 200ms cubic-bezier(0.35, 0, 0.25, 1);
}
a.nxhref {
	color: inherit;
}
a.selected {
        color: rgb(59,120,231);
        background-color: #f9f9f9;
}
a:hover, a.selected:hover {
	// color: #3367d6;
	background-color: #efefef;
	text-decoration: none;
}
a:active, a.selected:active {
	color: #3367d6;
	text-decoration: none;
        background-color: rgba(0,0,0,0.15);
}
.after:after{
        content:"";
        display:table;
        clear:both;
}
a.disabled {
        color: rgba(0,0,0,0.26);
        pointer-events: none;
	text-decoration: none;
}
a.disabled.bold {
	font-weight: 500;
}
a.external {
    background-position: top right;
    background-repeat: no-repeat;
    background-image: linear-gradient(transparent,transparent),url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 width=%2212%22 height=%2212%22%3E %3Cpath fill=%22%23fff%22 stroke=%22%2336c%22 d=%22M1.5 4.518h5.982V10.5H1.5z%22/%3E %3Cpath fill=%22%2336c%22 d=%22M5.765 1H11v5.39L9.427 7.937l-1.31-1.31L5.393 9.35l-2.69-2.688 2.81-2.808L4.2 2.544z%22/%3E %3Cpath fill=%22%23fff%22 d=%22M9.995 2.004l.022 4.885L8.2 5.07 5.32 7.95 4.09 6.723l2.882-2.88-1.85-1.852z%22/%3E %3C/svg%3E");
    padding-right: 15px;
}

body {
        padding:0;
        margin:0;
        background-image:none;
        overflow-x:hidden;
        overflow-y:visible;
//	color: rgb(0,0,0,0.65);
	letter-spacing: 0.01em;

//	background: #fff1e5;
//	background: #fafafa;
//	background: #f4f6f8;
//	background: #f7f7f7;
//	background: #e9ebee; 
//	background: #f0f0eb;
//	background: #f9f9f9;
//	background: rgb(236, 236, 236);
//	background: rgb(250,250,250); /* youtube */

	color: rgb(17, 17, 17);
	color: #000;

	height: 100%;
        position:relative;
}
body.overlay_open {
	/* In tandem with body's height: 100% it removes the scrollbar when overlay is open */
        overflow-y: hidden;
}
.wrapper {
        margin:0 auto;
        position: relative;
        height: auto;
        max-width: 1366px;
//overflow: hidden; /* changed */
	min-height: 100%;
}
.wrapper div.global {
//	position: absolute;
	position: fixed;
//	margin: 0 auto;

	/* cant use percentages here or the block wont be diplayed at the top if the page is very long */
	top: 4.5em;
	top: 2em;
//	left: 0;
//	right: 0;

	/* center horizontally */
	left: 50%;
	transform: translateX(-50%);

	/* using a 'block' would make content in the background not clickable */
	display: inline-block;

	color: #222;
	text-align: center;
	z-index: 999; /* overlay is 1000 */
}
.wrapper .global-hidden {
	display: none !important;
}

.wrapper div.global p {
	display: inline-block;
	background: var(--color-orange);

        border: 1px solid #f0c36d;

	-webkit-border-radius: 2px;
	border-radius: 2px;
	-webkit-box-shadow: 0 2px 4px rgba(0,0,0,0.2);
	box-shadow: 0 2px 4px rgba(0,0,0,0.2);
	padding: 0.3em 0.8em;
	padding: 0.3em 1.2em;

	padding: 0.4em 1.6em;

	font-weight: bold;
	font-size: 1em;
	line-height: 1.3em;
}
.wrapper div.global.error p {
	color: #fff;
	background: var(--color-redish);
	border: 1px solid var(--color-redish);
}

.wrapper div.global p a {
	color: inherit;
	font-weight: inherit;
	text-decoration: underline;
	padding-left: 0.3em;
}

.gray {
        color: rgba(0,0,0,0.655);
}
.lightgray {
        color: rgba(0,0,0,0.38) !important;
//	color: rgba(0,0,0,0.38);
}
.darkred {
	color: red;
}

/* 
 * Generic box with shadow 
 *
 */
.boxed {
	/* heavier variant */
//	-webkit-box-shadow: 0 2px 2px 0 rgba(0,0,0,0.14), 0 3px 1px -2px rgba(0,0,0,0.12), 0 1px 5px 0 rgba(0,0,0,0.2);
//	box-shadow: 0 2px 2px 0 rgba(0,0,0,0.14), 0 3px 1px -2px rgba(0,0,0,0.12), 0 1px 5px 0 rgba(0,0,0,0.2);

	/* lighter variant, box-shadow + border */
	box-shadow: 0px 1px 3px rgba(0,0,0,0.12);
	border: 1px solid #eeeccc;
	border-radius: 3px;

        padding: 4em 1.5em 4em 1.5em;
//padding: 4.5em 2em;

	background: white;
}

/*
 * Generix buttons
 *
 */
.btn {
	background-color: white;
	background-image: -moz-linear-gradient(center top , rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.02));
	background-image: linear-gradient(top,rgba(0,0,0,0),rgba(0,0,0,0.02));
	background-repeat: no-repeat;

	color: rgba(0,0,0,0.99) !important;
//	height: 24px;
	line-height: 24px;
	display: inline-block;

        padding: 0 7px;
	text-decoration: none !important;
	border: 1.1px solid rgb(211,211,211);
	border-radius: 2px;

	vertical-align: middle;
	font-size: 1.0em;
	font-family: inherit;
	cursor: pointer;
	box-sizing: border-box;
	white-space: nowrap;

	position: relative;
	-moz-user-select: none;
}
.btn.disabled {
	opacity: .6;
	pointer-events: none;
}
/* [Select] button in connector are hidden when Intent=Display. Readding .hide here cause it's defined earlier in the CSS and .btn overrides it */
.btn.hide {
	display: none;
}
.btn.pri {
	background: #3366d4;
	color: white !important;
	border-color: #3366d4;
}
.btn:hover {
	background-color: #fff;
	box-shadow: 0px 1px 3px rgba(0,0,0,0.2);
	border-color: rgb(204,204,204);
}
.btn.pri:hover {
	background-color: #3366d4;
        box-shadow: 0px 1px 3px rgba(0,0,0,0.35);
	border-color: #3366d4;
}
.processing, .processing:hover {
	border-color: transparent;
	box-shadow: none;
	background-image: none;
	pointer-events: none;
}


/*
 * Typical section 
 *
 */
h1.norm {
        line-height: 1em;
        font-size: 1.75em;
        font-weight: inherit;
        color: rgb(0,0,0);

        text-rendering: optimizeLegibility;
        letter-spacing: -0.01em;

        margin: 0;
}
h2.norm {
	font-size: 1.5em;
	font-weight: 400;
	letter-spacing: -0.01em;

	margin-bottom: 1em;
}
h3.norm {
	font-size: 1.33em;
	margin-bottom: 1em;
	font-weight: 400;
	letter-spacing: -0.005em;
}
p.norm {
        margin-top: 0.5em;
}
.title {
	margin-bottom: 1.2em;
	margin-bottom: 2em;
//	padding-bottom: 1em;

//	border-bottom: 1px solid #ddd;
	box-sizing: border-box;
	white-space: nowrap; /* we need to cap titles, they could be veeery long */
}
.title.title__nobottommargin {
	margin-bottom: 0;
}
.title.nxwarehouse {
//	padding-bottom: 1.5em;
padding-bottom: 0.5em;
	margin-top: 0.3em;
}
.title h2 {
        font-size: 1.5em;
        letter-spacing: -0.01em;
 
        font-weight: 400;
	display: inline-block;
	margin-right: 4em;
	line-height: 1.3em;
	vertical-align: middle;
}
.title h2 span.warehouse {
	display: block;
	font-size: 0.665em;
	letter-spacing: 0;
	line-height: 1em;
	margin-bottom: 0.2em;
//	margin-bottom: 0;
	color: rgba(0,0,0,0.655);
}
.title h2.minwidth {
	//min-width: 320px;	
}
.embed .title h2 {
	font-size: 1.33em;
font-size: 1.5em;
//	letter-spacing: 0;
}

.title a.back {
	margin-right: 1.2em;
//	border: 1px solid black;
	border-radius: 999px;
	padding: 0.6em 0.2em;
}
.embed .title a.back {
	margin-right: 0.9em;
}
.title a.back .material-icons {
//	vertical-align: top;
	vertical-align: middle;
	position: relative;
	top: -1px;
//	left: 1px;
}
.embed .title a.back .material-icons {
//	font-size: 22px;
//	top: -1px;
}


.title a.buttons {
	text-transform: uppercase;
	font-weight: 500;
	font-size: 1.08em;
	padding: 0.4em 0.5em;
	text-decoration: none;
//	border: 1px solid transparent;
//	border-radius: 2px;
	box-sizing: border-box;

	margin-right: 1.4em;
	position: relative;
//	top: -1px;
//	float: left;
//border: 1px solid green;
}
.title a.buttons .material-icons {
        font-size: 17px;
        vertical-align: middle;
	position: relative;
	top: -1px;
}
.title a.buttons.disabled {
	color: rgba(0, 0, 0, 0.26);
        pointer-events: none;
}
.title a.buttons.disabled:hover {
	background: none;
	cursor: default;
}



/*
 * Typical form
 *
 */
form label {
        display: block;
        margin-top: 1em;
        line-height: 1.6em;
        font-weight: 500;
        font-size: 0.9em;
        letter-spacing: 0.02em;
}
/*
.login_outer form input[type="text"],
.login_outer form input[type="password"] {
        border: none;
        border-bottom: 1px solid #d3d3d3;
        width: 100%;
        padding: 0.2em 0.05em;
        color: rgb(0,0,0);
        font-size: 1.05em;
	background-color: white;
}
.login_outer form input[type="text"]:focus,
.login_outer form input[type="password"]:focus {
        border-bottom: 1px solid #3366d4;
}
*/
/*
.errField,
form.frugal input:invalid,
form.frugal input:focus:invalid,
form.frugal select:invalid,
form.frugal select:focus:invalid {
	border: 1px solid #dd4b39 !important;
	box-shadow: 0 0 2px 1px #dd4b39 !important;
}
*/
.errField {
	border: 1px solid var(--color-redish) !important;
	box-shadow: 0 0 2px 1px var(--color-redish) !important;
}

.errText {
	color: var(--color-redish);
	padding: 0.35em 0 0 0;
	display: none;
	white-space: nowrap;
}

.links {
	margin: 2em 0 2em 0;
	line-height: 1.3em;
}
.inline {
	display: inline-block;
	display: inline;
}

form.frugal {
        width: var(--canvas-workspace-min);
        min-width: var(--canvas-workspace-min);
}
from.frugal.min-height {
//	min-height: 400px;
}
form.frugal label {
	margin-bottom: 0.35em;
	margin-top: 0;
	line-height: 1em;
}
form.frugal label.plain {
	display: inline;
	margin: 0;
	padding: 0;
	font-size: 1em;
	letter-spacing: 0;
	font-weight: 400;
	padding-left: 0.10em;
	cursor: pointer;
	vertical-align: top;
}
form.frugal label.plain.disabled {
	pointer-events: none;
	color: rgba(0,0,0,0.388);
}
form.frugal label span.opt {
	color: rgba(0,0,0,0.38);
	font-weight: 400;
	padding-left: 0.1em;
}
form.frugal div:first-child label {
//	margin-top: 0;
}
form.frugal input[type="text"],
form.frugal input[type="number"],
form.frugal input[type="password"],
form.frugal input[type="date"],
form.frugal input[type="email"],
form.frugal select,
form.frugal textarea {
	border: 1px solid #d3d3d3;
	color: #000;
	transition: border-color ease .1s;
	padding: 0 6px 0px 6px;
	background-color: #fff;
	border-radius: 1px;

        color: rgb(0,0,0);
//	max-width: 440px;
	width: 100%;
	font-size: 1em;
	height: 24px;
	vertical-align: baseline;


/*
	-ms-box-sizing:content-box;
	-moz-box-sizing:content-box;
	-webkit-box-sizing:content-box; 
	box-sizing:content-box;
*/
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;

        transition: all ease .15s;
/*
	border-top: none;
	border-left: none;
	border-right: none;
*/
}
form.frugal textarea.exit__reason {
	height: 125px;
}

form.frugal input[type="text"][disabled],
form.frugal input[type="number"][disabled],
form.frugal input[type="password"][disabled],
form.frugal input[type="date"][disabled],
form.frugal input[type="email"][disabled],
form.frugal select[disabled],
form.frugal textarea[disabled],
form.frugal input[type="text"][readonly],
form.frugal input[type="number"][readonly],
form.frugal input[type="password"][readonly],
form.frugal input[type="date"][readonly],
form.frugal input[type="email"][readonly],
form.frugal select[disabled],
form.frugal textarea[disabled] {
	pointer-events: none;
	-webkit-appearance: none;
	-moz-appearance: none;
	appearance: none;

	border-color: #efefef;

	color: rgba(0,0,0,0.65);
	opacity: 1; /* Chrome seems to lower this for disabled selects, making it explicit */
	padding-left: 5px; /* Standardise padding-left for all inputs, selects and inputs have it differntly by default */

	border-top: 0;
	border-left: 0;
	border-right: 0;
}
form.frugal input[type="text"].invisible,
form.frugal select.invisible {
	border: none;
//	padding-left: 0;
//	padding-right: 0;
	letter-spacing: inherit;
//	height: 1.2em;
//	margin-bottom: 0.45em;
}
form.frugal input[type="text"].invisible:not(.errField) {
	/* Remove standard appearance only when it's not highlighted as an error */
	padding: 0; /* no padding */
	height: 1.2em; /* reduced height */
	margin-bottom: 0.45em; /* bottom margin */
}

form.frugal input[type="text"].invisible.minor {
        color: rgba(0,0,0,0.655);
        font-size: 0.9em;
	margin-bottom: 0;
	padding: 0;
	margin: 0;
	height: 1.2em;
}
form.frugal input[type="radio"],
form.frugal input[type="checkbox"] {
	vertical-align: bottom;
	position: relative;
	width: 13px;
	height: 13px;
	top: -1px;
}
form.frugal select {
	padding: 0 0 0 2.5px;
}
form.frugal textarea {
//	height: 40px;
//	height: 24px;

	min-height: 24px;
	max-height: 150px;
	max-width: 100%;
	min-width: 100%;
	resize: none;

	padding-top: 3px;
	padding-bottom: 2px;
        transition: all ease .15s;
}
form.frugal textarea:focus {
	min-height: 48px;
}
form.frugal textarea.reset {
	height: auto;
	min-height: auto;
}
form.frugal input[type="text"]:focus,
form.frugal input[type="number"]:focus,
form.frugal input[type="password"]:focus,
form.frugal input[type="date"]:focus,
form.frugal input[type="email"]:focus,
form.frugal select:focus,
form.frugal textarea:focus {
        border-color: #3366d4;
}
form.frugal div.inline {
	display: inline-block;
	box-sizing: border-box;
//	white-space: nowrap;
	
}
.topmarginbig {
	margin-top: 1.3em;
}
form.frugal div.topmarginstd,
.topmarginstd {
	margin-top: 0.8em;
	margin-top: 0.7em;
}
.bottommarginstd {
	margin-bottom: 0.7em;
//border: 1px solid red;
}
form.frugal div.topmargin,
.topmargin {
	margin-top: 0.35em;
}
form.frugal div.topmargintiny,
.topmargintiny {
	margin-top: 0.15em;
}
form.frugal .leftmargin {
	width: calc(100% - 2px) !important;
	margin-left: 2px !important;
}
form.frugal .rightmargin {
	width: calc(100% - 2px) !important;
	margin-right: 2px !important;
}
form.frugal .bothmargin {
        width: calc(100% - 4px) !important;
        margin-right: 2px !important;
	margin-left: 2px !important;
}
form.frugal div.s70 {
	width: 66%;
}
form.frugal div.s28 {
	width: 34%;
}
form.frugal div.s40 {
        width: 40%;
}
form.frugal .s50 {
        width: 50%;
}
form.frugal .s25 {
        width: 25%;
}
form.frugal .s75 {
        width: 75%;
}


form.frugal div.group,
div.group {
        max-width: 440px;
	margin-bottom: 1.7em;
}
form.frugal div.group.group__wide,
div.group.group__wide {
	max-width: 480px;
}
div.group.group__nobottommargin {
	margin-bottom: 0em !important;
}
div.group.group__nomaxwidth {
	max-width: 100% !important;
}
form.frugal div.group:after,
div.group:after {
        content:"";
        display:table;
        clear:both;
}
form.frugal div.flex {
	/* 'flex' causes browsers to ignore whitespace within html */
	display: flex;
}
form.frugal div.hide-all {
	display: none !important;
}
form.frugal p.explain {
	color: rgba(0,0,0,0.655);
	letter-spacing: normal;
	font-size: 0.9em;
	padding-bottom: 0.5em;
	line-height: 1.1em;
}
form.frugal a.minor:hover {
	//text-decoration: underline;
}
form.frugal select.multiple {
	height: auto !important;
}
form.frugal select option.og {
	background: #efefef;
	// color: white;
	// background: #000;
}
form.frugal a.minor {
	font-size: 0.9em;
	padding-top: 0.35em;
	display: inline-block;
	text-decoration: none;
}
.minor {
	font-size: 0.9em;
}


.card {
	padding: 12px;
	-moz-box-shadow: 0 1px 3px rgba(0,0,0,0.12);
	box-shadow: 0 1px 3px rgba(0,0,0,0.12);
	border: 1.1px solid #e7e7e7;
//	border: 1px solid #d3d3d3;
//	border-radius: 1px;
	border-radius: 2px;
}
.card.disabled {
/*
	-moz-box-shadow: none;
	box-shadow: none;
	border-color: #d3d3d3;
	border-radius: 1px;
*/
}
.card .card-container {
//	display: flex;
//	flex-direction: row;
	position: relative;
//	border: 1px solid red;
	min-height: 50px;
}
.card .card-container p {
}
.card .card-container p.minor {
	color: rgba(0,0,0,0.655);
	margin-top: 0.5em;
	font-size: 0.9em;
	font-weight: 400;
	line-height: 1.2em;
	letter-spacing: normal;
}
.card .card-container .icon i.material-icons {
	color: rgb(59, 120, 231);
	font-size: 50px;
}
.card .card-container .icon {
	width: 15%;
display: none;
}
.card .card-container .text {
	width: 85%;
}
.card .card-container a {
	position: absolute;
	right: 0;
	bottom: 0;
}



.section-toggle {
	display: block;
	margin-bottom: 1.8em;
	text-decoration: none !important;
	//display: none;
}
.section-toggle i {
	display: inline-block;
	font-size: 0;
	position: relative;
	width: 10px;
	height: 8px;
	padding-left: 3px;
	transition: all ease .1s;
}
.section-toggle i span {
	display: block;
	position: absolute;
	top: -4px;
	opacity: .5;
	transition: all ease .1s;
}
.section-toggle i span::before {
	top: -1px;
}
.section-toggle i span::after {
	top: 4px;
}
.section-toggle i span::after,
.section-toggle i span::before {
	display: block;
	content: "";
	position: absolute;
	left: 1px;
	height: 5px;
	width: 5px;
	-moz-box-shadow: 1.37px 1.37px 0 0 #3367d6;
	box-shadow: 1.37px 1.37px 0 0 #3367d6;
	-moz-transform: rotateZ(45deg);
	transform: rotateZ(45deg);
}
.section-container {
	display: none;
}


/*
 * Login template
 *
 */
.login_outer {
	max-width: 29em;
//max-width: 30em;
	margin: 0 auto;

	right: 0;
	left: 0;
        position: absolute;
        top: 50%;
        -webkit-transform: translateY(-50%);
        -ms-transform: translateY(-50%);
        transform: translateY(-50%);
}
.login_outer .login_inner {
	min-height: 24em;
	}
.login_head {
	margin-bottom: 5em;
}
.login_bottom {
	margin-top: 6em;
}
.login_bottom input[type="submit"] {
	float: right;
}
.login_extra {
	padding: 0.6em 0 0 0;
}
.login_extra a {
	color: inherit;
	text-decoration: none;
}
.login_extra select {
	color: inherit;
	background: transparent;
	border: none;

	-webkit-appearance: none;
	-moz-appearance: none;
	appearance: none;
	font-weight: inherit;
}
.login_extra select option {
	background: white;
}


.placeholder {
	//max-width: 30em;
        margin: 0 auto;

        right: 0;
        left: 0;
        position: absolute;
        top: 50%;
        -webkit-transform: translateY(-50%);
        -ms-transform: translateY(-50%);
        transform: translateY(-50%);

	text-align: center;
}
img.logo {
	margin-bottom: 4em;
}

/*
 * Base-1 generic
 *
 */
.base-1 {
	padding-top: 58px;
	padding-top: 50px;
	padding-top: 2.5em;
	padding-top: 2.1em;
	padding-top: 0;
}
.base-1 #header {
	/*
	height: 30px;
	width: 100%;

	-moz-box-shadow: 0 3px 4px 0 rgba(0,0,0,.14),0 3px 3px -2px rgba(0,0,0,.2),0 1px 8px 0 rgba(0,0,0,.12);
	box-shadow: 0 3px 4px 0 rgba(0,0,0,.14),0 3px 3px -2px rgba(0,0,0,.2),0 1px 8px 0 rgba(0,0,0,.12);

	color: white;
	background: #303030;
	*/

	position: fixed;
	top: 0;
	left: 0;
	right: 0;
	z-index: 10;

	height: 5px;
	width: 100%;
	overflow: hidden;

	-webkit-box-shadow: 	inset 0 4px 4px -4px rgba(100,100,100,0.8);
	-moz-box-shadow: 	inset 0 4px 4px -4px rgba(100,100,100,0.8);
	box-shadow: 	 	inset 0 4px 4px -4px rgba(100,100,100,0.8);
}
.base-1 .dsize {
        //max-width: 1260px;
	max-width: 1280px;
        margin: 0 auto;
}
.base-1 #header ul#headerComponents {
//	border: 1px solid red;
//	text-align: center;
}
.base-1 #header ul#headerComponents > li {
//	float: left;
	display: inline-block;
//	height: 45px;
//	line-height: 45px;
//height: 30px;
line-height: 30px;
}
.base-1 #header ul#headerComponents > li > a {
	color: inherit;
	text-decoration: none;
	padding: 0 2.4em 0 0;
}
.base-1 #header ul#headerComponents > li > a:hover, 
.base-1 #header ul#headerComponents > li > a:active {
	//color: #365899;
	color: rgba(255,255,255,0.8);
}
.base-1 #header ul#headerComponents > li:first-child {
//	font-size: 1.50em;
//	line-height: 43.5px;
line-height: 28px;
font-size: 1.25em;
//	letter-spacing: -0.01em;
}
.base-1 #header ul#headerComponents > li:first-child a {
	font-weight: 400;
}
.base-1 #header ul#headerComponents > li:first-child b {
	font-weight: 500;
}
.base-1 #header ul#headerComponents > li.account {
//	float: left;
//	padding-right: 4em;
}
/*
.base-1 #header ul#headerComponents > li:nth-child(3) > button {
	display: inline-block;
	vertical-align: middle;
	height: 30px;
	padding-left: 1.1em;
	padding-right: 1.1em;
	border-bottom-left-radius: 0;
	border-top-left-radius: 0;
	border-color: #eee;
}
*/
.base-1 #header ul#headerComponents > li.toright {
	float: right;
//	padding: 0 0 0 2.1em;
}
.base-1 #header ul#headerComponents > li.toright > a {
//	padding: 0 0 0 1.8em;
//	padding: 0 0 0 1.7em;
	padding: 0;
	margin-left: 1.7em;
}
.base-1 #header ul#headerComponents > li.dropdown {
	position: relative;
	display: inline-block;
}
.base-1 #header ul#headerComponents > li.dropdown:hover .dropdown-menu {
//	display: block;
}
.base-1 #header ul#headerComponents > li.dropdown .dropdown-menu.toggleVisibilityOn {
	display: block;
}
.base-1 #header ul#headerComponents > li.dropdown .dropdown-menu {
	/* Default display setting */
	display: none;
	position: absolute;
	width: 100%;

	/* Mumble, mumble, menu has a dynamic width */
	min-width: 250px;
	width: auto;

        box-shadow: 0px 1px 3px rgba(0,0,0,0.12);
	border: 1px solid rgba(0, 0, 0, .15);
//	box-shadow: 0 3px 8px rgba(0, 0, 0, .3);

	background: white;
	cursor: auto;
	line-height: 1.5em;

	border-radius: 2px;

	z-index:99;

	color: rgba(0,0,0,0.65);
}
/*
.base-1 #header #shadows {
	color: black;
	background-image: url(/originals/img/shadowmenu.png);
	background-position: 50% 0px;
	height: 15px;
}
*/

.base-1 .canvas {
        min-height: 550px;
	padding-bottom: 2em;
//	margin-top: 2em;
	margin-top: 1.8em;
margin-top: 1.5em;
margin-top: 1.4em;

	display: flex;
	flex-direction: row;

}
.base-1 .canvas .canvasInner {
	padding-top: 1.5em;
	max-width: 780px;
}
.base-1 .canvas .canvasLeft {
	color: rgba(0,0,0,0.655);
	flex-basis: 180px;
	margin-right: 3em;
	position: relative;
//visibility: hidden;
//flex-basis: 00px;
//display: none;
}
.base-1 .canvas .canvasMain {
	flex-basis: 750px;
}
.base-1 .canvas .canvasWide {
        flex-basis: 1000px;
	flex-basis: 750px;
}


.base-1 .canvas .canvasLeft .warehouseChooser {
	/* needed for the dropdown */
        position: relative;
        display: inline-block;
}
.base-1 .canvas .canvasLeft .warehouseChooser > a {
        line-height: 1em;

        font-size: 1.5em;
        font-weight: inherit;
	color: rgb(59,120,231);

        text-rendering: optimizeLegibility;
        letter-spacing: -0.01em;
	text-decoration: none;
}
.base-1 .canvas .canvasLeft .warehouseChooser > a span:after{
        border-color: rgb(59,120,231) transparent rgb(59,120,231) transparent;
        border-style:solid;
        border-width:4px 4px 0px 4px!important;
        content:"";
        display:inline-block;font-size:0;height:0;left:1px;position:relative;top:-3px!important
}
.base-1 .canvas .canvasLeft .warehouseChooser .dropdown-content {
	display: none;
	position: absolute;
	z-index: 1;
	min-width: 140px;
	background: white;
	border: 1px solid rgba(0,0,0,.2);
	box-shadow: 0 2px 4px rgba(0,0,0,0.2);
}
.base-1 .canvas .canvasLeft .warehouseChooser:hover .dropdown-content {
	display: block;
}
.base-1 .canvas .canvasLeft .warehouseChooser .dropdown-content ul {
	margin: 0.5em 0;
	text-indent: 2em;
}
.base-1 .canvas .canvasLeft .warehouseChooser .dropdown-content ul li {
	line-height: 1.5em;
	font-size: 1.05em;
}
.base-1 .canvas .canvasLeft .warehouseChooser .dropdown-content ul li a.selected {
//	font-weight: 500;
//	color: rgb(59,120,231);
}

.base-1 .canvas .canvasLeft #LLMenus {
	height: 85%;
	height: 90%;
	height: 92.5%;
	width: 180px;
	overflow-y: auto;
//border: 2px solid red;
}
.base-1 .canvas .canvasLeft #LLMenus.fixed {
	position: fixed;
//	top: 46px;
}
.base-1 .canvas .canvasLeft #LLMenus.disabled {
	pointer-events: none;
	opacity: 0.2;
}
.base-1 .canvas .canvasLeft #LLMenus .identity {
	margin-top: 0.5em;
	margin-bottom: 1.5em;
	margin-bottom: 1em;
	height: 20px;
}
.base-1 .canvas .canvasLeft #LLMenus .identity div:first-child {
	float: left;
	width: 30%;
}
.base-1 .canvas .canvasLeft #LLMenus .identity div:last-child {
	float: left;
	width: 70%;
	text-align: left;
}
.base-1 .canvas .canvasLeft #LLMenus .identity div:last-child a {
//	color: rgba(0,0,0,0.175);
}

.base-1 .canvas .canvasLeft #LLMenus .switch {
	margin-bottom: 1.5em;
margin-bottom: 2em;
}
.base-1 .canvas .canvasLeft #LLMenus .switch a {
	color: inherit;
	display: block;
	line-height: 1.5em;
}
.base-1 .canvas .canvasLeft #LLMenus .switch a:hover {
//        background: #efefef;
}
.base-1 .canvas .canvasLeft #LLMenus .logout {
	position: absolute;
	bottom: 0;
	left: 0;
	width: 100%;
}
.base-1 .canvas .canvasLeft #LLMenus .logout a {
//	color: inherit;
	display: block;
	line-height: 1.5em;
}
.base-1 .canvas .canvasLeft #LLMenus .logout a:hover {
//        background: #efefef;
}


.base-1 .canvas .canvasLeft #LLMenus > a,
.base-1 .canvas .canvasLeft #LLMenus > ul {
	line-height: 1.5em;
}
.base-1 .canvas .canvasLeft #LLMenus > a {
	color: #000;
	font-weight: 500;
	font-size: 1.0em;
	display: block;
	text-decoration: none;

	position: relative;
}
.base-1 .canvas .canvasLeft #LLMenus > a:hover {
//	background: #efefef;
}
.base-1 .canvas .canvasLeft #LLMenus > a:not(:first-child) {
	margin-top: 0.9em;
//margin-top: 0.7em;
margin-top: 1em;
}
.base-1 .canvas .canvasLeft #LLMenus > ul {
	display: none;
}
.base-1 .canvas .canvasLeft #LLMenus > ul.show {
	display: block;
}
.base-1 .canvas .canvasLeft #LLMenus > ul li.bold {
	font-weight: 500;
//	 color: rgb(17,17,17);
	color: rgb(0,0,0);
	text-indent: 0;
//	text-transform: uppercase;
//	font-size: 0.9em;
//	letter-spacing: 0.02em;
//display: none;
}
.base-1 .canvas .canvasLeft #LLMenus > ul li:last-child {
	margin-bottom: 0.9em;
	margin-bottom: 0.7em;
	display: block;
//margin-bottom: 0.5em;
}
.base-1 .canvas .canvasLeft #LLMenus > ul li a {
//	color: inherit;
	text-decoration: none;
	display: block;
	position: relative;
//	transition: opacity 200ms cubic-bezier(0.35, 0, 0.25, 1), background-color 200ms cubic-bezier(0.35, 0, 0.25, 1);
}
.base-1 .canvas .canvasLeft #LLMenus > ul li a span.count {
//	background-color: rgb(249, 249, 249);
//	border: 2px solid rgb(249, 249, 249);
//	border-radius: 3px;

	display: inline-block;
//	line-height: 0.9em;
//	color: #3367d6;
}

.base-1 .canvas .canvasLeft #LLMenus > ul li a .material-icons {
        font-size: 13px;
        vertical-align: top;
	color: rgba(0,0,0,0.6);
	padding-right: 0px;
	position: relative;
	top: 1px;
	left: -1.5px;
}
.base-1 .canvas .canvasLeft #LLMenus > ul li a.disabled {
	cursor: default;
	color: rgba(0,0,0,0.38);
}
.base-1 .canvas .canvasLeft #LLMenus > ul li a.disabled:hover {
	background: none;
}
.base-1 .canvas .canvasLeft #LLMenus > ul li a:hover, 
.base-1 .canvas .canvasLeft #LLMenus > ul li a.selected:hover {
//	background-color: #efefef;
}
.base-1 .canvas .canvasLeft #LLMenus > ul li a:active,
.base-1 .canvas .canvasLeft #LLMenus > ul li a.selected:active {
//	background-color: rgba(0,0,0,0.15);
}
.base-1 .canvas .canvasLeft #LLMenus > ul li a.selected {
//	color: rgb(59,120,231);
//	background-color: #f9f9f9;
}
a.back {
	text-decoration: none;
}


/* bottom layer to overshadow the main window */
.base-1 #overlay {
	position: absolute;
	width: 100%;
	height: 100%;
	background: rgba(255, 255, 255, 0.875);
	left: 0;
	right: 0;
	top:0;
	bottom: 0;
	display: none;
}
.base-1 #overlay iframe {
	box-sizing: border-box;

	background: #fff;
	-moz-box-shadow: -4px 0 8px rgba(0,0,0,0.2);
	box-shadow: -2px 0 4px rgba(0,0,0,0.2);

	position: fixed;
	transition: left 400ms, opacity 400ms;
	transition: all 400ms;
	max-width: none;

	width: calc(100% - 306px);
	height: 100%;

//	z-index: 1000;
	right: 0;
	bottom: 0;
	top: 0;
	left: 306px;
	left: 800px;

	opacity: 0;
}
.base-1 #overlay iframe.opened {
	left: 306px;
	opacity: 1;
}
.base-1-embed {
	min-width: 780px;
	position: absolute;
	top: 1em;
	padding-top: 0.5em; /* allow some space so that buttons can overflow */
	left: 2em; /* left space */
	bottom: 1em;

	display: flex;
	flex-direction: column;
	height: calc(100% - 2.5em); /* 1em+0.5em top, 1em bottom */

	overflow-y: auto;
	overflow-x: hidden;

}
.base-1-embed .controlsrow,
.base-1-embed .contentsrow,
.base-1-embed .buttonsrow {
//	 border: 1px solid black;
}
.base-1-embed .controlsrow {
        align-self: flex-start;
        width: 100%;
}
.base-1-embed .contentsrow {
        flex-grow: 100;
        overflow-y: auto;
	padding-right: 1.8em; /* right space */
	//margin-top: 1em;

	/* Some padding keeps inner content detached from borders */
	padding-top: 0.5em;
	padding-bottom: 0.5em;
}
.base-1-embed .buttonsrow {
        align-self: flex-end;
        width: 100%;
//        margin-top: 2em;
        margin-top: 1em;
}


.base-1-embed .controlsrow p.explainer, p.explainer {
	margin-bottom: 1em;
	color: rgba(0,0,0,0.655);
}
.base-1-embed .controlsrow .tabs {
	border-bottom: 1px solid #ddd;
	margin-bottom: 1.5em;
}
.base-1-embed .controlsrow .tabs ul {
}
.base-1-embed .controlsrow .tabs ul li {
	display: inline-block;
	margin-right: 2em;
}
.base-1-embed .controlsrow .tabs ul li a {
	color: rgba(0,0,0,0.655);
	text-decoration: none;
}
.base-1-embed .controlsrow .tabs ul li a:hover {
	color: rgb(59,120,231);
}
.base-1-embed .controlsrow .tabs ul li a.selected {
        border-bottom: 2px solid rgb(59,120,231);
        color: rgb(59,120,231);
        line-height: 2em;
        display: block;
}

.base-1-embed .contentsrow p.feedback {
	font-weight: 500;
	font-size: 1.1em;
//	margin-bottom: 0.5em;
	margin-bottom: 1.3em;
}
.base-1-embed .contentsrow table.selector {
	min-width: 500px;
	width: 500px;
	margin-bottom: 0.5em;
	border-collapse: separate;
}
.base-1-embed .contentsrow table.selector.topmargin {
	margin-top: 1.5em;
}
.base-1-embed .contentsrow table.selector td {
//	padding: 0.8em 0.2em 0 0em;
	padding: 0 0.2em 0 0;
	vertical-align: top;
//border: 1px dotted gray;
}
.base-1-embed .contentsrow table.selector tr.spacer td {
	padding-bottom: 1em;
}
.base-1-embed .contentsrow table.selector td:first-child {
	vertical-align: top;
	color: rgba(0,0,0,0.38);
	width: 4%;
}
.base-1-embed .contentsrow table.selector td:nth-child(2) {
}
.base-1-embed .contentsrow table.selector td:nth-child(2) label {
	cursor: pointer;
//	letter-spacing: normal;
}
.base-1-embed .contentsrow table.selector td:nth-child(2) span.name {
	color: rgba(0,0,0,0.655);
}
.base-1-embed .contentsrow table.selector td:nth-child(2) span.name b,
.base-1-embed .contentsrow table.selector td:nth-child(2) span.taxuuid b {
        background: #efefef;
        font-weight: 500;
        color: rgb(59,120,231);
}
.base-1-embed .contentsrow table.selector td:nth-child(2) p {
//	color: rgba(0,0,0,0.655);
	color: rgba(0,0,0,0.38);
	font-size: 0.9em;
	display: block;
	padding-top: 0.25em;
	padding-top: 0.3em;
	line-height: 1.1em;
}
.base-1-embed .contentsrow table.selector td:nth-child(2) p:nth-child(3) {
//	color: rgb(59,120,231);
//	font-weight: 500;
//	color: #000;
}
.base-1-embed .contentsrow table.selector td:nth-child(3) {
	text-align: right;
}

.base-1-embed .contentsrow table.selector tbody tr td:first-child,
.base-1-embed .contentsrow table.selector thead tr th:first-child {
//        text-indent: 12px;
}
.base-1-embed .contentsrow table.selector tbody tr.pointer td:first-child {
        border-left: 2px solid rgb(59,120,231) !important;
        text-indent: 10px;
//	text-indent: 5px;
}
.base-1-embed .contentsrow table.selector tr.pointer td:nth-child(2) span.name {
        color: #000 !important;
}


.base-1-embed .contentsrow table#tariffs {

}

.base-1-embed .buttonsrow p {
	margin-bottom: 1.5em;
	color: rgba(0,0,0,0.65);
}
.base-1-embed .buttonsrow div {
	border-top: 1px solid #ddd;
	padding-top: 1.5em;
	padding-top: 1.0em;
}


.accounts {
	padding: 0.8em 0.8em;
	color: rgba(0,0,0,0.65);
}
.accounts div.user div {
	display: inline-block;
	vertical-align: middle;
	line-height: 1.2em;
	padding-left: 0.25em;
}
.accounts div.user i.material-icons.md-dark {
	font-size: 36px;
}
.accounts div.user div b {
	color: #000;
	font-weight: 500;
	font-size: 1.1em;
}
.accounts {
	padding: 1.5em 0 0.5em 0;
	padding-top: 0;
	max-height: 500px;
	overflow-y: auto;
}
.accounts h5 {
	margin-top: 1.5em;
	padding-bottom: 0.4em;
	font-size: 0.9em;
	font-weight: 500;
}


/* Standard dropdown menu */
.accounts ul.ddMenu {
	max-width: 90%;
}
.accounts ul.ddMenu li {
	line-height: 1.5em;
}
.accounts ul.ddMenu a {
	display: block;
	text-decoration: none;
	// color: inherit;
        // transition: opacity 200ms cubic-bezier(0.35, 0, 0.25, 1), background-color 200ms cubic-bezier(0.35, 0, 0.25, 1);
}
.accounts ul.ddMenu a.selected {
//	color: rgb(59,120,231);
//	background-color: #f9f9f9;
}
.accounts ul.ddMenu a:hover,
.accounts ul.ddMenu a.selected:hover {
//	background-color: #efefef;
}
.accounts ul.ddMenu a:active,
.accounts ul.ddMenu a.selected:active {
//	background-color: rgba(0,0,0,0.15);
}
.accounts ul.ddMenu a.deleted {
	opacity: 0.4;
}
.accounts ul.ddMenu a span {
        font-size: 0.9em;
        padding-left: 0.5em;
        color: rgb(0,0,0,0.38);
}




/*
 * Base-1 specific
 *
 */
.base-1 #header ul li input[name="omnisearch"] {
        border: 1px solid transparent;
	border-radius: 1px;
        padding: 0.5em 0.5em;
        width: 46em;
	background: rgba(255,255,255,0.15);
	color: inherit; /* white */
}
.base-1 #header ul li input[name="omnisearch"]::-webkit-input-placeholder { /* WebKit, Blink, Edge */
	color: inherit;
}
.base-1 #header ul li input[name="omnisearch"]:-moz-placeholder { /* Mozilla Firefox 4 to 18 */
	opacity: 1;
	color: inherit;
}
.base-1 #header ul li input[name="omnisearch"]::-moz-placeholder { /* Mozilla Firefox 19+ */
	color: inherit;
	opacity: 1;
}
.base-1 #header ul li input[name="omnisearch"]:-ms-input-placeholder { /* Internet Explorer 10-11 */
	color: inherit;
}
.base-1 #header ul li input[name="omnisearch"]::-ms-input-placeholder { /* Microsoft Edge */
	color: inherit;
}
.base-1 #header ul li input[name="omnisearch"]:focus {
	background: white;
	color: rgba(17,17,17);
}

.pop {
	-moz-box-shadow: 4px 0 0 0 #d3d3d3 inset,0 1px 3px rgba(0,0,0,0.12);
	box-shadow: 4px 0 0 0 #d3d3d3 inset, 0 1px 3px rgba(0,0,0,0.12);
	border: 1.1px solid #e7e7e7;

//        -moz-box-shadow: 4px 0 0 0 #d3d3d3 inset,0 0px 3px rgba(0,0,0,0.12);
//	box-shadow: 4px 0 0 0 #d3d3d3 inset, 0 0px 3px rgba(0,0,0,0.12);
	padding: 0.5em 1em 0.5em 1.1em;
	margin-bottom: 1.3em;
//	display: none;
	background: white;

	/* vertical aligning */
        display: flex;
        align-items: center;
}

.pop div {
//	padding-left: 0.2em;
//	padding-right: 0.6em;
//	display: inline-block;
//	vertical-align: middle;

	/* vertical aligning */
	display: flex;
	align-items: center;
	width: 100%;
	min-height: 1.5em;
//border: 1px solid black;
}
.pop p {
	flex-basis: 100%;
	display: inline-block;
//border: 1px solid red;
}
.pop p span.pre {
//	white-space: pre;
}
.pop ul li {
	line-height: 1.3em;
//        color: rgb(0,0,0,0.6);
}
.pop.pop__bottommargin {
	margin-bottom: 1.7em;
}


span.inconsistent > .material-icons {
	font-size: 1.5em;
}

.material-icons.md-dark,
.material-icons-outlined.md-dark { 
	font-size: 1.8em;
	font-size: 1.65em;
	font-size: 1.5em;
//font-size: 1.75em;
        vertical-align: middle;
	position: relative;
	top: -1px;
	color: rgba(0, 0, 0, 0.075); 
	color: rgba(0,0,0,0.3);

//        -webkit-text-stroke: 1px white;
//        text-stroke: 1px white;
}


/*
.material-icons.medium {
	font-size: 17px;
	vertical-align: middle;
	padding-bottom: 1px;
}
*/
.material-icons.md-dark.larger {
	font-size: 34px;
	font-size: 32px;
}
.material-icons.md-dark.smaller {
	font-size: 16px;
}
.material-icons.md-dark.tiny {
	font-size: 15px;
	vertical-align: top;
}
.base-1 #header a .material-icons.md-dark {
	//color: #fff;
	color: inherit;
}



.base-1 .progress {
	margin-bottom: 2.5em;
}
.base-1 .progress ul li {
	float: left;
	min-width: 180px;
min-width: 24.8%;
	margin-right: 1px;
}
.base-1 .progress ul li a {
	color: rgba(0,0,0,0.5);
	border-bottom: 1px solid rgba(0,0,0,0.15);
}
.base-1 .progress ul li a.current {
	color: inherit;
	border-bottom-color: rgba(0,0,0,0.6);
}


.base-1 .nav {
	margin: 0.6em 0 2.5em 0;
margin: 0.4em 0 2.5em 0;
	color: rgba(0,0,0,0.655);
}
.base-1 .nav a .material-icons {
	vertical-align: middle;
	font-size: 1.4em;
	text-indent: -0.3em;
}
.base-1 .nav a {
	color: inherit;
}


p.guidelines {
	padding-bottom: 1.7em;
	color: rgba(0,0,0,0.655);
}
p.guidelines #outerControls {
	//float: right;
	font-size: 0.9em;
}


.cascades {
//	border-top: 1px solid #ddd;
	width: var(--canvas-workspace-min);
	min-width: var(--canvas-workspace-min);

	/* Add extra bottom margin, kind of a quiet zone for humans */
	padding-bottom: 5em;
}
.interstitial {
	padding-top: 2em;
	padding-bottom: 0.4em;

}
.interstitial b {
        font-size: 0.9em;
        color: #000;
        font-weight: 500;
        letter-spacing: 0.02em;
	display: block;

	display: none; /* we're going to remove this */
}
.cascades .cascade {
	border-bottom: 1px solid #ddd;
	padding: 1em 1em;
}
.cascades .cascade.cascade__active {
/*
// box-shadow: 0 0px 4px 0 rgba(0,0,0,.14),0 3px 3px -2px rgba(0,0,0,.2),0 1px 8px 0 rgba(0,0,0,.12);
//-moz-box-shadow: inset 0 3px 4px 0 rgba(0,0,0,.14),0 3px 3px -2px rgba(0,0,0,.2),0 1px 8px 0 rgba(0,0,0,.12);
//box-shadow: inset 0 3px 4px 0 rgba(0,0,0,.14), 0 3px 3px -10px rgba(0,0,0,.2), 0 1px 0px 0 rgba(0,0,0,.12);
background-color: #fff;
    box-shadow:
	0px 100px 50px -40px #ffffff inset,
	0px -100px 50px -40px #ffffff inset,
	-5px 0px 10px -5px rgba(0,0,0,0.3) inset,
	5px 0px 10px -5px rgba(0,0,0,0.3) inset;

box-shadow:  -15px 0px 60px 25px #ffffff inset, 
        5px 0px 10px -5px rgba(0,0,0,0.5) inset;

    box-shadow:
	0px 5px 10px -5px rgba(0,0,0,0.3) inset,
	0px -5px 10px -5px rgba(0,0,0,0.3) inset,
	-100px 0px 50px -100px yellow inset,
	100px 0px 50px -40px #ffffff inset;

 box-shadow: 
        inset 0px 11px 4px -10px rgba(0,0,0,.2),
        inset 0px -11px 4px -10px rgba(0,0,0,.2);

	padding-top: 1.1em;
	padding-bottom: 1.1em;
*/
}
/* add border-top to div.cascade if preceded by div.interstitial */
.cascades .interstitial + .cascade,
.cascades .cascade:first-child {
	border-top: 1px solid #ddd;
}
.cascades .cascade > div {
	margin-top: 1.5em;
//	padding-left: 23px;

}
.cascades .cascade > div .minheight {
	min-height: 150px;
	min-height: 300px;
	display: flex;
	flex-direction: column;
}
.cascades .cascade .tofoot {
	margin-top: auto;
}

.cascades .cascade > a {
	font-size: 1.15em;
	color: #000;
	text-decoration: none;
	display: block;
}
.cascades .cascade > a span.suffix {
	color: rgba(0, 0, 0, 0.38);
	font-size: 0.85em;
	padding-left: 0.7em;
//	padding-left: 1em;
}
.cascades .cascade > a.disabled {
	color: rgba(0, 0, 0, 0.38);
	// cursor: default;
        pointer-events: none;
}
.cascades .cascade > a i.material-icons {
	color: rgb(59,120,231);
	font-size: 16px;
	vertical-align: middle;
	position: relative;
	top: -1.5px;
	padding-right: 0.15em;
}
.cascades .cascade > a i.material-icons.disabled {
	color: rgba(0,0,0,0.55);
}
.cascades_bottom {
	margin-top: 2em;
}

.cascades_links {
	margin-top: 2em;
	margin-left: 1em;
	text-align: left;
	color: rgba(0,0,0,0.655);
//	line-height: 1.3em;
//	border: 1px dotted gray;
//	text-align: left;
}
.cascades_links a {
//	color: inherit;
//	border: 1px solid red;
}
.cascades_links a i.material-icons {
	display: none;
	font-size: 1.2em;
	vertical-align: bottom;
//	line-height: 1.3em;
	padding-right: 0.15em;
}
.surface {
	background: #f9f9f9;
}
.metadata {
        padding: 0.5em 1em 0.5em 1.1em;
        margin-bottom: 1.3em;
        margin-bottom: 2.0em;

        /* vertical aligning */
        display: flex;
        align-items: center;
}
.metadata.warnings {
	border: 1px solid var(--color-redish);
	-moz-box-shadow: 4px 0 0 0 var(--color-redish) inset,0 1px 3px var(--color-redish);
        box-shadow: 4px 0 0 0 var(--color-redish) inset, 0 1px 3px var(--color-redish);

	color: var(--color-redish);
	display: none; /* Hidden at page load */
}
.metadata div {
        /* vertical aligning */
        display: flex;
	align-items: center;
        width: 100%;
        min-height: 1.5em;
}
.metadata div p.status {
}
.metadata div p.extranet {
	padding-left: 1em;
}


table.view {
	border-collapse: separate;
	margin-bottom: 1.5em;

//	width: 100%;
//	min-width: 100%;
//	max-width: 100%;

	/* Browsers won't observe max-width */
	width: var(--canvas-workspace-min);
	max-width: var(--canvas-workspace-min);
	min-width: var(--canvas-workspace-min);
}
table.view th:last-child {
	width: 99%;
}
table.view th {
	padding-bottom: 0.7em;
}
table.view th span, 
.th-alike {
	color: inherit;
	padding-right: 1.3em;
	padding-right: 2.5em;
	display: block;

        line-height: 1.5em;
        font-weight: 500;
        font-size: 0.9em;
        letter-spacing: 0.02em;
        text-align: left;
        text-decoration: none;
	white-space: nowrap;
}
table.view tbody tr {
//	background: #efefef;
}
table.view tbody tr[data-href]:hover {
	background: #efefef;
	cursor: pointer;
}
table.view tbody tr[data-href]:hover td {
//	color: rgb(59,120,231) !important;
}
table.view tbody tr td {
	padding: 0.2em 1em 0.2em 0em;
	padding: 0.45em 1em 0.45em 0em;
	padding: 0.5em 1.3em 0.5em 0;
	padding: 0.525em 1.3em 0.525em 0;
//padding: 0.5em 1.3em 0.5em 0;

	padding-right: 2.5em;
//	padding-right: 2em;

	border-bottom: 1px solid #efefff;
	border-bottom: 1px dotted #eee;

	border-top: 1px solid transparent;
	color: rgba(0,0,0,0.655);
//color: black;
//color: rgba(0,0,0,0.38);

	/* truncate long values */
	white-space: nowrap;
	max-width: 170px;
	max-width: 140px;
	text-overflow: ellipsis;
	overflow: hidden;

	/* Default, do not use multiple lines */
//	white-space: nowrap;
}
/* .cancelled and .orphaned do not conflict as one affects 'text-decoration' and the other affects 'color' */
table.view tbody tr.cancelled td, .cancelled {
	text-decoration: line-through;
}
table.view tbody tr.orphaned td {
	color: var(--color-redish);
}


/*
table.view tbody tr td.wrap {
        white-space: nowrap;
        max-width: 100px;
        text-overflow: ellipsis;
        overflow: hidden;
}
*/

/* selected */
/* Using tr[data-href] to isolate only clickable rows, leaving out 'group label' rows */
table.view tbody tr[data-href].selected td {
	/* !important: When selected, all hover effects are off */
//        background: rgb(194,219,255) !important;
        background-color: rgba(194,219,255,100);
        border-color: white;
}
/* .active goes after .selected because we want to highlight rows on click even if .selected is applied */
table.view tbody tr[data-href].active td {
        animation: animate-background-to-none 200ms ease-in-out 1.8s forwards;
        animation-delay: 0ms;
}
table.view tbody tr[data-href].selected.active td {
        animation: animate-background-to-selected  200ms ease-in-out 1.8s forwards;
	animation-delay: 0ms;
}
@keyframes animate-background-to-none {
        0% {
		background-color: rgba(0,0,0,0.15);
        }
        100% {
                background-color: rgba(0,0,0,0.00);
        }
}
@keyframes animate-background-to-selected {
        0% {
                background-color: rgba(0,0,0,0.15);
        }
        100% {
                background-color: rgba(194,219,255,100);
        }
}
@keyframes animate-background-to-sticky {
        0% {
                background-color: rgba(0,0,0,0.15);
        }
        100% {
                background-color: #efefef;
        }
}

/* 1st cell, checkbox */
/* Using tr[data-href] to isolate only clickable rows, leaving out 'group label' rows */
table.view tbody tr[data-href] td:nth-child(1) {
	padding-left: 0;
	padding-right: 1.5em;
	padding-top: 0;
	padding-bottom: 0;
	cursor: auto;
}
table.view tbody tr[data-href] td:nth-child(1) input[type="checkbox"] {
	position: relative;
	width: 13px;
	height: 13px;
	top: -1px;
	vertical-align: middle;
}

/* 2nd cell, numerator */
table.view tbody tr td:nth-child(2) {
	color: rgba(0,0,0,0.38) !important;
}
table.view thead tr th:nth-child(2) span,
table.view tbody tr td:nth-child(2) {
//	padding-right: 1.5em;
}

/* 3rd cell, status */
table.view thead tr th:nth-child(3) span,
table.view tbody tr td:nth-child(3) {
        // padding-right: 1.0em;
}


table.view tbody tr td.minwidth {
	min-width: 130px;
}
table.view tbody tr td.toright,
table.view th.toright span {
	text-align: right;
}
.cell-ellipsis {
	overflow:hidden;
	white-space:nowrap;
	text-overflow:ellipsis;
}
.cell-nowrap {
	white-space: nowrap;
}
table.view tbody tr td.highlight {
	color: #000;
}
table.view tbody tr td:first-child,
table.view thead tr th:first-child {
	text-indent: 12px;
}
table.view tbody tr.pointer td:first-child {
	border-left: 2px solid rgb(59,120,231) !important;
	text-indent: 10px;
}
table.view tbody tr.pointer:not(.orphaned) td {
	color: #000;
}
table.view tbody tr td .material-icons.md-dark {
	font-size: 1em;
	padding: 0;
}
table.view tbody tr td a {
	display: block;
	color: inherit;
	text-decoration: none;
}
/* make negative amounts show up in red */
table.view tbody tr td[data-monetary-amount^="-"],
span[data-monetary-amount^="-"] {
	color: var(--color-redish) !important;
}
/* right-align monetary amounts */
table.view tbody tr td[data-monetary-amount],
table.view tr th[data-monetary-amount] span,
span[data-monetary-amount] {
	text-align: right !important;
}
table.view tbody tr td.toright,
table.view tr th.toright span {
        text-align: right !important;
}


table.view tbody tr.rowset-header td b {
	font-size: 0.9em;
	color: #000;
	font-weight: 500;
	padding-top: 1em;
	padding-bottom: 0.3em;
	letter-spacing: 0.02em;
	border-bottom: 1px solid transparent;
}
/*
table.view tbody tr.rowset-header.uf_margin td {
	padding-top: 2.5em;
}
*/
/* Add padding-top to each rowset-header that immediately follows a tr.highlight */
table.view tbody tr.highlight + tr.rowset-header td {
	padding-top: 2.5em;
}

table.view tbody tr td span.circle {
	border-top-width: 4px;
	border-top-style: solid;
	border-bottom-width: 4px;
	border-bottom-style: solid;
	border-color: transparent;
	width: 8px;
	height: 0;
	display: inline-block;
	vertical-align: middle;
	position: relative;
	top: -1px;
	border-radius: 5px;
}
table.view tbody tr td span.circle.gray {
	border-color: gray;
}
table.view tbody tr td span.circle.orange {
	border-color: orange;
}
table.view tbody tr td span.circle.blank {
	border-color: #efefef;
}
table.view tbody tr.highlight {
	background-color: #f9f9f9;
}


table.view tbody tr.subtotal td.toright {
	text-align: right;
}
table.view tbody tr.subtotal td.label {
        font-size: 0.9em;
        letter-spacing: 0.02em;
	position: relative;
	top: -1px;
}
table.view tbody tr.subtotal td {
	color: #000;
	font-weight: 500;
}

p#counter {
	display: none;
	color: rgba(0,0,0,0.38);
	// margin-top: 1.5em;
}
a#handle {
	display: none;
}

.base-1 ul.recordals span.timestamp {
/*
	font-family: Courier New, monospace;
	letter-spacing: -0.02em;
	word-spacing: -0.05em;
	color: rgba(0,0,0,0.6);
*/
	padding-right: 0.6em;
}


table.products {
	min-width: 440px;
	max-width: 530px;
	border-collapse: separate;
}
table.products td {
	vertical-align: top;
        color: rgba(0,0,0,0.655);
        height: 19px;
        line-height: 19px;
	white-space: nowrap;
//	border: 1px dotted black;
}
table.products td:nth-child(1) {
        width: 1%;
//	padding-right: 1em;
}
table.products td:nth-child(1) input[type="checkbox"] {
	margin-right: 1em;
}
table.products td:nth-child(2) {
	width: 58%;
}
table.products td:nth-child(3) {
	width: 27%
}
table.products td:nth-child(4) {
	width: 15%;
}

table.products tbody td.cb-on-hover input[type="checkbox"] {
        visibility: hidden;
        opacity: 0.25;
}
table.products tbody:hover td.cb-on-hover input[type="checkbox"] {
        visibility: visible;
}
table.products tbody tr.vc-inner.selected td {
        background-color: rgb(194,219,255);
}

table.products input[type=checkbox].invisible {
//	visibility: hidden !important;
	display: none;	
}
table.products .vcc-parent {
	cursor: pointer;
}
table.products .vcc-parent.nopointer {
	cursor: default;
}


table.products .nest-0 td:nth-child(2),
table.products p.nest-0 { /* this one is used by <p class='nest-0'> in Composition */
	text-indent: 1.5em;
}
table.products .nest-1 {
        text-indent: 3em;
}
table.products td span.uuid {
	padding: 0 0.8em;
	margin-right: 2.3em;
}
table.products td.crisscross span {
	margin-right: 0.5em;
}
table.products td.crisscross input,
table.products td.crisscross select {
	width: 35px;
	padding: 0 2px 0 2px;
	height: 17px;
	text-align: center;
//	margin-left: 0.3em;
}
table.products td.crisscross select {
	width: 50px;
	height: 18px;
	padding: 0;
}
table.products td.toright {
        text-align: right;
}
table.products td.toright a {
        vertical-align: top;
}
table.products tbody tr.pointer td:first-child {
        border-left: 2px solid rgb(59,120,231) !important;
//        text-indent: 10px;
	padding-left: 10px;
}
table.products tbody tr.pointer td {
        color: #000;
}
/* Highlight of matches when searching */
table.products td b {
        background: #efefef;
	font-weight: 500;
	color: rgb(59,120,231);
}

a.edit-icon {
	background-color: #fff;
	border: 1px solid transparent;
	border-radius: 2px;
	color: #000;
	padding: 0.1em 0.4em;
	position: relative;
	text-decoration: none;
	display: inline-block;
//	margin-top: 0.15em;
	cursor: pointer;
}
a.edit-icon:hover {
	border-color: #ccc;
	-moz-box-shadow: 0 1px 3px rgba(0,0,0,0.2);
	box-shadow: 0 1px 3px rgba(0,0,0,0.2);
}
a.edit-icon i.material-icons {
        font-size: 16px;
	vertical-align: middle;
	position: relative;
	top: -1px;
}
a.edit-icon.disabled {
        color: rgba(0,0,0,0.26);
        pointer-events: none;
}

.holder {
	position: relative;
}
.results-dropdown-outer {
	position: absolute;
	width: calc(100% - 2px); /* border */
	background: #fff;
        -moz-box-shadow: 0 1px 4px rgba(0,0,0,0.22);
        box-shadow: 0 1px 4px rgba(0,0,0,0.22);
        border: 1.1px solid #e7e7e7;
border: 1.1px solid #ccc;
	display: none;
	z-index: 1;
}
.results-dropdown-outer ul li a {
//	border: 1px solid red;
	display: block;
	text-decoration: none;
	color: inherit;
	line-height: 2.1em;
	cursor: default;
	border-bottom: 1px solid #e7e7e7;
	border-bottom: 1px solid #efefef;
	padding: 0 6px;
}
.results-dropdown-outer ul li a span:last-child {
	color: rgba(0,0,0,0.38);
}
.results-dropdown-outer ul li a b,
.results-highlight {
        background: #efefef;
        font-weight: 500;
        color: rgb(59,120,231);
}
.results-dropdown-outer ul li a:hover {
        background: #efefef;	
}
.results-dropdown-outer ul li:last-child a {
	border-bottom: none;
}
.results-dropdown-outer p.uuid_nxfeedback,
p.nxfeedback {
	padding: 0.6em 6px;
        color: rgba(0,0,0,0.655);
}

.sizegroupOuter {
	margin-top: 0em;
	margin-bottom: 1.7em;
}
table.sizegroup {
}
table.sizegroup th {
	padding-top: 0.8em;
	padding-bottom: 0.8em;
	padding: 0.8em 0.6em;
        font-weight: 500;
        font-size: 0.9em;
        letter-spacing: 0.02em;
//        white-space: nowrap;
	max-width: 1em;
	vertical-align: middle;
}
table.sizegroup td {
	//border: 1px dotted black;
	padding: 0.5em 0.8em;
	min-width: 60px;
	text-align: center;
	border-bottom: 1px solid #eee;
//border-bottom: 1px solid white;
	color: rgba(0,0,0,0.655);
//background: #efefef;

}
table.sizegroup td:first-child {
	min-width: 20px;
	text-align: left;
	color: rgba(0,0,0,0.38);
}
table.sizegroup td.default,
table.sizegroup th.default {
	background: #efefef;
}


div.statsOuter {
	color: rgba(0,0,0,0.655);
}
div.statsOuter ul li {
//	padding-bottom: 0.4em;
	line-height: 1.5em;
}
div.statsOuter ul li b {
	font-weight: 500;
	color: #000;
	padding-left: 0.2em;
}
div.statsOuter p.footnote {
        margin-top: 1.5em;
        color: rgba(0,0,0,0.38);
}

div.mainchart {

}

div.variantOuter {
	margin-bottom: 1.7em;
}
div.sizeHeader {

}
div.pricesOuter {
        border-left: 2px solid #ddd;
        margin: 0.5em 0 0.5em 1em;
        padding: 0.8em 0 0.8em 1.0em;
//padding-bottom: 1.1em;
//border: 1px solid black;
}
div.variantSize {
        color: rgba(0,0,0,0.655);
}
div.variantSize span.label {
	padding: 0 0.1em 0 0.6em;
}
div.variantSize table {
//	margin-bottom: 1em;
//border-bottom: 1px solid black;
}
div.variantSize table td {
	padding-bottom: 0.15em;
padding-bottom: 0.35em;
}
div.variantSize table td:nth-child(1) {
	padding-right: 2.5em;
}
div.variantSize table tr:nth-child(3) td {
//	padding-bottom: 0;
}
div.variantSize table tr.splitter td {
	padding: 0;
	vertical-align: center;
}
div.variantSize table tr.splitter td span {
	display: inline-block;
	height: 1px;
	width: 100%;
	border-top: 1px solid #eee;
	margin: 1em 0;
margin: 0.7em 0 0.7em 0;
	vertical-align: middle;
}
div.variantSize table span.preSymbol {
	padding-right: 0.2em;
	width: 15px;
	display: inline-block;
	text-align: right;
//	color: #000;
}
div.variantSize table input[type="text"] {
	width: 100px;
	text-align: right;
}
div.variantSize table sup {
	font-size: 0.8em;
}
div.variantSize table tr.note td {
	font-size: 0.9em;
	letter-spacing: normal;
	padding-top: 0.4em;
        color: rgba(0,0,0,0.38);
}
span.note {
        font-size: 0.9em;
        letter-spacing: normal;
	padding-top: 0.4em;
	display: block;
}

div.variantSize .pricesCopy {
	padding: 0.8em 0 0.3em 0;
}
div.variantSize .pricesCopy input[type="checkbox"] {
	vertical-align: middle;
}


/* fields modifiers for variants */
form.frugal.variants select.size1 {
	width: 150px;
}
form.frugal.variants input.size2 {
	width: 55px;
}
form.frugal.variants input.size3 {
	width: 130px;
}
form.frugal.variants input.noborders {
//	border-color: transparent;
}
form.frugal.variants input.bold {
	font-weight: bold;
}

form.frugal.variants input[type="text"]:read-only, {
        pointer-events: none;
        border-color: #efefef;
}
form.frugal.variants input[type="text"]:-moz-read-only {
	pointer-events: none;	
	border-color: #efefef;
}

table.images {
	width: 100%;
	margin-bottom: 1.5em;
        color: rgba(0,0,0,0.655);
	line-height: 1.15em;
}
table.images:last-child {
	margin-bottom: 0em;
}
table.images td {
	vertical-align: middle;
	padding-right: 1em;
}
table.images td:last-child {
	padding-right: 0;
	white-space: nowrap;
}
table.images td:first-child {
	width: 1%;
}
table.images td:nth-child(2) {
	width: 100%;
}
table.images td:nth-child(2) span {
	font-size: 0.9em;
}
table.images td:nth-child(3) {
//	vertical-align: top;
}
table.images td img {
	border: 1px solid #ddd;
}


table.payments {
        /* keep separate otherwise, when removing rows via javascript, tbody's bottom border will not show */
        border-collapse: separate;
        width: 100%;
        max-width: 100%;
        color: rgba(0,0,0,0.655);

	/* This explicit bottom margin won't be needed since we will have a "grand total" row in the payments table as well */
	margin-bottom: 1.7em;
}

/* Disabled class applied to payments table */
table.payments.disabled input,
table.payments.disabled select {
        pointer-events: none;
        border-color: #efefef;
        color: rgba(0,0,0,0.65);
}
table.payments.disabled td:last-child a {
        color: rgba(0,0,0,0.38);
        pointer-events: none;
}

/* THEAD */
table.payments th {
//      padding-bottom: 0.7em;
        padding-bottom: 0.4em;
//border: 1px dotted gray;
	padding-right: 0.9em;
}
table.payments th:last-child {
	padding-right: 0;
}
table.payments th span {
        color: #000;
        display: block;
        line-height: 1.5em;
        font-weight: 500;
        font-size: 0.9em;
        letter-spacing: 0.02em;
        text-decoration: none;
        white-space: nowrap;
        text-align: center; /* default to center */
}
/* override, first two <th>'s aligned to left */
table.payments th:nth-child(1) span,
table.payments th:nth-child(2) span {
        text-align: left;
}
/* temporary, needed to align <th>'s label to <td>'s content */
table.payments th:nth-child(2) span {
        padding-left: 0.6em;
}


/* second tbody, each row has a bottom border */
table.payments tbody:nth-child(2) td {
        white-space: nowrap;
        padding: 0.8em 0.9em 0.8em 0;
        border-bottom: 1px solid #efefef;
}
table.payments tbody:nth-child(2) td:last-child {
	padding-right: 0;
}

/* temporary... */
table.payments tbody td:nth-child(2) input {
        border-color: transparent;
        color: inherit;
        pointer-events: none;
}

table.payments tbody td {
        padding-bottom: 0.35em;
}
table.payments tbody td:nth-child(1) {
        color: rgba(0,0,0,0.38);
}
table.payments tbody td:nth-child(2) {
//        width: 330px;
        width: 35%;
}

/* cells with <input> field */
table.payments tbody td:nth-child(3),
table.payments tbody td:nth-child(4) {
        white-space: nowrap;
}

/* add right-margin to last element of each cell */
table.payments tbody td *:last-child {
//        margin-right: 0.9em;
}
/* override for last cell */
table.payments tbody td:last-child *:last-child {
//        margin-right: 0;
}


/* nominative of payer */
table.payments tbody td:nth-child(3) input {
	width: 160px;
	max-width: 160px;
}
/* method of payment */
table.payments tbody td:nth-child(4) select {
	width: 120px;
	max-width: 120px;
}
/* amount of payment */
table.payments tbody td:nth-child(5) input {
        width: 80px;
        max-width: 80px;
}
table.payments span.symbol,
table.payments b.symbol {
        font-family: 'Roboto Mono', monospace;
}

/* right-align prices */
table.payments tbody td:nth-child(5) input {
        text-align: right;
}

table.payments tr td input.redink,
table.payments tr td input[type="text"][readonly].redink {
	color: var(--color-redish);
}



table.bill {
	/* keep separate otherwise, when removing rows via javascript, tbody's bottom border will not show */
	border-collapse: separate;
	width: 100%;
	max-width: 100%;
        color: rgba(0,0,0,0.655);
}

/* Prototype row */
table.bill tr#prototype {
	display: none;
}

/* Stub rows */
table.bill tr[data-tsid=''],
table.bill.compose tr[data-itemid=''] {
	color: rgba(0,0,0,0.38);
}
table.bill tr[data-tsid=''] input,
table.bill.compose tr input { /* <input>(s) always disabled for .compose, for both stubs and standard rows */
	pointer-events: none;
        border-color: #efefef;
	color: inherit; /* 0,0,0,0.65 */
}
table.bill tr[data-tsid=''] td:last-child a,
table.bill.compose tr[data-itemid=''] td:last-child a {
	visibility: hidden;
}

/* Disabled class added to <table> */
/* This is not in use at all (?) */
table.bill.disabled input {
        pointer-events: none;
        border-color: #efefef;
	color: rgba(0,0,0,0.65);
}
table.bill.disabled td:last-child a {
	color: rgba(0,0,0,0.38);
	pointer-events: none;
}



/* THEAD */
table.bill th {
	padding-bottom: 0.4em;
}
table.bill th span {
        color: #000;
        display: block;
        line-height: 1.5em;
        font-weight: 500;
        font-size: 0.9em;
        letter-spacing: 0.02em;
        text-decoration: none;
        white-space: nowrap;
        text-align: center; /* default to center */
}
/* override, first two <th>'s aligned to left */
table.bill th:nth-child(1) span,
table.bill th:nth-child(2) span {
	text-align: left;
}
/* temporary, needed to align <th>'s label to <td>'s content */
table.bill th:nth-child(2) span {
	padding-left: 0.6em;
}


/* second tbody, each row has a bottom border */
table.bill tbody:nth-child(2) td {
	white-space: nowrap;
	//padding: 0.8em 0;
	height: 45px;
	height: 43px;
	border-bottom: 1px solid #efefef;
	vertical-align: middle;
//border: 1px solid black;
}

/* temporary... */
/*
table.bill tbody td:nth-child(2) input {
	border-color: transparent;
	color: inherit;
	pointer-events: none;
}
*/
/* descriptions, mainline and subline */
table.bill tbody td:nth-child(2) span.mainline,
table.bill tbody td:nth-child(2) span.subline {
	display: block;
	width: 350px; /* less than full width, there's no right padding */
	max-width: 350px; /* ellipsis won't work unless max-width is in pixels */
        white-space: nowrap;
        text-overflow: ellipsis;
        overflow: hidden;
	padding-left: 6px;
//border: 1px solid red;
}
table.bill tbody td:nth-child(2) span.subline {
	color: rgba(0,0,0,0.38);
	font-size: 0.9em;
	padding-top: 4px;
}
table.bill tbody tr.canceled td:nth-child(2) span.mainline,
table.bill tbody tr.canceled td:nth-child(2) span.subline {
	text-decoration: line-through;
}

/* Second tbody and tfoot */
table.bill tbody:nth-child(3) td,
table.bill tfoot td {
	padding-bottom: 0.35em;
}
table.bill tbody td:nth-child(1) {
	color: rgba(0,0,0,0.38);
}
table.bill tbody td:nth-child(2) {
	width: 330px;
	width: 99%;
}



/* cells with <input> field */
table.bill tbody td:nth-child(3),
table.bill tbody td:nth-child(4),
table.bill tbody td:nth-child(5),
table.bill tfoot td {
	white-space: nowrap;
}

/* add right-margin to last element of each cell */
table.bill tbody td *:last-child {
	margin-right: 0.9em;
}
/* override for last cell */
table.bill tbody td:last-child *:last-child {
	margin-right: 0;
}


table.bill tbody td:nth-child(3) input, 
table.bill tbody td:nth-child(4) input,
table.bill tbody td:nth-child(5) input,
table.bill tfoot td input {
	width: 80px;
	max-width: 80px;
}
table.bill span.symbol {
	font-family: 'Roboto Mono', monospace;
}

/* right-align prices */
table.bill tbody td:nth-child(3) input,
table.bill tbody td:nth-child(4) input,
table.bill tbody td:nth-child(5) input,
table.bill tfoot td input
{
	text-align: right;
}


/* Second tbody, i.e. the discounts tbody, add a gray line and bottom padding for the last <tr> */
table.bill tbody:nth-child(3) tr:last-child td {
	padding-bottom: 0.8em;
	border-bottom: 1px solid #efefef;
}


/* begin TFOOT */
table.bill tbody tr:first-child td,
table.bill tfoot tr td {
	padding-top: 0.8em;
}

table.bill tfoot tr td:first-child {
	text-align: right;
}
table.bill tfoot tr td {
//	padding-top: 0.8em;
	padding-bottom: 0;
}
/* grand total, label */
table.bill tfoot tr td:first-child {
	padding-right: 0.8em;
	font-size: 0.9em;
	letter-spacing: 0.02em;
	font-weight: 500;
	color: #000;
}
/* grand total, input */
table.bill tfoot tr:last-child td input[type="text"] {
	font-size: 1.15em;
	font-weight: bold;
	letter-spacing: -0.01em;
	color: #000;
//	border-color: rgba(0,0,0,0.5);
}
/* Override standard readonly color */
table.bill tfoot tr:first-child td input[type="text"][readonly] {
//	color: #000;
}
table.bill tr td input.redink,
table.bill tr td input[type="text"][readonly].redink {
	color: var(--color-redish);
}




.itemsControlsBlock {
	position: relative;
}
.itemsControlsBlock .itemsControlsOuter {
        position: absolute;
        background: #fff;
        -moz-box-shadow: 0 1px 4px rgba(0,0,0,0.22);
        box-shadow: 0 1px 4px rgba(0,0,0,0.22);
        border: 1.1px solid #ccc;
        display: none;
        z-index: 1;
	color: #000;

        padding-top: 8px;
        padding-bottom: 6px;
}
.itemsControlsBlock .itemsControlsOuter a {
        display: block;
        text-decoration: none;
        color: inherit;
        line-height: 1.6em;
	padding: 0 10px;
	white-space: nowrap;
}
.itemsControlsBlock .itemsControlsOuter a:hover {
        background: #efefef;
}


#menuOuterBlock {
        position: relative;
}
#menuOuterBlock a.btn:after{
        border-color: #000 transparent #000 transparent;
        border-style:solid;
        border-width:4px 4px 0px 4px!important;
        content:"";
        display:inline-block;font-size:0;height:0;left:4px;position:relative;top:-2px!important;
	margin-right: 5px;
}
#menuOuterBlock .menuOuter {
        position: absolute;
        max-width: calc(100% - 2px); /* border */
	width: 55%;
        background: #fff;
        -moz-box-shadow: 0 1px 4px rgba(0,0,0,0.22);
        box-shadow: 0 1px 4px rgba(0,0,0,0.22);
	//-webkit-box-shadow: 0 4px 8px rgba(0,0,0,0.2);
	//box-shadow: 0 4px 8px rgba(0,0,0,0.2);

	// border: 1.1px solid #e7e7e7;
	border: 1px solid #ccc;
	// border: 1px solid lightgrey;
        display: none;
	z-index: 1;

	padding-top: 8px;
	padding-bottom: 6px;
}

#menuOuterBlock .menuOuter label {
	padding-top: 6px;
	padding-bottom: 0;
//	margin-bottom: 3px;
        color: rgba(0,0,0,0.388);
	text-transform: uppercase;
	text-indent: 8px;
	font-size: 0.85em;
	letter-spacing: 0;
}
#menuOuterBlock .menuOuter label:first-child {
	padding-top: 0;
}
#menuOuterBlock .menuOuter label,
#menuOuterBlock .menuOuter a {
}
#menuOuterBlock .menuOuter a {
        display: block;
        text-decoration: none;
        color: inherit;
        line-height: 1.6em;
	text-indent: 16px;
//	text-indent: 12px;
	text-indent: 8px;
}
#menuOuterBlock .menuOuter a:hover {
        background: #efefef;
}
#menuOuterBlock div.line {
//	border-top: 1px solid #ddd;
//	margin: 0 auto;
//	width: 95%;
}

/*
 * Extender
 *
 */
.extender__content_container {
	display: none;
//	border: 2px solid black;
}
.extender__content_container:not(:first-child) {
	margin-top: 1.3em;
	margin-top: 1.7em; /* same as .group */
}
.extender__content_container.extender__content_container_nomargintop {
	margin-top: 0;
}
.extender__hidden {
	display: none !important;
}
.extender__button_container {
	-webkit-transition: margin-top cubic-bezier(0.4,0.0,0.2,1) .2s;
	transition: margin-top cubic-bezier(0.4,0.0,0.2,1) .2s;
}
.extender__button_container.extender__button_container_marginbottom {
	margin-bottom: 0.30em;
}
.extender__button_container.active {
	//margin-top: 8px;
	margin-top: 5px;
	margin-bottom: 1.3em;
	margin-bottom: 1.7em; /* same as .group */
}
.extender__button_container i.extender__icon_wrapper {
	display: inline-block;
	font-size: 0;
	position: relative;
}
.extender__button_container i.extender__icon_extender {
	width: 14px;
	height: 8px;
	padding-left: 3px;
	-webkit-transition: all ease .1s;
	transition: all ease .1s;
}
span.extender__icon_extender_inner {
	display: block;
	position: absolute;
	top: -4px;
	opacity: .5;
	-webkit-transition: all ease .1s;
	transition: all ease .1s;
}
span.extender__icon_extender_inner:before {
	top: -1px;
}
.extender__button_container.active span.extender__icon_extender_inner:before {
	top: 6px;
}
.extender__button_container.active span.extender__icon_extender_inner:before,
.extender__button_container.active span.extender__icon_extender_inner:after {
	-webkit-box-shadow: -1.37px -1.37px 0 0 #3367d6;
	box-shadow: -1.37px -1.37px 0 0 #3367d6;
}
span.extender__icon_extender_inner:after {
        top: 4px;
}
.extender__button_container.active span.extender__icon_extender_inner:after {
	top: 11px;
}
span.extender__icon_extender_inner:before,
span.extender__icon_extender_inner:after {
	display: block;
	content: "";
	position: absolute;
	left: 1px;
	height: 5px;
	width: 5px;
	-webkit-box-shadow: 1.37px 1.37px 0 0 #3367d6;
	box-shadow: 1.37px 1.37px 0 0 #3367d6;
	-webkit-transform: rotateZ(45deg);
	transform: rotateZ(45deg);
}
.extender__content_container .persistable {
	padding: 8px 3px 4px 3px;
}


table.returns {
	color: rgba(0,0,0,0.655);
}
table.returns > tbody > tr > td {
//	border: 1px dotted black;
	padding-bottom: 1.7em;
}

table.returns table {
	min-width: 650px;
	width: 650px;
}
table.returns table thead tr th,
table.returns table tbody tr td,
table.returns table tfoot tr td {
//	line-height: 19px;
//	line-height: 21px;
	padding-top: 4px;
	padding-bottom: 4px;
	padding-right: 0.5em;
	border-bottom: 1px solid #efefef;
	border-bottom: 1px dotted #eee;
//	border: 1px solid black;
}
/* Default alignment is to the right */
table.returns table tbody tr td,
table.returns table tfoot tr td {
	text-align: right;
}
table.returns table thead tr th {
	text-align: left;
}
table.returns table thead tr th:nth-child(2) {
	text-align: right;
	color: rgba(0,0,0,0.38);
}
table.returns table tbody tr td:first-child,
table.returns table tfoot tr td:first-child {
	text-indent: 1em;
	text-align: left;
}

/* truncate long values */
table.returns table thead tr th:first-child,
table.returns table tbody tr td:first-child span:first-child,
table.returns table tbody tr td:first-child span:last-child,
table.returns table tfoot tr td:first-child {
        white-space: nowrap;
        text-overflow: ellipsis;
        overflow: hidden;
	max-width: 325px; /* 650 divided by 2 */
}
/* span needs to be 'block' in order for ellipsis to work */
table.returns table tbody tr td:first-child span:first-child,
table.returns table tbody tr td:first-child span:last-child {
	display: block;
//	border: 1px solid red;
}
table.returns table tbody tr td:first-child span:last-child {
	display: block;
	color: rgba(0,0,0,0.38);
	font-size: 0.9em;
	padding-top: 4px;
}

/* fixed widths */
/* table.returns table thead tr th:nth-child(1), */

table.returns table tbody tr td:nth-child(1),
table.returns table tfoot tr td:nth-child(1) {
//	width: 50%;
//border: 2px solid red;
}
table.returns table tbody tr td:nth-child(2),
table.returns table tbody tr td:nth-child(3),
table.returns table tbody tr td:nth-child(4) {
	// width: 12.5%;
	width: 11.6%;
}
table.returns table tbody tr td:nth-child(5) {
	width: 15%;
//	border: none;
}
table.returns table tbody tr td:last-child,
table.returns table thead tr th:last-child,
table.returns table tfoot tr td:last-child {
	border: none;
}

table.returns table tfoot tr.bottom_links td {
	padding-top: 6px;
	border-bottom: none;
}

/* make negative amounts show up in red */
table.returns table tr td[data-monetary-amount^="-"] {
        color: var(--color-redish);
}

/* highlight matches */
table.returns table tr td b {
        background: #efefef;
        font-weight: 500;
        color: rgb(59,120,231);
}

/* adjust .btn class */
table.returns table tr td:last-child {
	padding-top: 0;
	padding-bottom: 0;
}
table.returns table tr td a.btn {
	margin-top: 2px;
	line-height: 20px;
}




table.availables > tbody > tr > td {
	padding-bottom: 1.7em;
}
table.availables table {
        min-width: 650px;
        width: 650px;
}
table.availables table td {
        line-height: 20px;
	border-bottom: 1px dotted #eee;
	vertical-align: middle;
}
/* adjust .btn class */
table.availables table tr td a.btn {
        line-height: 20px;
}


div.pdfwrap {
	border: 1px solid #efefef;
	height: 500px;
	margin-bottom: 1.7em;
}
div.pdfwrap object {
	width: 100%;
	height: 500px;
}
div.pdfwrap p.preview {
	padding: 1.5em;
}
div.pdfph {
	border: 1px solid #efefef;
        height: 500px;
	position: relative;
}
div.pdfph p {
        right: 0;
        left: 0;
        position: absolute;
        top: 50%;
        -webkit-transform: translateY(-50%);
        -ms-transform: translateY(-50%);
        transform: translateY(-50%);

        text-align: center;
}


/*
 * Stock - this is the outer table
 *
 */
table.stock {
	width: 100%;
	max-width: 100%;
}
table.stock > tbody > tr > td {
        padding-bottom: 1.7em;
}
table.stock table {
//        min-width: 600px;
//        width: 600px;
	max-width: 100%;
	min-width: 100%;
}
table.stock table td {
        line-height: 20px;
        border-bottom: 1px dotted #eee;
        vertical-align: middle;
//border: 1px solid black;
}
/* adjust .btn class */
table.stock table tr td a.btn {
        line-height: 20px;
}


/*
 * Stock-product, this is the product-specific inner table
 *
 */
table.stock-products {
	width: 100%;
	min-width: 100%;
	max-width: 100%;
	border-collapse: separate;
}
table.stock-products td {
	vertical-align: top;
        color: rgba(0,0,0,0.655);
        height: 21px;
        line-height: 21px;
	white-space: nowrap;

//border: 1px dotted black;
}
table.stock-products td.cb-on-hover input[type="checkbox"] {
	visibility: hidden;
	opacity: 0.25;
}
table.stock-products:hover td.cb-on-hover input[type="checkbox"] {
	visibility: visible;
}

table.stock-products tr.vc-inner:hover td {
	cursor: pointer;
	background-color: #efefef;
}
table.stock-products tr.vc-inner.sticky td {
	background-color: #efefef;
}
table.stock-products tr.vc-inner.selected td,
table.stock-products tr.items.selected td {
	/* When selected, all hover effects are off */
	// background-color: rgb(194,219,255) !important;
	background-color: rgb(194,219,255);
	border-color: white;
}
/* .active goes after .selected because we want to highlight rows on click even if .selected is applied */
table.stock-products tr.vc-inner.active td {
//        animation: animate-background-to-none 200ms ease-in-out 1.8s forwards;
//        animation-delay: 0ms;
}
table.stock-products tr.vc-inner.selected.active td {
//        animation: animate-background-to-selected 200ms ease-in-out 1.8s forwards;
//        animation-delay: 0ms;
}


table.stock-products td:nth-child(1) {
        width: 1%;
	padding-right: 1em;
//	border-left: 2px solid transparent; /* not to leave the checkbox attached to the border */
}
/* Embedded, hide checkbox in first <td>s for .vc-inner rows  */
table#stock.embedded table.stock-products tr.vc-inner td:nth-child(1) input[type=checkbox] {
	//display: none;
	visibility: hidden;
//	margin-left: 5px;
}
/* Embedded, add 2px left transparent border */
table#stock.embedded table.stock-products tr td:nth-child(1) {
//	border-left: 2px solid transparent;
}

table.stock-products td:nth-child(2) {
	width: 44%;

        /* truncate long values */
        white-space: nowrap;
	max-width: 1px; /* ellipsis won't work unless width is specified in pixels */
}
table.stock-products td:nth-child(2) > .wrap {
        /* truncate long values */
        white-space: nowrap;
        text-overflow: ellipsis;
        overflow: hidden;
//	border: 1px solid red;
	max-width: 96%;
}
table.stock-products td:nth-child(3) {
        width: 17.5%;
}
table.stock-products td:nth-child(4) {
	width: 17.5%;
}
table.stock-products td:nth-child(5) {
	width: 20%;
        /* truncate long values */
        white-space: nowrap;
        max-width: 1px; /* ellipsis won't work unless width is specified in pixels */
}
table.stock-products td:nth-child(5) > .wrap {
        /* truncate long values */
        white-space: nowrap;
        text-overflow: ellipsis;
        overflow: hidden;
        max-width: 96%;
}


table.stock-products td:nth-child(1) input[type="checkbox"] {
	vertical-align: middle;
	//margin-left: 5px;
}


/*
table.stock-products td:nth-child(1) input[type="checkbox"] {
	opacity: 0;
	position: absolute;
}
table.stock-products td:nth-child(1) input[type="checkbox"] ~ label:before {
  content: '';
  display: inline-block;
  cursor: pointer;
  margin: 2px 10px -2px 0;
  width: 12px;
  height: 12px;
  background: white;
  border: 1px solid #999;
  border-radius: 2px;
  transition: .3s;
}
table.stock-products td:nth-child(1) input[type="checkbox"]:checked ~ label:before {
  background: white;
  content: '\2714';
}
table.stock-products td:nth-child(1) input[type="checkbox"]:focus ~ label:before {
  border-color: #73b9ff;
}
*/

table.stock-products .vcc-parent {
	cursor: pointer;
}
table.stock-products tr.nest-0 td:nth-child(2) {
	text-indent: 1.5em;
}
table.stock-products .nest-1 {
        text-indent: 3em;
}
table.stock-products .nest-2 {
	text-indent: 4.5em; /* itemsgroups */
}
table.stock-products .nest-3 {
        text-indent: 6em; /* items */
}
/* Hide shadowed tr(s) */
table.stock-products tr[data-shadowed="1"] {
	display: none;
}
/* Very-light gray for all elements in the <tr> */
table.stock-products tr.nest-0[data-shadowed="1"] *,
table.stock-products tr.vc-inner[data-shadowed="1"] * {
	color: rgba(0,0,0,0.210) !important;
	color: rgba(190,0,0,0.655) !important;
}

table.stock-products tr.itemsgroups,
table.stock-products tr.items {
	background: #fafafa;
	display: none; /* hidden by default, fade in */
}
table.stock-products tr.items td {
//	border: 1px solid black;
}
table.stock-products tr.itemsgroups td:first-child,
table.stock-products tr.items td:first-child {
//	border-left: 2px solid gray !important;
}

table.stock-products tr.items input[type=checkbox] {
	display: none; /* hidden in standard Products, visible when Embedded */
}
table#stock.embedded table.stock-products tr.items input[type=checkbox] {
	display: inline-block;
	vertical-align: middle;
//	margin-left: 5px;
}


table.stock-products td span.uuid {
	padding: 0 0.8em;
	//margin-right: 2.3em;
}
table.stock-products td span.material-icons-outlined {
	font-size: 1.0em;
	vertical-align: middle;
//        -webkit-text-stroke: 1px #white;
//        text-stroke: 1px white;
	text-indent: 0;
}
table.stock-products td.crisscross span {
	margin-right: 0.5em;
}
table.stock-products td.crisscross input,
table.stock-products td.crisscross select {
	width: 35px;
	padding: 0 2px 0 2px;
	height: 17px;
	text-align: center;
//	margin-left: 0.3em;
}
table.stock-products td.crisscross select {
	width: 50px;
	height: 18px;
	padding: 0;
}
table.stock-products td.toright {
        text-align: right;
}
table.stock-products td.toright a {
        vertical-align: top;
}
table.stock-products tbody tr.pointer td:first-child {
        border-left: 2px solid rgb(59,120,231) !important;
//        text-indent: 10px;
	padding-left: 10px;
}
table.stock-products tbody tr.pointer td {
        color: #000;
}
/* Highlight of matches when searching */
table.stock-products td b {
        background: #efefef;
	font-weight: 500;
	color: rgb(59,120,231);
}
/*
table.stock-products tr.vc-inner:hover td {
	cursor: pointer;
	background: #efefef;
}
table.stock-products tr.vc-inner.sticky td {
	background: #efefef;
}
*/
table.stock-products tr.shadowed td {
	border: none;
	padding-top: 0.5em;
        text-indent: 1.5em;
	height: 14px;
	line-height: 14px;
	font-size: 0.9em;
}
table.stock-products tr.shadowed td a {
//	font-size: 0.9em;
	line-height: 1em;
}


div.filters_enum {
	margin-bottom: 1.7em;
	border: 1px solid #ddd;
	padding: 0em 0.8em;

	/* TODO: Remove padding, add it to inner div */
	padding: 0.8em 0.8em;
	padding: 0.8em 1em;
	position: relative;

        width: calc( var(--canvas-workspace-min) - 2em );
        min-width: calc( var(--canvas-workspace-min) - 2em);
}
div.filters_enum i.material-icons {
	font-size: 1.5em;
	font-size: 1.5em;
	vertical-align: middle;
	padding-right: 0.2em;
	position: relative;
//	position: absolute;
	top: -2px;
}
div.filters_enum p {
	position: relative;
//	vertical-align: middle;
//	margin-bottom: 0.3em;
//border: 1px solid red;
	line-height: 1em;
	overflow: visible;
	height: 1.2em;
}
div.filters_enum p b {
	font-weight: 500;
}
div.filters_enum ul {
	margin-top: 0.6em;
	padding-left: 0.25em;
//	line-height: 1.35em;
}
div.filters_enum ul li {
	line-height: 1.35em;
	// cursor: pointer;
}
/*
   cross-browser, vertically-aligned bullets
   https://stackoverflow.com/questions/24127083/bullets-not-centered-vertically-in-chrome-safari
*/
div.filters_enum ul li:before {
	content: '';
	background-color: #000;
	display: inline-block;
	position: relative;
	height: 4px;
	width: 4px;
	border-radius: 4px;
	margin-right: 7px;
	top: -2px;
}
div.filters_enum ul li span {
//	visibility: hidden;
}
/* formerly :hover */
div.filters_enum ul li span {
	padding-left: 0.6em;
	padding-right: 0.6em;
	color: rgba(0,0,0,0.38);
	visibility: visible;
//	float: right;
}
div.filters_enum p a {
	font-size: 0.9em;
	padding-left: 0.5em;
}

fieldset div.filters_bottom {
	//text-align: right;
	text-align: left;
	position: absolute;
	top: 0.9em;
	right: 1.3em;
}
.filters_enum div.filters_bottom {
        text-align: left;
        position: absolute;
        top: 0.9em;
        right: 1.3em;
}

div.products_controls {
	margin-bottom: 1.7em;
//	border: 1px solid red;
}
div.products_controls input[type="checkbox"] {
	vertical-align: middle;
	position: relative;
	top: -2px;
}
div.products_controls > p {
	display: inline-block;
//	height: 24px;
	line-height: 24px;
//border: 1px solid red;	
	vertical-align: middle;
	position: relative;
}
div.products_controls > p:nth-child(2),
div.products_controls > p:nth-child(4) {
	margin-left: 2.8em;
}
div.products_controls > p:nth-child(2),
div.products_controls > p:nth-child(4),
div.products_controls > input[type="checkbox"] {
	margin-right: 0.1em;
}
div.products_controls p > label {
	vertical-align: middle;
	line-height: 24px;
}
div.selectall {
	//background: #efefef;
	background: #f9f9f9;
	color: rgba(0,0,0,0.655);
	padding: 0.7em 0.6em;
	margin-bottom: 1.7em;
	text-align: center;
	font-weight: 500;
	line-height: 1.2em;
}

div.products_controls a.btn_label:after{
        border-color: #000 transparent #000 transparent;
        border-style:solid;
        border-width:4px 4px 0px 4px!important;
        content:"";
        display:inline-block;font-size:0;height:0;left:4px;position:relative;top:-2px!important;
        margin-right: 5px;
}

.dropdown_outer {
	display: inline-block;
	position: relative;
}
.dropdown_outer .dropdown_selection {
        position: absolute;
//        max-width: calc(100% - 2px); /* border */
        min-width: 250px;
        background: #fff;
        -moz-box-shadow: 0 1px 4px rgba(0,0,0,0.22);
        box-shadow: 0 1px 4px rgba(0,0,0,0.22);
        border: 1px solid #ccc;
        display: none;
        z-index: 1;

        padding-top: 8px;
        padding-bottom: 6px
}
.dropdown_outer .dropdown_selection label {
        padding-top: 6px;
        padding-bottom: 0;
        color: rgba(0,0,0,0.388);
        text-transform: uppercase;
        text-indent: 8px;
        font-size: 0.85em;
        letter-spacing: 0;
}
.dropdown_outer .dropdown_selection label:first-child {
        padding-top: 0;
}
.dropdown_outer .dropdown_selection a {
        display: block;
        text-decoration: none;
        color: inherit;
        line-height: 1.6em;
        text-indent: 16px;
	text-indent: 8px;
}
.dropdown_outer .dropdown_selection a.nested {
	text-indent: 16px;
}
.dropdown_outer .dropdown_selection span {
	display: block;
	color: rgba(0,0,0,0.388);
	text-indent: 8px;
	line-height: 1.6em;
}

.dropdown_outer .dropdown_selection a:hover {
        background: #efefef;
}
.dropdown_outer .dropdown_selection a.disabled {
	pointer-events: none;
	color: rgba(0,0,0,0.38);
}


div.publisherSettings {
	margin-top: 1.7em;
}
div.publisherSettings p {
//        color: rgba(0,0,0,0.655);
}
div.percentage_block {
	display: none;
}


.profile_ib {
	padding-left: 0.75em;
	line-height: 1.35em;
	color: rgba(0,0,0,0.655);
}
.profile_ts {
	color: rgba(0,0,0,0.38);
}


.products__delivery_summary {
        width: 100%;
        max-width: 100%;
        color: rgba(0,0,0,0.655);
}
.products__delivery_summary td {
        white-space: nowrap;
        height: 43px;
        border-bottom: 1px solid #efefef;
        vertical-align: middle;
}
.products__delivery_summary td:nth-child(2) span.mainline,
.products__delivery_summary td:nth-child(2) span.subline {
//	padding-left: 6px;
}
.products__delivery_summary td:nth-child(2) span.subline {
        color: rgba(0,0,0,0.38);
        font-size: 0.9em;
        padding-top: 4px;
	display: block;
}
.products__delivery_summary td:nth-child(1) {
        color: rgba(0,0,0,0.38);
}
.products__delivery_summary td:nth-child(1) span {
	padding-right: 0.9em;
}
.products__delivery_summary td:nth-child(3) {
	text-align: center;
}

.ea-mappings {
	color: rgba(0,0,0,0.655);
}
.ea-mappings td {
	line-height: 1.5em;
	padding-right: 2em;
}
.ea-mappings.indent {
	text-indent: 2em;
	margin-bottom: 2em;
}


.wrapper-404 {
}
.wrapper-404 p {
	font-size: 1.3em;
	margin-bottom: 3.5em;
}
.wrapper-404 p span {
	font-size: 1.8em;
	display: block;
	letter-spacing: -0.03em;
}



.reports_models p.description {
	color: rgba(0,0,0,0.655);
	padding: 0.4em 0em 1.5em 1.45em;
	line-height: 1.3em;
	display: none;
}

/* iframe */
.iframe_wrapper {
	border: 1px solid #efefef;
        height: 500px;
	width: 100%;
        margin-bottom: 1.7em;
}


.filter_prefix {
	margin-bottom: 4px;
}
.filter_prefix input[type="text"] {
/*
	border-top: none !important;
	border-left: none !important;
	border-right: none !important;
	padding-left: 0 !important;
*/
}
.filter_container {
	border: 1px solid #d3d3d3;
	height: 123px;		/* 123px fits precisely 9 rows */
	min-height: 123px;
	padding: 4px 3px;
	overflow-y: scroll;
	resize: vertical; 	/* allows the user to resize the div only vertically */
}
.filter_container input[type=checkbox] + label {
	display: inline-block;
	width: 96%;
        cursor: pointer;
	line-height: 1.15em;
}
.filter_container input[type=checkbox]:checked + label {
	background: rgb(194,219,255) !important; /* higher priority than :hover */
}
.filter_container input[type=checkbox] + label:hover {
        background: #efefef;
}
.filter_container label span:not(.results-highlight) {
	color: rgba(0,0,0,0.388) !important;
}
.filter_container .filter_container_inner {
	//margin-top: 4px;
	padding-left: 1em;
}
.filter_container div.selected-group {
	display: none; /* hidden at first cause it has a bottom-margin of 3px, visibility toggled by javascript when populated */
}
.filter_container > div,
.filter_container .filter_container_inner > div {
	margin-bottom: 3px;
	margin-bottom: 2px;
}
.filter_container .filter_container_inner > div {
	display: none;
}
.filter_container .filter_container_inner > div:first-child {
	margin-top: 4px;
}
.filter_container span.monospace {
	font-family: 'Roboto Mono', monospace;
}
.filter_container div {
	white-space: nowrap;
}


fieldset#filters_mask {
	margin-bottom: 1.7em;
	border: 1px solid #ddd;
//	padding: 1.5em 1.3em;
	padding: 1.7em 1.3em 1.0em 1.3em;

	position: relative;
}
fieldset#filters_mask legend {
	padding: 0 1em;
	line-height: 0; /* fixes bug in Firefox, removes extra spaces */
	background: white;
}
fieldset#filters_mask div.group {
//	max-width: 480px; /* override standard .group class of 440px */
}

.cf:after{
	content:"";
	display:table;
	clear:both;
}
.sp_wrapper {
	margin:0 auto;
	position: relative;
	height: auto;
	overflow: hidden;
//	overflow-y: auto;
	max-width: 1366px;

	color: rgba(0,0,0,0.655);
	font-size: 12.5px;
}
.sp_dsize {
        margin: 0 auto;
        max-width: 1100px;
}
.headtwoext {
	width: 100%;

	border-bottom: 1px solid #ccc;
	position: relative; /* needed */
	z-index: 999;

	padding-top: 0.2em;
	padding-bottom: 0.2em;
	background: white;
}
.sticky-header .headtwoext {
	position: fixed;
	top: 0;

	box-shadow: 0 3px 2px -2px rgba(0,0,0,.1);
	-webkit-box-shadow: 0 3px 2px -2px rgba(0,0,0,.1);

	transform: translateZ(0);
	-webkit-transform: translateZ(0);
}


.superheadOuter {
	border-bottom: 1px solid #eee;
//	background: white;
}
.superheadInner {
//	color: white;
//	color: rgba(0,0,0,0.655);
}
.superheadInner ul li {
	float: left;
	font-size: 0.85em;
	font-weight: 400;
	padding: 0 1.7em 0 0;
	line-height: 2.5em;
}
.superheadInner ul li a {
	text-decoration: none;
//	line-height: 2.5em;
}
.superheadInner ul li a.active {
//	color: rgba(6, 3, 141, 1);
	color: black;
	font-weight: bold;
}

.headtwo {
	padding-top: 0.58em;
	padding-bottom: 0.38em;
}
.headtwo.blue {
	border-top: none;
}
.headtwo .headint {
	position: relative;
	text-align: center;
}
.headtwo .headint {
	margin: 0 auto;
	max-width: 1100px;
}


.headtwo ul.headtwonav.search_n_book {
	float: left;
}
.headtwo ul.headtwonav.search_n_book li:first-child a span {
	padding-left: 0;
	position: relative;
}
.headtwo ul.headtwonav.search_n_book li:first-child a img {
	/* adjustments */
	position: relative;
	top: -1px;
	vertical-align: middle;
}

.headtwo ul.headtwonav {
	list-style-type: none;
	margin: 0 auto;
	display: inline-block;
}


.headtwo ul.headtwonav.menu_extention {
	float: right;
}
.headtwo ul.headtwonav.menu_extention > li:last-child > a > span {
//	padding-right: 0;
}

.headtwo ul.headtwonav li {
	float: left;
//	height: 44px;
//	height: 40px;
}
.sticky-header .headtwo ul.headtwonav li {
//	height: 30px;
}

.headtwo ul.headtwonav > li > a {
	text-decoration: none;
	display: inline-block;
	font-size: 1.0em;
	font-weight: 400;
	height: 100%;
//	color: rgba(0,0,0,0.655);
//	color: black;
	color: inherit;
}
.headtwo ul.headtwonav > li > a:hover {
	color: black;
}
.headtwo ul.headtwonav > li > a > span {
	padding: 5px 10px;
	line-height: 44px;
	//line-height: 40px;

        /* transitions for height adjustments */
        -webkit-transition: all 0.25s;
        transition: all 0.25s;
}
.sticky-header .headtwo ul.headtwonav > li > a > span {
	line-height: 24px;
}
.headtwo ul.headtwonav > li > a.subdomain {
	color: rgba(0,0,0,0.85);
	font-weight: bold;
	font-size: 1.5em;
	font-size: 1.6em;
	letter-spacing: 0;

	text-align: left;
	padding-top: 0px;
}
.headtwo ul.headtwonav > li > a.active {
	color: black;
}

.headtwo ul.headtwonav > li > a.loginbtn span {
	background: #0896FF;
	border-radius: 2px;
        padding: 7px 10px;
	margin-left: 10px;
	color: white;
}

.banner {
	margin: 0 auto;
	max-width: 1366px;
	width: 100%;
	//height: 480px;
	height: 380px;

	position: relative;

//	background: url(/originals/img/media_darker.jpg) 50% 100% no-repeat;
	background: url(/immutables/img/6d4c77b66253eef09016e49ad871b287.jpg) 50% 70% no-repeat;

	border-bottom: 1px solid #ccc;
}

#videowall {
	position: relative;
	margin: 0;
	width: 100%;
	overflow: hidden;
	height: 100%;
}
#videowall ul li {
	margin: 0;
	padding: 0;
	list-style: none;
	display: block;
	position: absolute;

	background: transparent;
}
#videowall a {
	display: block;
}
#videowall img {
	position: absolute;

	opacity: 0.14;
	opacity: 0.05;

        -webkit-filter: brightness(1.25) grayscale(100%);
	-moz-filter: brightness(1.25) grayscale(100%);
	-ms-filter: brightness(125%) grayscale(100%);
	-o-filter: brightness(125%) grayscale(100%);
 	filter: grayscale(100%) brightness(125%);
}
#videowall li:hover a img {
        filter: grayscale(0%);
        -webkit-filter: brightness(1.10) grayscale(0%);
	opacity: 1;
        border-top: none;
}
.v_thumb {
	overflow: hidden;
//	background-color: #f5f5f5;
}

.banner .bannerInner {
	position: absolute;
	width: 420px;
	color: rgba(255,255,255,0.95);

//	top: 35%;
	top: 50%;

        -webkit-transform: translateY(-50%);
        -ms-transform: translateY(-50%);
        transform: translateY(-50%);

	/* images of the videowall have z-index 10 and 11 */
	z-index: 12;
	padding: 20px 0 20px 20px;

	display: none;
}
.banner h1 {
	line-height: 1em;
	//font-size: 2.0em;
	font-size: 2.1em;

	font-weight: 400;
	letter-spacing: -.03em;

	z-index: 11;
	margin-bottom: 14px;
}
.banner h3 {
	font-size: 1.1em;
	font-weight: 400;
	line-height: 1.3em;
	color: rgba(255,255,255,0.85);

	margin-bottom: 14px;
	
}
.banner .bannerInner a {
	color: rgba(255,255,255,0.85);
	font-size: 1.1em;
	font-weight: 400;
	display: block;
	line-height: 1.3em;
}

.sp_content .sp_sections {
	margin-top: 2.5em;
        display: flex;
        flex-direction: row;
}
.sp_content .sp_sections .sp_section_left {
        flex-basis: 180px;
        margin-right: 3em;
}
.sp_content .sp_sections .sp_section_main {
	flex-basis: 750px;
	flex-basis: 650px;
}
.sp_content .sp_sections .sp_section_main .sp_item {
	padding-bottom: 1.5em;
}
.sp_content .sp_sections .sp_section_main .sp_item:last-child {
	padding-bottom: 0;
}
.sp_content .sp_sections .sp_section_left h5 {
	font-size: 1em;
	font-weight: 500;
	color: rgba(0,0,0,0.87);
	border-top: 1px solid rgba(0,0,0,0.87);
	padding-top: 0.5em;
}
.sp_content .sp_sections .sp_section_main h5 {
        font-size: 1em;
        font-weight: 500;
        color: rgba(0,0,0,0.87);
	padding-bottom: 1em;
}
.sp_content .sp_sections .sp_section_main h3 {
	font-size: 1.3em;
	font-weight: 500;
        color: rgba(0,0,0,0.87);
	padding-bottom: 1em;
}
.sp_content .sp_sections .sp_section_main p {
	line-height: 1.5em;
}
.sp_content .sp_sections .sp_section_main p.margin__bottom {
	margin-bottom: 0.8em;
}
.sp_anchor {
	display: block;
	position: relative;
	top: -110px;
	visibility: hidden;
}

.sp_footer {
	margin-top: 3em;
	margin-bottom: 2em;
	color: rgba(0,0,0,0.388);
	text-align: center;
	line-height: 1.2em;
	font-size: 0.95em;
}

table.sp_charges {
	margin-top: 1em;
	margin-bottom: 1em;
	border-collapse: collapse;
	border: 1px solid #eee;
	width: 100%;
}
table.sp_charges td {
	border-bottom: 1px solid #eee;
	padding: 0.4em 1em 0.4em 1em;
	color: rgba(0,0,0,0.87);
	font-size: 0.95em;
	line-height: 1.2em;
}
table.sp_charges td:first-child {
	width: 75%;
}


.languages_enumeration {
	margin-top: 4em;
	color: rgba(0,0,0,0.38);
}
.languages_enumeration ul,
.languages_enumeration span {
	float: left;
}
.languages_enumeration ul li {
	float: left;
	margin-left: 0.5em;
}


.db-section {
//	margin-bottom: 1.7em;
	color: rgba(0,0,0,0.655);
}
.db-section .db-inner-section + .db-inner-section {
	margin-top: 1em;
}
.db-section p.subtitle {
	line-height: 1.5em;
	display: block;
	margin-bottom: 0.25em;
}
.db-section p.db-footnote {
	display: block;
	margin-top: 1em;
}
.db-section h3 {
        font-size: 1.15em;
        color: #000;
	display: block;
	margin-bottom: 0.7em;
	line-height: 1.3em;
}
.db-section sup {
	line-height: 1em;
}
.db-section table {
	width: 500px;
}
.db-section table td {
	line-height: 1.5em;
	border-bottom: 1px dotted #eee;
}
.db-section table td:nth-child(1) {
	width: 70%;
//	text-indent: 0.5em;
}
.db-section table td:nth-child(2) {
	width: 27%;
	text-align: right;
}
.db-section table td:nth-child(3) {
	width: 3%;
	text-align: center;
}
.db-section table td:nth-child(2),
.db-section table td:nth-child(3) {
	color: #000;
	font-weight: 500;
}

p.livedata {
	margin-top: 1.7em;
}

.selection-specs {
	margin: 1em 0 1em 2em;
	margin: var(--form-group-marginbottom) 0 var(--form-group-marginbottom) 2em;
	display: none;
}
.selection-specs.active {
	display: block;
}

.Connector {
//        min-width: 780px;
	width: 100%;
//border: 1px solid black;

//        position: absolute;
//        top: 1em;
//        padding-top: 0.5em; /* allow some space so that buttons can overflow */
//        left: 2em; /* left space */
//        bottom: 1em;

	position: absolute;
	top: 0;
	left: 0;
	bottom: 0;
	right: 0;

//        height: calc(100% - 2.5em); /* 1em+0.5em top, 1em bottom */
	height: 100%;

        overflow-y: auto;
        overflow-x: hidden;
}
.Connector .ConnectorInner {
	margin: 1em 0 1em 2em;
	height: calc(100% - 2em);
//	border: 1px solid red;

        display: flex;
        flex-direction: column;
}
.Connector .ConnectorInner .Module {
	flex-grow: 100;
//	overflow-y: auto;
//	border: 2px solid black;
}
.Connector .ConnectorInner .Controls {
	align-self: flex-end;
	width: 100%;
//	margin-top: 1em;
//	border: 1px dotted gray;
}

.Connector .ConnectorInner .Module iframe {
	width: 100%;
	height: 100%;
//	border: 2px solid black;
}
.Connector .ConnectorInner .Controls div {
        border-top: 1px solid #ddd;
        padding-top: 1.0em;
}

#PaymentsOuter {
	padding: 2em 1em 1em 1em;
}
.payments-viewer {
	color: rgba(0,0,0,0.655);
}
.payments-viewer table tbody tr td {
//	padding: 2px 0;
	padding-bottom: 2px;
	vertical-align: middle;
}
.payments-viewer table tbody tr:last-child td {
	padding-bottom: 6px;
}


p#SerialFeedback {
//	font-weight: 500;
}

table.CouponSpendingSummary {
	color: rgba(0,0,0,0.655);
}
table.CouponSpendingSummary tr td {
	line-height: 1.8em;
}
table.CouponSpendingSummary tr td:nth-child(1) {
	padding-right: 6em;
}
table.CouponSpendingSummary tr td:nth-child(2) {
        padding-right: 1em;
}
table.CouponSpendingSummary tr td:nth-child(3) {
	text-align: right;
}


table.CouponsTransactions {
	color: rgba(0,0,0,0.655);
}
table.CouponsTransactions tr td {
	padding-right: 2em;
	line-height: 1.8em;
}
table.CouponsTransactions tr td:nth-child(5) {
	text-align: right;
}

span.redink {
	color: var(--color-redish);
}

.enums {
	display: table;
	width: 100%;
	max-width: 600px;
}
.enums.margin-bottom {
        margin-bottom: 1.7em;
}
.enums .enums-row {
	display: table-row;
}
.enums .enums-row .enums-cell {
	display: table-cell;
	height: 21px;
	line-height: 21px;
	border-top: 1px dotted #efefef;
}
.enums .enums-row:last-child .enums-cell {
	border-bottom: 1px dotted #efefef;
}
.enums .enums-row .enums-cell.label {
	width: 30%;

	font-weight: 500;
	font-size: 0.9em;
	letter-spacing: 0.02em;
}
.enums .enums-row .enums-cell.value {
	width: 70%;
	color: rgba(0,0,0,0.655);
}
.enums .enums-row.nesting-1 .enums-cell {
	text-indent: 1.5em;
}