/** Add css rules here for your application. */
*:not(  .veloxCustomFontArea, .veloxCustomFontArea *,
        .sapioRoboto, .sapioRoboto *,
        code, pre, code *, pre *) {
	font-family: 'Inter', sans-serif !important;
}

.sapioRoboto, .sapioRoboto * {
	font-family: 'Roboto', sans-serif !important;
}

/* Hide mobile safari's annoying "gray rectangle on click" "feature" */
* {
	-webkit-tap-highlight-color: transparent !important;
}

h1:first-child,
h2:first-child,
h3:first-child,
h4:first-child,
h5:first-child,
h6:first-child {
    margin-top: 0px !important;
}

.sapioRoboto h1:first-child,
.sapioRoboto h2:first-child,
.sapioRoboto h3:first-child,
.sapioRoboto h4:first-child,
.sapioRoboto h5:first-child,
.sapioRoboto h6:first-child {
    margin-top: revert !important;
}

/* we dont use outlines in here. */
input, textarea:hover, input:focus, input:active,
textarea, textarea:hover, textarea:focus, textarea:active {
    outline:0px none transparent;
}

/* For dragging calendar events, on drag start, we need to add '' to the 
root panel which will cause all scrolling containers to lose their transform, 
thus fixing an offset caused by translateZ(0px). */
.removeTransform .verticalScrollingLayoutContainer {
	transform: none !important;
}

body {
	position: fixed;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
}

iframe {
	border: none !important;
}

.defaultBorderRadius {
	border-radius: 5px;
}

.myProfileMenuTopLabel {
	padding: 5px;
}

.elnNotebookViewPanel {
	overflow: hidden;
}

.exemplarPasswordField {

}

.veloxSplitDraggerBarVertical {
	height: 100%;
	width: 100%;
	position: relative;
	cursor: e-resize;
	cursor: col-resize;
}

.veloxSplitDraggerBarVerticalHorizontal {
	width: 100%;
	position: relative;
	cursor: n-resize;
	cursor: row-resize;
}

.veloxSplitDraggerDot {
	width: 4px;
	height: 4px;
	border-radius: 100px;
	border-style: solid;
	border-width: 1px;
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
}

.noBoxShadow {
	box-shadow: none !important;
}

.primaryToolbarContainer {
	z-index: 10;
}

.MainLimsViewDetailsPanel {
	/*border-top: none !important;*/
	
}

.MainLimsViewPanel {
	border-collapse: separate;
}

.mainPanel {
	vertical-align: middle;
	border-spacing: 0px;
	margin-left: auto;
	margin-right: auto;
	/*margin-bottom:auto;*/
	width: 100%;
	background: #fff;
}

.wizardToolbarHeaderText {
	float: right;
	font-size: 16px !important;
	margin-left: 15px;
}

.dataRecordTreeItemTable {
	display: table !important;
}

/* used to align the data tree icons with the associated text */
.dataRecordTreeItem {
	display: inline-block;
	font-size: 12px !important;
	vertical-align: middle;
}

.dataRecordTreeItemDiv {
	display: block !important;
	padding: 2px !important;
	border-radius: 5px;
}

.dataRecordTreeItemTable table:first-of-type {
	
}

.hideRootTreeItem .dataRecordRootTreeItem > table {
	display:none !important;
}

.dataRecordRootTreeItem {

}

.dataRecordContainerTreeItem {
	font-weight: 700 !important;
}

.treeNodeIcon {
	display: inline;
	vertical-align: middle !important;
}

.gwt-TreeItem img {
	display: inline;
	vertical-align: middle !important;
}

.gwt-TreeItem-selected img {
	display: inline;
	vertical-align: middle !important;
}

/* style for form field labels displayed on data form tab panels */
.formFieldLabel {
	text-align: right !important;
}

/* special override for the formFieldLabel to make the text align to the left instead */
.formFieldLabel.leftFieldForm {
	text-align: left !important;
}

.veloxRowNumbererHeader {
	/* The row numberer header should have no content in it, so hide any elements that are added to it. */
	display: none;
}

/*** BEGIN DERECK'S HELPER CLASSES ***/
/** Image Label -- a replacement for JLabel.
    1) Create a Text (or other) element.
    2) Add the imageLabel and an imageLabel-xx style class to the element.
    3) Set the backgroundImage/background-image attribute of the element (can use getSafeUri().asString() from the 
    	image bundle resources to get a URL to use).  
      note) May need to use a render event listener to set this, as a data url could cause issues pre-render **/
.imageLabel {
	background-repeat: no-repeat;
	vertical-align: middle;
	background-position: left center;
	background-size: contain;
}

.imageLabel-32 {
	padding-left: 37px;
	min-height: 32px;
}

