/*
	Global Stylesheet 
	Created by Norm Attarmigiroglu for STRONCOONLINE.COM
	Malopan Communications Inc.
	May 23, 2013
	Modifications by Sandy and Josephine
*/

/* -------------------------------------------------------------------------------------------------------
SITE-WIDE STYLES
--------------------------------------------------------------------------------------------------------*/
	:root, ::before, ::after {
		--dark-blue: #002049;
		--blue: #279CD2;
		--light-blue: #8DD0EF;
		--grey-blue: #BADBEA;
		--highlight: #D1F1FF;
		--bg-blue: #EFF7FA;
		--dark-grey: #393939/*#4E4E4E*/;
		--grey: #4B4B4B/*#707070*/;
		--light-grey: #D5D5D5;
		--bg-grey:#F5F5F5;
		--yellow: #FFC514;
		--magenta: #DD1A62;
		--red: #D8605C;
		--green: #99D959;/*#D5D96C;*/
		--border-color:#C9D9DE;
		--font: Roboto, Arial, Helvetica, sans-serif;
		--font-light: 300;
		--font-med: 500;
		--font-bold: 700;
		--font-xbold: 900;
		--border: solid 1px var(--border-color);
		--border-radius: 3px;
		--big-radius: 8px;
		--shadow: 5px 5px 5px 0 rgb(0 0 0 / 20%), -1px -1px 4px rgb(0 0 0 / 5%);
		--half-shadow: 5px 5px 5px 0 rgb(0 0 0 / 10%), -1px -1px 4px rgb(0 0 0 / 3%);
		--half-shadow-inset: inset 5px 5px 5px 0 rgb(0 0 0 / 10%), -1px -1px 4px rgb(0 0 0 / 3%);
		--small-shadow-inset: inset 3px 3px 3px 0 rgb(0 0 0 / 10%), -1px -1px 2px rgb(0 0 0 / 3%);
		--tiny-shadow-inset: inset 1px 1px 5px 0 rgb(0 0 0 / 10%), -1px -1px 2px rgb(0 0 0 / 3%);
		--font-awesome: "Font Awesome 5 Free";
		--padding: 0.75rem 0;
		--cell-padding: 0.75rem 0.5rem;
		--max-width:1600px;
		--arrow-down: "\f107";
		--arrow-right: "\f105";
		--triple-arrow: "\203A\203A\203A";
		--triple-back: "\2039\2039\2039";
		--letter-spacing: 0.025em;
		--cols:auto-fit;
		--table-label-width:20%;
		--table-col-width:80%;
	}
	/*
	@import url('https://fonts.googleapis.com/css2?family=Roboto:ital,wght@0,100;0,300;0,400;0,500;0,700;0,900;1,100;1,300;1,400;1,500;1,700;1,900&display=swap');
	@import url('https://fonts.googleapis.com/css2?family=Roboto+Condensed:ital,wght@0,300;0,400;0,700;1,300;1,400;1,700&display=swap');
	@import url('https://fonts.googleapis.com/css2?family=Roboto+Slab:wght@100;200;300;400;500;600;700;800;900&display=swap');
	*/
	/* Containers
	----------------------------------------------------------------------------------------------------*/
	div.Content860 {
		position:relative;
		padding-left:0.5em;
	}
		
	.clear {
		clear: both;
		display: block;
		overflow: hidden;
		visibility: hidden;
		width: 0;
		height: 0;
	}
	.container_24 {
		width:100%;
	}
	
	.grid {
		display:grid;
	}
	.grid.cols {
		grid-template-columns:repeat(var(--cols), minmax(2rem,1fr));
	}
	.grid.auto {
		grid-template-columns:repeat(var(--cols), auto);
	}
	.grid.two {
		grid-template-columns: 1fr 1fr;
	}
	.grid.form {
		grid-template-columns:1fr 4fr;
	}
	.grid.spaced {
		grid-gap: 2rem;
	}
	.flex.gap, .grid.gap {
		grid-gap:1rem;
	}
	.grid.padded {
		grid-gap: 0.5rem;
	}
	.fullRow {
		grid-column: 1/-1;
	}
	.flex, .flexMiddle, .flexCenter, .flexRight {
		display:flex;
	}
	.flex.middle, .flexMiddle, .grid.middle, .gridMiddle {
		align-items: center;
	}
	.flex.top {
		align-items: flex-start;
	}
	.flex.bottom {
		align-items: flex-end;
	}
	.flex.center, .flexCenter, .content-center {
		justify-content: center;
	}
	.flex.right, .flexRight {
		justify-content: flex-end;
	}
	.flex.spaced, .FormNote.spaced {
		justify-content: space-between;
	}
	.flex.wrap {
		flex-wrap:wrap;
	}
	.page {
		position:relative;
		max-width: var(--max-width);
		min-height:100vh;
		margin-left: auto;
		margin-right: auto;
		display: grid;
		grid-auto-flow: column;
		grid-template-areas:   "leftmenu header"
                        "leftmenu main"
                        "leftmenu footer";
		grid-template-columns: auto 1fr;
		grid-template-rows: auto 1fr auto;
	}
	#page > .grid_18 {
		width: 100%;
		margin: 0;
	}
	span.fw {
		display:inline-block;
		width:1.25em;
	}
	.hasSidebar {
		display:grid;
		grid-template-columns: 7fr 3fr;
		grid-gap: 3rem;
	}
	.sq {
		position:relative;
	}
	.sq::before {
	  content: "";
	  padding-bottom: 100%;
	  display: block;
	}
	.sq > img, .sq > div {
	  position:absolute;
	  top:0;
	  left:0;
	  right:0;
	  bottom:0;
	  width: 100%;
	  height: 100%;
	  object-fit: contain;
	}
	.container.grey {
		border: var(--border);
		border-radius: var(--border-radius);
		border-color: var(--light-grey);
		background-color: var(--bg-grey);
		padding: 1rem;
	}
	.prodTypes .sq > img {
		object-fit: cover;
	}
	
	.showMenu #leftMenu {
		position:relative;
		display:block;
	}
	
	#openMenu, .showMenu #closeMenu {
		display:block;
		position:absolute;
		top:80vh;
		width:1.25rem;
		height:4rem;
		text-align:center;
		background:var(--blue);
		color:white;
		font-weight:bold;
		z-index:1;
	}
	
	#openMenu span, #closeMenu span {
		line-height: 2.7em;
		font-size: 1.5em;
	}
	
	#openMenu .fa, #closeMenu .fa {
		font-weight: bold;
	}
	
	#openMenu {
		left:0;
		position:fixed;
		border-top-right-radius:var(--border-radius);
		border-bottom-right-radius:var(--border-radius);
	}
	
	#closeMenu {
		/*left:calc(250px + (5rem - 1.25rem));*/
		right: 0;
		border-top-left-radius:var(--border-radius);
		border-bottom-left-radius:var(--border-radius);
	}
	
	.showMenu #openMenu, #closeMenu,#leftMenu {
		display:none;
	}
	
	.showMenu .TopLevelMenuBackground {
		padding-left: 1.25em;
	}
	
	#leftMenu {
		grid-area: leftmenu;
		width:250px;
		min-height:100vh;
		padding-left: 2rem;
		padding-right: 3rem;
		box-shadow: 0em 0px 0.8rem 0px rgb(0 0 0 / 15%);
		order:0;
	}
	
	@media only screen and (min-width: 1600px)
	{
		#openMenu {
			left: calc((100% - var(--max-width)) / 2);
			position:fixed;
		}
		/*#closeMenu {
			left: calc(((100% - var(--max-width)) / 2) + 250px + 5em - 1.25em);
			position:fixed;
		}*/
	}
	.icon {
		font-family: 'Roboto Condensed';
		font-size: 1.25em;
		font-weight: 900;
		line-height: 100%;
		display: inline-block;
		-webkit-font-smoothing: antialiased;
	}
	.icon.arrow::before {
		content:var(--triple-arrow);
	}
	.icon.circle {
		display: flex;
		align-items: center;
		justify-content: center;
		align-content: center;
		border-radius: 50%;
		width: 1.25em;
		height: 1.25em;
	}
	.icon.circle.arrow::before {
		padding-bottom:0.1em;
	}
	.icon.magenta {
		background:var(--magenta);
		color:white;
	}
	.icon.blue {
		background:var(--blue);
		color:white;
	}
	.icon.darkblue {
		background:var(--dark-blue);
		color:white;
	}
	.smallicon.border {
		width: 1.1em;
		height: 1.1em;
		font-size: 0.7em;
		line-height: 0.7em;
		border-width: 2px;
		border-style: solid;
		border-radius: 50%;
		border-color: var(--dark-grey);
		color: var(--dark-grey);
		display: flex;
		align-items: center;
		justify-content: center;
	}
	.smallicon.border.blue {
		border-color:var(--blue);
		color:var(--blue);
	}
	.smallicon.border.darkblue {
		border-color:var(--dark-blue);
		color:var(--dark-blue);
	}
	header {
		grid-area: header;
		order:2;
	}
	
	#page {
		grid-area: main;
		padding: 2rem;
		order:2;
	}
	
	footer {
		grid-area: footer;
	}
	
	.resetPage {
		margin: -2rem;
		width: calc(100% + 4rem);
		height: calc(100% + 4rem);
	}
	
	#mainContent .grid_18 {
		width:100%;
		float:none;
	}
		
	.full, .DropDown.full, .DropDown.full select, input.full { width:100%; }
	/* Default Fonts
	----------------------------------------------------------------------------------------------------*/
	html, html .x-body, .x-panel-body.x-panel-body-default {
		font-size:14px;
		font-family:var(--font);
		font-weight:300;
	}
	body {
		line-height: 120%;
		letter-spacing: var(--letter-spacing);
	}
	div, table, td, p, ul, ol {
		letter-spacing: var(--letter-spacing);
	}
	
	h1, h2, h3, h4, h5, h6, p { line-height: 120%; }
		
	h1, h2, h3, h4, h5, h6 {
		font-weight:bold;
	}
		
	ul, ol {
		list-style:inside;
	}
	
	p, .p { margin-top: 1em; margin-bottom:1em; }
	
	table {
		border-collapse: initial;
	}
		
	/* Headers
	----------------------------------------------------------------------------------------------------*/
	h1 {
		font-size:2.2rem;
		color:var(--dark-blue);
	}
		
	h2 {
		font-size:1.5rem;
		color:var(--dark-blue);
	}
		
	h3 {
		font-size:1.35rem;
		color:var(--dark-blue);
	}
	h4 {
		font-size:1.2rem;
		color:var(--dark-blue);
	}
	
	h2.subHeader {
		font-size: 1.75rem;
	}
	
	.subHeader {
		margin-top: 0.5em; margin-bottom:0.5em;
		color:var(--blue);
	}
		
	/* Bullets
	----------------------------------------------------------------------------------------------------*/
	ul.BlueArrowLevel01 {
		list-style-image:url(../gfx/arrow-small-blue-white-bg.png);
		font-size:13px;
		font-weight:normal;
		line-height:150%;
		}
		
	ul.BlueArrowLevel02 {
		list-style-image:url(../gfx/arrow-small-blue-white-bg.png);
		font-size:13px;
		font-weight:normal;
		line-height:150%;
		margin-left:30px;
		}
		
	.ListTitle {
		font-weight:bold;
		color:#0a2d6d;
		}
	
	/* Links
	----------------------------------------------------------------------------------------------------*/
	a {
		color:var(--blue);
		text-decoration:none;
		cursor:pointer;	
		}
	
	a:hover {
		color:var(--dark-blue);
		text-decoration:none;
		cursor:pointer;
	}
	
	a.inactive, a .inactive {
		color:var(--light-grey);
	}
		
	/* Images
	----------------------------------------------------------------------------------------------------*/
	img { border:0px;	}
	a img { vertical-align: middle; border:none; }
	
	/* Form Related
	----------------------------------------------------------------------------------------------------*/
	table.Form {
		width:100%;
		border-collapse:collapse;
		border-spacing:0px;
		}
	
	td.FormLeft {
		width:20%;
		border-bottom:var(--border);
		vertical-align:middle;
		padding:10px 0px;
		}
	
	td.FormRight {
		width:50%;
		border-bottom:var(--border);
		vertical-align:middle;
		padding:10px 0px;
		}
		
	td.FormColumn2 {
		padding:3px;
	}
	
	/*-------------------------Input Type Select Object Styling-------------------------*/
	div.DropDown, .DropDown input { 
		/*background:url(../gfx/select-drop-down-arrow-orange.png) no-repeat right; */
		width:auto;
		/*overflow:hidden;*/ /* this hides the select's drop button */
		padding:0; 
		margin:0;
	}
	div.DropDown {
		/* SVG background image */
		background: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='100' height='100' fill='%2000000'><polygon points='0,0 100,0 50,50'/></svg>") no-repeat;
		background-size: 12px;
		background-position: calc(100% - 12px) calc((100% - 12px / 2));
		background-repeat: no-repeat;
		background-color: transparent;
	}
		
	div.DropDown, .DropDown input, input[type=text],input[type=email],input[type=password], 
	input[type=tel], input[type=url], input[type=number], input[type=time], .formTextarea {
		border: none;
		border-radius:var(--border-radius);
		background-color:var(--bg-grey);
		font-size:1rem;
		font-family:var(--font);
	}
	select, .DropDown select option, button,.Button, input[type=file]::file-selector-button, input[type=file]::-webkit-file-upload-button {
		font-family:var(--font);
		letter-spacing: var(--letter-spacing);
	}
	
	div.DropDown.custom select {
		width:100%;
	}
	input[type=number] {
		-webkit-appearance: textfield;
		-moz-appearance: textfield;
		-ms-appearance: textfield;  
		appearance: textfield;
	}
	
	input[type=number]::-webkit-inner-spin-button, 
	input[type=number]::-webkit-outer-spin-button { 
	  -webkit-appearance: none; 
	  -moz-appearance: none;
	  appearance: none;
	  margin: 0; 
	}
	
	div.DropDown,
	input[type=text],input[type=email],input[type=password], input[type=tel], input[type=url], input[type=number], input[type=time], .formTextarea,
	div.DropDown.half, .service input[type=text].half, .formTextbox.half,
	div.DropDown.third, .service input[type=text].third, .formTextbox.third,
	div.DropDown.quarter, .service input[type=text].quarter, .formTextbox.quarter {
		vertical-align: middle;
		display: inline-block;
	}

	div.DropDown select { 
		min-width:35px;
		margin-right:5px;
		width:101%; /* this width effectively extends the drop down button out of view */
		background-color:transparent; /* this hides the select's background making any styling visible from the div */
		background-image:none; 
		/*-webkit-appearance: none;   this is required for Webkit browsers */
		border:0; 
		box-shadow:none; 
		/* needed */
		-webkit-appearance: none;
		-moz-appearance: none;
		appearance: none;
		/*margin-right:1rem;*/
		padding-right: 36px !important;
	}
	div.DropDown select, input[type=text],input[type=email],input[type=password], input[type=tel], input[type=url], input[type=number], input[type=time]{
		vertical-align: middle;
	}
	
	div.DropDown select,
	input[type=text],input[type=email],input[type=password], input[type=tel], input[type=url], input[type=number], .formTextarea {
		padding:0.5em;
	}
	input[type="time"] { padding: 0.4em 0.5em; }
		
	input[type=text],input[type=email],input[type=password], input[type=tel], input[type=url], input[type=number], input[type=time], .formTextarea {
		box-sizing: border-box;
	}
	.DropDown input {
		background-image: none;
	}
	
	.service .upload {
		width: auto;
		margin-left: 0;
	}
	
	.service input[type=text], input[type=email], .service input[type=tel], input[type=url], input[type=number]{
		color:#000000;
	}
	
	.service input[type=text],input[type=email], .service input[type=tel], input[type=number], .formTextbox {
		/*padding:4px;*/ height:auto;
	}
	
	div.DropDown.half select, div.DropDown.third select, div.DropDown.quarter select {
		width: 100%;
	}
	
	div.DropDown.half, .service input[type=text].half, .formTextbox.half {
		width: 100px;
	}
	
	div.DropDown.third, .service input[type=text].third, .formTextbox.third {
		width: 60px;
	}
	
	div.DropDown.quarter, .service input[type=text].quarter, .formTextbox.quarter {
		width: 50px;
	}
	
	.service input[type=text].half {width: 90px;}
	div.DropDown.half select, div.DropDown.third select , div.DropDown.quarter select {width: 100%;}
	.service td .half:first-child {margin-right: 6px;}
	
	.FormLabel { display:flex; align-items: center; }
	.FormLabel span:first-child, .FormLabel label:first-child { padding-right: 0.5rem; }
	.FormLabel span:last-child, .FormLabel label:last-child { padding-left: 0.5rem; }
	.FormLabel input { width:100%; }
	
	input.formQty {
		width: calc(100% - 0.5rem); /* width - margin */
		border: var(--border);
		background: white;
		margin: 0.25rem;
		padding: 0.25rem 0.5rem;
	}
	
	.icon-radio { display: none; }
	.icon-radio+label{ color:var(--light-grey); }
	.icon-radio:checked+label{ color:var(--blue); }
	
	input.data {	
		padding:0px;
		border:none;
		background:none;
		-moz-box-shadow: none;
		-webkit-box-shadow: none;
		box-shadow: none;
	}
	
	.inset {
		box-shadow:var(--half-shadow-inset);
	}
	.inset-sm {
		box-shadow:var(--small-shadow-inset);
	}
	.inset-xs {
		box-shadow:var(--tiny-shadow-inset);
	}
	/*-------------Input Type File Browse Styling-------------*/
	div.upload {
		width:8rem;
		height:1.5rem;
		overflow:hidden;
		display:inline-block;
		position:relative;
		margin-left:5px;
	}
	
	div.upload:after {
		content: 'browse';
		background-color: var(--blue);   
		color: #FFFFFF;
		border: none;
		border-width: 0;
		border-radius: var(--border-radius);
		padding: 0.25rem 1rem;
		font-size: 1rem;
		line-height:1rem;
		position:absolute;
		top: 0;
		bottom: 0;
		left:0;
		z-index:-1;
	}
			
	div.upload input {
		display:block !important;
		width:6rem !important;
		height:1.5rem !important;
		opacity:0 !important;
		overflow:hidden !important;
	}
	
	input[type=file] {
		appearance:none;
		position:relative;
		border-radius:var(--border-radius);
		background-color:var(--bg-grey);
		border:none;
		width: 75%;
		font-family: var(--font);
		font-size:1rem;
	}
	
	input[type=file]::file-selector-button, input[type=file]::-webkit-file-upload-button {
		-webkit-appearance: button;
		background-color:var(--blue);
		color:white;
		font-weight:var(--font-med);
		font-size:1.1rem;
		border: 0;
		padding:0.5rem 1rem;
		margin-right:1rem;
	}
		
	input {
		border:solid 1px #909092;
	}
		
	.formTextarea { margin: 0px; }
		
	input[type="checkbox"], input[type=radio] {
	  -webkit-appearance: none;
	  appearance: none;
	  background-color: #fff;
	  margin: 0;
	  font: inherit;
	  color: var(--blue);
	  width: 1.15em;
	  height: 1.15em;
	  border: 1px solid var(--dark-blue);
	  border-radius: 0.15rem;
	  transform: translateY(-0.075em);
	  display: inline-grid;
	  place-content: center;
	}
	input[type="checkbox"]::before, input[type="radio"]::before {
	  content: "";
	  width: 0.60em;
	  height: 0.60em;
	  transform: scale(0);
	  transition: 120ms transform ease-in-out;
	  box-shadow: inset 1em 1em currentColor;
	}

	input[type="checkbox"]:checked::before, input[type="radio"]:checked::before {
	  transform: scale(1);
	}
	
	input[type="checkbox"]:focus, input[type="radio"]:focus {
	    outline: 1px solid var(--light-blue);
		outline-offset: 1px;
	}
	
	input[type="checkbox"]:disabled, input[type="radio"]:disabled {
	  color: var(--light-grey);
	  border-color: var(--light-grey);
	  cursor: not-allowed;
	}
	
	input[type=radio],input[type="radio"]::before {
		border-radius: 50%;
	}
	
	input.noborder {
			border:none;
			border-color: transparent; 
			background-color:white; 
			box-shadow: none;
	      }
		  
	.spacer-chk {
		display:inline-block;
		width:0;
		margin-right:calc(2px + 1.15em);
	}
		
	/*select {
		color:#000000;
		cursor:pointer;
		border:0;
		}*/
		
	.cal img { vertical-align: sub; }
	
	html #ui-datepicker-div {
		background: white;
		border:1px solid white;
		margin:0.5rem;
		padding:0.5rem;
		border-radius: var(--big-radius);
		box-shadow: var(--shadow);
	}
	
	html #ui-datepicker-div, html .ui-datepicker-inline, html .ui-datepicker-header select, #ui-datepicker-div button {
		font-family: var(--font);
	}
	
	html .ui-datepicker-group {
		width: 50%;
		float: left;
	}
	
	html .ui-datepicker-row-break {
		clear:both;
	}
	
	html .ui-datepicker-buttonpane {
		border-top: var(--border);
		padding-top: 0.5rem;
		margin-top: 0.5rem;
	}
	
	html .ui-datepicker-title {
		display: flex;
		/*flex-direction: column;*/
		align-items: center;
		justify-content: center;
	}
	
	html .ui-datepicker-header {
		background:white;
		text-align: center;
		font-weight: 400;
		display: flex;
		align-items: center;
		justify-content: center;
	}
	
	html .ui-datepicker-control, html .ui-datepicker-links, html .ui-datepicker, html .ui-datepicker-calendar th {
		font-weight:400;
		color:var(--grey);
	}
	
	html .ui-datepicker-header, html .ui-datepicker-calendar tbody a, html .ui-datepicker-header select {
		font-weight:400;
		color:var(--dark-grey);
	}
	
	html .ui-datepicker-header select {
		border:none;
		background:var(--bg-grey);
		padding: 0.25rem 0.5rem;
	}
	
	.ui-datepicker-title span {
		padding: 0.4rem 0;
	}
	
	html .ui-datepicker-calendar td, html .ui-datepicker-calendar th {
		padding: 0.4rem 0.25rem !important;
	}
	html .ui-datepicker-today {
		background: var(--blue) !important;
		border-radius:var(--border-radius);
	}
	
	html .ui-datepicker-calendar .ui-datepicker-today a {
		color:white;
	}
	
	html .ui-datepicker-close, .ui-datepicker-next {
		order: 2;
	}
	
	#ui-datepicker-div button {
		padding: 0.4rem 1rem;
	}
	
	img.ui-datepicker-trigger {
		background-color: var(--blue);
		margin: 0 !important;
		padding: 0.3575rem;
		border-top-left-radius: 0px;
		border-top-right-radius: var(--border-radius);
		border-bottom-right-radius: var(--border-radius);
		border-bottom-left-radius: 0px;
		height: 1.5rem;
	}
	
	input.hasDatepicker {
		width:7em;
		border-top-left-radius: var(--border-radius);
		border-top-right-radius: 0;
		border-bottom-right-radius: 0;
		border-bottom-left-radius: var(--border-radius);
	}
	
	.smallBtn, #ui-datepicker-div button {
		background-color:var(--blue);
		font-weight: var(--font-med);
		color: #FFFFFF;
		border: none;
		border-width: 0;
		border-radius:var(--border-radius);
		padding:0.25rem 1rem;
	}
	
	input[type=button],input[type=submit] {
		-webkit-appearance: button;
	}
	
	.Button, .btnText {
		background-repeat: no-repeat;
		background-color:var(--blue);
		font-weight: var(--font-med);
		color: #FFFFFF;
		border: none;
		border-width: 0;
		border-radius:var(--border-radius);
		padding:0.5rem 3rem;
		font-size:1.25rem;
	}
	
	.btnText { height: 23px; line-height: 23px; font-size: 13px; vertical-align: middle; font-family: Arial; }
	.btnMinus .Button, .btnPlus .Button, .btnArrowLeft .Button, .btnArrowRight .Button, .btnCheckmark .Button, .btnCheck .Button, .btnForward .Button, .btnBack .Button {
		top: -1px;
		position: relative;
	}
	
	.btnMinus, .btnPlus, .btnArrowLeft, .btnArrowRight, .btnCheckmark, .btnCheck, .btnForward, .btnBack { position:relative;display: inline-block; margin-left: 29px; }
	
	.btnMinus::before, .btnPlus::before, .btnArrowLeft::before, .btnArrowRight::before, .btnCheckmark::before, .btnCheck::before, .btnForward::before, .btnBack::before{
	 	content:"_";
		text-indent:29px;
		width:29px;
		height:29px;
		overflow: hidden;
		display: block;
		position: absolute;
		top:-1px;
		left: -29px;
		background-position: left 0 top 0;
	 }
	
	.btnText { height: 23px; line-height: 23px; font-size: 13px; vertical-align: middle; font-family: Arial; }
	/*
	.btnMinus, .btnPlus, .btnArrowLeft, .btnArrowRight, .btnCheckmark, .btnCheck, .btnForward, .btnBack {
		line-height: 29px;
		padding-left: 29px;
		display: inline-block;
		border: none;
		background-position: left 0 top 0;
		background-color:#0073ac;
		background-repeat: no-repeat;
	}
	*/
	.btnMinus::before {
		background-image: url('../gfx/button-minus.png');
	}
	
	.btnPlus::before {
		background-image: url('../gfx/button-plus.png');
	}
	
	.btnCheckmark::before, .btnCheck::before {
		background-image: url('../gfx/button-checkmark.png');
	}
	
	.btnForward::before {
		background-image: url('../gfx/button-forward.png');
	}
	
	.btnBack::before {
		background-image: url('../gfx/button-back.png');
	}
	
	div.Button {
		display: inline-block;
		line-height: 29px;
		padding-left: 29px;
		height: 29px;
		padding: 0 12px;
		letter-spacing: 0.5px;
	}
	
	div.Button:active {
		line-height: 31px;
		padding-left: 13px;
		padding-right: 11px;
	}
	
	.Button .fa, .Button .far, .Button .fas {
	    font-size: 0.8em;
		line-height: 1.35em;
		vertical-align: text-bottom;
		padding-left: 1em;
	}
	.hasBadge {
		position:relative;
		display: inline-block;
		vertical-align:middle;
	}
	.badge {
	    background: var(--red);
		border-radius: 0.5rem;
		font-size: 0.5em;
		line-height: 100%;
		position: absolute;
		display: block;
		color: white;
		padding: 0.25em;
		top: -40%;
		left: 65%;
	}
	a:hover .badge {
		background-color:var(--magenta);
	}
	.pointer, .FormButton {
		cursor:pointer;
	}
	
	.Quantity {
		background:#ecf2f5;
		font-size:12px;
		font-weight:bold;
		color:#000000;
		border:solid 1px #909092;
		text-align:center;
		padding:2px 0px;
		}
		
	.NotesInstructions {
		font-weight:bold;
		color:#d37826;
		}	
	
	/* tabs */
	.x-tab-bar.x-tab-bar-default-top {
		background: none;
		background-color: transparent;
	}
	.x-panel.x-panel-default, .x-tab-bar.x-tab-bar-default-top {
		border: none;
	}
	.x-tab-inner.x-tab-inner-default {
		font-family: var(--font);
		font-size: 1rem;
	}
	.x-panel .x-tab.x-tab-default .x-tab-inner.x-tab-inner-default {
		color:var(--grey);
	}
	.x-panel .x-tab.x-tab-active.x-tab-default .x-tab-inner.x-tab-inner-default {
		color:var(--bg-blue);
	}
	.x-panel .x-tab.x-tab-default-top, .x-panel .x-tab.x-tab-default-left, .x-panel .x-tab.x-tab-default-right,
	.x-panel .x-tab.x-tab-active.x-tab-default-top, .x-panel .x-tab.x-tab-active.x-tab-default-left, .x-panel .x-tab.x-tab-active.x-tab-default-right	{
		background-image:none;
		background-color:var(--bg-grey);
		border-color: var(--light-grey);
		box-shadow: none;
		padding: 0.5rem 1rem;
	}
	.x-panel .x-tab.x-tab-active.x-tab-default-top, .x-panel .x-tab.x-tab-active.x-tab-default-left, .x-panel .x-tab.x-tab-active.x-tab-default-right {
		background-color:var(--blue);
		border-color: var(--blue);
	}
	.x-tab-bar-strip.x-tab-bar-strip-default {
		background-image:none;
		background-color:var(--light-grey);
	}
	/* Default Reports or Lists
	----------------------------------------------------------------------------------------------------*/
	.companyList td, .companyList .companyNote .grid * {
		padding:0.5rem;
	}
	.companyList .company td {
		background-color:var(--bg-blue);
		border-top: var(--border);
	}
	.companyList .company+.company td {
		padding-top:0;
		border-top: none;
	}
	.companyList td.action {
		padding:0.5rem 0;
		text-align:center;
	}
	.companyList .companyNote { background-color:var(--bg-grey); }
	.companyList .contact>td { background:linear-gradient(rgba(255,255,255,0.75),rgba(255,255,255,0.75)),linear-gradient(var(--green), var(--green));; }
	.companyList .contact>td:first-child, .companyList .events>td, .companyList .facilityService>td, .companyList .companyNote>td {
		padding: 0;
	}
	.companyList .contact>td:first-child, .companyList .events>td {
		padding-left: 0.75rem;
	}
	.companyList label, .companyList .subHeading>td {
		font-weight:var(--font-bold);
	}
	.companyList .subHeading>td {
		border-bottom: var(--border);
		color: var(--dark-blue);
	}
	.companyList .companyName {
		color: var(--dark-blue);
		font-weight:var(--font-med);
		font-size:1.25rem;
	}
	.paddedTable td {
		padding:var(--cell-padding);
	}
	.ReportForm , .ReportSubmit, .paddedCell, .paddedForm {
		vertical-align:middle; 
		line-height: 170%;
		padding: var(--cell-padding); 
		
	}
	/*.ReportForm , .ReportSubmit,*/ .paddedCellBorder {
		border-bottom: 1px solid;
		border-color:var(--border-color);		
	}
	.ReportForm , .ReportSubmit, .paddedForm {
		width: var(--table-col-width);
	}
	.ReportForm.auto, .ReportSubmit.auto, .paddedForm.auto{
		width: auto;
	}
	.ReportForm * { vertical-align: middle;}
	/*
	.ReportSubmit {
		border-top: 1px solid;
		border-color:var(--border-color);	
	}
	*/
	.ReportForm.text, .ReportSubmit.text, .paddedForm.text { width:var(--table-label-width); }
	.ReportForm.half, .ReportSubmit.half, .ReportForm.third, .ReportSubmit.third { width:25%; }
	.ReportForm.half.last,.ReportSubmit.half.last { width:55%; }
	.ReportForm.third.last,.ReportSubmit.third.last { width:30%; }
	
	.FormNote {
		display:flex;
		grid-gap:1rem;
		flex-wrap:wrap;
		align-items: center;
	}
	
	.ReportsListsHeader, .ReportHeader {
		width:100%;
		padding: var(--cell-padding); 
		box-sizing:border-box;
	}
		
	.ReportsListsHeaderRight, .ReportsListsHeader, .ReportHeader {
		font-size: 1.25rem;
		font-weight:var(--font-med);
		color:var(--blue);
	}	
	
	table.ReportsLists {
		border-spacing:0px;
		width:100%;
		box-sizing:border-box;
	}

	td.ReportsListsColumnHeaders, td.ReportsListsRows {
		border-right:var(--border);
		border-bottom:var(--border);
	}
		
	/* ---------- new list css version -------------- */	
	td.ReportsListsRows, td.ReportsListsRows2, td.tableCell, .tableCell, .cartCell {
		line-height:125%;
		/*border-bottom:solid 0px;
		border-color:var(--border-color);	*/
		padding: var(--cell-padding); 
	}

	td.ReportsListsColumnHeaders, td.ReportsListsColumnHeaders2, .greyHeading, .tableHeader, .OrderDetailsHead td {
		background:var(--bg-blue);
		vertical-align:middle;
		padding: var(--cell-padding); 
	}
	
	td.ReportsListsColumnHeaders, td.ReportsListsColumnHeaders2, .greyHeading, .tableHeader,
	td.ReportsListsColumnHeaders a, td.ReportsListsColumnHeaders2 a, .tableHeader a, .OrderDetailsHead td {
		color:black;
		font-weight:var(--font-med);
	}
		
	td.altRow , .td.altRow, .altRow > td { background: var(--bg-grey); }
	/*** Borders ***/

	.ReportsLists {
		border-collapse: separate;
	}
	
	td.ReportsListsColumnHeaders, td.ReportsListsColumnHeaders2, .greyHeading, .tableHeader, .OrderDetailsHead td {
		border-radius: 0;
		border-width: 1px 0px;
		border-color: var(--bg-grey);
		border-style: solid;
		border-collapse: separate; 
	}

	td.ReportsListsColumnHeaders:first-child, td.ReportsListsColumnHeaders2:first-child, .greyHeading:first-child, .tableHeader:first-child, .OrderDetailsHead td:first-child {
		border-left-width: 1px;
		border-top-left-radius: var(--border-radius);
		border-bottom-left-radius: var(--border-radius);
	}
	
	td.ReportsListsColumnHeaders:last-child, td.ReportsListsColumnHeaders2:last-child, .greyHeading:last-child, .tableHeader:last-child, .OrderDetailsHead td:last-child {
		border-right-width: 1px;
		border-top-right-radius: var(--border-radius);
		border-bottom-right-radius: var(--border-radius);
	}
	
	.list {
		display:grid;
		grid-template-columns: repeat(var(--cols), minmax(2rem,1fr));
		padding: 0.5rem 0;
		border-bottom: var(--border);
	}
	.list .list {
		padding: 0;
		border-bottom: 0;
	}
	
	.letters {
		display: flex;
		align-items: center;
		justify-content: center;
		justify-items: center;
		grid-gap: 0.5rem;
	}
	.letters a {
		text-decoration: underline;
		line-height:normal;
	}
	.letters a.active {
		color: var(--magenta);
		font-size: 1.25em;
	}
	/*
	td.ReportsListsRows, td.ReportsListsRows2, td.tableCell, .tableCell {
		background: linear-gradient(to bottom, transparent 1px, transparent 1px, transparent calc(100% - 2px), var(--border-color) calc(100% - 2px)) no-repeat, 
			linear-gradient(to left, var(--border-color) 1px, transparent 1px, transparent calc(100% - 1px), var(--border-color) calc(100% - 1px)) no-repeat;
	}
	
	td.ReportsListsRows:first-child, td.ReportsListsRows2:first-child, td.tableCell:first-child, .tableCell:first-child
	{
		background: linear-gradient(to bottom, transparent 1px, transparent 1px, transparent calc(100% - 2px), var(--border-color) calc(100% - 2px)) no-repeat, 
			linear-gradient(to left, var(--border-color) 1px, transparent 1px, transparent calc(100% - 1px), transparent calc(100% - 1px)) no-repeat;
	}
	
	td.ReportsListsRows:last-child, td.ReportsListsRows2:last-child, td.tableCell:last-child, .tableCell:last-child
	{
		background: linear-gradient(to bottom, transparent 1px, transparent 1px, transparent calc(100% - 2px), var(--border-color) calc(100% - 2px)) no-repeat, 
			linear-gradient(to left, transparent 1px, transparent 1px, transparent calc(100% - 1px), var(--border-color) calc(100% - 1px)) no-repeat;
	}
	
	td.altRow.ReportsListsRows, td.altRow.ReportsListsRows2, td.altRow.tableCell, .altRow.tableCell,
	table:not(.custom) tr:nth-child(2n+1)>td.ReportsListsRows, table:not(.custom) tr:nth-child(2n+1)>td.ReportsListsRows2, 
	table:not(.custom) tr:nth-child(2n+1)>td.tableCell, table:not(.custom) tr:nth-child(2n+1)>.tableCell,
	table.custom td.altRow.tableCell, table.custom .altRow.tableCell
	{
		background: linear-gradient(to bottom, transparent 1px, transparent 1px, transparent calc(100% - 2px), var(--border-color) calc(100% - 2px)) no-repeat, 
			linear-gradient(to left, var(--border-color) 1px, transparent 1px, transparent calc(100% - 1px), var(--border-color) calc(100% - 1px)) no-repeat, var(--bg-grey);
	}
	
	td.altRow.ReportsListsRows:first-child, td.altRow.ReportsListsRows2:first-child, td.altRow.tableCell:first-child, .altRow.tableCell:first-child,
	table:not(.custom) tr:nth-child(2n+1)>td.ReportsListsRows:first-child, table:not(.custom) tr:nth-child(2n+1)>td.ReportsListsRows2:first-child, 
	table:not(.custom) tr:nth-child(2n+1)>td.tableCell:first-child, table:not(.custom) tr:nth-child(2n+1)>.tableCell:first-child,
	table.custom td.altRow.tableCell:first-child, table.custom .altRow.tableCell:first-child
	{
		background: linear-gradient(to bottom, transparent 1px, transparent 1px, transparent calc(100% - 2px), var(--border-color) calc(100% - 2px)) no-repeat, 
			linear-gradient(to left, var(--border-color) 1px, transparent 1px, transparent calc(100% - 1px), transparent calc(100% - 1px)) no-repeat, var(--bg-grey);
	}
	
	td.altRow.ReportsListsRows:last-child, td.altRow.ReportsListsRows2:last-child, td.altRow.tableCell:last-child, .altRow.tableCell:last-child,
	table:not(.custom) tr:nth-child(2n+1)>td.ReportsListsRows:last-child, table:not(.custom) tr:nth-child(2n+1)>td.ReportsListsRows2:last-child, 
	table:not(.custom) tr:nth-child(2n+1)>td.tableCell:last-child, table:not(.custom) tr:nth-child(2n+1)>.tableCell:last-child,
	table.custom td.altRow.tableCell:last-child, table.custom .altRow.tableCell:last-child
	{
		background: linear-gradient(to bottom, transparent 1px, transparent 1px, transparent calc(100% - 2px), var(--border-color) calc(100% - 2px)) no-repeat, 
			linear-gradient(to left, transparent 1px, transparent 1px, transparent calc(100% - 1px), var(--border-color) calc(100% - 1px)) no-repeat,  var(--bg-grey);
	}
	
	td.ReportsListsRows, td.ReportsListsRows2, td.tableCell, .tableCell,
	td.ReportsListsRows:first-child, td.ReportsListsRows2:first-child, td.tableCell:first-child, .tableCell:first-child
	td.ReportsListsRows:last-child, td.ReportsListsRows2:last-child, td.tableCell:last-child, .tableCell:last-child,
	table.custom td.altRow.tableCell, table.custom .altRow.tableCell,table.custom td.altRow.tableCell:first-child, table.custom .altRow.tableCell:first-child, table.custom td.altRow.tableCell:last-child, table.custom .altRow.tableCell:last-child,
	table:not(.custom) tr:nth-child(2n+1) td.ReportsListsRows, table:not(.custom) tr:nth-child(2n+1) td.ReportsListsRows2, table:not(.custom) tr:nth-child(2n+1) td.tableCell, table:not(.custom) tr:nth-child(2n+1) .tableCell,
	table:not(.custom) tr:nth-child(2n+1) td.ReportsListsRows:first-child, table:not(.custom) tr:nth-child(2n+1) table:not(.custom) tr:nth-child(2n+1) td.ReportsListsRows2:first-child, table:not(.custom) tr:nth-child(2n+1) td.tableCell:first-child, table:not(.custom) tr:nth-child(2n+1) .tableCell:first-child
	table:not(.custom) tr:nth-child(2n+1) td.ReportsListsRows:last-child, table:not(.custom) tr:nth-child(2n+1) td.ReportsListsRows2:last-child, table:not(.custom) tr:nth-child(2n+1) td.tableCell:last-child, table:not(.custom) tr:nth-child(2n+1) .tableCell:last-child
	{
		background-position: center;
		background-size: 100%, 100% calc(100% - 1em);
	}
	*/
	.tableCell,td.border-top, td.border-bottom, td.border-left, td.border-right, .OrderSubListHead .cartCell:nth-child(n+2), #confirmation #OrderList .FormContent {
		position: relative;
	}
	
	table:not(.custom) tr:nth-child(2n+1)>td.ReportsListsRows, table:not(.custom) tr:nth-child(2n+1)>td.ReportsListsRows2, 
	table:not(.custom) tr:nth-child(2n+1)>td.tableCell, table:not(.custom) tr:nth-child(2n+1)>.tableCell, table.striped tr:nth-child(2n)>td,
	table.custom td.altRow.tableCell, table.custom .altRow.tableCell {
		background-color:var(--bg-grey);
	}
	
	
	table .tableCell input[type=text],
	table .tableCell input[type=email],
	table .tableCell input[type=password], 
	table .tableCell input[type=tel], 
	table .tableCell input[type=url], 
	table .tableCell input[type=number],
	table .tableCell input[type=time],	
	table .tableCell .formTextarea {
		border:var(--border);
	}
	
	table:not(.custom) tr:nth-child(2n+1)>.tableCell div.DropDown, 
	table:not(.custom) tr:nth-child(2n+1)>.tableCell .DropDown input, 
	table:not(.custom) tr:nth-child(2n+1)>.tableCell input[type=text],
	table:not(.custom) tr:nth-child(2n+1)>.tableCell input[type=email],
	table:not(.custom) tr:nth-child(2n+1)>.tableCell input[type=password], 
	table:not(.custom) tr:nth-child(2n+1)>.tableCell input[type=tel], 
	table:not(.custom) tr:nth-child(2n+1)>.tableCell input[type=url], 
	table:not(.custom) tr:nth-child(2n+1)>.tableCell input[type=number], 
	table:not(.custom) tr:nth-child(2n+1)>.tableCell input[type=time],	
	table:not(.custom) tr:nth-child(2n+1)>.tableCell .formTextarea {
		background-color:white;
	}
	
	.tableCell::after, .tableCell::before,
	td.border-right::after, td.border-left::after, td.border-top::after, td.border-bottom::after,
	td.border-right::before, td.border-left::before, td.border-top::before, td.border-bottom::before, .OrderSubListHead .cartCell:nth-child(n+2)::before, #confirmation #OrderList .FormContent::before
	{
		content: "";
		position: absolute;
		pointer-events: none;
	}
	
	.tableCell::before, td.border-left::before, td.border-right::before, .OrderSubListHead .cartCell:nth-child(n+2)::before, #confirmation #OrderList > table .FormContent::before {
		top: 0.5rem;
		bottom: 0.5rem;
		left: 0;
		right: 0;
	}
	
	td.border-left::before, td.border-right::before {
		top: 0.1rem; bottom: 0.1rem;
	}
	
	.tableCell::before, td.border-left::before, .OrderSubListHead .cartCell:nth-child(n+2)::before, #confirmation #OrderList > table .FormContent:nth-child(n+2)::before {
		border-left: var(--border);
	}
	
	.tableCell::before, td.border-right::before, .OrderSubListHead .cartCell:nth-child(n+2)::before, #confirmation #OrderList > table .FormContent:nth-child(n+2)::before {
		border-right: var(--border);
	}
	
	.tableCell.bl-0::before,.tableCell.br-0+.tableCell::before, .OrderSubListHead .cartCell.bl-0::before, .cartServiceHead.OrderSubListHead .cartCell::before, #confirmation #OrderList > table table .FormContent::before {
		border-left:none;
	}
	.tableCell.br-0::before,.tableCell.bl-0+.tableCell::before, .cartServiceHead.OrderSubListHead .cartCell::before, #confirmation #OrderList > table table .FormContent::before {
		border-right:none;
	}
	
	.tableCell::after, td.border-top::after, td.border-bottom::after, #confirmation #OrderList .FormContent::after {
		left: 0;
		right: 0;
		top: 0;
		bottom: 0;
	}
	/*
	.tableCell::after, #confirmation #OrderList .FormContent::after {
		border-bottom: 2px solid var(--border-color);
	}
	*/
	/*td.border-top::after, */.border-top {
		border-top: var(--border);
	}
	
	/*td.border-bottom::after, */.border-bottom {
		border-bottom: var(--border);
	}
	
	.tableCell.bb-0::before, .tableCell.by-0::before {
		bottom:0;
	}
	.tableCell.bt-0::before, .tableCell.by-0::before {
		top: 0;
	}
	.tableCell.bb-0::after, .tableCell.by-0::after {
		border-bottom:none;
	}
	.tableCell.bt-0::after, .tableCell.by-0::after {
		border-top:none;
	}
	
	.tableCell:first-child::before {
		border-left:none;
	}
	
	.tableCell:last-child::before, .OrderSubListHead .cartCell:last-child::before {
		border-right:none;
	}

	html *:not(td).borderBottom, td.lastRow:not(.tableCell), .lastRow:not(.tableCell), .greyHeading  {
		border-bottom: var(--border);
	}
	
	html *:not(td).borderRight {
		border-right: var(--border);
	}
	
	html *:not(td).borderTop, .greyHeading {
		border-top: var(--border);
	}
	
	html *:not(td).borderLeft {
		border-left: var(--border);
	}
	
	td.lastCell:not(.tableCell|.tableHeader), .lastCell:not(.tableCell|.tableHeader) {
		border-right: 0px;
	}
		
	td.spacerBottom {
		border-bottom: 1rem solid #fff;
	}	
	html .border { border: var(--border); }
	
	/* ---------- new list css version END -------------- */	
	
	
	/* Errors or Warnings
	----------------------------------------------------------------------------------------------------*/
	.ErrorOrWarning, .error, .warning, .success {
		font-weight:var(--font-bold);
		color:var(--red);
		letter-spacing:0.5px;
		}
	.success{
		color:var(--green);
	}
		
	.required {
		color:var(--red);
		}
		
	.ErrorName {
		font-weight:bold;
		color:#d37826;
		}
		
	.ErrorDescription {
		font-weight:bold;
		color:#000;
		}
		
	.instructions {
		--color:var(--magenta);
	}
	.box {
		--color:var(--dark-blue);
		border:var(--border);border-color:var(--color);color:var(--color);font-weight:var(--font-med);
		border-radius:var(--border-radius);padding:1rem;margin:1rem 0;
	}
	.box.inv {
		border:none;color:white;background:var(--color);
	}
	.box h2 {
		font-weight:var(--font-med);margin-bottom:1rem;
	}
	.box h2, .box a { color:var(--color); }
	.box.inv h2, .box.inv a { color:white; }
	.box.magenta { --color:var(--magenta); }
	.box.inv.magenta { background:linear-gradient(rgba(255,255,255,0.2),rgba(255,255,255,0.2)),linear-gradient(var(--color), var(--color)); }
	/* Spacers
	----------------------------------------------------------------------------------------------------*/
	.Spacer {
		display:block;
		height:0;
		margin-bottom:1rem;
	}
	.Spacer-2 {
		display:block;
		height:0;
		margin-bottom:1.5rem;
	}
	.Spacer-3 {
		display:block;
		height:0;
		margin-bottom:1.5rem;
	}
	br.Spacer { height: 1rem; }
	br.Spacer-2 { height: 2rem; }
	br.Spacer-3 { height: 3rem; }
	.Spacer1	{
		display:block;
		height:1px;
		}
	
	.Spacer5	{
		display:block;
		height:5px;
		}
	
	.Spacer10	{
		display:block;
		height:10px;
		}
	
	.Spacer15	{
		display:block;
		height:15px;
		}
		
	.Spacer20	{
		display:block;
		height:20px;
	}
		
	.Spacer30	{
		display:block;
		height:30px;
		}
		
	.Spacer40	{
		display:block;
		height:40px;
		}
	
	.Spacer50	{
		display:block;
		height:50px;
		}
		
	.Spacer60	{
		display:block;
		height:60px;
		}
		
