:root {
	--primary-color: #262AFF;
	--background-color: #EEEEEE;
	--black-text: #0C0C0C;
	--sunshine: #FFCC00;
	--sunshine-20transparent-color: #FFCC0033;
	--raspberry: #F4364C;
	--creamsicle: #FDA052;
	--smoke: #C4C4C4;
	--smoke-darker: #A7A7A7;
	--smoke-20transparent: #D9D9D9;
	--pulse-blue: #1CABFF;
	--charcoal: #595959;
}

.primary-color {
	color: var(--primary-color);
}

.warning {
	color: var(--black-text);
	background-color: var(--sunshine-20transparent-color);
	padding: 4px;
	margin-bottom: 4px;
	margin-top: 14px;
	border-style: solid;
	border-width: 2px;
	border-radius: 5px;
	border-color: var(--sunshine);
	width: fit-content;
}

.response-message {
	color: var(--raspberry);
}

.background-color {
	background-color: var(--background-color);
}


.table-header-primary {
	background-color: var(--primary-color);
	color: white !important;
}

.table-header-primary th {
	font-weight: normal;
}

body {
	font-family: 'Segoe UI', Tahoma;
	background-color: White;
	color: var(--black-text);
}

/* START LOGIN PAGE */
.login-padding {
	padding: 24px 70px;
	box-sizing: border-box;
}

.login-logo {
	display: block;
	margin-left: auto;
	margin-right: auto;
	width: 300px;
	height: auto;
	padding-bottom: 16px;
}

.login-form-container label {
	font-size: 13px;
}

.login-form-container table tr td:first-child {
	white-space: nowrap;
	vertical-align: middle;
	padding-right: 8px;
}

.login-form-container table tr td {
	vertical-align: middle;
}

.login-form-container .aspNetLogin .title,
.login-form-container .aspNetLogin .instruction {
	text-align: end;
}

/* END LOGIN PAGE */

DIV#banner {
	position: absolute;
	left: 0px;
	top: 0px;
	height: 90px;
	width: 1225px;
	font-size: small;
	border-spacing: 0px;
	color: White;
	z-index: 1;
}

DIV#menu {
	position: absolute;
	font-size: small;
	left: 0px;
	top: 132px;
	height: 600px;
	width: 120px;
	background-color: var(--background-color);
	border-style: solid;
	border-color: Gray;
	border-width: 1px;
	border-spacing: 0px;
	padding: 5px;
	z-index: 2;
	font-family: "Segoe UI Semibold";
}

DIV#mainContent {
	position: absolute;
	font-size: small;
	left: 155px;
	top: 132px;
	height: 600px;
	width: 855px;
	background-color: Transparent;
	padding: 5px;
	z-index: 1;
}

.widediv {
	overflow: auto;
	width: 1000px;
	margin-top: 10px;
}

.recurringsearchfieldset {
	margin-top: 10px;
	margin-left: 0px;
	width: 666px;
	padding: 14px;
}

.legend {
	font-weight: bold;
	font-size: 18px;
}

.recurringresultfieldset {
	margin-top: 10px;
	margin-left: 0px;
	width: 1000px;
	padding: 14px;
}

.vMessageColor {
	color: var(--raspberry);
}

.hintStyle {
	font-size: 11px;
	font-weight: lighter;
}

.gvCaptionStyle caption {
	font-size: 1.5em;
	font-weight: bold;
	color: Black;
	vertical-align: middle;
}

.gvItemPadding {
	padding: 0px 8px 0px 0px;
}

.ellipsis {
	width: 120px;
	overflow: hidden;
	white-space: nowrap;
	display: block;
	text-overflow: ellipsis;
}

.titlecolor {
	color: darkcyan;
}

.gvWideItem {
	padding: 0px 8px 0px 0px;
	width: 500px;
}

/*.tooltip {
    width: 300px;
}*/

a {
	color: var(--primary-color) !important;
}

	a title {
		height: 800px;
	}

	a.tooltip {
		position: relative;
		text-decoration: none;
		color: blue;
	}

		a.tooltip span {
			display: none;
		}

		a.tooltip:hover span {
			position: absolute;
			top: 40px;
			left: -300px;
			display: block;
			width: 500px;
			color: black;
			background-color: #FFFF40;
			border: 1px solid black;
			padding: 5px;
			z-index: 1000;
		}

.popuppanel {
	width: 500px;
	/*height: 500px;*/
	overflow: auto;
	background: #EDEDED; /*#FBFBFB;*/
	color: black;
	padding: 16px;
}

.popuptextarea {
	border: none;
	background: #EDEDED;
}

.wiztable {
	border-collapse: collapse;
	width: 435px;
}

	.wiztable td {
		text-align: left;
		padding: 5px;
	}

	.wiztable td {
		border: 1px solid black;
	}

	.wiztable > tbody > tr:first-child > td {
		border: none;
	}

#wizHeader li .prevStep {
	background-color: var(--smoke-darker);
}

.wiz-completed {
	background-color: var(--smoke-darker);
	border-color: var(--smoke-darker);
}

#wizHeader li .prevStep:after {
	border-left-color: var(--smoke-darker) !important;
}