.imageLabel-24 {
	padding-left: 29px;
	min-height: 24px;
}

.imageLabel-16 {
	padding-left: 21px;
	min-height: 16px;
}

/*** END DERECK'S HELPER CLASSES ***/
/*** BEGIN REPORT BUILDER COMPONENTS ***/
.reportTermEditorLabel {
	font-size: 11pt;
	font-weight: bold;
	/* simulation of: setBorder(new EtchedBorder(EtchedBorder.LOWERED)) */
	border: solid 1px #808080;
	border-radius: 5px;
	/* really long data type and data field names need to be truncated */
	overflow: hidden;
}

.reportTermEditorLabel.simple-and {
	text-align: center;
    height: 32px;
    line-height: 32px;
}

.reportTermPanel {
	padding: 2px 1px 2px 2px;
	border-radius: 5px;
	border: 2px solid transparent;
}

.reportTermPanel-over {
	border: 2px dashed #25b4e3;
}

.reportTermPanel-selected {
	border: 2px solid #25b4e3;
}

.reportTermPanel.simple .reportTermPanel-selected, .reportTermPanel.simple .reportTermPanel-over, .reportTermPanel.simple.reportTermPanel-selected,
	.reportTermPanel.simple.reportTermPanel-over {
	/* border-color: transparent; */
	
}

.reportTermPanel>div {
	float: left;
}

.reportTermPanel.compositeTermPanel.simple {
	padding: 0;
	border-width: 0;
}

.reportConditionPanel {
	/* simulation of: setBorder(new BevelBorder(BevelBorder.LOWERED)) */
	
}

.reportConditionPanel .termPanel {
	max-height: 380px;
	overflow: auto;
}

.rawTermPanel .notLabel {
    font-size: 12px;
    font-weight: bold;
    background-position: 0px 0px;
    margin-right: 5px;
    margin-top: 6px;
    background-size: 24px;
}

.rawTermPanel .notLabel > div {
    padding-left: 3px;
    line-height: 24px;
}

.rawTermPanel.templateTerm {
    background-color: #25b4e34d;
}

.termDataTypePanel {
	min-height: 36px;
	min-width: 320px;
	background-color: transparent;
}

.termDataTypePanel .reportTermEditorLabel {
	padding-left: 3px;
	width: 313px;
	height: 32px;
	line-height: 32px;
	white-space: nowrap;
	text-overflow: ellipsis;
	overflow: hidden;
}

.termDataTypePanel .dataTypePicker {
	width: 320px;
	height: 36px;
}

.termDataFieldPanel {
	min-height: 36px;
	min-width: 320px;
	background-color: transparent;
}

.termDataFieldPanel .reportTermEditorLabel {
	text-align: left;
	padding-left: 3px;
	width: 313px;
	height: 32px;
	line-height: 32px;
	white-space: nowrap;
	text-overflow: ellipsis;
	overflow: hidden;
}

.termOperatorPanel {
	text-align: center;
	border-width: 0;
	min-height: 36px;
	min-width: 50px;
}

.termOperatorPanel .reportTermEditorLabel {
	width: 46px;
	height: 32px;
	line-height: 32px;
}

.termOperatorPanel .operatorCombo {
	width: 50px;
	height: 32px;
}

.termValuePanel {
	min-height: 36px;
	min-width: 220px;
}

.termValuePanel .editor {
	width: 220px;
	height: 36px;
}

.termValuePanel .reportTermEditorLabel {
	text-align: left;
	padding-left: 3px;
	width: 213px;
	height: 32px;
	line-height: 32px;
	white-space: nowrap;
	text-overflow: ellipsis;
	overflow: hidden;
}

.termValuePanel .dateChooser {
	width: 220px;
	height: 36px;
}

.termValuePanel .dateChooser input {
	width: 195px;
}

.termValuePanel .termValueSelectionComponent {
	width: 216px !important;
	height: 36px;
}

.termValuePanel .termValueSelectionComponent>div {
	float: left;
}

.termValuePanel .termValueSelectionComponent div {
	width: 195px !important;
}

.termValuePanel .termValueSelectionComponent div input {
	width: 187px !important;
}

.termValuePanel .termValueSelectionComponent div.selectionEditorButton {
	width: 19px !important;
	height: 19px !important;
}

.termValuePanel .termValueSelectionComponent div.selectionEditorButton input {
	width: 1px !important;
	height: 1px !important;
}

.termValuePanel .enumComboBox {
	width: 220px !important;
	height: 36px;
}

.termValuePanel .enumComboBox input {
	width: 194px !important;
}

.termValuePanel .multiLineTextEditor {
	width: 216px;
	height: 36px;
	/* simulation of: setBorder(new BevelBorder(BevelBorder.LOWERED)) */
/* border: 2px inset #ccc; */
}