/* -------------------------------------------------------------------------------------------------------
NON-CONTENT RELATED STYLES (header, top navigation, left column, footer)
--------------------------------------------------------------------------------------------------------*/

	/* Header
	----------------------------------------------------------------------------------------------------*/
	header {
		display:block;
		}
	
	
	/* Top Level Menu Background
	----------------------------------------------------------------------------------------------------*/
	#TopLevelMenuBackground {
		background:var(--bg-grey);
		display:flex;
		justify-content: flex-end;
		width:auto;
		padding:0.5rem;
	}
	#SecondaryLevelMenuBackground {
		flex-direction: column;
	}
	
	/* Top Level Menu
	----------------------------------------------------------------------------------------------------*/
	div.TopLevelMenuItemContainer {
		display:flex;
		position:relative;
		border-right: 1px solid;
		font-size: 1.2rem;
		padding: 0 1rem;
		margin: 0.5rem 0;
		line-height: 80%;
		align-items: center;
	}
	
	
	div.TopLevelMenuItemContainer:last-child, div.SecondaryLevelMenuItemContainer:last-child {
		border-right:none;
	}
	
	div.TopLevelMenuItem {
		width:auto;
		text-align:center;
	}
	
	div.TopLevelMenuItem {
		border-color:var(--dark-blue);
	}
	
	/* Secondary Menu Background
	----------------------------------------------------------------------------------------------------*/
	#SecondaryLevelMenuBackground {
		background:#FFF;
	}
	
	/* Secondary Level Menu
	----------------------------------------------------------------------------------------------------*/
	.MenuOn {
		color: var(--magenta);
		/*height:27px;*/
	}
		
	/* Top Bar
	----------------------------------------------------------------------------------------------------*/
	#topbar, #menuLogo {
		display:flex;
		align-items: center;
		justify-content: space-between;
		height: 6rem;
	}
	
	#topbar {
		background:var(--dark-blue);
		padding:0 2rem;
	}
	
	#topbar .widgets {
		position:relative;
		display:flex;
		justify-content:flex-end;
		column-gap: 4rem;
		gap:4rem;
		font-size: 1.1rem;
		font-weight:var(--font-light);
	}
	
	#topbar .widgets, #topbar .widgets a {
		color: white;
	}
	
	#topbar .widgets i.fa, #topbar .widgets i.far {
		padding-right:1rem;
	}
		
	#logo img, #menuLogo img, #loginTop img {
		height: 3rem;
	}
	
	#logo img {
		filter: contrast(0) grayscale(1) brightness(3);
		width: auto;
	}
	
	#userMenuBtn { padding-left:1em; }
	
	.showMenu #logo img, .userMenu {
		display: none;
		font-size: 0.85em;
		font-weight: normal;
	}
	
	#staffSearch .mainSearch, #productSearch .mainSearch, #glossarySearch .mainSearch, #convCalc .mainCalc, .userMenu {
		position: absolute;
		background: white;
		border-radius: var(--big-radius);
		box-shadow: var(--shadow);
		z-index:20;
		padding:0.75rem;
		top: 175%;
		font-weight:var(--font-light);
	}
	
	#staffSearch, #productSearch, #glossarySearch, #convCalc {
		z-index:19;
		position:fixed;
		top:0;
		left:0;
		width:100%;
		height:100%;
		background: rgba(90, 90, 90, 0.36);
		overflow: hidden;
		color: var(--dark-blue);
	}
	#convCalc .mainCalc, #staffSearch .mainSearch, #productSearch .mainSearch, #glossarySearch .mainSearch {
		background-color: #fff;
		padding: 1.2rem 1.75rem;   
		width: 80vw;
		max-width: calc(var(--max-width) * 0.6);
		left: 50%;
		top: 10vh;
		transform: translateX(-50%);
	}
	#staffSearch .mainSearch, #productSearch .mainSearch, #glossarySearch .mainSearch {
		padding:1rem;
	}
	#convCalc .mainCalc, #StaffSearchResults, #ProdSearchResults, #GlossarySearchResults {
		max-height: calc(80vh - 8rem);
		overflow-y: auto;
	}
	#convCalc .fas, #staffSearch .fas, #productSearch .fas, #glossarySearch .fas {
		color:var(--dark-blue);
		font-size:1.25rem;
	}
	#convCalc .Button {
		border-radius: 0;
	}
	#convCalc span {
		display:inline-block; width:7rem;
	}
	#convCalc div.DropDown, #convCalc input[type=text] {
		background-color: #fff; border: var(--border);
	}
	#convCalc .in {
		box-shadow:var(--tiny-shadow-inset);
	}
	#convCalc sup {font-size:0.7em;vertical-align:top;}
	
	#convCalc .UCform {
		display: flex;
		align-content: center;
		align-items: center;
		column-gap: 1rem;
	}
	#convCalc .accordion .header {
		text-align: center;
		font-weight: var(--font-bold);
	}
	#topbar .userMenu a {
		color:var(--dark-blue);
	}
		
	/* My Profile Box
	----------------------------------------------------------------------------------------------------*/
	#MyProfileBoxTopContainer, #MyProfileBoxTopContainerOnly, #MyProfileBoxBottomContainer {
		background:#ecf2f5;
		position:relative;
		height:65px;
		border-bottom:solid 1px #0073ac;
		}
		
	#MyProfileBoxTopContainerOnly, #MyProfileBoxBottomContainer {
		border-bottom:solid 4px #0073ac;
		}
		
	#MyProfileBoxTopContent, #MyProfileBoxMiddleContainer, #MyProfileBoxBottomLeftContent {
		position:relative;
		left:40px;
		text-align:left;
		}
		
	#MyProfileBoxTopContent2 {
		position:relative;
		top:10px;
		right:10px;
		text-align:right;
		}
		
	#MyProfileBoxMiddleContainer {
		width:210px;
		height:auto;
		padding:20px 0px;
		padding-right:20px;
		}
		
	#MyProfileBoxBottomLeftContent {
		top:13px;
		width:  40px;
		float: left;
		}
		
	#MyProfileBoxBottomRightContent {
		position:relative;
		float:right;
		top:25px;
		right:110px;
		}
	
	.MyProfileBoxText {
		font-size:14px;
		color:#909092;
		line-height:125%;
		}
		
	.Name {
		font-family:Verdana, Arial, Helvetica, sans-serif;
		font-size:15px;
		font-weight:bold;
		color:#0a2d6d;
		}
		
	.AdminTitle{
		color:#0a2d6d;
		Font-size:24px;
	}
		
	/* Left Menu
	----------------------------------------------------------------------------------------------------*/
	/* #HomeWelcome {		 
		margin-top: 2rem;
		font-size: 2rem;
		line-height:110%;
		font-weight: var(--font-light);
		padding-left: 0.5rem;
		border-left: 0.2rem solid #475569;
		width: calc(100% - 5rem);
	}*/
	#MenuWelcome {
		/*position: absolute;
		top: 30vh;*/
		margin-top: 2rem;
		font-size: 2.5rem;
		line-height:110%;
		font-weight: var(--font-light);
		padding-left: 0.5rem;
		border-left: 0.2rem solid var(--magenta);
		width: calc(100% - 5rem);
	}
	.menuAd {
		margin-top:2rem;
		overflow-x: hidden;
	}
	.menuAd img {
		width: 100%;
	}
	#LeftMenuContainer {
		position:relative;
		/*left:40px;*/
		width:100%;
		height:auto;
		text-align:left;
		padding:50px 0px;
		}
		
	#LeftMenuContainer table {
		width:100%;
	}
	
	td.leftMenuItem, div.SecondaryLevelMenuItemContainer, .userMenu div, .orderMenuLink {
		border-bottom:var(--border);
	}
	
	td.leftMenuItem, div.SecondaryLevelMenuItem, div.SecondaryLevelMenuItemOn, .userMenu div {
		padding:0.75rem;
	}
	
	td.leftMenuItem a, div.SecondaryLevelMenuItemContainer, a.SecondaryLevelMenu {	
		color:var(--dark-grey);
		/*font-weight:var(--font-med);*/
		text-decoration:none;
	}
	
	.SecondaryLevelMenuItemContainer i.fa {
		padding: 0 0.5rem;
	}
	
	td.leftMenuItem table {
		margin-left: 0.5rem;
		border-left: 0.5rem solid transparent;
	}
	
	td.leftMenuItem table a {
		color:var(--dark-blue);
		font-weight:normal;
		text-decoration:none;	
	}
	
	
	td.leftMenuItem.active.hasMenu, .SecondaryLevelMenuItemContainer.hasMenu {
		border-bottom:none;
		padding-bottom:0;
	}
	
	td.leftMenuItem .active a, td.leftMenuItem a.active, .LeftMenuLevel1.active, .LeftMenuLevel01.current, .active a.LeftMenuLevel02 {
		color:var(--magenta);
		font-weight:var(--font-bold);
	}
	
	#menuCompanyName, .orderMenuLink .arrow, td.leftMenuItem .active, .LeftMenuLevel1.active, a.LeftMenuLevel02.active, .LeftMenuItemLevel02.active {
		position:relative;
	}
	
	#menuCompanyName:after, td.leftMenuItem .active.arrow a:after, .orderMenuLink .arrow:after {
		float: right;
		content: var(--arrow-right);
		font-size: 1.25rem;
		font-weight: var(--font-bold);
		line-height: 0.5rem;
		transform: translateY(-50%);
		position: absolute;
		right: 0.5rem;
		top: 50%;
		font-family: var(--font-awesome);
	}
	.orderMenuLink > .arrow:after {
		right: -0.5rem;
	}
	
	.orderMenuLink a + div, .orderMenuLink a + table {
		display:none;
	}
	
	.orderMenuLink a.hasMenu + div {
		display:block;
	}
	.orderMenuLink a.hasMenu + table {
		display:table;
	}
	
	.orderMenuLink a.hasMenu + div:last-child, .orderMenuLink a.hasMenu + table tr:last-child td {
		padding-bottom:0;
		border-bottom: 0;
	}
	.orderMenuLink a.hasMenu + div:last-child .arrow:after, .orderMenuLink a.hasMenu + table tr:last-child .arrow:after {
		transform: translateY(0%);
	}
	#menuCompanyName {
		border-bottom:var(--border);
		padding:0.75rem 0;
		padding-right: 1.5rem;
		color:var(--dark-blue);
		font-weight:var(--font-med);
	}
	
	.open #menuCompanyName:after {
		content:var(--arrow-down);
	}
	
	#menuCompanyInfo {
		display:none;
		padding: 1rem;
		line-height: 120%;
		color: var(--dark-blue);
	}
	
	.open #menuCompanyInfo, .orderMenuLink > a {
		display:block;
	}
	
	td.LeftMenuItemLevel02 {
		padding:0.5rem 0;
		padding-right:1rem;
		border-bottom:var(--border);
	}
		
	#orderMenu {
		border-top:var(--border);
		padding-left:2rem;
	}
	
	.orderMenuLink {
		padding: 0.5rem 0;
		padding-right:1rem;
	}		
	
	.orderMenuLink > table, .orderMenuLink > div {
		margin-top:0.5rem;
		margin-left:1rem;
		border-top:var(--border);
	}
	
	.orderMenuLink > img {
		display:none;
	}
		
	td.OrderOnlineItemOn {
		height:14px;
		padding-left:18px;
		border-bottom:dotted 1px #ccc;
		width:100%;
		background: #ecf2f5;
		vertical-align:middle;
		font-weight:var(--font-bold);
		}
		
	.orderMenuLink a, a.LeftMenuLevel02 {
		color:var(--dark-blue);
		font-weight:normal;		
	}
	
	.orderMenuLink a.active {
		color:var(--grey);
	}
	
	td.leftMenuItem a:hover, .orderMenuLink a:hover, a.LeftMenuLevel02:hover {
		color:var(--blue);
	}
		
	/* Half page template */
	.hasPromo, .centerContent {
		display: grid;
		height: 100%;
	}
	.hasPromo {
		align-content: space-between;
	}
	.hasPromo > div {
		padding: 2rem;
	}
	.hasPromo .promos, .centerContent .bgFooter {
		display: grid;
		grid-auto-flow: column;
		grid-column-gap: 1rem;
		/*height: 20vh;*/
		background-image: url('/images/quarter-bg.png');
		background-position: center;
		background-size: cover;
		background-color: var(--bg-blue);
	}
	.hasPromo .promos .promo {
		background-size: cover;
		background-position: center;
		overflow:hidden;
	}
	.hasPromo .promos .promo img {
		object-fit: cover;
		width: 100%;
		display: flex;
		justify-content: stretch;
	}
	.centerContent .bgFooter {
		align-self: end;
		height: 25vh;
	}
	.centerContent {
		position: relative;
	}
	.centerContent .content {
		position: absolute;
		box-shadow: var(--shadow);
		border-radius: var(--border-radius);
		background-color: #fff;
		padding: 3rem 6rem;
		left: 50%;
		top: 50%;
		transform: translate(-50%, -50%);
		display: flex;
		flex-direction: column;;
	}
	/* Login */
	.loginPage {
		display: grid;
		grid-template-rows: auto 1fr auto;
		height: 100vh;
	}
	.loginPage::before {
		content:"";
		position:fixed;
		top:0;
		left:0;
		width:100%;
		height:100%;
		background: linear-gradient(to right, white 40%, transparent), url('/images/360ShowServices4-08.jpg');
		background-position-x: right;
		background-size: cover;
		filter:blur(3px);
		z-index:-1;
	}
	.loginPage h1, .loginPage h2 {
		margin: 1rem 0;
	}
	#loginTop {
		background:white;
		padding: 2rem;
		box-shadow: 0 0.5rem 0.5rem 0px rgb(0 0 0 / 15%);
		display: flex;
		justify-content: space-between;
		align-items: center;
	}
	.loginMenu {
		margin-left: 3.5rem;
		display:flex;
		justify-content:flex-end;
		align-items: center;
		grid-gap: 3.5rem;
	}
	#loginTop .contact, .loginMenu a {
		padding: 0.5rem 0.75rem;
		color: var(--dark-blue);
		text-transform: uppercase;
		font-size: 1.25rem;
		font-weight: var(--font-light);
		text-align: right;
	}
	.loginMenu a:hover { color: var(--grey); }
	#loginTop .contact {
		background-color:var(--dark-blue);
		border-radius:var(--border-radius);
		color:white;
	}
	#loginTop .contact:hover, #loginBody .loginLinks a:hover {
		background-color:var(--light-blue);
	}
	#loginBanner {
		/*height: 8rem;
		border-bottom: 0.5rem solid;
		border-color:var(--dark-blue);
		background: linear-gradient(var(--dark-blue),var(--grey-blue));
		display:none;*/
		height:200px;
		padding: 0 2rem;
		display: flex;
		align-items: center;
	}
	#loginBanner h1 {
		color: white;
		font-weight: var(--font-light);
	}
	#loginWelcome {
		position:relative;
		display:none;
	}
	#loginWelcome .welcome {
		position: absolute;
		display: flex;
		font-size: 3rem;
		top: -3rem;
		left: 2rem;
		height: 6rem;
		line-height:1;
		width: calc(50% - 4rem);
		align-items: center;
		justify-content: center;
		text-align:center;
		background: var(--dark-blue);
		color: white;
		font-weight: 300;
	}
	#loginBody {
		display: grid;
		grid-template-columns: 1fr 1fr;
		/*margin-top: 6rem;*/
		/*align-self: center;*/
	}
	#loginForm, #loginEvt {
		justify-self: center;
		width: 33rem;
	}
	#loginBody form {
		display: grid;
		grid-template-rows: repeat(5,minmax(3rem, auto));
		align-content: space-between;
		row-gap: 0.75rem;
		width: 25rem;
	}
	#loginAd {
		margin: 0 3rem;
		display: flex;
		align-items: flex-start;
		justify-content: center;
	}
	#loginAd img {
		box-shadow:var(--half-shadow);
		width:40rem;
	}
	
	#loginBody {
		grid-template-columns: 1fr;
	}
	.loginPage::before {
		background: linear-gradient(to right, white, transparent 90%), url('/images/360ShowServices4-07.jpg');
		background-position-x: right;
		background-position-y: center;
		background-size: cover;
		filter:blur(5px) grayscale(1);
	}
	#loginEvt {
		display: none;
	}
	#loginForm, #loginEvt {
		padding: 3rem;
		border-radius: 0.5rem;
		/*box-shadow: var(--shadow);*/
		background: rgba(255,255,255);
	}
	.custom-login
	{
		background: var(--loginBg);
	}
	.custom-login #loginBanner {
		display:none;
	}
	.custom-login #loginContainer {
		border-radius: 0.5rem;
		/*box-shadow: var(--shadow);*/
		width: 66rem;
		justify-self: center;
		/*background: white;*/
	}
	.custom-login #loginForm, .custom-login #loginEvt {
		border-radius:0;
		background: none;
		box-shadow:none;
	}
	.custom-login #loginEvt {
		display:block; align-items:center;
	}
	#loginEvt .poster {
		width:100%; max-height:25rem; object-fit:contain;
	}
	#loginForm form {
		width:auto;
	}
	.loginAd {
		display: none;
	}
	#loginBody p {
		color: var(--grey);
		line-height:150%;
	}
	#loginBody .loginLinks a {
		color: var(--dark-blue);
		text-decoration: underline;
		font-weight: var(--font-med);
		margin-right: 3rem;
	}
	.loginPage footer {
		grid-area: auto;
	}
	.ForgotPassword {
		text-align: center;
		align-self: center;
	}
	/* Add Show
	----------------------------------------------------------------------------------------------------*/
	#AddShowContent {
		position:relative;
		left:40px;
		width:210px;
		height:auto;
		text-align:left;
		padding:50px 0px;
		padding-right:30px;
		}
		
	#AddShowBottom {
		text-align:right;
		padding-right:20px;
		}
		
	p.AddShowText {
		font-size:15px;
		color:#909092;
		}
		
	.AddShowFieldName {
		font-size:15px;
		color:#0a2d6d;
		}
		
	.AddShowField {
		background:#ecf2f5;
		height:24px;
		border:solid 1px #aacbdb;
		width:190px;;
		}
		
	.AsteriskOrange {
		font-size:17px;
		font-weight:var(--font-bold);
		color:#d37826;
		}
		
	.AsteriskExplain {
		font-size:11px;
		color:#d37826;
		}
		
	/* Footer
	----------------------------------------------------------------------------------------------------*/
	footer {
		grid-area: footer;
		width: 100%;
		text-align:center;
		background-color: var(--dark-blue);
		font-size: 0.85rem;
		color: var(--light-grey);
	}
	footer > div {
		margin: 1.5rem auto;
	}
	footer a {
		color: var(--light-grey);
	}
	footer a:hover {
		color: var(--light-grey);
		text-decoration: underline;
	}
	footer .fab {
		border: 1px solid;
		border-color: var(--light-grey);
		font-size: 1.5rem;
		width: 2.9rem;
		line-height: 2.9rem;
		margin-right: 0.5rem;
	}
	footer .fab:hover {
		background:var(--bg-grey);
		color: var(--dark-blue);
		text-decoration: none;
	}
	/* Links
	----------------------------------------------------------------------------------------------------*/
	a.TopGenericMenu {
		color:#909092;
		text-decoration:none;
		}

	a.TopGenericMenu:hover {
		color:#035c8d;
		text-decoration:underline;
		}
		
	a.TopLevelMenu {
		color:var(--dark-blue);
		/*font-weight: var(--font-light);*/
		text-decoration:none;
	}
	
	a.TopLevelMenu:hover {
		color:var(--blue);
		/*font-weight: var(--font-light);*/
		text-decoration:none;
	}
	
	a.SecondaryLevelMenu:hover {
		color: var(--blue);
		text-decoration:none;
		}
		
	a.UpdateProfile {
		font-size:13px;
		color:#0073ac;
		text-decoration:none;
		}
	
	a.UpdateProfile:hover {
		color:#909092;
		}
		
	a.MyProfile {
		font-size:18px;
		color:#0073ac;
		text-decoration:none;	
		}
	
	a.MyProfile:hover {
		color:#909092;
		}
		