#wizHeader li .currentStep {
	background-color: var(--primary-color);
	;
}

	#wizHeader li .currentStep:after {
		border-left-color: var(--primary-color) !important;
	}

#wizHeader li .nextStep {
	background-color: var(--smoke-20transparent);
	color: var(--black-text);
}

	#wizHeader li .nextStep:after {
		border-left-color: var(--smoke-20transparent) !important;
		color: var(--black-text);
	}

#wizHeader {
	list-style: none;
	overflow: hidden;
	font: 12px 'Segoe UI';
	margin: 0px;
	padding: 0px;
	width: 600px;
}

	#wizHeader li {
		float: left;
	}

		#wizHeader li a {
			color: white !important;
			text-decoration: none;
			padding: 10px 0 10px 75px;
			background: brown; /* fallback color */
			background: hsla(34,85%,35%,1);
			position: relative;
			display: block;
			float: left;
		}

			#wizHeader li a:after {
				content: " ";
				display: block;
				width: 0;
				height: 0;
				border-top: 50px solid transparent; /* Go big on the size, and let overflow hide */
				border-bottom: 50px solid transparent;
				border-left: 30px solid hsla(34,85%,35%,1);
				position: absolute;
				top: 50%;
				margin-top: -50px;
				left: 100%;
				z-index: 2;
			}

			#wizHeader li a:before {
				content: " ";
				display: block;
				width: 0;
				height: 0;
				border-top: 50px solid transparent;
				border-bottom: 50px solid transparent;
				border-left: 30px solid white;
				position: absolute;
				top: 50%;
				margin-top: -50px;
				margin-left: 5px;
				left: 100%;
				z-index: 1;
			}

		#wizHeader li:first-child a {
			padding-left: 2px;
		}

		#wizHeader li:last-child {
			padding-right: 2px;
		}

		#wizHeader li a:hover {
			background: var(--creamsicle);
		}

			#wizHeader li a:hover:after {
				border-left-color: var(--creamsicle) !important;
			}

.lnkbutton {
	display: block;
	height: 25px;
	background: white;
	text-align: center;
	border-radius: 5px;
	border: 0px;
	color: blue;
	font-weight: bold;
	float: left;
	cursor: pointer
}

.modalBackground {
	background-color: Black;
	filter: alpha(opacity=60);
	opacity: 0.6;
}

.modalPopup {
	background-color: #FFFFFF;
	width: 300px;
	border: 3px solid #0DA9D0;
	padding: 0;
}

	.modalPopup .header {
		background-color: #2FBDF1;
		height: 30px;
		color: White;
		line-height: 30px;
		text-align: center;
		font-weight: bold;
	}

	.modalPopup .body {
		min-height: 50px;
		line-height: 30px;
		text-align: center;
		font-weight: bold;
		margin-bottom: 5px;
	}

.HiddenColSetting {
	display: none;
}

.mfaButton {
	width: 100%;
	padding: 5px 5px;
	margin: 5px 0;
	box-sizing: border-box;
	background-color: var(--background-color);
}

	.mfaButton:focus {
		background-color: var(--pulse-blue);
	}

.mfaInput {
	width: 100%;
	padding: 5px 5px;
	margin: 5px 0;
	box-sizing: border-box;
	text-align: center;
}

#divGetCode select {
	width: 100%;
	padding: 5px 5px;
	margin: 5px 0;
	box-sizing: border-box;
}

.gridview tbody tr:first-child a {
	color: white !important;
}

.gridview tbody tr:not(:first-child) a {
	color: #1B1EC6 !important;
}

.gridview td {
	padding: 5px 5px;
}

.side-menu-item:hover {
	background-color: white !important;
}

.banner-menu-item:hover {
	background-color: var(--background-color) !important;
}

.login-status {
	font-family: "Segoe UI Semibold";
}

.menu-banner {
	width: 100%;
	font-family: "Segoe UI Semibold";
	margin-top: 10px;
}

.menu-banner td {
	padding: 1px;
}


	.menu-banner td[style*="width:0"]::before {
		content: ">";
		color: var(--primary-color);
		font-size: 18px;
		height: 85%;
		vertical-align: middle;
		display: inline-block;
		margin-left: 0px;
	}

.menu-banner tr:first-child {
	display: flex;
	justify-content: space-around;
}

.menu-banner td[style*="width:0"]:hover {
	cursor: pointer;
}

.menu-banner td[style*="width:0"] img {
	display: none;
}

button,
input[type="button"],
input[type="submit"],
input[type="file"],
input[type="reset"] {
	background-color: var(--background-color);
	border-width: 1px;
	font-family: 'Segoe UI' !important;
	color: var(--black-text);
}

input[type="text"],
select:enabled {
	color: var(--black-text);
}

input:disabled,
select:disabled,
input[readonly] {
	background-color: var(--background-color) !important;
	cursor: not-allowed;
	color: var(--black-text);
}

.gridview-add-user td {
	padding: 5px 5px;
}

.gridview-add-user a {
	color: var(--primary-color) !important;
}

select {
	font-family: "Segoe UI" !important;
}

[id$="LinkButtonCredentials"] {
	text-decoration: none;
	cursor: pointer;
}