.termValuePanel .multiLineTextEditor textarea {
	height: 32px;
	padding-top: 2px;
}

.termValuePanel .multiLineTextEditor .selectionEditorButton {
	width: 20px;
	height: 20px;
}

.termValuePanel .singleLineTextEditor {
	width: 216px;
	height: 32px;
	/* simulation of: setBorder(new BevelBorder(BevelBorder.LOWERED)) */
/* border: 2px inset #ccc; */
}

.termValuePanel .singleLineTextEditor .selectionEditorButton {
	width: 20px;
	height: 20px;
}

.actionTextEditorTextComponent {
	border-width: 0;
}

.compositeTermPanel .notLabel {
	font-size: 12px;
	font-weight: bold;
}

.termLogicalOperator {
	text-align: center;
	font-family: sans-serif;
	vertical-align: middle;
	border-width: 0;
}

.termLogicalOperator .reportTermEditorLabel {
	width: 66px;
	height: 32px;
	line-height: 32px;
}

.termLogicalOperator .operatorCombo {
	width: 70px;
	height: 36px;
}

.operatorPanel {
	width: 100px;
	float: left;
	overflow: visible !important
}

.operatorPanel .notLabel, .operatorPanel .termLogicalOperatorPanel {
	float: left;
	/*margin: 0 5px 0 5px;*/
}

.operatorPanel .notLabel {
	clear: both;
}

.operatorBranch {
	width: 60px;
	height: 0;
	float: right;
	border-left: 1px solid gray;
}

.operatorBranch-top {
	border-top: 1px solid gray;
}

.operatorBranch-bottom {
	border-bottom: 1px solid gray;
}

.termDataFieldPanel .dataFieldDefPicker div[role="combobox"], .termDataTypePanel .dataTypePicker div[role="combobox"] {
	width: 318px !important;
}

.termDataFieldPanel .dataFieldDefPicker div[role="combobox"] input, .termDataTypePanel .dataTypePicker div[role="combobox"] input
	{
	width: 294px !important;
}

.singleLineTextEditor .actionTextEditorTextComponent {
	width: 196px !important;
}

.singleLineTextEditor .actionTextEditorTextComponent input {
	width: 188px !important;
}

.multiLinePopup .actionTextEditorTextComponent textarea {
	overflow-y: scroll;
	margin-top: 1px;
}

.multiLineTextEditor .selectionEditorButton {
	margin-left: 196px !important;
}

/*** END REPORT BUILDER COMPONENTS ***/

.focusStealer {
	position: absolute !important;
	top: 0% !important;
	left: 0% !important;
	width: 95%; /* shouldnt be 100% or else in dialogs with this, it looks wierd, ex: QBE dialog */
	height: 95%; /* shouldnt be 100% or else in dialogs with this, it looks wierd, ex: QBE dialog */
	border: none;
	z-index: -10;
	opacity: 0.0;
}

.focusStealerCheckbox {
	position: fixed !important;
	top: -10000px !important;
	left: -10000px !important;
	width: 0;
	height: 0;
	border: 0;
}

/* Chrome needs the focus stealer to be positioned absolutely, or else the first paste on a table always fails.  But if
   it is positioned absolutely then it causes a few bugs in Firefox.  Need to have a condtional style rule that handles
   both cases (TI-TODO) */
.focusStealer.absoluteFocusStealer {
	position: absolute !important;
}

.velox-mobile-menu-item {
	height: 28px !important;
}

.touch-grid tr>td {
	padding-top: 5px !important;
	padding-bottom: 5px !important;
}

/* For elements that want to ignore the "reset.css" rules */
/* (via: http://www.jbcrawford.net/archives/tag/un-reset-css) */
.unreset address:not(.ignore-unreset),
.unreset blockquote:not(.ignore-unreset),
.unreset dd:not(.ignore-unreset),
.unreset div:not(.ignore-unreset),
.unreset dl:not(.ignore-unreset),
.unreset dt:not(.ignore-unreset),
.unreset fieldset:not(.ignore-unreset),
.unreset form:not(.ignore-unreset),
.unreset frame:not(.ignore-unreset),
.unreset frameset:not(.ignore-unreset),
.unreset h1:not(.ignore-unreset),
.unreset h2:not(.ignore-unreset),
.unreset h3:not(.ignore-unreset),
.unreset h4:not(.ignore-unreset),
.unreset h5:not(.ignore-unreset),
.unreset h6:not(.ignore-unreset),
.unreset noframes:not(.ignore-unreset),
.unreset ol:not(.ignore-unreset),
.unreset p:not(.ignore-unreset),
.unreset ul:not(.ignore-unreset),
.unreset center:not(.ignore-unreset),
.unreset dir:not(.ignore-unreset),
.unreset hr:not(.ignore-unreset),
.unreset menu:not(.ignore-unreset),
.unreset pre:not(.ignore-unreset) {
	display: block
}