/* SEARCH EVENTS */
.searchEvents {
	display:flex;
	gap: 1rem;
    align-items: stretch;
    padding: 0 15%;
    flex-direction: column;
}
.searchEvents input[type=text], input.padded {
    padding: 1rem;
}

.searchEvents .date {
    display: flex;
    align-items: stretch;
    justify-content: center;
}

.searchEvents img.ui-datepicker-trigger {
    padding: 0.8rem;
}

.searchEvents input.hasDatepicker {
    width: 100%;
}

.searchEvents .buttons {
	grid-column: span 2;
	display: flex;
    flex-direction: column;
    row-gap: 1rem;
    width: 40%;
	margin: auto;
}
/* News */
/*.NewsContainer {
	width: calc(50% - 2rem);
}*/
.NewsContainer:nth-child(n+2) {
	margin-left:0.75rem;
	margin-right:1.25rem;
}
.NewsContainer:nth-child(2n+2) {
	margin-left:1.25rem;
	margin-right:0.75rem;
}
.NewsContainer:nth-child(-n+30) {
	width:100%;
    margin: 0 0.75rem;
}
.NewsContainer:nth-child(n+31) .NewsTitle, .NewsContainer:nth-child(n+31) .NewsText {
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
	word-break: keep-all;
	overflow: hidden;
}
.NewsContainer:nth-child(n+31) .NewsText {
	-webkit-line-clamp: 3;
}
.NewsTitle {
	font-size: 1.25rem;
	font-weight: var(--font-bold);
	margin: 0.5rem 0;
}
.NewsContainer:nth-child(n+31) .NewsTitle {
	height:calc(1em*1.2*2);
}
.NewsDate {
	color:var(--grey);
}
.NewsTitle, .NewsDate {
	line-height:120%;
}
.NewsFull {
	display:none;
	z-index: 1;
	justify-content: center;
    align-items: center;
}
.NewsFull .bg {
	background-color:rgba(0,0,0,0.9);
}
.NewsFull, .NewsFull .bg {
	position:fixed;
	top:0;
	left:0;
	width:100%;
	height:100%;
}
.NewsArticle {
	position: relative;
	background-color: white;
	width: 80vh;
	max-width: 95w;
	height:80vh;
	padding:0 2rem;
	overflow-y: scroll;
}
.NewsArticle:before, .NewsArticle .NewsClose {
	position:sticky;
	top:0;
	content: '';
	display: block;
	background: white;
	height:2em;
	width:100%;
}
.NewsArticle .NewsClose {
	bottom: 0rem;
	text-align: right;
}
.NewsClose a, .NewsFooter a {
	color:var(--magenta);
}
/* Event summary */
.eventSummary .currentDayOfWeek,.eventSummary .currentDate, .eventSummary .CurrTitle {
	margin: 0.5rem 0; 
}
.eventSummary .currentDate, .eventSummary .CurrTitle {
	padding: 0.5rem;
}
.eventSummary .currentDate {
	display:flex;justify-content: space-between;font-size: 1.25rem;/*font-weight: var(--font-bold);*/color:var(--magenta);padding:0.5rem 1rem;align-items: center;text-align:center;
}
.eventSummary .currentDayOfWeek, .eventSummary .currentDate a {
	color:var(--magenta);
}
.eventSummary .currentDayOfWeek {
	text-transform: uppercase; text-align:center;
}
.eventSummary .currentDate .day {
	color: var(--dark-grey);
	font-size: 1.75em;
}
.eventSummary .CurrTitle {
	/*font-weight: var(--font-light); */
	font-size: 1.5rem;
	/*border: var(--border);*/
	border-radius: var(--border-radius);
	background-color: var(--bg-grey);
	color:var(--dark-blue);
	margin-top: 1.5rem;
}
.eventSummary .CurrEvent {
	padding: 0.75rem 1rem;
	line-height: 150%;
	border-bottom: var(--border);
}	
.eventSummary .CurrEvent .EventLoc {
	color:var(--grey);
}
.eventSummary .CurrEvent .EventName {
	font-weight:var(--font-med);
}
/* -------------------------------------------------------------------------------------------------------
ADMIN LANDING PAGE (after login)
--------------------------------------------------------------------------------------------------------*/
	table.AdminHome {
		border-collapse:collapse;
		border-spacing:0px;
		}


