.dialogseparator
{
	background-color: #FBFBFB;
	background: linear-gradient(85deg, whitesmoke 0%, #FBFBFB 28%, rgba(255,255,255,1) 100%);
	xfont-weight: bold;
	border-bottom: 1px solid whitesmoke;
	
	border-radius: 4px 0px 0px 4px;
	//background-color: whitesmoke;
}
		
.xdialogseparator
{
	padding-top: 10px;
	padding-bottom: 10px;
	background-color: #FBFBFB;
	background: linear-gradient(85deg, whitesmoke 0%, #FBFBFB 28%, rgba(255,255,255,1) 100%);
	font-weight: bold;
	border-bottom: 1px solid whitesmoke;
	
	border-radius: 4px 0px 0px 4px;
	//background-color: whitesmoke;
}

.xdialogseparatortransparent
{
	padding-top: 10px;
	padding-bottom: 10px;
	font-weight: bold;
}

.xdialog
{
	//background-color:white;
	//width: 600px;
	//height: 400px;
	
	//box-shadow: 0 0 20px 0 rgba(48, 113, 180, 0.3);
	
	//border: 1px solid silver;
	
	border-radius: 8px;
}

.progressbar
{
	border-radius: 2px;
	//width: 180px;
	width: 100%;
	max-width: 180px;
	height: 18px;
	border: 1px solid #469369;
	background-color: white;
	//box-shadow: 0 0 4px 0 #469369;//#b1ffbe;
}

.progressbarinner
{
	height: 16px;
	//background-color: #6DFF88;//#b1ffbe;
	background-color: #57BF54;//#7CB783;
	padding-left: 4px;
	font-size: 10px;
}

.xgrid
{
	border: none;
}

.xgrid2
{
	display: table;
	//border: 1px solid transparent;
	border: none;
}

.xgridfullwidth
{
	min-width: 100%;
	//width: 100%;
}

.xgridrowdiv
{
	width: auto;
	display: table-row;
	clear: both;
}

.xgridcelldiv
{
	display: table-cell;
}

.xgrid:focus, .xgrid:focus-within
{
	xborder: 1px solid #F0F0F0;
}

.xgridoverlay
{
	position: absolute;
	pointer-events: none;
}

.xgridoverlaysquare
{
	display: flex;
	align-items: center;
	//border: 2px solid rgba(50,50,50, 0.05);
	background-color: rgba(255, 255, 255, 0.3);
	
	border-radius: 8px;
	
	padding-left: 4px;
	padding-top: 4px;
	padding-bottom: 4px;
	
	z-index: 1000;
	vertical-align: middle;
	
	overflow: hidden;
	box-sizing: border-box;
}

.xgridoverlaylegend
{
	display: flex;
	align-items: center;
	height: 100%;	
	
	color: #333333;
	//font-weight: bold;
	
	z-index: 1000;
	padding: 0px 8px 0px 10px;
	vertical-align: middle;
	
	backdrop-filter: blur(4px);
}

.xgridhinsertindicator
{
	background-color: black;
	height: 2px;
	width: 100%;
}

.xgridhinsertindicator::before {
  content:'';
  display:inline-block;
  width: 8px;
  height: 8px;
  translate:  0px -10px;
  background-color: black;
  border-radius: 50%;
}

.xgridnoborder
{
	border: 0px solid white !important;
	padding: 8px;
}

.xgridpicker
{
	position: relative;
	cursor: pointer;
}

.xgridnoscroll
{
	overflow-y: hidden;
}

.xgridindent
{
	padding-left: 24px;
	//padding-top: 0px !important;
	//padding-right: 0px !important;
	//padding-bottom: 0px !important;
}

.xgridrow
{
	border-bottom: 1px solid #F0F0F0;
	//background-color: white;
}

.xgridrow:hover
{
	//filter: brightness(0.96);
	background-color: #FEFEFE;
	filter: brightness(0.98);
}

.xgridrownew
{
	background-color: #F9FAF9;
}

.xgridrowinvalid
{
	background-color: #FFC9B2;
}

.xgridbase
{
	padding: 6px 8px 6px 8px;
	font-size: 0.9em;
}

.xgridvertical
{
  -webkit-writing-mode: vertical-rl;
  writing-mode: vertical-rl;
  transform: rotate(180deg);
}

.xgridcell
{
	user-select: none;
	-webkit-box-sizing: border-box; /* Safari/Chrome, other WebKit */
	-moz-box-sizing: border-box;    /* Firefox, other Gecko */
	box-sizing: border-box;         /* Opera/IE 8+ */
	border-right: 1px solid #F0F0F0;
	border-bottom: inherit;
	min-width: 34px;
	min-height: 1rem;
	overflow: hidden;
}

.xgridcell:empty
{
	content: "\00a0";
}

.xgridcell:last-of-type
{
	border-right: none;
}

.xgridcardview
{
	display: flex !important;
	flex-flow: row wrap;
	justify-content: flex-start;
	
	//margin: -10px -10px;
	padding: 10px;
	
	overflow-y: visible;
}


.xgridcardview
{
	gap: 10px;
}

.xgridcardimageimg
{
	object-fit: cover;	//contain;//cover;
	object-position: 50% 50%;	//top;
	background-color: white;
	width: 100%;
	max-height: 180px;
}

.xgridimgtemp
{
	padding: 12%;
	object-fit: contain;
}

.xgridcardimage
{
	display: block !important;
	width: 100% !important;
	padding: 0px 0px 8px 0px !important;
	height: 188px;
}

.xgridcardimageimgsm
{
	max-height: 120px;
	min-height: 120px;
}

.xgridcardimagesm
{
	height: 128px;
}

.xgridcard
{
	position: relative;
	overflow: hidden;
	flex: 1;
	
	min-width: 220px;
	max-width: 240px;
	background-color: #E4EAEA;
	
	border-radius: 16px;
	
	/* margin: 10px 10px; */
	
	//border: 0px !important;
	border: 2px solid white;
	padding: 0px 0px 4px 0px !important;
}

.xgridfloatbottomleft
{
	position: absolute;
	left: 0px;
	bottom: 0px;
}

.xgridfloatbottomright
{
	position: absolute;
	right: 0px;
	bottom: 0px;
}

.xgridfloattopleft
{
	position: absolute;
	left: 0px;
	top: 0px;
	
	padding-left: 4px;
	padding-top: 4px;
}

.xgridfloattopright
{
	position: absolute;
	right: 0px;
	top: 0px;
	
	padding-right: 4px;
	padding-top: 4px;
}

.xgridcardselected
{
	border: 2px solid blue;
}

.xgridcard .xgridcell
{
	border: 0px;
}

.xgridcardsm
{
	min-width: 140px;
	max-width: 160px;
}

.xgridcarditem
{
	display: block;// !important;
	
	padding: 2px 10px 2px 10px !important;
	
	border: 0px !important;
}

.xgridcard .itemleft
{
	display: inline-block;
	width: 50%;
}

.xgridcard .itemright
{
	display: inline-block;
	width: 50%;
	text-align: right;
}

.xgridcarditemleft
{
	display: inline-block;
	width: 50%;
}

.xgridcarditemright
{
	display: inline-block;
	width: 50%;
	text-align: right;
}

.xgridcarditemleftleft
{
	display: inline-block;
	width: 72%;
}

.xgridcarditemrightleft
{
	display: inline-block;
	width: 28%;
	text-align: right;
}

.xgridcenter
{
	text-align: center;
}

.xgridright
{
	text-align: right;
}

.xgridspacious
{
	padding: 24px 16px 24px 16px;
}

// last

.xdialogfullheight
{
	height: 100vh;
}

.xdialogcontentfullheight
{
	height: 100vh;
}

.xdialogrow
{
	margin-bottom: 0.6rem;
}

.xdialogctrl
{
	margin-left: 0px;
	//font-size: 0.9rem;
	//padding: .375rem .75rem;
	
	padding-top: .3rem;
	padding-bottom: .3rem;
	
	//padding-top: .375rem;
	//padding-bottom: .375rem;
}

.xdialoglabel
{
	font-size: 0.9rem;
	//padding: .375rem .75rem;
}

.xdialogrequired
{
	//border-color: #888899 !important;
	//outline: 1px solid #e4e4e4;
	outline: 2px solid #F6F7ED;
	//#EDF9ED;
	//#EFFFEF;
	//#e6ffe6;
	//#e5FFe5;
}

.xdialogrequiredp:after
{
	display:inline-block;
	content: '*';
	color: green;
	z-index: 10;
}

.xgridcellspacer
{
	display: inline-block;
	content: ' ';
}

.xgridro
{
	font-size: 1rem;
	padding: .375rem .75rem;
}

.xgridcellbold
{
	font-weight: bold;
}

.xgridcellreadonly
{
	color: #222222;
}

.xgridinput
{
	border: 0px solid black !important;
	background-color: transparent !important;
}

.xgridcellselected
{
	background-color: #E5EFFF;
		// #EAF1FF;	//#D6F0FF;
	
	user-select: text !important;
	//border: 2px solid blue;

	//cursor: text;
}

.xgbt
{
	border-top: 1px solid blue !important;
}

.xgbr
{
	border-right: 1px solid blue !important;
}

.xgbb
{
	border-bottom: 1px solid blue !important;
}


.xgridcellfocus
{
	background-color: white;
	outline: 2px solid blue;
	outline-offset: -2px;
	cursor: text;
}

.xgridcellheader
{
	background-color: #F8F8F8;
	border-right: 1px solid #e0e0e0;
	border-bottom: 2px solid #BBBBBB;
	//padding: 8px;
	
	cursor: default;
}

.xgridcellindicator
{
	background-color: #F8F8F8;
	border-right: 1px solid #DDDDDD !important;
	border-bottom: 1px solid #DDDDDD;
	
	cursor: default;
}

.xgridrow:hover .xgridcellindicator
{
	filter: brightness(0.98);
}

.xgridcellheadersort
{
	font-weight: bold;
	border-bottom: 2px solid blue;
}

.xgridcellheaderselected
{
	background-color: gainsboro;
}

.hidden-parent .hidden-child
{
    //visibility: hidden;
	opacity: 0;
	
	transition: all 0.15s ease-in-out;
}

.hidden-parent:hover .hidden-child
{
	opacity: 1;
    visibility: visible;
}

.xgridcellheader .hidden-child
{
    visibility: hidden;
}

.xgridcellheader:hover .hidden-child
{
    visibility: visible;
}

.xgridgroupby
{
	flex: 0 0 100%; /* flex-grow, flex-shrink, flex-basis */
	display: block;
	background-color: #FAFAFC;
	border-bottom: 1px solid whitesmoke;
	color: grey;
	
	padding-bottom: 4px;
	//border-radius: 4px;
	
	font-weight: bold;
	
	margin-top: 8px;
	margin-bottom: 8px;
}

.xgridfilter
{
	display: inline-block;
	float: right;
	font-size: 10px;
	color: grey;
	padding: 4px;
	border-radius: 2px;
	
	border: 1px solid grey;
	//margin-left:auto;
	margin-left: 4px;
	line-height: 10px;
	
	cursor: pointer;
}

.xgriddragging
{
	border-radius: 4px;
	background-color: whitesmoke;
	opacity: 0.82;
	border: 1px solid gainsboro;
	
	padding: 2px;
	
	box-shadow: 4px 4px 8px 0 #AAAAAA;
}

.xgriddraggable
{
	cursor: move;
	cursor: grab;
	touch-action: pinch-zoom;
}

.xgridfilter:hover
{
	background-color: silver;
}

.xgridsortAscending
{
	position:relative;
}

.xgridsortAscending:after
{
	content: ' \2191';	
	//color: black;
	//position: absolute;
	right: 5px;
}

.xgridsortDescending
{
	position:relative;
}

.xgridsortDescending:after
{	
	content: ' \2193';
	//color: black;
	//position: absolute;
	right: 5px;
}


.xdialogheader
{
	padding: 0.4rem 0.8rem;
}

.tablegridfixed
{
  table-layout: fixed;
}

.xgridrowselected
{
	background-color: #8CBAFF !important;//#7788FF !important;
}

.modal-title
{
	font-size: 1.4rem;
	font-weight: bold;
	
	max-width: 90%;
	
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}

.xdialog .modal-body
{
	padding: 0px;
}

.xgridimage
{
	height: 32px;
}

.xgridmenuimage
{
	display: inline-block;
	margin-right: 8px;
	//width: 28px;
	//height: 28px;
	
	text-align: center;
	vertical-align: middle;
	
	overflow: hidden;
}


.flextitle
{
	flex: 0 1 auto;
}

.flexcontent
{
	flex: 1;
}



A.blacklink {text-decoration: none;FONT-WEIGHT: bold;color: black; background:transparent;}
A.blacklink:link {text-decoration: none;FONT-WEIGHT: bold;color: black;}
A.blacklink:visited {text-decoration: none;FONT-WEIGHT: bold;color: black; }
A.blacklink:hover {text-decoration: none;FONT-WEIGHT: bold;color: grey; }
A.blacklink:active {text-decoration: none;FONT-WEIGHT: bold;color: black;}


.xdialogicon
{
	display: inline-block;
	
	color: #656565;
	
	padding: 4px;
	background-color: white;

	text-align: center;
	
	text-shadow: 6px 7px 6px rgba(0,0,0,0.2),
                 0px -5px 35px rgba(255,255,255,0.3);
}

.fa-Mx
{
	font-size: 1.2em;
}


.xbtnbase
{
	cursor: pointer;
}

.xbtnbase:hover
{
	opacity: 0.6;
}

fieldset
{
	padding: 4px 8px 4px 8px;
	margin: 0px;
	border: 1px solid whitesmoke;
}

legend
{
	width: auto;
	font-size: 0.9rem;
	font-weight: bold;
	padding: 0px 4px 0px 4px;
}

.xgridvatop
{
	vertical-align: top;
}

.xgridvamiddle
{
	vertical-align: middle;
}



.buttoneditbutton
{
	border-top-left-radius: 0px !important;
	border-bottom-left-radius: 0px !important;
	
	background-color: whitesmoke;
}

.buttoneditedit
{
	border-top-right-radius: 0px !important;
	border-bottom-right-radius: 0px !important;
	
	border-right: 0px !important;
}


.h-100v
{
	height: 100vh;
}


.d-img-loading
{
	display: none;
}