.unreset li {
	display: list-item
}

.unreset head {
	display: none
}

.unreset table {
	display: table
}

.unreset tr {
	display: table-row
}

.unreset thead {
	display: table-header-group
}

.unreset tbody {
	display: table-row-group
}

.unreset tfoot {
	display: table-footer-group
}

.unreset col {
	display: table-column
}

.unreset colgroup {
	display: table-column-group
}

.unreset td, .unreset th {
	display: table-cell
}

.unreset caption {
	display: table-caption
}

.unreset th {
	font-weight: bolder;
	text-align: center
}

.unreset caption {
	text-align: center
}

.unreset body {
	margin: 8px
}

.unreset h1 {
	font-size: 2em;
	margin: .67em 0
}

.unreset h2 {
	font-size: 1.5em;
	margin: .75em 0
}

.unreset h3 {
	font-size: 1.17em;
	margin: .83em 0
}

.unreset h4 {
	margin: 1.12em 0
}

.unreset p, .unreset blockquote, .unreset ul, .unreset fieldset, .unreset form, .unreset ol, .unreset dl,
	.unreset dir, .unreset menu {
	margin-block-end: 0.5em;
    margin-block-start: 0.5em;
    margin-top: 0.5em;
    margin-bottom: 0.5em;
}

/*
 * Since the client halves the margins by default, if you want
 * to use the standard 1em margins, you have to put 'standardmargins'.
 */
.unreset.standardmargins p, .unreset.standardmargins blockquote, .unreset.standardmargins ul,
.unreset.standardmargins fieldset, .unreset.standardmargins form, .unreset.standardmargins ol,
.unreset.standardmargins dl, .unreset.standardmargins dir, .unreset.standardmargins menu {
	margin-block-end: 1em;
    margin-block-start: 1em;
    margin-top: 1em;
    margin-bottom: 1em;
}

.unreset h5 {
	font-size: .83em;
	margin: 1.5em 0
}

.unreset h6 {
	font-size: .75em;
	margin: 1.67em 0
}

.unreset h1, .unreset h2, .unreset h3, .unreset h4, .unreset h5, .unreset h6, .unreset b, .unreset strong {
	font-weight: bolder;
	font-style: inherit
}

.unreset blockquote {
	margin-left: 40px;
	margin-right: 40px
}

.unreset i, .unreset cite, .unreset em, .unreset var, .unreset address {
	font-style: italic;
	font-weight: inherit;
}

.unreset pre, .unreset tt, .unreset code, .unreset kbd, .unreset samp {
	font-family: monospace
}

.unreset pre {
	white-space: pre
}

.unreset button, .unreset textarea, .unreset input, .unreset select {
	display: inline-block
}

.unreset big {
	font-size: 1.17em
}

.unreset small, .unreset sub, .unreset sup {
	font-size: .83em
}

.unreset sub {
	vertical-align: sub
}

.unreset sup {
	vertical-align: super
}

.unreset table {
	border-spacing: 2px;
}

.unreset thead, .unreset tbody, .unreset tfoot {
	vertical-align: middle
}

.unreset td, .unreset th, .unreset tr {
	vertical-align: inherit
}

.unreset s, .unreset strike, .unreset del {
	text-decoration: line-through
}

.unreset hr {
	border: 1px inset
}

.unreset ol, .unreset ul, .unreset dir, .unreset menu, .unreset dd {
	margin-left: 40px
}

.unreset ol {
	list-style-type: decimal
}

.unreset ol ul, .unreset ul ol, .unreset ul ul, .unreset ol ol {
	margin-top: 0;
	margin-bottom: 0
}

.unreset ul {
	list-style-type: disc
}

.unreset u, .unreset ins {
	text-decoration: underline
}

.unreset br:before {
	content: "\A";
	white-space: pre-line
}

.unreset center {
	text-align: center
}

.unreset :link, .unreset :visited {
	text-decoration: underline
}

/* these unresets come from Chrome's user agent stylesheet (TI-12322) */
.unreset ul ul, ol ul {
	list-style-type: circle
}

.unreset ol ol ul, ol ul ul, ul ol ul, ul ul ul {
	list-style-type: square
}

/* ensure tinymce dialogs appear above velox dialogs (PR-32271) */
/* use important since it seems like TinyMCE regularly injects a new style for this class, which overrides our rules */
.tox-tinymce-aux {
	z-index: 2000000 !important;
}

.myProfileMenuFullNameText {
    font-size: 14px;
}

.cssButton {
    background-image: none;
    background-color: #f4f4f4;
    border-radius: 5px;
    text-align: center;
}