/* -------------------------------------------------------------------------------------------------------
EXHIBITOR LANDING PAGE (after login)
--------------------------------------------------------------------------------------------------------*/

	/* My Upcoming Shows
	----------------------------------------------------------------------------------------------------*/
	#upcomingShows {
		display: grid;
		grid-gap: 2rem;
		align-content: stretch;
		margin-top: 2rem;
	}
	#upcomingShows a:hover {
		box-shadow: var(--shadow);
	}
	#upcomingShows .show {
		border-radius: var(--border-radius);
		box-shadow: var(--half-shadow);
		box-sizing: border-box;
		padding: 1rem;
		border-left: 0.75rem solid;
		border-color: var(--highlight);
		display: grid;
		grid-gap: 0.55em;
	}
	#upcomingShows .show.closed .notice {
		position: absolute;
		top: 0;
		bottom: 0;
		left: 0;
		right: 0;
		display: flex;
		justify-content: flex-end;
		align-items: center;
		z-index: 1;
		color: var(--magenta);
		font-size: 1.4rem;
		line-height: 150%;
		text-align: right;
		padding: 1rem;
		/*backdrop-filter: blur(1px);*/
	}
	#upcomingShows .show.closed {
		position: relative;
		filter: blur(1px);
	}/*
	#upcomingShows .show.closed:before {
		display: grid;
		content: 'show closed';
		text-align: center;
		position: absolute;
		left: -0.75rem;
		padding-right: 0.75rem;
		width: 100%;
		height: 100%;
		align-content: center;
		justify-content: center;
		background-color: rgba(0,0,0,0.1);
		color: black;
		font-size: 400%;
		font-weight: 900;
		opacity: 0.20;
		border-radius: var(--border-radius);
		font-style: italic;
		text-transform: uppercase;
	}*/
	#upcomingShows div {
		color:var(--grey);
		font-size:110%;
	}
	#upcomingShows .showTitle {
		color:var(--dark-blue);
		margin: 0.25em 0;
	}
	#upcomingShows a:hover .showTitle/*, #upcomingShows a:hover div*/ {
		color:var(--highlight);
	}
	#upcomingShows .showLocation {
		color:var(--dark-grey);
	}
	#upcomingShows .booths {
		display:grid;
		grid-template-columns: auto 1fr;
		grid-gap: 0.5rem;
	}
	#upcomingShows .booths label {
		font-weight: var(--font-med);
	}
	div.Content880	{
		position:relative;
	}
	
	/* Dividing Line Between Each of the Shows Listed
	----------------------------------------------------------------------------------------------------*/
	div.MyUpcomingShowsDivider {
		background:url(../gfx/bg-my-upcoming-shows-long.png) no-repeat;
		position:relative;
		width:860px;
		height:3px;
		}
	
	p.ExhibitorLanding {
		font-size:15px;
		color:#909092;
		line-height:130%;
		}
	
	/* Links
	----------------------------------------------------------------------------------------------------*/	
	a.MyUpcomingShows {
		font-size:15px;
		font-weight:var(--font-bold);
		color:#0a2d6d;
		text-decoration:none;	
		}
	
	a.MyUpcomingShows:hover {
		color:#909092;
		}
		
/* -------------------------------------------------------------------------------------------------------
SHOW INFORMATION PAGE
--------------------------------------------------------------------------------------------------------*/

	
	.popUp { margin:1rem; }
	.popUp .Content860BlueBG , .popUp .BlueGradientLine { padding-left:0; }
	.popUp div.Content860BlueBGC1 { margin-left:20px; width:55%; }
	.popUp div.Content860BlueBGC3 { display: none; }
	.popUp div.Content860BlueBGC2 { background: none; }
	
	/* Breadcrumb Container and Content
	----------------------------------------------------------------------------------------------------*/	
	/* for 2 rows event header */
	#Breadcrumb, #Breadcrumb2 {
		position:relative;
		/*z-index:10;*/
		padding: 0.5rem 0;
		/*margin-top: 1.5rem;*/
		margin-bottom:2rem;
		border-bottom:var(--border);
		color:var(--dark-blue);
	}
	
	#Breadcrumb .help, #Breadcrumb2 .help {
		position:absolute;
		right: 0.5rem;
	}
	
	#Breadcrumb .current, #BreadScrumb2 .current {
		font-weight:var(--font-med);
	}
	
	#Breadcrumb .current, #Breadcrumb2 .current, .Breadcrumb {
		padding: 0 0.75rem;
		line-height: 80%;
		display: inline-block;
	}
	
	.Breadcrumb {
		border-right:1px solid;
		border-color:var(--grey);
	}
	
	#Breadcrumb span:last-child, #Breadcrumb2 span:last-child {
		border-right:0;
	}
	
	.Breadcrumb a {
		color:var(--grey);
		text-decoration:none;
	}
	
	.Breadcrumb a:hover {
		color:var(--blue);
	}
	
	
	/* Table Containing Information About Selected Show
	----------------------------------------------------------------------------------------------------*/
	.accordion {
		border: 1px solid;
		border-color: var(--light-grey);
		border-radius: var(--border-radius);
		margin: 0.85rem 0;
	}
	.accordion > .header {
		background-color: var(--bg-grey);
		color: var(--dark-blue);
		font-weight: var(--font-bold);
	}
	.accordion > .header, .accordion > .body {
		padding: 0.85rem;
		font-size: 1rem;
	}
	.accordion > .body {
		border-top: 1px solid;
		border-color: var(--light-grey);
	}
	.accordion > .body.full {
		padding: 0.85rem 0;
	}
	.accordion > .body .header {
		font-weight: var(--font-med);
		margin-bottom: 0.75rem;
	}
	td.ShowInfoDetailLeft, .ShowInfoHead, td.ShowInfoDetailRight {
		font-size:1rem;
		line-height:100%;
	}
	
	td.ShowInfoDetailLeft {
		width:40%;
		padding:0.75rem 0;
		color:var(--dark-blue);
		}
		
	td.ShowInfoDetailRight {
		width:35%;
		padding:0.75rem 0;
		line-height:150%;
		}
		
	.ShowInfoHead {
		color:var(--dark-blue);
		padding-left: 0.85rem;
		background-image: url('../gfx/arrow-small-blue-white-bg.png');
		background-repeat: no-repeat;
		background-position: left top;
	}
	#event_overview .accordion {
		margin: 2rem 0;
	}
	#event_overview .accordion > .header {
		background-color: var(--bg-blue);
		padding-top: 0; padding-bottom: 0;
	}
	#event_overview .accordion .subHeader {
		margin-top: 0; margin-bottom: 0;
		padding-top: 0.5em; padding-bottom: 0.5em;
	}
	#event_overview .accordion > .body {
		background-color: white;
	}
	#event_overview .accordion > .header, #event_overview .accordion > .body {
		padding-left: 1rem;
		padding-right: 1rem;
	}
	#event_overview .accordion > .body h3 {
		margin-bottom: 0.5em;
	}
	/* Table Containing Date and Time Information About Selected Show
	----------------------------------------------------------------------------------------------------*/
	td.ShowInfoDatesHeader {
		width:100%;
		font-size:1rem;
		color:var(--dark-blue);
		padding:0.75 0;
	}
		
	td.ShowInfoDatesColumnHeader {
		width:33.3333%;
		font-size:1rem;
		color:var(--dark-blue);
		padding:0.5rem 0px;
		padding-left:1rem;
		}
		
	td.ShowInfoDates {
		width:33.3333%;
		font-size:1rem;
		padding:0.5rem 0px;
		padding-left:1rem;
	}
	#EventHeader {
		display:flex;
		flex-direction:column;
		justify-content: flex-end;
	}
	.ShowBasicInfo {
		display:flex;
		justify-content: space-between;
		column-gap:1.75rem;
		/*background: url(/images/HowManyShows.jpg),rgba(255,255,255,0.4);*/
		background-position: center center;
		background-size: cover;
		border-left: 2px solid var(--magenta);
		margin: 1rem 0;
	}
	.ShowLogo {
		box-shadow: var(--half-shadow);
		border-radius: var(--border-radius);
		display: flex;
		align-content: center;
		justify-content: center;
		max-width: calc(var(--max-width) * 0.2);
		padding: 0.5rem;
	}
	.GenericShowLogo {
		background: linear-gradient(45deg, rgb(111, 111, 111), rgb(75, 77, 80));
		display: flex;
		align-items: center;
		justify-content:center;
		font-variant: small-caps;
		color: #fff;
		font-weight: var(--font-light);
		padding: 0.5rem;
		width:20vw;
	}
	.ShowInformation {
		width: 100%;
		align-content: center;
		row-gap: 0.5rem;
		display:flex;
		flex-direction:column;
	}
	.ShowInformation, .ShowInternalInfo {
		margin: 1rem 0;
	}
	.ShowBasicInfo .ShowInformation, .ShowBasicInfo .ShowInternalInfo {
		margin:0;
	}
	.ShowInternalInfo {
		width:16rem;
		order:1;
		flex-direction: initial;
		align-self: flex-end;
		justify-content: flex-end;
		display:grid;
		row-gap: 0.5rem;
		margin-right: 1rem;
	}
	
	.ShowExhiInfo {
		display:flex;
	}
	.ShowExhiInfo {
		justify-content: space-between;
	}
	.ShowInformation p, .ShowInternalInfo p, .ShowExhiInfo p {
		margin: 0.5rem 0;
		order:1;
	}
	.ShowInfoTitle {
		font-size: 1.15rem;
		line-height: 130%;
		font-weight: var(--font-med);
	}
	#EventHeader .ShowInfoTitle .ShowName {
		font-size: 2rem;
		font-weight:var(--font-med);
		display: block;
		line-height: 120%;
	}
	.ShowInformation .ShowInfoDates, .ShowInfoTitle a.ShowName, .ShowInfoLocation, .ShowInternalInfo {
		color:white;
		color: var(--dark-blue);
		font-weight:var(--font-light);
		/*text-align:center;*/
	}
	.ShowInformation .ShowInfoDates, .ShowInfoTitle a.ShowName, .ShowInfoLocation, .ShowInternalInfo {
		margin-left:1rem;
	}
	.ShowInformation .ShowInfoDates, .ShowInfoLocation, .ShowInternalInfo, .ShowExhiInfo .ShowBooths, .ShowExhiInfo .notice {
		font-size:1.25rem;
		font-weight:var(--font-light);
	}
	.ShowExhiInfo .ShowBooths {
		width: 35vw;
		max-width: 35%;
		padding-left: 1rem;
		border-left: 2px solid var(--magenta);
	}
	.ShowExhiInfo .notice {
		text-align: right;
		line-height: 125%;
		color: var(--magenta);
	}
	.ShowBooths, .ShowCartTotal, #upcomingShows .ShowInfoTitle a {
		color: var(--dark-blue);
	}
	
	.ShowContact {
		color:var(--dark-grey);
	}
	/*
	.ShowInfoLocation {
		order: 3;
	}*/
	.ShowCartTotal {
		text-align:right;
	}
	.ShowBooths, .ShowCartTotal { font-weight:var(--font-bold);
		position:relative; }
	.boothNo { 
		display:block; font-weight: normal; 
	}
	.ShowCartTotal .CartTotal {
		font-weight: var(--font-bold);
		color: var(--dark-blue);
		background: white;
		border: var(--border);
		border-color: var(--blue);
		text-align: right;
		margin-top: 0.25rem;
		padding: 0.35rem 0.75rem;
		width: 15rem;
		display: block;
	}
	.hasDollarOverlay {
		position:relative;
	}
	.hasDollarOverlay:after, .ShowCartTotal:after {
		content:"$";
		position:absolute;
		bottom:calc((100% - 1rem) / 2);
		line-height:100%;
		left:0.75rem;
	}
	.hasDollarOverlay input {
		text-indent: 1rem;
	}
	.ShowCartTotal:after {
		top:2em;
		left:1rem;
	}
		
/* -------------------------------------------------------------------------------------------------------
ORDER ONLINE PAGE
--------------------------------------------------------------------------------------------------------*/
	
	.prodTypes, .prodGroups, .prodList {
		display: grid;
		grid-template-columns: repeat(4, 1fr);
		grid-column-gap: 4.5rem;
		grid-row-gap: 2.5rem;
		margin: 2rem 0;
	}
	.prodTypes {
		grid-template-columns: repeat(3, 1fr);
		grid-column-gap: 3.5rem;
		grid-row-gap: 2.5rem;
	}
	.prodGroups .OrderOnline, .prodList .Product, .prodTypes .type {
		border: 1px solid;
		border-color: var(--light-grey);
		border-radius: var(--border-radius);
		display: flex;
		flex-direction: column;
	}
	.prodList .Product {
		border: 0px;
	}
	.prodGroups .OrderOnline:hover, .prodList .Product:hover, .prodTypes .type:hover {
		box-shadow: var(--half-shadow);
	}
	.prodGroups .itemText, .prodList .itemText, .prodTypes .itemText {
		border-top: 1px solid;
		border-color: transparent;
		color:var(--dark-blue);
		font-weight:var(--font-med);
		text-align:center;
		padding:0.5rem 2.5rem;
		height:100%;
		border-bottom-left-radius: var(--border-radius);
		border-bottom-right-radius: var(--border-radius);
	}
	.prodGroups .sq, .prodList .sq, .prodTypes .sq {
		border: 1px solid;
		border-color: var(--light-grey);
		border-top-left-radius: var(--border-radius);
		border-top-right-radius: var(--border-radius);
	}
	.prodTypes .sq::before {
		padding-bottom: 60%;
	}
	.prodTypes .itemText {
		padding-top: 1.25rem;
		padding-bottom: 1rem;
		background-color:var(--bg-grey);
	}
	.prodTypes a:hover .itemText, .prodGroups a:hover .itemText {
		background-color:var(--yellow);
	}
	.prodTypes .fas, .prodGroups .itemText .fas {
		display:block;
		line-height: 1.25rem;
		color: var(--red);
	}
	.prodTypes .fas {
		margin-top: 0.75rem;
	}
	.prodTypes a:hover .fas, .prodGroups .itemText a:hover .fas {
		color: var(--dark-blue);
		font-size: 1.25rem;
	}
	.prodGroups .fas {
		margin-bottom: 0.5rem;
	}
	.prodGroups .icon {
		display:block;
		color:var(--magenta);
	}
	.prodList .itemText {
		background-color:var(--bg-blue);
	}
	/* Order Online Container for Products
	----------------------------------------------------------------------------------------------------*/
	div.OrderOnlineProducts, div.OrderOnlineProductsOpacity , div.OrderOnlineServices, div.OrderOnlineServicesOpacity, div.OrderOnlinePackages {
		position:relative;
		float:left;
		width:280px;
		}
		
	.links .OrderOnlineProducts, .links  .OrderOnlineServices, .links  .OrderOnlinePackages {
		left: 40px;
	}
		
	/* SH 20/08/2013 */
	div.OrderOnlineProductsOpacity {
		opacity: .3; /* for all other browsers */
		-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=30)"; /* for IE8 */
		filter: alpha(opacity=30); /* for IE5-7 */
		}
	
	/* Order Online Container for Services
	----------------------------------------------------------------------------------------------------*/
	/* SH 20/08/2013 */
	div.OrderOnlineServicesOpacity {
		opacity: .3; /* for all other browsers */
		-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=30)"; /* for IE8 */
		filter: alpha(opacity=30); /* for IE5-7 */
		}
	.serviceBlock li, .serviceGrid .accordion li {
		list-style: outside;
		margin-left: 1.5rem;
		line-height: 1.35;
		margin-bottom: 0.25rem;
	}
	.serviceGrid {
	    display: grid;
		grid-template-columns: 2fr 1fr;
		column-gap: 4.5rem;
	}
	.serviceGrid .accordion {
		border: none;
	}
	.serviceGrid .accordion > .header {
		border: var(--border-color);
		border-color: var(--blue);
		background-color: var(--blue);
		color: #fff;
		border-top-left-radius: var(--border-radius);
		border-top-right-radius: var(--border-radius);
	}
	.serviceGrid .accordion > .body {
		border: var(--border);
		border-bottom-left-radius: var(--border-radius);
		border-bottom-right-radius: var(--border-radius);
	}
	.serviceFrm {
		width: 100%;
		color:var(--dark-blue);
	}
	.serviceFrm thead>tr td {
		font-size: 1rem;
		padding: 0.5rem 0;
		font-weight: var(--font-bold);
	}
	.serviceFrm tr td:first-child {
		width:30%;
	}
	.serviceFrm.sectioned tbody>tr td:first-child, .serviceFrm tbody.section>tr td:first-child {
		padding-left: 2rem;
	}
	.serviceFrm.sectioned tbody.section>tr td:first-child {
		padding-left: 4rem;
	}
	.formRight {
		text-align: right;
	}
	.formGrid {
		column-gap: 2rem;
	}
	.serviceFrm div.DropDown select {
		width:100%;
	}
	.serviceNote p {
		line-height: 130%;
		margin: 1rem auto;
	}
	.serviceNote strong {
		color: var(--dark-blue);
	}
	.service td {
		padding-top: 2px;
		padding-bottom: 2px;
	}
	
	.ServiceFirst td, .serviceAlpha td {
		padding-top: 7px;
	}
	
	.ServiceLast td, .serviceOmega td {
		padding-bottom: 7px;
	}
	
	.ServiceTotal, .ServiceTotal input {
		color:#d37826;
		/*font-weight: bold;*/
	}
	
	.serviceFooter {
		background-color: #ecf2f5;
		padding: 2px 12px;
	}
	
	.serviceFooter, .serviceFooter p, .serviceDesc p {
		margin: 10px 0;
	}
	
	.serviceFooter strong, .serviceDesc strong, .serviceSub {
		font-weight: var(--font-bold);
	}
	
	.serviceDesc, .estimate > .block p, .service .accordion > .body { line-height:130%; }
	.serviceDesc ul { list-style-position: outside; }
	
	.service select {
		/*border: 1px solid;
		color: #000;*/
		margin-left: 0;
	}
	
	.formID {
		font-size: smaller;
	}
	
	.note {
		font-size: smaller;
		color: var(--grey);
	}
		
	/* Order Online Category Name Blue
	----------------------------------------------------------------------------------------------------*/	
	div.OrderOnlineCategoryName {
		position:relative;
		font-size:20px;
		color:#0073ac;
		}
		
	/* Order Online Category Content
	----------------------------------------------------------------------------------------------------*/	
	div.OrderOnlineCategoryContent {
		position:relative;
		line-height:200%;
		}
	
	/* Links
	----------------------------------------------------------------------------------------------------*/
	a.OrderOnline {
		font-size:14px;
		color:#909092;
		text-decoration:none;	
		}
	
	a.OrderOnline:hover {
		color:#0073ac;
		}
		
/* -------------------------------------------------------------------------------------------------------
ORDER ONLINE CATEGORIES PAGE
--------------------------------------------------------------------------------------------------------*/
	
	/* Current Shopping Cart Total Container
	----------------------------------------------------------------------------------------------------*/
	#CurrentShoppingCartContainer {
		background:url(../gfx/bg-shopping-cart-orange.png) no-repeat;
		background-position: bottom center;
		background-size: 100% auto;
		position:relative;
		left: 5%;
		width: 90%;
		height:135px;
		}
		
	#CurrentShoppingCartHeader {
		position:relative;
		text-align:center;
		top:14px;
		text-align:center;
		}
		
	#CurrentShoppingCartAmountContainer {
		position:relative;
		top:25px;
		padding: 0 5%;
		}
		
	input.CurrentShoppingCartAmount {
		font-size:16px;
		font-weight:var(--font-bold);
		color:#d37826;
		border:0px;
		text-align:center;
		padding:5px 0px;
		width: 100%;
	}
		
	a.CurrentShoppingCartTotal {
		font-size:14px;
		color:#fff;
		text-decoration:none;	
		}
	
	a.CurrentShoppingCartTotal:hover {
		color:#0073ac;
		}
		
/* -------------------------------------------------------------------------------------------------------
ORDER ONLINE PRODUCTS PAGE
--------------------------------------------------------------------------------------------------------*/
	
	.prod {
		display:flex;
		column-gap: 2rem;
		margin: 2em 0;
	}
	
	.prodRow {
		display:grid;
		grid-template-columns: 1fr 2fr;
		margin: 1rem 0;
	}
	
	.prod .addToCart {
		display:flex;
		justify-content: flex-end;
	}
	
	.prod .prices {
		border-top:var(--border);
	}
	.prod .prodSection {
		margin-top:1rem;
	}
	
	.prod .addToCart, .prod .addonList {
		margin:2rem 0;
	}
	.prodRow > div:nth-child(2n) {
		justify-self: flex-end;
	}
	.prod .prodImg, .prod .prodDetail {
		width:40%;
		display:flex;
		flex-direction: column;
	}
	.prod .prodImg .img, .prod .prodImg a, .prod .propSelect .DropDown, .prod input[type=text], .prod textarea {
		border: var(--border);
		border-color: var(--light-grey);
		border-radius: var(--border-radius);
		background: white;
	}
	.prod .prodImg .img, .prod .prodImg a {
		display: block;
		padding: 0.5rem;
	}
	.prod .prodImg .img {
		box-shadow:var(--half-shadow);
		display: grid;
		max-height: 40vw;
	}
	.prodImg .img img {
		grid-area: 1 / 1 / 2 / 2;
		width: 100%;
		height: 100%;
		object-fit: scale-down;
	}
	.prod .prodImg a {
		color: var(--dark-blue);
		font-size: 0.75rem;
		text-align: center;
		margin-top:-1px;
		padding: 1rem;
	}
	.prod input[type=checkbox]+label {
		padding-left:0.5rem;
	}
	.prod .addOn > div {
		margin-left: 2rem;
	}
	
	.prod .addOn .prodRow {
		margin-top: 0.5rem;
		margin-bottom: 0.5rem;
	}
	
	.prod .ProductDescriptionCenter {
		color:var(--grey);
	}
	
	.prod input[type=text], .prod textarea {
		box-shadow:var(--half-shadow-inset);
	}
	.prod .propSelect .DropDown {
		display: block;
		box-shadow:var(--half-shadow);
	}
	
	.prod .propSelect select {
		width:100%;
	}
	
	.prod .ProductDescriptionLeft, .prod .prices .ProductDescriptionCenter, .prod .prices input[type=text] {
		color: var(--dark-blue);
	}
	
	.prod .Total, .prod .prices .TotalAmount input[type=text], .prod .ProductDescriptionLeft, .prod .prices .ProductDescriptionCenter {
		font-weight:var(--font-med);
	}
	
	.prod .prices .ProductDescriptionLeft {
		font-weight:normal;
	}
	
	.prod .ProductDescriptionLeft {
		padding-top: 0.5rem;
	}
	
	.prod .prices .ProductDescriptionLeft {
		padding-top: 0;
	}
	
	.prod .prices input {
		text-align: right;
		padding: 0;
		border: none;
		box-shadow: none;
	}
	/* Table Containing Product Images and Descriptions (1 row)
	----------------------------------------------------------------------------------------------------*/
	table.ProductsContainer {
		width:860px;
		text-align:center;
		padding-bottom:5px;
		}	
	
	/* Table Containing Product Image and Description
	----------------------------------------------------------------------------------------------------*/
	table.ProductView {
		width:215px;
		text-align:center;
		padding-bottom:5px;
		}
	
	/* Table Cells Containing Product Image
	----------------------------------------------------------------------------------------------------*/
	td.ProductImage {
		width:215px;
		text-align:center;
		padding-bottom:5px;
		}
		
	/* Table Cells Containing Product Details
	----------------------------------------------------------------------------------------------------*/
	td.ProductDetails {
		width:215px;
		vertical-align:top;
		padding-bottom:40px;
		}
		
	/* Product Details
	----------------------------------------------------------------------------------------------------*/
	div.ProductDetailsContainer {
		position:relative;
		left:25px;
		width:155px;
		overflow:hidden;
		}
		
	div.ProductArrow {
		position:relative;
		float:left;
		width:17px;
		}
		
	div.ProductArrowBlock {
		line-height:150%; 
		background-image:url('../gfx/arrow-medium-blue-white-bg.png'); 
		background-repeat:no-repeat;
		background-position: left 3px; 
		padding-left:17px;
	}
		
	div.ProductDetails {
		position:relative;
		float:left;
		width:138px;
		line-height:125%;
		}		
		
	/* Links
	----------------------------------------------------------------------------------------------------*/
	a.Product {
		font-size:13px;
		font-weight:var(--font-bold);
		color:#0a2d6d;
		text-decoration:none;	
		}
	
	a.Product:hover {
		color:#909092;
		}
		
/* -------------------------------------------------------------------------------------------------------
PRODUCT AND PACKAGE DESCRIPTION PAGE
--------------------------------------------------------------------------------------------------------*/

	/* Containers for Product Image, Product Description, Package Description
	----------------------------------------------------------------------------------------------------*/
	div.ProductImageMedium {
		position:relative;
		float:left;
		width:320px;
		text-align:left;
		}
		
	div.ProductDescriptionContainer {
		position:relative;
		float:right;
		width:520px;
		text-align:left;
		}
		
	div.ProductDescription {
		position:relative;
		line-height:150%;
		}
		
	.ProductDescriptionDarkBlue, .ProductDescriptionDarkBlue p {
		font-weight: normal;
		color:var(--dark-blue);
		line-height:125%;
		}
		
	table.ProductOrPackageDescription {
		border-collapse:collapse;
		border-spacing:0px;
		}
		
	td.ProductDescriptionLeft {
		font-weight:normal;
		padding:8px 0px; 
		}
		
	td.ProductDescriptionCenter {
		font-weight:normal; 
		padding:8px 0px;
		}
		
	td.ProductDescriptionRight {
		padding:8px 0px;
		}
		
	td.PackageDescriptionLeft {
		font-weight:normal;
		padding:8px 0px; 
		}
		
	td.PackageDescriptionCenter {
		font-weight:normal; 
		border-bottom:var(--border);
		padding:8px 0px;
		}
		
	td.PackageDescriptionRight {
		font-weight:normal;
		border-bottom:var(--border);
		padding:8px 0px;
		}
		
/* -------------------------------------------------------------------------------------------------------
NON-INVENTORY PRODUCTS DESCRIPTION PAGE - SH 19/08/2013
--------------------------------------------------------------------------------------------------------*/

	/* Containers for Non-Inventory Description
	----------------------------------------------------------------------------------------------------*/

div.NonInvDescriptionContainer {
		position:relative;
		float:left;
		width:860px;
		text-align:left;
		padding-left: 10px;
		}

.NonInvInputNumb{
		background: #ecf2f5;
		font-size: 12px;
		border: solid 1px #909092;
		text-align: right;
		padding: 2px 0px;
		}
.NonInvInput{
		background: #ecf2f5;
		font-size: 12px;
		border: solid 1px #909092;
		padding: 2px 0px;
		}
		
.NonInvTotalAmount{
		position:relative;
		float:left;
		font-size:13px;
		font-weight:var(--font-bold);
		color:#d37826;
		}
		
/* -------------------------------------------------------------------------------------------------------
INTERNAL PRODUCTS DESCRIPTION PAGE - SH 20/08/2013
--------------------------------------------------------------------------------------------------------*/

	/* Containers for Internal Product Description
	----------------------------------------------------------------------------------------------------*/

div.IntProdDescriptionContainer {
		position:relative;
		float:left;
		width:860px;
		text-align:left;
		padding-left: 10px;
		}

.IntProdInputNumb{
		background: #ecf2f5;
		font-size: 12px;
		border: solid 1px #909092;
		text-align: right;
		padding: 2px 0px;
		}
.IntProdInput{
		background: #ecf2f5;
		font-size: 12px;
		border: solid 1px #909092;
		padding: 2px 0px;
		}
		
.IntProdTotalAmount{
		position:relative;
		float:left;
		font-size:13px;
		font-weight:var(--font-bold);
		color:#d37826;
		}

/* -------------------------------------------------------------------------------------------------------
CUSTOM ORDERS DESCRIPTION PAGE - SH 21/08/2013
--------------------------------------------------------------------------------------------------------*/

	/* Containers for Custom Orders Description
	----------------------------------------------------------------------------------------------------*/

div.CustOrderDescriptionContainer {
		position:relative;
		float:left;
		width:860px;
		text-align:left;
		padding-left: 10px;
		}

.CustOrderInputNumb{
		background: #ecf2f5;
		font-size: 12px;
		border: solid 1px #909092;
		text-align: right;
		padding: 2px 0px;
		font-weight:normal;
		}
.CustOrderInput{
		background: #ecf2f5;
		font-size: 12px;
		border: solid 1px #909092;
		padding: 2px 0px;
		}
		
.CustOrderTotalAmount{
		position:relative;
		float:left;
		font-size:13px;
		font-weight:var(--font-bold);
		color:#d37826;
		}
		
 .CustOrderDescriptionContainer .MyCartC1{
	border-bottom: hidden;
}
		
.CustOrderDescriptionContainer .MyCartC2C3C4C5C6{
	border-top: dotted 1px rgba(204,204,204,0.4);
	border-bottom: none;
}
		
/* -------------------------------------------------------------------------------------------------------
REGISTRATION PAGES
--------------------------------------------------------------------------------------------------------*/

	/* Left Column
	----------------------------------------------------------------------------------------------------*/
	#RegisterBoxContainer {
		position:relative;
		left:40px;
		width:210px;
		height:auto;
		text-align:left;
		padding:20px 0px;
		padding-right:20px;
		}
		
	#RegisterBoxContainerBottom {
		position:relative;
		width:280px;
		border-bottom:solid 4px #0073ac;
		}
	
	.WelcomeToStroncoonline {
		font-size:15px;
		font-weight:var(--font-bold);
		color:#909092;
		line-height:115%;
		}
		
	a.NewUser {
		font-size:20px;
		font-weight:var(--font-bold);
		color:#0a2d6d;
		text-decoration:none;
		}
		
	a.NewUser:hover {
		font-size:20px;
		font-weight:var(--font-bold);
		color:#909092;
		text-decoration:none;
		}
		
	.RegisterBoxText {
		font-weight:normal;
		line-height:125%;
		}
		
	/* Right Column
	----------------------------------------------------------------------------------------------------*/
	div.RegisterFormSectionHeader {
		background:var(--dark-blue);
		font-size:1rem;
		color:#fff;
		padding:0.5rem;
		}
		
	td.RegisterStepOneLeft {
		width:140px;
		height:32px;
		font-size:13px;
		font-weight:var(--font-bold);
		color:#0a2d6d; 
		}
		
	td.RegisterStepOneRight {
		width:250px;
		height:32px;
		}
		
	p.Register {
		font-weight:normal;
		line-height:150%;
		}
		
	.RequiredField {
		font-weight:var(--font-bold);
		color:var(--red);
		}
		
	.RegistrationStep {
		color:var(--blue);
		}
		
/* -------------------------------------------------------------------------------------------------------
MY COMPANY INFORMATION PAGE
--------------------------------------------------------------------------------------------------------*/
	
	/* Edit Link Container
	----------------------------------------------------------------------------------------------------*/
	div.Edit {
		position:relative;
		float:right;
		top:0px;
		right:5px;
		}
		
	div.EditRemoveBooth {
		position:relative;
		float:right;
		top:0px;
		right:120px;
		}
		
	div.Add {
		position:relative;
		float:right;
		top:4px;
		right:155px;
		}
		
	div.BoothNotAvailableCheckBox {
		position:relative;
		float:left;
		bottom:5px;
		margin-right:4px;
		}
	
	/* Links
	----------------------------------------------------------------------------------------------------*/
	a.Edit {
		font-size:15px;
		color:#fff;
		text-decoration:none;	
		}
	
	a.Edit:hover {
		color:#d37826;
		}
		
	a.EditViewContact {
		font-size:1rem;
		color:#0073ac;
		text-decoration:none;	
		}
	
	a.EditViewContact:hover {
		color:#909092;
		}
	
/* -------------------------------------------------------------------------------------------------------
TERMS AND CONDITIONS PAGE
--------------------------------------------------------------------------------------------------------*/
	
	/* Content
	----------------------------------------------------------------------------------------------------*/
	.TermsConditions {
		margin-top:1em;
		margin-bottom:1em;
		line-height:125%;
	}
	
	p.TermsConditions {
		font-size:1rem;
		text-align:justify;
	}
		
	ul.TermsConditions {
		list-style-position:inside;
		text-indent: -1.35em;
		margin-left: 1.5em;
	}
	
	.TermsConditions li {
		margin-bottom: 0.5em;
	}
	
	.TermsConditions li::marker {
		width: 1.5em;
	}
		
/* -------------------------------------------------------------------------------------------------------
MY CART PAGES
--------------------------------------------------------------------------------------------------------*/
	
	/* My Cart - Step 1 - My Cart
	----------------------------------------------------------------------------------------------------*/
	
	#CartStepsContainer {
		display:grid;
		grid-template-columns: repeat(3, 1fr);
		column-gap:1rem;
		background: linear-gradient(to bottom, rgba(0,0,0,0) 0%,rgba(0,0,0,0) 40%,var(--bg-grey) 40%,var(--bg-grey) 60%,rgba(0,0,0,0) 60%,rgba(0,0,0,0) 100%);
	}
	
	#CartStepsContainer.half-active {
		display:grid;
		grid-template-columns: repeat(3, 1fr);
		column-gap:1rem;
		background: linear-gradient(to bottom, white 0%, white 40%,transparent 40%,transparent 60%,white 60%,white 100%), linear-gradient(to right, var(--highlight) 0%, var(--highlight) 50%, var(--bg-grey) 50%,var(--bg-grey) 100%);
	}
		
	.cartStep {
		border-radius: var(--border-radius);
		border: var(--border);
		border-color: var(--grey);
		background-color: var(--bg-grey);
		color: var(--grey);
		font-size: 1.15rem;
		font-weight: var(--font-med);
		padding: 0.3rem 1.5rem;
	}
	.cartStep.active {
		border-color: var(--blue);
		background-color: var(--bg-blue);
	}
	.cartStep.active, .stepName {
		color: var(--dark-blue);
	}
	.cartStep, .stepHeader {
		display: flex;
		justify-content: space-between;
		align-items: center;
		column-gap:1rem;
	}
	.stepHeader .stepIcon {
		width: 2.85rem;
		height: 2.85rem;
		border-radius: 50%;
		display: grid;
		align-items: center;
		justify-items: center;
		color: #fff;
		background-color: var(--grey);
	}
	.cartStep.active .stepIcon {
		color: var(--blue);
		background-color: #fff;
	}
	.stepHeader .stepText {
		font-size: 0.85rem;
	}

	.cartSaveChanges {
		background-color:#0073ac;
		font-weight: var(--font-bold);
		color: #FFFFFF;
		border: hidden;
		padding: 1px 5px;
		margin-top: 5px;
	}
	.cartPage .HeaderBlue, .cartPage .subHeader {
		color:black;
		margin: 1rem 0;
	}
	
	.cartOrderInfo {
		display:grid;
		grid-template-columns: 1fr 1fr 1fr;
		grid-column-gap: 0.5rem;
	}
	.cartOrderInfo > div {
		border-radius: var(--border-radius);
		border: var(--border);
		border-color: var(--light-grey);
		background-color:var(--bg-grey);
		padding: 0.75rem 1.25rem;
	}	
	.cartOrderInfo label {
		color: var(--dark-blue);
		font-weight: var(--font-bold);
		margin: 0.75rem 0;
		display: block;
	}
	.cartOrderInfo .DropDown {
		border-radius: var(--border-radius);
		border: var(--border);
		border-color: var(--light-grey);
		min-width: 60%;
	}
	.cartOrderInfo .DropDown select {
		width:100%;
	}
	table.MyCart, #confirmation #OrderList > table {
		width:100%;
		border-spacing:0px;
		border-collapse: separate;
		box-sizing: border-box;
		color:var(--dark-blue);
	}
	
	tr.itemDetails td, td.itemDetails {
		padding-top: 0; padding-bottom: 0;
	}
	
	td.MyCartCustomDetailsStart, .ServiceDetailsStart td {
		border-bottom: none;
	}
	
	.ServiceDetailsEnd {
		border-bottom: solid 1px #ccc;
	}
	
	.ServiceDetailsEnd:last-child {
		border-bottom: solid 1px #0073ac;
	}
	.MyCart td > .disc {
		display: flex;
		align-items: center;
		margin: auto 0.5rem;
	}
	.MyCart input, #confirmation .formTextarea {
		background-color:white;
		border:var(--border);
		box-shadow:var(--half-shadow-inset);
	}
	
	#confirmation .paymentInfo input[type="text"], #confirmation .paymentInfo .DropDown, #confirmation #ChangeOrder_Details .DropDown {
		background-color:var(--bg-grey);
		border:var(--border);
		color:var(--dark-blue);
	}
	#confirmation .paymentInfo input[type="text"] + .ui-datepicker-trigger {
		height:1.65rem;
	}
	#confirmation .paymentInfo #PrePaid_Balance, #confirmation .amounts span {
		display:inline-block;
		box-sizing: border-box;
		width:100%;
		padding:0.5rem;
		border-radius:var(--border-radius);
		border:var(--border);
	}
	#confirmation .paymentInfo #PrePaid_Balance, #confirmation .amounts .balance span {
		background-color:var(--bg-grey);
		border-color:var(--blue);
		color:var(--blue);
		font-weight:var(--font-bold);
	}
	#confirmation .amounts .balance label {
		color:var(--blue);
		font-weight:var(--font-bold);
	}
	#confirmation .paymentInfo .grid {
		grid-row-gap: 0.75rem;
		align-items: center;
	}
	#confirmation .paymentInfo > div > div, #ChangeOrder_Details > .grid > div > div {
		margin-bottom: 0.75em;
	}
	#ChangeOrder_Details > .grid > div > div {
		align-items: center;
	}
	.MyCart tr .tableCell:first-child::before, #confirmation #OrderList > table .FormContent:first-child::before, #confirmation #OrderList > table .FormContent:last-child::before, #confirmation #OrderList > table table .FormContent:nth-child(n+2)::before {
		border-right:none;
	}
	.MyCart tr .tableCell:nth-child(2)::before, #confirmation #OrderList > table .FormContent:nth-child(2)::before, #confirmation #OrderList > table table .FormContent:nth-child(n+2)::before {
		border-left:none;
	}
	#confirmation #OrderList > table .FormContent {
		padding: var(--cell-padding);
	}
	#confirmation #OrderList .OrderDetailsSubList .FormContent, #confirmation #OrderList .CustomOrderSubList table:first-child .FormContent {
		padding:0.5rem;
	}
	#confirmation #OrderList > table table .FormContent {
		padding: 0;
	}
	.MyCart .OrderDetailsSubList table:first-child td, .MyCart .CustomOrderSubList table:first-child td
	{ padding: 0.5rem 0; }
	.CartHead {
		border-radius:var(--border-radius);
	}
	.CartHead td, .ServiceHead td {
		font-weight:var(--font-bold);
	}
		
		
	table.MyCart2 {
		width:410px;
		border-collapse:collapse;
		border-spacing:0px;
		border-right:solid 1px #ccc;
		}
	.MyCart2 td {
		font-size: 13px;
	}
		
	td.MyCart2Left {
		/*font-size:13px;*/
		line-height:125%;
		color:#0a2d6d;
		vertical-align:top;
		width: 120px;
		padding: 5px 0px;
		background-image: url("../gfx/arrow-medium-blue-white-bg.png");
		background-position: 0px 5px;
		background-repeat: no-repeat;
		text-indent: 15px;
	}
		
	td.MyCart2Right {
		width:290px;
		/*font-size:13px;*/
		line-height:125%;
		color:#282828;
		vertical-align:top;
		padding: 5px 0px;
		}
		
	.pkgPopup {
		background-color: #ecf2f5;
	}
	
	.pkgPopup td {
		font-size: 11px;
	}
		
	/* My Cart - Step 2 - Confirmation
	----------------------------------------------------------------------------------------------------*/
	/*
	#OrderList td, #OrderList div {
		font-size: 12px;
		vertical-align: middle;
	}
	
	#OrderList .line {
		height: 1px;
		background-color: rgba(204, 204, 204, .5);
	}
	*/
	
	.prodName {
		font-weight: 600;
	}
	
	.widthBullet {
		font-size: 0.75rem;
		width: 2em;
		max-width: 2em;
	}
	
	.OrderDetailsCatHead, .head .OrderDetailsCatHead, .ServiceHead td, .checkoutHead {
		font-size: 1.5rem;
		color: black;
		margin: 1rem 0;
	}
	
	.ServiceHead.nobg td {
		background-image: none;
		text-indent: 0px;
	}
	
	.head .OrderDetailsCatHead {
		background: none;
		text-indent: 0;
	}
	#confirmation .line {
		border-top: var(--border);
	}
	
	#OrderList .FormContent td:first-child table {
		margin-left: 3px;
	}
	
	#OrderList tr .FormContent:last-child {
		border-right: none;
	}
	
	.OrderDetailsSubList>td:first-child, .itemDetails>td:first-child {
		padding-left: 0.75rem !important;
		padding-right: 0 !important;
		margin: 0;
	}
	
	
	.OrderDetailsSubList td:first-child, .CustomOrderSubList td:first-child {
		border-top: none;
	}
	.OrderDetailsSubList .widthBullet { color:var(--blue); }
	
	.CustomOrderSubList>td:first-child {
		padding-left: 0.75rem !important;
		padding-right: 0 !important;
	}
	
	.OrderDetailsSubList table {
		width: 100%;
	}
	
	.OrderDetailsSubList .pkgNoteHead { display:inline-block; margin-left:2rem; margin-right:0.5rem; }
	.MyCart .OrderDetailsSubList .pkgNoteHead, #confirmation #OrderList .OrderDetailsSubList .pkgNoteHead {
		color:var(--magenta);
	}
	.MyCart .adjNotes {
	    padding-left: 0.75rem;
		padding-bottom: 1rem;
	}
	.MyCart .adjNotes > .adjNotes {
		padding-left: 2rem;
		padding-bottom: 0;
	}
	.MyCart .totals, #confirmation .totals {
		margin-left:30%;
		margin-bottom: 0.75rem;
	}
	.MyCart .totals > div, #confirmation .totals > div {
		display:flex;
		justify-content: space-between;
		padding: 1.25rem;
		margin-bottom: 0.5rem;
		border: var(--border);
		border-radius: var(--border-radius);
		border-color: var(--light-grey);
		background-color: var(--bg-grey);
		color: var(--grey);
		font-weight: var(--font-bold);
	}
	.MyCart .totals > div input, #confirmation .totals > div #confirmation .totals > div.subtotal  {
		color: var(--grey);
		font-weight: var(--font-bold);
		text-align: right;
		border: 0;
	}
	#confirmation .totals > div.discount  {
		color: var(--magenta);
	}
	.MyCart .totals > div.subtotal, .MyCart .totals > div.subtotal input, #confirmation .totals > div.total {
		border-color: var(--blue);
		color: var(--dark-blue);
	}
	#confirmation .terms {
		border: var(--border);
		border-radius: var(--border-radius);
		border-color: var(--light-grey);
		background-color: var(--bg-grey);
		text-align:center;
		padding: 1rem;
		margin: 1rem 0;
	}
	#confirmation .terms label {
		color: var(--grey);
	}
	.OrderSubListHead {
		background-color: var(--bg-grey);
	}
	
	.FormContent {
		line-height: 125%;
	}
	
	#OrderDetails .FormContent {
		/*font-size: 14px;*/
		line-height: 200%;
		vertical-align: middle;
		border-bottom: solid 1px #ccc;
	}
	
	td.OrderDetailsRow1 {
		width:200px;
		height:26px;
		font-family:Verdana, Arial, Helvetica, sans-serif;
		font-size:17px;
		color:#0a2d6d;
		vertical-align:middle;
		border-bottom:solid 1px #ccc;/*#0073ac;*/
		}
	
	td.OrderDetailsRow2 {
		width:200px;
		height:24px;
		font-family:Verdana, Arial, Helvetica, sans-serif;
		/*font-size:14px;*/
		color:#282828;
		vertical-align:middle;
		border-bottom:solid 1px #ccc;
		}
	
	div.OrderDetailsCategoryHeader {
		width:800px;
		height:24px;
		font-family:Verdana, Arial, Helvetica, sans-serif;
		font-size:17px;
		color:#0a2d6d;
		vertical-align:middle;
		border-bottom:solid 1px #0073ac;
		}
		
	td.OrderDetailsProductsColumnHeaders {
		height:28px;
		font-family:Verdana, Arial, Helvetica, sans-serif;
		/*font-size:14px;*/
		color:#0073ac;
		vertical-align:middle;
		border-bottom:solid 1px #ccc;
		}
		
	td.OrderDetailsProductsRows {
		font-family:Verdana, Arial, Helvetica, sans-serif;
		font-size:13px;
		line-height:125%;
		border-bottom:solid 1px #ccc;
		padding:8px 0px;
		}
		
	ol.MyCartNotes {
		list-style:inside;
		list-style-type:decimal;
		line-height:150%;
		}
	
/*  --------------  side bar style --------------  */
	.estimate > .block {
		border: 1px solid;
		border-color: var(--light-grey);
		border-radius: var(--border-radius);
		margin: 0.75rem 0;
	}
	.estimate > .block > div h1, .estimate > .block > div:not(:last-child) {
		border-bottom: 1px solid;
		border-color: var(--light-grey);
	}
	.estimate > .block > div h1 {
		background-color: var(--bg-grey);
		color: var(--dark-blue);
		font-weight: var(--font-bold);
		text-align: center;
		padding: 0.85rem 1.5rem;
		font-size: 1rem;
	}
	.estimate #right_bar1 h1 {
		background-color: var(--dark-blue);
		color: #fff;
		font-weight: var(--font-med);
		font-size: 1.2rem;
	}
	.estimate #right_bar1 h1:first-child {
		text-align:left;
	}
	.estimate #right_bar1 h1:last-child {
		text-align:right;
	}
	div:not(#right_bar1) > table.sideBars tr {
		display: grid;
		grid-template-columns: 1fr;
		margin: 0.85rem 0;
	}
	#right_bar1 > table.sideBars td {
		padding-top: 0.85rem;
	}
	table.sideBars td {
		padding: 0.25rem 1.5rem;
	}
	table.sideBars tr td:first-child {
		font-weight: var(--font-med);
		color: var(--grey);
	}
	table.sideBars tr td.right{
		text-align: left;
		color: var(--dark-blue);
	}
	.estimate > .block p {
		padding: 1.5rem;
	}
	
	.estimate .serviceNote {
		color: var(--grey);
	}
	
	.estimate > .block p .fas, .estimate .serviceNote .fas {
		color:var(--magenta);
	}

/* ------------- Payment ------------ */
.label {
		width: 200px;
		display: inline-block;
	}
	
.paymentMethod {
	padding-right: 1rem;
}
.paymentMethod input+label {
	padding-left: 1rem;
}
#CC_Terminal input[type="radio"] {
	display:none;
}
/* ----------- General ------------ */


table tr td.nolines, #OrderList tr.nolines *, #TopBodyBackground .FormContent.nolines {
	border-top: none;
	border-bottom: none;
}

table tr td.noborder, #TopBodyBackground .FormContent.noborder, #TopBodyBackground .noborder, img.print {
		border: none;
		border-right: none;
		border-left: none;
		border-top: none;
		border-bottom: none;
	}
	
.hoverLink .hoverPopUp { display: none; }
.hoverLink:hover .hoverPopUp { 
	display: block;
	background-color: #FFF;
	max-height: 480px;
	max-width: 480px;
	z-index: 2000;
	-webkit-box-shadow: 0px 0px 10px 0px rgba(50, 50, 50, 0.5);
	-moz-box-shadow:    0px 0px 10px 0px rgba(50, 50, 50, 0.5);
	box-shadow:         0px 0px 10px 0px rgba(50, 50, 50, 0.5);
}
	
.fadingTooltip {
	position: absolute;
	background-color:#FFFFFF;opacity:1;display:block;z-index:9999999;
	margin-top:10px; padding:5px; border: solid 1px #ccc;
}
div.table { display: table; }
.tr { display: table-row; }
.td { display: table-cell; }

.greyHeading { font-size: 15px; }
.tinyText { font-size:9px; line-height: 100%; }

.padFull { width:95%; }

.pad0left, .pad0-x, .pad0X, .pad0, .pl-0, .px-0, .p-0 { padding-left: 0px; }
.pad0right, .pad0-x, .pad0X, .pad0, .pr-0, .px-0, .p-0 { padding-right: 0px; }
.pad0top, .pad0-y, .pad0Y, .pad0, .pt-0, .py-0, .p-0 { padding-top: 0px; }
.pad0bottom, .pad0-y, .pad0Y, .pad0, .pb-0, .py-0, .p-0  { padding-bottom: 0px; }

.pad5left, .pad5-x, .pad5X, .pad5 { padding-left: 5px; }
.pad5right, .pad5-x, .pad5X, .pad5 { padding-right: 5px; }
.pad5top, .pad5-y, .pad5Y, .pad5 { padding-top: 5px; }
.pad5bottom, .pad5-y, .pad5Y, .pad5 { padding-bottom: 5px; }

.pad10left, .pad10-x, .pad10X, .pad10 { padding-left: 10px; }
.pad10right, .pad10-x, .pad10X, .pad10 { padding-right: 10px; }
.pad10top, .pad10-y, .pad10Y, .pad10 { padding-top: 10px; }
.pad10bottom, .pad10-y, .pad10Y, .pad10 { padding-bottom: 10px; }

.pl, .px, .pall { padding-left: 0.5rem; }
.pr, .px, .pall { padding-right: 0.5rem; }
.pt, .py, .pall { padding-top: 0.5rem; }
.pb, .py, .pall { padding-bottom: 0.5rem; }
.pl-2, .px-2, .pall-2 { padding-left: 1rem; }
.pr-2, .px-2, .pall-2 { padding-right: 1rem; }
.pt-2, .py-2, .pall-2 { padding-top: 1rem; }
.pb-2, .py-2, .pall-2 { padding-bottom: 1rem; }

.pl-1 { padding-left: 1rem; }
.pl-fa, .pl-fw { padding-left: 1.25em; }
.pl-fw-adj, .pl-fw-indent { padding-left: calc(1.25rem + 0.25rem); }
.pl-h2-fw-indent { padding-left: calc(1.75rem * 1.5); }
.pl-chk { padding-left: calc(4px + 1.15em); }

.margin10top,.margin10Y { margin-top: 10px; }
.margin10bottom,.margin10Y { margin-bottom: 10px; }
.margin15top,.margin15Y { margin-top: 15px; }
.margin15bottom,.margin15Y { margin-bottom: 15px; }
.margin20top,.margin20Y { margin-top: 20px; }
.margin20bottom,.margin20Y { margin-bottom: 20px; }

.my-sm { margin-top: 0.5rem; margin-bottom: 0.5rem; }

.ml, .mx, .mall { margin-left: 1rem; }
.mr, .mx, .mall { margin-right: 1rem; }
.mt, .my, .mall { margin-top: 1rem; }
.mb, .my, .mall { margin-bottom: 1rem; }

.ml-2, .mx-2, .mall-2  { margin-left:2rem; }
.mr-2, .mx-2, .mall-2 { margin-right: 2rem; }
.mt-2, .my-2, .mall-2 { margin-top: 2rem; }
.mb-2, .my-2, .mall-2 { margin-bottom: 2rem; }
.ml-chk { margin-left: calc(4px + 1.15em); }

html .mb-0 { margin-bottom: 0; }

hr { border-bottom-color:var(--border-color); border-bottom-style: solid; border-top: none;border-right: none; border-left: none;}
.border { border:var(--border); }
.rounded { border-radius: var(--border-radius); }
.blueline { border-bottom: 1px solid var(--blue); }
.blueBorder { border-color:  var(--blue); }
.lightBlueBorder { border-color: var(--light-blue); }
.blueHr { border-bottom-color: var(--dark-blue); border-bottom-style: solid; /*border-bottom-color: #b1d4e6;*/ }
.heavyborder { border-width: 2px; }
.bt { border-top:var(--border); }
.bb { border-bottom:var(--border); }

.error { color:var(--red); }
.red { color:var(--red); }
.yellow { color:var(--yellow); }
.magenta, a.red:hover, a .red:hover, .red a:hover { color:var(--magenta); }
.green { color:var(--green); }
.whiteText { color: #fff; }
.lightblueText { color: var(--light-blue);}
.blue, .brightBlue, .brightblueText, .brightBlueText { color:var(--blue); }
.darkblueText, .darkBlueText { color: var(--dark-blue);}
.blueText, .greyHeading { color: var(--dark-blue);}
.darkgreyText { color:var(--dark-grey); }
.lightgreyText { color:var(--light-grey); }
.greyText, .greyout { color:var(--grey); }
.blackText { color:#000; }

.altbg:nth-child(2n) { background-color:var(--bg-blue) }
#page .whiteBg { background-color:#fff; }
.lightGreyBg, .greyHeading { background-color:var(--bg-grey); }
.lightOrangeBg { background-color:#e8ba92; }
.greenBg { background: linear-gradient(rgba(255,255,255,0.5),rgba(255,255,255,0.5)),linear-gradient(var(--green), var(--green)); }
.yellowBg { background: linear-gradient(rgba(255,255,255,0.5),rgba(255,255,255,0.5)),linear-gradient(var(--yellow), var(--yellow)); }
.blueBg { background-color:var(--dark-blue); }
.lightblueBg, .lightBlueBg { background-color:var(--bg-blue); }
.hoverBg:hover { background-color: var(--bg-blue);}

.halfspace { line-height:150%; }

/* Labels immediately following a selected radio button */
input[type="radio"]:checked+label{ font-weight: var(--font-bold); }

.text-sm { font-size: 80%; }
.text-reg { font-size: 100%; }
.text-md { font-size: 110%; }
.text-lg { font-size: 130%; }
.text-xl { font-size: 175%; }
.text-2x { font-size: 200%; }
.med { font-weight: var(--font-med); }
strong, .strong { font-weight: var(--font-bold); }
em { font-style: italic; }
em strong, strong em { font-weight: var(--font-bold); font-style: italic; }
.smallcaps { font-variant: small-caps; }
.strike { text-decoration:line-through; }
.underline { text-decoration:underline; }
	
/* Alignment */
html body .left {
	text-align:left;
}
html body .center {
	text-align: center;
}
html body .right, #report .right {
	text-align: right;
}

html body .top, #OrderList td.top, #OrderList .top td {
	vertical-align:top;
}

html body .indent {	text-indent: 2rem; }

html body .middle { vertical-align:middle; }

html body .nopadding { padding-top: 0; padding-bottom: 0; padding-left: 0; padding-right: 0; }
	
/* ----------- tooltip: Sandy added (Jan 20, 2016)  ------------ */
.ttLink:hover .tooltip {
    display:block;
}

.tooltip {
    display: none;
	background: #ccc;
	/*
background: #ff6600;
*/
	font-size:11px;
	font-weight:normal;
	border:1px solid #f2f2f2;
	color:#464646;
	padding:5px 10px;
    margin-top: 15px; /* moves it down */
    position: absolute;
    z-index: 1000;
}

.tooltip-left {margin-left: 20px; /* moves the tooltip to the right */}
.tooltip-right {margin-left: 10px; }




.p10 {padding: 10px;}
.p5 {padding: 5px;}

/* sticky list title row */
table th {
   position: sticky;
   position: --webkit-sticky;
   top:0;
   background:#fff;
   font-weight:normal;
}

.fr-video iframe {
    width: 100%;
}

.loader {
	border: 16px solid var(--light-grey);
	border-top: 16px solid var(--dark-blue);
	border-radius: 50%;
	width: 120px;
	height: 120px;
	animation: spin 2s linear infinite;
}

@keyframes spin {
	0% { transform: rotate(0deg); }
	100% { transform: rotate(360deg); }
	}

@media print {
	:root, ::before, ::after {
		--dark-blue: #000;
		--cell-padding: 0.25rem 0.25rem;
	}
	body { min-width: 100%; filter:grayscale(1); }
	.noprint, #leftMenu { display:none !important; }
	#TopLevelMenuBackground, #SecondaryLevelMenuBackground, #topbar .widget {display:none;}
	.container_24 .grid_18 {width: 100% !important;}
	#page, footer { zoom: 0.70; }
	#page, #page > .grid_18 { width: auto !important; display:block; float:none;page-break-before: avoid;break-before: avoid;page-break-inside:auto;break-inside:auto;}
	.ShowBasicInfo, #topbar, #userMenu, footer { background: none; color:black !important; }
	.ShowInformation .ShowInfoDates, .ShowInfoTitle a.ShowName, .ShowInfoLocation, .ShowInternalInfo { color:black !important; }
	#topbar #userMenu { display:block; }
	.showMenu #logo img { display: inline !important; filter: contrast(0) grayscale(1) brightness(0) !important; }
	#topbar { height:3rem; }
	.ShowInformation, .ShowInternalInfo { margin: 0; }
	.ShowBasicInfo {
		border-left: 2px solid #000;
		margin: 0;
	}
	footer { margin-bottom:0; }
	table { page-break-inside:auto; }
    tr    { page-break-inside:avoid;break-inside:avoid; page-break-after:auto;break-after:auto }
    thead { display:table-header-group }
    tfoot { display:table-footer-group }
} 
/*
@media only screen 
	and (max-device-width: 1112px) {
	.showMenu #leftMenu {
		position: absolute;
		background: white;
		min-height: 100%;
		z-index:90;
	}
}
*/
@media only screen 
	and (max-device-width: 1112px) {
		#openMenu, .showMenu #closeMenu {
			width: calc(1.25rem * 1.75);
			font-size: 1.75em;
			height: calc(4rem * 1.75);
			top: 70vh;
		}
		#closeMenu {
			left: calc(250px + (5rem - (1.25rem * 1.75)));
		}
		.d-none-sm {
			display:none;
		}
		.hasPromo .promos .promo:first-child {
		}
		.hasPromo .promos .promo:nth-child(n+2) {
			display:none;
		}
	}

@media only screen
	and (max-device-width: 1440px) {
		#topbar .widgets {
			column-gap: 1.5rem;
			gap:1.5rem;
		}
		#topbar .widgets i.fa, #topbar .widgets i.far { padding-right: 0.25rem; }
	}

	.textArea
	{
	border: none;
	border-radius:var(--border-radius);
	background-color:var(--bg-grey);
	font-size:1rem;
	font-family:var(--font);
	}
	.disabledtext
	{
	   width: 200px;
	   border:0px; 
	   word-wrap: break-word;
	   text-align:left;
	}
	.disabledinputtext
	{
	   width: 100px;
	   border:0px; 
	   word-wrap: break-word;
	   text-align:center;
	}
	.editabletextintable {
		width: 100px;
		word-wrap: break-word;
		box-shadow: var(--half-shadow-inset);  
		text-align:center;
	}