/*@import url('https://fonts.googleapis.com/css?family=Roboto:300,400,500,700&display=swap');*/
/*@import "../stylesheets/fa/v4.7.0/css/font-awesome.min.css";*/
/*@import "../stylesheets/fa/v6.2.0/css/fontawesome.min.css";*/
/*@import "../stylesheets/fa/v6.2.0/css/brands.min.css";*/
@import "../stylesheets/fa/v6.2.0/css/all.min.css";
/*@import "../stylesheets/fa/v6.2.0/css/v4-font-face.min.css";*/
@import "../stylesheets/fa/v6.2.0/css/v4-shims.min.css";
@import "../stylesheets/unify/styles.css"; /* need this for the icons on courses to complete */
@import "../stylesheets/bs/css/bootstrap.css";
/* @import "../stylesheets/unify/app.css"; */ /* may contain some we'll need to pull out ex. img.img-circle */
@import "./training-calendar.css";
@import "datepicker.css";
@import "datepicker_mod.css";
@import "datepicker_vista.css";
@import "ng-navigation-menu.css";
@import "margins.css";
@import "paddings.css";
@import "flex-box.css";
@import "swiper.css";
@import "navbar-header.css";

:root {
	/* this doesn't seem to give me white on latitude blue, need to see how the bs scss does it. */
	/* --bs-primary-contrast: calc((
    (0.2126 * (var(--bs-primary-rgb) / 65536)) +
    (0.7152 * ((var(--bs-primary-rgb) % 65536) / 256)) +
    (0.0722 * (var(--bs-primary-rgb) % 256))
  ) < 0.5 ? 255 : 0); */
	--bs-primary-contrast: #ffffff; /* usually white or black, depending on primary color. */
	--lat-striped-row-bg: rgba(var(--bs-emphasis-color-rgb), 0.05); /* taken from -bs-table-striped-bg */
	--bs-primary-monochrome-100: lch(from var(--bs-primary) calc(l + 50) c h); /* same as --bs-primary-bg-subtle */
	--bs-primary-monochrome-200: lch(from var(--bs-primary) calc(l + 38) c h); /* same as --bs-primary-border-subtle */
	--bs-primary-monochrome-300: lch(from var(--bs-primary) calc(l + 25) c h);
	--bs-primary-monochrome-400: lch(from var(--bs-primary) calc(l + 13) c h);
	--bs-primary-monochrome-500: var(--bs-primary);
	--bs-primary-monochrome-600: lch(from var(--bs-primary) calc(l - 12) c h);
	--bs-primary-monochrome-700: lch(from var(--bs-primary) calc(l - 25) c h);
	--bs-primary-monochrome-800: lch(from var(--bs-primary) calc(l - 37) c h);
	--bs-primary-monochrome-900: lch(from var(--bs-primary) calc(l - 50) c h);
	--bs-border-radius: 0.25rem;
	--badge-pending: #5C99E0;
	--badge-success: #198754;
	--badge-error: #CB3F3F;
	--badge-info: rgba(12, 17, 29, 0.08);
	--badge-new: #198754;
	--color-main-black: #0c111d;
	--color-bg-main: #fff;
	--color-border-new: #EAECF0;
	--bs-body-font-family: 'Outfit', sans-serif;
}

/* these were documented as bootstrap utility classes, but must be 4 or later */
/*.float-left {
    float: left;
}
.float-right {
    float: right;
}

select::-ms-expand {
    display: block;
}*/

/* base popup modal dialog style */
.MooDialog {
	background-color: #ffc;
	padding: 10px;
	text-align: center;
	-moz-border-radius: 10px;
	-webkit-border-radius: 10px;
	border-radius: 10px; /* future proofing */
	-khtml-border-radius: 10px; /* for old Konqueror browsers */
	-webkit-box-sizing: content-box;
	-moz-box-sizing: content-box;
	box-sizing: content-box;
	line-height: inherit;
}

.MooDialogAlert, .popup-alert-p {
	font-weight: bold;
	font-size: larger;
}

.MooDialog span {
	display: block;
}

.MooDialog .buttons {
	padding-top: 8px;
	text-align: center;
}

.MooDialog .title {
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	bottom: auto;
	padding: 3px 20px;
	margin-bottom: 8px;
	border-radius: 0px;
	-moz-border-radius: 0px;
	-webkit-border-radius: 0px;
	/* change title bar font/colors */
	font-weight: bold;
	font-size: larger;
	/* text-shadow: 1px 1px 0 #000; */
	color: #000000; /* #ffc; */
	background: #99CCFF; /* #630; */
}

.popup-alert-p {
	margin-top: 2.8em; /* room for two lines of title */
}

/* constrain the resource name in the course form to a max width so the table doesn't wrap back to the beginning */
div#ctlTemplate_regMainBody_ctlCourseGeneralInfoEdit_ctl01_ctlResourcePickerContent table.hTable tBody tr td:first-child {
	max-width: 250px;
}

/* newer style summary header for simpler header */
div.summaryView div.summary-header {
	font-weight: bold;
	font-size: large;
	background: transparent;
	color: inherit;
	border: 0;
	padding: 0 0 0.25em 0;
}

	div.summaryView div.summary-header > dl {
		margin-top: 0;
	}

div.summaryView div.summary-details {
	border: 0 !important;
}

	div.summaryView div.summary-details .expandoContent,
	div.summary-details #wsExpand_container_FacilityInfo,
	div.summary-details #wsExpand_container_MeetingInfo,
	div.summary-details #wsExpand_container_PenaltySettings,
	div.summary-details #wsExpand_container_OfferingStatusTotals {
		border: 0 !important;
	}

div.summaryView div.summary-header .summary-sub {
	font-size: medium;
}

div#navList span {
	margin: 0.5em;
}

/*.radio input, .radio label {
	vertical-align: text-bottom;
}*/

	.radio input[type=radio] {
		position: unset;
		margin: 3px 3px 0px 5px;
	}

input[type=checkbox] {
	margin: 3px 3px 3px 5px;
}

.radio label {
	margin-right: 0.4em;
	min-height: unset;
	padding-left: unset;
	font-weight: unset;
	cursor: unset;
	display: unset;
}

/*.LiveCourseHeader label, .TeachingOptionsMobile label {
	font-size: 60%;
}*/

/* styling for fieldsets and collapsible fieldset lists */
DIV.DListStyle fieldset.title-hr {
	border: 0;
	padding: 0;
}

	DIV.DListStyle fieldset.title-hr legend {
		width: 100%;
		background-color: transparent;
		background: inherit;
	}

	DIV.DListStyle fieldset.title-hr legend, DIV.DListStyle .collapsible-fields .collapsiblePanel-title, .collapsiblePanel-title {
		font-size: var(--bs-body-font-size);
		font-weight: bold;
		border: 0;
		border-bottom: #999 1px solid;
		margin: 0 0 4px 0;
		padding: 0px;
		border-radius: 0px;
		-moz-border-radius: 0px;
	}

	DIV.DListStyle fieldset.title-hr .subText {
		margin-left: 8px;
		margin-right: 8px;
	}

span.subHeader {
	color: #666;
}

DIV.collapsiblePanel > DIV.DListStyle fieldset {
	padding-left: 0px;
}

fieldset fieldset.title-hr {
	margin: 0 !important;
	padding: 0 !important;
}

.collapsiblePanel-title {
	cursor: pointer;
}

/* line up with left of fieldset */
div.DListStyle fieldset.title_hr, DIV.DListStyle .collapsible-fields {
	margin-top: 4px;
	margin-left: 1em;
	margin-right: 1em;
}
.container-fluid div.DListStyle fieldset.title_hr, .container-fluid DIV.DListStyle .collapsible-fields {
	margin-top: initial;
	margin-left: initial;
	margin-right: initial;
}

div.DListStyle fieldset.title-hr dd.desc {
	float: none !important;
	display: table-cell;
}

div.DListStyle fieldset.save {
	margin: 0;
	padding-bottom: 0;
	padding-top: 8px;
}

div.DListStyle fieldset .dynamic {
	border-bottom: 0 !important;
}
/*div.picker,span.Nodata { margin: 0 0 10px 0px !important; }*/
fieldset.picker, fieldset.picker span.EmptyTableMessage {
	padding-top: 5px !important;
	margin: 0 0 10px 0px !important;
}

/* start header styles */
div.header-outer {
	min-height: 70px;
}

div.headerOuter {
	font-size: xx-small;
	height: 49px;
	background: #69c;
}

div.header-outer .headerLogo {
	z-index: 3;
	float: left;
	margin-left: 0px;
	margin-right: 7px;
}

div.header-outer a:link, div.header-outer a:visited, .headerText {
	text-decoration: none;
	font-weight: normal;
}

.headerText {
	font-size: x-small;
	padding-right: 3px;
}

.headerIcon {
	vertical-align: top;
}

/* end header styles */
/* start new menu styles */

div.ui_menu_itemSelected a, div.ui_menu_mainSelected a {
	border-bottom: solid 0px #ccc;
	border-right: solid 0px #ccc;
	border-left: solid 0px #ccc;
	display: block;
	text-decoration: none;
	padding: 5px 5px 5px 30px;
}

/* header/dropdown menu */

/* main container for the help/logout/user information */
.top-nav-container {
	padding: 0;
	margin: 0 6px auto;
	position: relative;
	right: 0;
	top: 3px;
	z-index: 599;
	background: inherit;
}

ul#top-nav-menu, ul.top-nav-menu {
	margin: 0;
	padding: 0;
	float: none;
	float: right;
	list-style: none;
	top: 0px;
	right: 0px;
	background: inherit;
}

	ul#top-nav-menu li, ul.top-nav-menu li {
		float: left;
		margin: 0;
		padding: 0 0 2px 8px;
		z-index: 9000;
		list-style: none;
		background: inherit;
	}

	ul#top-nav-menu .top-nav-flyover, ul.top-nav-menu .top-nav-flyover {
		display: none;
	}

		ul#top-nav-menu .top-nav-flyover li, ul.top-nav-menu .top-nav-flyover li {
			float: none;
			padding: 0 8px 2px 8px;
		}

	ul#top-nav-menu li a, ul.top-nav-menu li a {
		float: left;
	}

		ul#top-nav-menu li a:hover, ul.top-nav-menu li a:hover {
			color: #000;
		}

.headerText {
	display: block;
	padding: 0 4px 4px 0px;
	white-space: nowrap;
}
/*ul#top-nav-menu li .headerText, ul.top-nav-menu li .headerText
{
	display:block;
	background: url(../demo/images/MenuArrow.gif) no-repeat 3px 3px;
	padding: 0 0 4px 14px;
}*/
.top-nav-flyover li .headerText {
	padding: 0;
}
/*ul#top-nav-menu li .menu-open, ul.top-nav-menu li .menu-open
{
	background: url(../demo/images/MenuDnArrow.gif) no-repeat 3px 3px;
}*/

ul#top-nav-menu li .menu-open .top-nav-flyover, ul.top-nav-menu li .menu-open .top-nav-flyover {
	display: block;
}

ul#top-nav-menu li li .headerText, ul.top-nav-menu li li .headerText,
ul#top-nav-menu li li .headerText:hover, ul.top-nav-menu li li .headerText:hover {
	background: inherit;
	background-image: none;
}

#top-nav-account .top-nav-flyover {
	position: absolute;
	background: inherit;
	z-index: 90000;
	padding: 6px 0;
	border: solid 1px #333;
	border-bottom: solid 2px #333;
	right: 0;
}

#top-nav-account.openToggler .navigation, .no_js #top-nav-account:hover .navigation {
	display: block;
}

#top-nav-account .nav li {
	border-bottom: 0;
	padding: 0;
}

ul#top-nav-menu ul.top-nav-flyover li a, ul.top-nav-menu ul.top-nav-flyover li a {
	float: none;
	text-indent: 0; /*--Reset text indent--*/
	height: auto;
	margin: 0;
	display: block;
	text-decoration: none;
}

ul#top-nav-menu ul.top-nav-flyover .nav-divider, ul.top-nav-menu ul.top-nav-flyover .nav-divider {
	background: #ddd;
	font-size: 0;
	height: 1px;
	line-height: 0;
	margin: 6px 7px;
	padding: 0;
}

ul#top-nav-menu ul.top-nav-flyover li *, ul.top-nav-menu ul.top-nav-flyover li * {
	padding: 3px 0;
}

ul#top-nav-menu ul.top-nav-flyover a:hover, ul.top-nav-menu ul.top-nav-flyover a:hover {
	background: var(--bs-primary-monochrome-400);
	color: #fff;
}
/* end top menu styles */
/* left nav footer */
.custom-lnav {
	margin-top: 10px;
}

.course-tax-search, .custom-lnav-content {
	border: solid 1px #ccc;
}
/* end left nav footer */
.filters .collapsiblePanel-title {
	margin-left: 0px !important;
}

/* Flyover help text */
.tip-wrap {
	pointer-events: none; /* adding to address #57833 issue */
	z-index: 8000;
}

.tip-title, .tip-text {
	line-height: 1.1em;
	overflow: hidden;
	background-color: #ffc;
	text-align: left;
	white-space: normal;
}

.tip-title {
	font-size: var(--bs-body-font-size);
	font-weight: normal;
	color: #24407B;
	/* font-family: Arial; */
	max-width: 480px;
}

.tip-top {
	height: 14px;
	margin-bottom: -12px;
}

.tip {
	background-color: #ffc;
	padding: 16px;
	text-align: left;
	font-size: 11px;
	-moz-border-radius: 10px;
	-webkit-border-radius: 10px;
	border-radius: 10px; /* future proofing */
	-khtml-border-radius: 10px; /* for old Konqueror browsers */
	border: solid 1px #333;
}

.tip-bottom {
	height: 14px;
}

.helpimage {
	padding-left: 10px;
}

.portaladButton {
	display: block;
	margin: 5px auto;
	text-align: center;
}

.FeaturedCourses {
	display: none;
}

/* Cert Tree styling */
.noPrint {
	display: block;
}

.nodeheader {
	font-size: 8pt;
	padding: 4px 2px 0px 0px;
}

.nodedocuments {
	font-size: 8pt;
	border-style: none;
	margin: 5px 3px 0px 13px;
	padding-bottom: 0px;
}

	.nodedocuments > table {
		border: solid gray 1px;
	}

		.nodedocuments > table th, .nodedocuments > table td,
		.ruleTypePerf > table th, .ruleTypePerf > table td {
			border-style: none;
		}

.document > table {
	border: solid gray 1px;
	margin: 1px 1px 1px 0;
}

.margined {
	padding: 4px;
}

.padded {
	font-size: 8pt;
	padding: 2px 2px 2px 2px;
}

.ico { /* icons for certification, primary rule, generic rule */
	background-color: #69c;
	border: outset 1px lightgray;
	font-weight: bold;
	color: white;
	padding: 2px;
	margin-left: 4px;
	margin-right: 3px;
}

.ico2 { /* icons for course, ase */
	background-color: var(--bs-primary-monochrome-400);
	border: outset 1px lightgray;
	font-weight: bold;
	color: white;
	padding: 2px;
	margin-left: 4px;
	margin-right: 3px;
}

.treeButton { /* expand all, collapse all, print buttons */
	background-color: #69c;
	color: white;
	font-weight: bold;
	font-size: 10px;
	cursor: pointer;
	cursor: hand;
	/*font-family: Verdana;*/
	border: ridge 1px var(--bs-primary-monochrome-400);
	height: 20px;
}

.ctnd { /* expandable icon/row */
	padding: 2px 0px;
	text-align: left;
}

	.ctnd img {
		cursor: pointer;
		cursor: hand;
	}

.ruleTypePerf {
	margin: 4px 1px 1px 0;
}
/* certain rule types */
.coursease {
}
/* ASE course only */
/* End Cert Tree */

div#submitSuccess, div#submitFailure {
	font-size: 14px;
	padding-left: 20px;
	color: Green;
}

div#submitFailure {
	color: Red;
}

/* homepage main content area has extra potential styling because it is the first page seen after login */
div.homeContent {
	padding-top: 3px;
	border-top: solid 1px #ccc; /* border between breadcrumb and page */
}
/* Remaining characters display on announcements and other large text areas */
.countRemainingBox {
	padding: 2px;
}

.countRemaining {
	border: solid 1px black;
	padding: 2px;
}

.countRemainingWarning {
	border-color: red;
	color: red;
	font-weight: bold;
}

/* picker controls */
.picker-name-list /* this is the list of chosen item names in a picker control after you have chosen them (unless the picker uses a table) */ {
	display: block;
	max-height: 8em;
	overflow-y: auto; /* set to about 8 lines high in most browsers, with a vertical scrollbar if the list is taller */
}

table.certDetails {
	margin-top: 8px;
	margin-bottom: -4px;
}

	table.certDetails th {
		border: none;
		border-right: solid 0px #69c;
		background: #fff;
		color: #666;
		padding: 4px;
		vertical-align: top;
		font-size: 14px;
		font-weight: bold;
	}

#helpimagestyle img {
	padding: 0px;
}

.messageNotice {
	background-color: Yellow;
	padding: 12px 8px 12px 8px;
	font-weight: bold;
	margin: 5px 0px 15px 0px;
	border: solid 1px #000;
}

.readOnly {
	background-color: #ECECEC;
}

#MaxInactivedays, input[type="file"].file-inline {
	display: inline;
}

.uploadPanel {
	margin: 20px 20px 20px 20px;
}

.testButtonRow {
	margin-bottom: 20px;
	width: 100%;
	text-align: center;
}

.OnlyOnMobileFull {
	display: none;
}

.OnlyOnMobileBack {
	visibility: visible;
	-webkit-appearance: none;
	/*background-color: #dadadc;*/
	/*border: black 1px solid;*/
	/*-moz-border-radius: 8px 8px 8px 8px;
    border-radius: 8px 8px 8px 8px;
    -moz-box-shadow: 3px 3px 3px #666;*/
	/*box-shadow: 3px 3px 3px #666;*/
	/*text-decoration: none;*/
	font-weight: bold;
	font-size: 1.2em;
	margin-bottom: 4px;
}

.CGComponentName {
	width: 60%;
}

.CGComponentStatus {
	width: 20%;
}

.CGComponentAction {
	width: 20%;
}

.CGComponentTable {
	width: 70%;
	position: relative;
	left: 20px;
	top: 5px;
}

#CourseGroupActionData {
	position: relative;
	top: 22px;
}

#CourseGroupNameData {
	font-size: 14px;
}

.hTableHeader_tableSort_true {
	/*background: #2d71b3;
    color: #fff;*/
	font-weight: bold;
	padding-left: 15px;
	background-image: url(../../general/images/sortIndicator.desc.gif) !important;
	background-repeat: no-repeat;
	background-position: 3px 3px;
	vertical-align: bottom; /**/
}

.hTableHeader_tableSort_false {
	/*background: #2d71b3;
    color: #fff;*/
	font-weight: bold;
	padding-left: 15px;
	background-image: url(../../general/images/sortIndicator.asc.gif) !important;
	background-repeat: no-repeat;
	background-position: 3px 3px;
	vertical-align: bottom;
}
/* extra positioning for javascript sorting headers */
TD.hTableHeader_tableSort_true {
	background-position: 3px .9em;
}

TD.hTableHeader_tableSort_false {
	background-position: 3px .9em;
}

.hTableHeader_tableSort_false .sortHeader, .hTableHeader_tableSort_true .sortHeader {
	padding-left: 6px;
	margin-left: 4px;
}


/*User Search Criteria Styling*/

.hiddenServerControls {
	display: none;
}

.pnlResults {
	margin-left: 10px;
	float: left;
	clear: both;
	margin-top: 30px;
	width: 98%;
}

.rowimg {
	width: 20px;
	height: 20px;
	vertical-align: middle;
	margin-left: 20px;
	cursor:pointer;
}

.rowimg .action-icon {
	color: var(--bs-primary);
	width: initial;
}

	.rowimg .action-icon:hover {
		color: var(--bs-btn-hover-color);
		background-color: var(--bs-btn-hover-bg);
		border-color: var(--bs-btn-hover-border-color);
	}

#dynamicCriteriaTable {
	width: 100%;
}

	#dynamicCriteriaTable img {
		cursor: pointer;
	}

	#dynamicCriteriaTable tr {
		height: 40px;
	}
	/* match selectize-input style */
	#dynamicCriteriaTable input,
	#dynamicCriteriaTable button.calButton.btn {
		border: 1px solid #d0d0d0;
	}

	#dynamicCriteriaTable button.calButton.btn {
		padding: 0.25rem 0.6rem;
	}

.userSearchButton {
	float: right;
	margin-right: 20px;
	margin-top: 20px;
}

.pnlResultsMessage {
	font-size: 14px;
	width: 500px;
}

.criteriaerror {
	font-size: 8px;
	color: red;
	font-weight: bold;
}

.ddlcriteria {
	width: 160px;
}

.ddloperators {
	min-width: 100px;
	max-width: 160px;
}

.pnlUserResults {
	width: 100%;
	float: left;
}

/* Goal status page styling */

.GoalMet {
	color: green;
	font-weight: bold;
}

.GoalNotMet {
	color: red;
	font-weight: bold;
}

.goalCancel {
	background: url("../images/Cancel.gif") no-repeat 0 0;
	background-size: contain;
	margin-left: 10px;
	cursor: pointer;
	border: 0;
	height: 15px;
	width: 15px;
}

/* Required Training Widget styles*/

.MoreLink {
	text-align: center;
	margin-top: 10px;
}

.AddEditConfirmationMessage {
	background: #ffc;
	border: 1px solid #960;
	color: #630;
	padding: .5em;
	margin-bottom: 10px;
	border-radius: 8px;
	-moz-border-radius: 8px;
}

	.AddEditConfirmationMessage DIV.AECMmessages {
		display: table;
		margin: 0 0 0 0;
	}

	.AddEditConfirmationMessage DIV.AECMimages {
		float: left;
		margin: 0 1em 0 0;
		width: 27.5em;
	}

.baseText {
	font-weight: normal;
	color: #000000;
}
/* /*new header common css*/
/* .navbar-bg { */
/* background-color: white; */
/* } */

/*adjust distorted layout*/
legend {
	width: inherit;
	font-size: inherit;
}

.breadcrumb {
	padding: inherit;
	margin-bottom: inherit;
	background-color: inherit;
	border-radius: inherit;
}

/*end adjust distorted layout*/

/******************************************************************SELECTIZE CSS ********************************************************************************************/

.selectize-input {
	border-radius: var(--bs-border-radius);
}

.selectize-dropdown [data-selectable] {
	padding: 5px 8px;
}

.selectize-dropdown .selected {
	background-color: var(--bs-gray-200);
	color: unset;
}

.selectize-dropdown .active:not(.selected) {
	background-color: var(--bs-primary);
	color: var(--bs-primary-contrast);
}

.selectize-control .selectize-dropdown .caption {
		display: block;
	font-size: 10px;
	font-style: italic;
	color: var(--bs-secondary);
}

.selectize-control .selectize-dropdown .active:not(.selected) .caption {
	color: var(--bs-primary-contrast);
}

.selectize-control .selectize-dropdown .label {
	display: block;
	padding: 0;
	font-size: 12px;
}

.selectize-control .selectize-dropdown .active:not(.selected) .label {
	color: var(--bs-primary-contrast);
}

.selectize-control.single::before {
	transition: opacity 0.2s;
	content: ' ';
	z-index: 2;
	position: absolute;
	display: block;
	top: 0.5rem;
	right: 2.1rem;
	width: 1rem;
	height: 1rem;
	background: url(../jscripts/selectize/css/spinner_selectize.gif);
	background-size: 1rem;
	opacity: 0;
}

.selectize-control.single.loading::before {
	opacity: 1.0;
}

.selectize-control.MultiPickerInput::before {
	transition: opacity 0.2s;
	content: ' ';
	z-index: 2;
	position: absolute;
	display: block;
	top: 0.5rem;
	right: 0.9rem;
	width: 1rem;
	height: 1rem;
	background: url(../jscripts/selectize/css/spinner_selectize.gif);
	background-size: 1rem;
	opacity: 0;
}

.selectize-control.MultiPickerInput.loading::before {
	opacity: 0.4;
}

.selectize-control.multi .selectize-input>div.active {
	background: var(--bs-primary);
	color: var(--bs-primary-contrast);
}

.selectize-control.multi .selectize-input>div.active .remove {
	border-color : var(--bs-primary-contrast);
	color: var(--bs-primary-contrast);
}

.selectize-control.plugin-remove_button [data-value] .remove {
	border-left: 1px solid;
	border-left-color: var(--bs-body-color);
	padding-left: 4px;
	margin-left: 4px;
	color: var(--bs-body-color);
}

/******************************************************************SELECTIZE CSS END ********************************************************************************************/

/******************************************************************STYLESHEET CSS BEGIN******************************************************************************************/
/****
* styles from stylesheet.css
****/

/* Default Framed 1200px LMS Stylesheet */
/* Branding: change var(--bs-primary) to desired menu color */
/* Branding: change #d7e7f6 to desired menu background color */
/* Branding: change var(--bs-primary) to desired section header color */
/* Branding: change #eeeeee to desired footer color */
/* Branding: change #7088B4 to desired link hoover color */
/* Branding: change #727272 to desired link color */
/* Branding: change #eeeeee to desired background color */
/* search "HeaderContainer" to adjust header height */
/* search "Frame Width" to adjust display width */


DIV.DListStyle fieldset.title-hr legend, DIV.DListStyle .collapsible-fields .collapsiblePanel-title, .collapsiblePanel-title {
	font-size: x-large;
	font-weight: normal;
	border-bottom: #EEE 1px solid !important;
}

div.DListStyle fieldset dl {
	border-top: 0px solid !important;
	border-bottom: 0px solid !important;
	margin-bottom: 2px !important;
	margin-top: 2px !important;
}

/*div.DListStyle .prettyButtons, .prettyButtons, .prettyButtonsDark, .prettyButtonsDisabled, a.prettyButtonsDark:link, a.prettyButtonsDark:visited, a.prettyButtonsDark:active, a.prettyButtonsDark:hover, a.prettyButtonsDisabled:link, a.prettyButtonsDisabled:visited, a.prettyButtonsDisabled:active, a.prettyButtonsDisabled:hover, a.prettyButtons:link, a.prettyButtons:visited, a.prettyButtons:active, a.prettyButtons:hover {
	height: 30px;
}*/

div.DListStyle .rowimg {
	margin-left: 10px !important;
}

div.ui_menu_mainSelected a {
	padding: 5px 5px 5px 20px !important;
	color: var(--bs-primary-monochrome-300);
	font-weight: normal;
}

div.ui_menu_itemSelected a, div.ui_menu_mainSelected a {
	font-weight: normal;
	color: var(--bs-primary-monochrome-300);
	font-size: 14px;
}

.Week_Container a {
	height: 20px;
}

.ThisNeedsToGo {
	width: 100%;
}

.collapsePanel {
	width: 100%;
	background-color: white;
	overflow: hidden;
}

div.EditInterestLink {
	display: none !important;
}

.collapsiblePanel-collapsed {
	display: none;
}

.updatePanelProgress {
	color: Blue;
	float: left;
}

.collapsible-fields, .collapsiblePanel-title, .collapsiblePanel-title {
	border: 0px;
	font-size: var(--bs-body-font-size);
}

.widthContainer {
	width: 100%;
}
/* End */

/* plus and minus image for expansion controls */
.expansionImage {
	padding-right: 8px;
}

.loadingImage {
	padding-left: 30px;
}

.aspx-spinner {
	padding: 0.5rem;
	transform: translate(-50%, -50%);
	left: 50%;
	top: 50%;
	position: fixed;
	background: var(--color-bg-main);
	border: var(--bs-border-width) solid var(--bs-border-color);
	z-index: 1000;
}
.jsDebug {
	background: #ffffff;
	padding: 5px;
	border: 1px solid #999999;
	overflow: scroll;
	height: 300px;
	width: 100%;
}

.myEmployeeTab {
	background: #FFE;
}

/* begin Roster Tabs styles */

div.rosterTabs {
	white-space: nowrap;
	margin: 5px 0 6px 0;
	display: block;
}

	div.rosterTabs a, div.rosterTabs a:visited {
		border: #eeeeee 1px solid;
		/*        -moz-border-radius: 0px 0px 0 0; */
		border-radius: 4px;
		padding: 8px 8px 12px 8px;
		display: inline;
		font-weight: normal;
		background: #ffffff;
		color: var(--bs-primary);
		text-decoration: none;
	}

		div.rosterTabs a:hover {
			/* border: #eeeeee 1px solid; */
			/* border-radius: 4px; */
			/* padding: 8px 8px 12px 8px; */
			/* display: inline; */
			/* font-weight: normal; */
			background: #eeeeee;
			color: var(--bs-primary);
			/* text-decoration: none; */
			/* margin-left: 6px; */
		}

		div.rosterTabs a.highlightTab, div.rosterTabs a.highlightTab:link, div.rosterTabs a.highlightTab:visited, div.rosterTabs a.highlightTab:hover, div.rosterTabs a.highlightTab:active {
			background: var(--bs-primary);
			color: var(--bs-primary-contrast);
			border: var(--bs-primary) 1px solid;
		}

		div.rosterTabs a.myEmployeeTab, div.rosterTabs a.myEmployeeTab:link, div.rosterTabs a.myEmployeeTab:visited,
		div.rosterTabs a.myEmployeeTab:hover, div.rosterTabs a.myEmployeeTab:active {
			background: var(--bs-primary);
			border: var(--bs-primary) 1px solid;
			color: var(--bs-primary-contrast);
		}

		div.rosterTabs a.myEmployeeInactiveTab,
		div.rosterTabs a.myEmployeeInactiveTab:link,
		div.rosterTabs a.myEmployeeInactiveTab:visited,
		div.rosterTabs a.myEmployeeInactiveTab:active {
			background: #fff; /* might be a candidate for --bs-body-bg */
		}

			div.rosterTabs a.myEmployeeInactiveTab:hover {
				background: #eeeeee; /* might be a candidate for --bs-nav-link-hover-bg, if such a thing existed */
			}

		div.rosterTabs a.disableTab, div.rosterTabs a.disableTab:link, div.rosterTabs a.disableTab:visited, div.rosterTabs a.disableTab:hover, div.rosterTabs a.disableTab:active {
			color: var(--bs-primary);
		}

.tabbedPageContainer {
	padding: 25px 15px 15px 5px;
	border-top: 0px solid var(--bs-primary);
	border-bottom: 0px solid #999;
	border-left: 0px solid #999;
	border-right: 0px solid #999;
}

/* end Roster Tabs styles */

/* begin roster tab sub nav styles */


.rosterTabSubNav {
	margin: 0 0 10px 0;
	padding: 0;
}

dl.rosterTabSubNav dt {
	color: var(--bs-primary);
	display: inline;
	font-weight: bold;
	padding-right: 5px;
}

dl.rosterTabSubNav dd {
	display: inline;
	border-left: 1px solid #999;
	margin: 0;
	padding: 0 10px;
}

	dl.rosterTabSubNav dd#firstOne {
		border: 0;
		padding-left: 0;
	}

	dl.rosterTabSubNav dd a, dl.rosterTabSubNav dd a:visited {
		color: #00f;
	}

/* end offering summary list styles */ /* CSS Document */

.abbreviatedNoteCollapsed {
	width: 190px;
	white-space: normal !important; /*ticket 55133*/
	overflow: hidden;
	float: left;
}

.abbreviatedNoteExpanded {
	width: 190px;
	height: 60px;
	white-space: normal;
	overflow: auto;
	float: right;
}

.abbreviatedNoteCollapsed dt {
	display: none;
}

.abbreviatedNoteCollapsed dd {
	display: block;
}

.abbreviatedNoteExpanded dt div {
	font-weight: normal;
}


.abbreviatedNoteCollapsed dl {
	margin-top: 0px;
	background-color: transparent;
	border: dashed 0px #ccc;
}

.abbreviatedNoteExpanded dl {
	margin-top: 0px;
	width: 170px;
	border: dashed 1px #ccc;
	border-left: 0px;
	border-right: 0px;
}


.editButtonContainer {
	float: right;
}

.textInputElement {
	width: 190px;
	height: 60px;
}

/* begin offering summary list styles */

dl.summaryView {
	margin: auto auto 20px auto;
}

	dl.summaryView dt {
		background: var(--bs-primary-monochrome-400);
		padding: .5em 1em;
	}

		dl.summaryView dt label, dl.summaryView dt span, dl.summaryView dt div {
			color: #fff;
			font-weight: bold;
		}

	dl.summaryView dd {
		border: 0px solid #999;
		border-top: 0;
		margin-left: 0;
		padding: 0;
	}

		dl.summaryView dd dl {
			border-left: 0px solid #999;
			padding-left: 1em;
			display: inline;
			white-space: nowrap;
		}

			dl.summaryView dd dl.first {
				border-left: 0;
				padding-left: 0;
			}

			dl.summaryView dd dl dt {
				border: 0;
				background: none;
				color: var(--bs-primary);
				display: inline;
				padding: 0;
			}

			dl.summaryView dd dl dd {
				border: 0;
				display: inline;
				margin-left: .3em;
				margin-right: 1em;
				padding: 0;
			}

		dl.summaryView dd div.summaryDetails div {
			padding: .5em 1em;
			border: 0px solid #999;
			border-width: 0px 0 0 0;
		}

			dl.summaryView dd div.summaryDetails div.alt {
				background: #eee;
			}


div.summaryView {
	margin: 0 0 20px 0;
	border: solid 0px #eee;
}

	div.summaryView div.summaryHeader {
		background: var(--bs-primary);
		padding: .5em 1em;
		color: var(--bs-primary-contrast);
		font-weight: bold;
	}

	div.summaryView div.summaryDetails {
		border: 0px solid #999;
		border-top: 0;
		padding: 0;
	}

		div.summaryView div.summaryDetails div {
			padding: .5em 1em;
			border: 0px solid #999;
			border-width: 0px 0 0 0;
		}

			div.summaryView div.summaryDetails div.alt {
				background: #eee;
			}

		div.summaryView div.summaryDetails dl {
			border-left: 0px solid #999;
			padding-left: 1em;
			display: inline;
			white-space: nowrap;
		}

			div.summaryView div.summaryDetails dl.first {
				border-left: 0;
				padding-left: 0;
			}

			div.summaryView div.summaryDetails dl dt {
				border: 0;
				background: none;
				color: var(--bs-primary);
				display: inline;
				padding: 0;
			}

			div.summaryView div.summaryDetails dl dd {
				border: 0;
				display: inline;
				margin-left: .3em;
				margin-right: 1em;
				padding: 0;
			}

.offering-description {
	max-height: 6em;
	overflow: auto;
}

/* end offering summary list styles */


div.DListStyle {
	border-top: 0px solid var(--bs-primary);
	border-bottom: 0px solid #999;
	border-left: 0px solid #999;
	border-right: 0px solid #999;
	float: none;
	margin: 0;
	padding: 10px;
}

	div.DListStyle fieldset {
		clear: both;
		background: none;
		border-top: 0px solid #999;
		border-bottom: 0px solid #999;
		border-right: 0px solid #999;
		border-left: 0px solid #999;
		margin: 0 0 1em 0;
		padding: 0 1em 1em 1em;
		-moz-border-radius: 0px;
		border-radius: 0px;
		/*-moz-box-shadow: 3px 3px 3px #666;
progid:DXImageTransform.Microsoft.Shadow(color=#000000,direction=135);
-webkit-box-shadow: 3px 3px 3px #666;
box-shadow: 3px 3px 3px #666;*/
	}

		/* Where do we have a table inside of a field set? */
		div.DListStyle fieldset table {
			margin-top: 1em;
			width: 100%;
		}

		div.DListStyle fieldset legend {
			color: var(--bs-primary);
			/* background: #cccccc;
	border: 1px solid #eeeeee; */
			font-size: x-large;
			font-weight: normal;
			padding: .1em;
			margin: 6px 0 6px 0;
			border-radius: 0px;
			-moz-border-radius: 0px;
            width: 100%; /* there were some instances where items were showing up next to the ledgend, even if there was a br */
		}

			div.DListStyle fieldset legend span.subText {
				font-weight: normal;
			}

		div.DListStyle fieldset dl {
			clear: left;
			margin: 0;
			padding: .5em 0 .5em 0;
			width: 100%;
		}

	div.DListStyle div dl {
		float: left;
	}

	div.DListStyle fieldset dl {
		float: left;
	}

.DListStyle fieldset dl.alt {
	background: inherit;
	/*added to fix the duplicate bit's when adding resources on course/admin/course_add.aspx or

course/admin/course_general_info_edit.aspx */
	float: none;
	overflow: hidden;
}

.DListStyle fieldset dl.dynamic {
	background: #ffffff;
	margin: 1px 0 0 0;
}

div.DListStyle fieldset dl dt {
	color: #666;
	display: block;
	float: left;
	margin-right: 1em;
	text-align: right;
	width: 27em;
}

@media(max-width:1200px) {
	div.DListStyle fieldset dl dt {
		width: 19em;
	}
}
@media(max-width:800px) {
	div.DListStyle fieldset dl dt {
		width: 14em;
	}
}

@media(max-width:590px) {
	div.DListStyle fieldset dl dt {
		text-align: left;
		width: 100%;
	}
}

	div.DListStyle fieldset dl dt.Truncated {
		color: #666;
		display: block;
		float: left;
		margin-right: 1em;
		text-align: right;
		width: 10em;
	}

div.DListStyle fieldset dl.alt dt {
	color: #555;
}

div.DListStyle fieldset dl dd {
	display: block;
	float: left;
	margin-left: 0; /*width:65%;*/
}

@media(max-width:500px) {
	div.DListStyle fieldset dl dd {
		clear: left;
	}
}

	div.DListStyle fieldset dl dd table {
		display: table;
		float: none;
		margin: 0;
		width: auto;
	}

div.DListStyle div#button {
	margin-top: 1em;
}

div.DListStyle fieldset dl dt label {
	color: var(--bs-primary);
	display: block;
	white-space: normal;
	font-weight: normal;
}

.brandLabel {
	color: var(--bs-primary);
	display: inline;
	white-space: normal;
	font-weight: bold;
}
/* Label Span can be removed soon, as the sub header is being taken out of the label */
div.DListStyle fieldset dl dt label span.dListLabelSubHeader, div.DListStyle dl dt span.dListLabelSubHeader {
	color: #666;
	display: block;
	font-weight: normal;
	white-space: normal;
	font-size: small;
}

.d-flex > .dListLabelSubHeader {
	font-size: 0.8em;
}

div.DListStyle div.hide {
	display: none;
}

.expandImagePlus {
	width: 13px;
	height: 12px;
	padding: 0px;
	margin: 0px;
	background: url( "../../general/images/status_indicators/button_plus.gif" ) no-repeat 0px 3px;
	cursor: pointer;
}

.expandImageMinus {
	width: 13px;
	height: 12px;
	padding: 0px;
	margin: 0px;
	background: url( "../../general/images/status_indicators/button_minus.gif" ) no-repeat 0px 3px;
	cursor: pointer;
}

.spacingR {
	margin-right: 4px; /* add needed non breaking spacing between label and input */
}

.spacingL2 {
	margin-left: 0px;
	background-color: #2d71b3;
	padding: 6px 8px 6px 8px;
	border: 1px;
	color: #ffffff;
	vertical-align: middle;
}

	.spacingL2:hover {
		margin-left: 0px;
		background-color: var(--bs-primary-monochrome-600);
		padding: 6px 8px 6px 8px;
		border: 1px;
		color: #ffffff;
		vertical-align: middle;
	}

table dl {
	margin-bottom: 0;
	margin-left: 0;
	margin-right: 0;
}

	table dl dt {
		background: none;
		font-weight: bold;
		padding-left: 0;
		white-space: nowrap;
	}

	table dl dd {
		margin-left: 0;
		padding-left: 0;
	}


/* begin more info tool tips */
.moreInfoToolTip {
	display: none;
	font-size: .85em;
	margin-top: .3em;
	position: relative;
	z-index: 9;
}

	.moreInfoToolTip dl {
		display: inline;
		margin-top: .3em;
	}

		.moreInfoToolTip dl dt, .moreInfoToolTip dl dd {
			display: inline;
		}

		.moreInfoToolTip dl dt {
			font-weight: normal;
		}

/* end more info tool tips */

/* an attempt to define font family once. we shouldn't need to re-define it for different markup if it's defined in the body.*/
body {
	color: #000;
	background: #ffffff;
	margin: 0;
	padding: 0 0 0px 0 !important; /* ticket 66874 */
	/* changed to inherit font-family and size from bootstrap var defined at :root */
	/* font-size: var(--bs-body-font-size); 12px*/
	;
	/*text-align: center;*/
}

/*
p, td, th, select, input, textarea {
	font-family: "Trebuchet MS", Helvetica, sans-serif;
	font-size: 12px;
    text-align: left; -- this was causing landing page icons to shift to left.
}
*/

/*
div {
    font-family: "Trebuchet MS", Helvetica, sans-serif;
	font-size: 12px;
	text-align: left;
	}
*/

/*
body {
	font-family: "Trebuchet MS", Helvetica, sans-serif;
	font-size: 9px;
}
*/



table, td, th {
	border: 0px #999;
	border-collapse: collapse;
	border-spacing: 0;
	empty-cells: show;
	font-size: inherit;
}

h1 {
	font-size: 120%;
}


h2 {
	font-size: 1.5em;
	font-weight: normal;
}

.cellCourseTopicsBackground {
	background-color: rgba(var(--color-bg-main), 1);
	border-left: 20px solid #f7f7f7;
	border-top: 20px solid #f7f7f7;
	border-bottom: 20px solid #f7f7f7;
	vertical-align: top;
	max-width: 200px;
}

.contentBackground {
	background: #fff;
	/*border: 20px solid #f7f7f7;
    border: 20px solid #fff;*/
}

.content, #cellPrimary {
	background: #fff;
}

.content {
	padding: 15px;
}

.tdColor1 {
	-moz-border-radius: 0 0 0px 0px;
	border-radius: 0 0 0px 0px;
	background: #ffffff;
	color: #fff;
	border: solid 0px #ccc;
}

/* Table styles */

.tableBorder {
	border: solid 1px #f7f7f7 !important;
}

	.tableBorder td, .tableBorder th {
		padding: 0.5em;
	}
.tableHeader {
	background: var(--bs-primary);
	font-weight: bold;
	color: #fff;
	border-top: solid 0px #999;
	border-left: solid 0px #999;
	border-right: solid 0px #999;
	border-bottom: solid 0px #999;
}

.tableContent {
	background: #fff;
	border-top: solid 0px #999;
	border-left: solid 0px #999;
	border-right: solid 0px #999;
	border-bottom: solid 0px #999;
}

.tableContent_Alternate {
	background: #eee;
	border-top: solid 0px #999;
	border-left: solid 0px #999;
	border-right: solid 0px #999;
	border-bottom: solid 0px #999;
}
.tableContent td, .tableContent_Alternate td {
	padding: 0px 3px;
}
.tableContent_selected {
	background: #ccc;
	border-top: solid 0px #666;
	border-left: solid 0px #666;
	border-right: solid 0px #666;
	border-bottom: solid 0px #666;
}

/* End table styles */

/* Styles for vertical tables, "v" is for vertical */

.vTable {
	border: solid 1px #eee; /* For Netscape */
	width: 100%;
}

.vTableHeader, .vTableContent, .vTableContent_alternate {
	border: solid 0px #999;
	padding: 8px;
}

.vTableHeader {
	background: var(--bs-primary);
	color: #fff;
	font-weight: bold;
	width: 20%;
	text-align: right;
	vertical-align: top;
}

.vTableContent {
	background: #fff;
}

.vTableContent_alternate {
	background: #eee;
}

.vTableContent_Selected {
	background: #ccc;
	border: solid 1px #666;
	padding: 8px;
}

/* End vertical tables styles */

/* Styles for horizontal tables, "h" is for horizontal */

.hTable {
	border: solid 1px #eee; /* For Netscape */
	width: 100%;
}

.hTableHeader, .hTableContent, .hTableContent_Alternate, .hTableContent_Pending, .hTableContent_MinPadding,
.hTableContent_MinPadding_Alternate, .hTableHeader td,
.hTableContent td, .hTableContent_Pending td, .hTableContent_Alternate td,
.hTableContentConflict td {
	border: solid 0px #999;
	padding: 6px;
	vertical-align: middle;
}

.hTableHeader {
	background: var(--bs-primary);
	color: var(--bs-primary-contrast);
	font-weight: bold;
}

.hTableSubHeader, .hTableSubHeader td {
	border-left: solid 0px #999;
	border-right: solid 0px #999;
	border-top: solid 0px #999;
	border-bottom: solid 0px #999;
	padding: 1px 6px 1px 6px;
	vertical-align: top;
	background: #CCCCCC;
	color: #fff;
	font-weight: bold;
}

.hTableContent {
	background: #fff;
}

.hTableContent_Alternate {
	background: #efefef;
}

.hTableContent_Pending {
	background: #FFFFFF;
}

.hTableContent_MinPadding {
	padding: 3px;
	vertical-align: middle;
}

.hTableContent_MinPadding_Alternate {
	padding: 4px;
	vertical-align: middle;
	background: #eee;
}

.hTableContent_Selected {
	background: #ccc;
	border: solid 1px #666;
	padding: 8px;
}

.hTableContentConflict {
	background-color: #ffc;
}

.hTableHeader_tableSort_SortingIndicator {
	background-color: var(--bs-primary);
	color: #fff;
	font-weight: bold;
	margin-left: 8px;
}

.hTableHeader_tableSort_true {
	/*background: var(--bs-primary);
    color: #fff;*/
	font-weight: bold;
	padding-left: 15px;
	background-image: url(../../general/images/sortIndicator.desc.gif);
	background-repeat: no-repeat;
	background-position: 3px 3px;
	vertical-align: bottom; /**/
}

.hTableHeader_tableSort_false {
	/*background: var(--bs-primary);
    color: #fff;*/
	font-weight: bold;
	padding-left: 15px;
	background-image: url(../../general/images/sortIndicator.asc.gif);
	background-repeat: no-repeat;
	background-position: 3px 3px;
	vertical-align: bottom;
}
/* extra positioning for javascript sorting headers */
TD.hTableHeader_tableSort_true {
	background-position: 3px .9em;
}

TD.hTableHeader_tableSort_false {
	background-position: 3px .9em;
}

.hTableHeader_tableSort_false .sortHeader, .hTableHeader_tableSort_true .sortHeader {
	padding-left: 6px;
	margin-left: 4px;
}

.EmptyTableMessage {
	margin: auto 20px;
	font-size: var(--bs-body-font-size);
	display: block;
	/* background-color: #eee; */
	border: solid 0px #999;
	padding: 5px;
	/* text-align: center; */
	font-weight: bold;
	color: #666;
}

.AttentionMessage {
	background: #ffc;
	border: 0px solid #960;
	color: #000000;
	padding: .5em;
}

.AddEditConfirmationMessage {
	background: #deeebe;
	border: 0px solid #960;
	color: #000000;
	padding: .5em;
	margin-bottom: 10px;
}

	.AddEditConfirmationMessage DIV.AECMmessages {
		display: table;
		margin: 0 0 0 0;
	}

	.AddEditConfirmationMessage DIV.AECMimages {
		float: left;
		margin: 0 1em 0 0;
		width: 27.5em;
	}

	.AddEditConfirmationMessage IMG {
		float: right;
	}

.ImpersonationPanel {
	background: #ffc;
	border: 1px solid #960;
	padding: .5em;
	padding-left: .5em;
	margin-bottom: 10px;
}

.ImpersonationPanelLinks {
	float: right;
	padding-left: 4px;
}
/* End horizontal tables styles */

/* Begin nested and parent datagrid styles */

.grd_Parent, .grd_Child {
	width: 100%;
}

.child_header {
	background: #69c;
	color: #FFF;
	font-weight: bold;
}
/* end nested and parent datagrid styles */

/* Button Styles */

.prettyButtons, .prettyButtonsDark, .prettyButtonsDisabled, a.prettyButtonsDark:link, a.prettyButtonsDark:visited,
a.prettyButtonsDark:active,
a.prettyButtonsDark:hover, a.prettyButtonsDisabled:link, a.prettyButtonsDisabled:visited,
a.prettyButtonsDisabled:active, a.prettyButtonsDisabled:hover, a.prettyButtons:link, a.prettyButtons:visited,
a.prettyButtons:active, a.prettyButtons:hover {
	border-radius: var(--bs-border-radius);
	/* -moz-box-shadow: 4px 4px 4px #666;
        box-shadow: 4px 4px 4px #666; */
	text-decoration: none;
	height: inherit !important; /* overrides old custom css that set height to 20px because of old stylesheet template */
	padding: 6px 8px;
	font-weight: bold;
	font-size: var(--bs-body-font-size);
	border: var(--bs-primary-monochrome-600) 0px solid; /* was #336699 note this deviates from bs in that the bg and border are both the same color usually */
	color: var(--bs-primary-contrast);
	margin-bottom: 6px;
}

a.prettyButtonsDark:link, a.prettyButtonsDark:visited, a.prettyButtonsDark:active, a.prettyButtonsDark:hover,
a.prettyButtonsDisabled:link,
a.prettyButtonsDisabled:visited, a.prettyButtonsDisabled:active, a.prettyButtonsDisabled:hover,
a.prettyButtons, a.prettyButtons:link, a.prettyButtons:visited, a.prettyButtons:active, a.prettyButtons:hover {
	padding: 6px 8px;
	/*height: 30px;*/
}

.prettyButtons, .prettyButtonsDark {
	cursor: pointer;
}

.prettyButtons, .actionLinkVertical, .actionLink {
	/* orange background
        background: #E26613; */
	background: var(--bs-primary);
	display: inline-block;
}

	.prettyButtons:hover, .actionLinkVertical:hover, .actionLink:hover {
		background: var(--bs-primary-monochrome-600);
	}


.prettyButtonsDisabled, .actionLinkDisabled, .actionLinkVerticalDisabled {
	background: #999999;
}

.prettyButtonsDark {
	background: #E26613;
}

.actionLinkVerticalDisabled,
a.actionLinkVerticalDisabled:link,
a.actionLinkVerticalDisabled:visited,
a.actionLinkVerticalDisabled:active,
a.actionLinkVerticalDisabled:hover,
 .actionLinkVertical,
a.actionLinkVertical:link,
a.actionLinkVertical:visited,
a.actionLinkVertical:active,
a.actionLinkVertical:hover,
 .actionLinkDisabled,
a.actionLinkDisabled:link,
a.actionLinkDisabled:visited,
a.actionLinkDisabled:active,
a.actionLinkDisabled:hover, .actionLink,
a.actionLink:link,
a.actionLink:visited,
a.actionLink:active,
a.actionLink:hover {
	border-radius: var(--bs-border-radius);
	vertical-align: middle;
	padding: 4px 5px 5px 5px;
	margin: 2px 0px 2px 0px;
	white-space: nowrap;
	border: var(--bs-primary) 0px solid;
	color: var(--bs-primary-contrast);
	font-weight: bold;
	font-size: small;
	text-align: center;
	text-decoration: none;
	width: auto;
}
.actionLinkVerticalDisabled.btn,
a.actionLinkVerticalDisabled:link.btn,
a.actionLinkVerticalDisabled:visited.btn,
a.actionLinkVerticalDisabled:active.btn,
a.actionLinkVerticalDisabled:hover.btn,
.actionLinkVertical.btn,
a.actionLinkVertical:link.btn,
a.actionLinkVertical:visited.btn,
a.actionLinkVertical:active.btn,
a.actionLinkVertical:hover.btn,
.actionLinkDisabled.btn,
a.actionLinkDisabled:link.btn,
a.actionLinkDisabled:visited.btn,
a.actionLinkDisabled:active.btn,
a.actionLinkDisabled:hover, .actionLink.btn,
a.actionLink:link.btn,
a.actionLink:visited.btn,
a.actionLink:active.btn,
a.actionLink:hover.btn{
	padding: var(--bs-btn-padding-y) var(--bs-btn-padding-x);
	margin: 0 0 2px 0;
}

input.actionLinkVerticalDisabled, input.actionLinkVertical {
	display: block;
	width: 100%;
}

input.actionLinkVertical, input.actionLink {
	cursor: pointer;
}

a.actionLinkVerticalDisabled, a.actionLinkVertical {
	display: block;
	width: 100%; /* entire block isn't clickable with an expression */ /* make link buttons look similar to INPUT

buttons.  */
	padding: 1px 5px 1px 5px; /* height: 1.8em; is even closer, but costs height */
}

.actionLinkDisabled, .actionLink {
	height: 30px;
	display: inline;
}

.HideAll {
	display: none;
}

.ShowAll {
	display: inline;
}

a[role="button"], a[role="button"]:visited, a[role="button"]:hover, a[role="button"]:active,
a:link, a:visited, a:hover, a:active {
	text-decoration: none;
	overflow-wrap: break-word;
}

	/*#75195 - Fix visibility of edit favorite tools icon*/
	a:visited > .fa.fa-pencil.action-icon {
		color: #fff;
	}

a:hover {
	color: var(--bs-link-hover-color);
	text-decoration: none;
}

a:active {
	color: var(--bs-link-color-rgb);
	text-decoration: none;
}

a#ctlTemplate_regMainBody_fsetStatusActions_ctlCourseSelfStudyStatus_btnPurchase {
	padding: 7px 8px 9px 8px;
}

a.featuresLink:link, a.featuresLink:visited, a.featuresLink:active, a.featuresLink:hover {
	color: #ccc;
	font-weight: bold;
	font-size: var(--bs-body-font-size);
	text-decoration: none;
}

a.userMenuLink:link, a.userMenuLink:visited, a.userMenuLink:hover, a.userMenuLink:active {
	color: #003;
	font-weight: bold;
	font-size: var(--bs-body-font-size);
	text-decoration: none;
}

a.whiteLink:link, a.whiteLink:visited, a.whiteLink:hover, a.whiteLink:active {
	font-size: 10px;
	color: var(--bs-primary);
	font-weight: bold;
}

span.sortHeader {
	text-decoration: underline;
	cursor: pointer;
}

a.sortHeader:link, a.sortHeader:visited, a.sortHeader:hover, a.sortHeader:active {
	color: #fff;
	font-weight: bold;
}

img.sortIndicator {
	padding-right: 3px;
	padding-left: 0px;
	margin: 0;
	margin-top: 2px;
	margin-bottom: 5px;
	vertical-align: top;
	float: left;
}

.header {
	color: var(--bs-primary);
	font-weight: normal;
	font-size: x-large;
}

	.header > i.fa-regular, .header > i.fa-solid, .header > i.fa-light, .header > i.fa-thin {
		font-size: x-small;
	}


.subheader {
	color: var(--bs-primary);
	font-weight: normal;
	font-size: x-large;
}

/*.ui_feature_menu {
    background-image: url(../images/menu_bg_dark.gif);
    background-repeat: repeat-x;
    background: black;
    border-right: solid 1px #666;
    padding-left: 10px;
    padding-top: 5px;
    padding-bottom: 5px;
    padding-right: 5px;
}*/

/*.ui_feature_menu_spacer {
    background: #666;
}*/

/* .ui_public_home_content_bg {
} */

.pagingTable, .pagingTableNoBoard {
	background: #fff;
	font-size: smaller;
	padding: 8px;
	margin-top: 0.5em; /* For Netscape */
	width: 100%;
}

.pagingTable {
	border: solid 1px #999;
	border-bottom: 0px;
	border-top: 0px;
	border-left: 0px;
	border-right: 0px;
}

.pagingRow {
	background: #fff;
}

.pagingCell {
	padding: 8px;
	background: #fff;
	font-weight: bold;
	color: var(--bs-primary-monochrome-400);
}

.pagingText {
	background: #fff;
	font-weight: bold;
	color: var(--bs-primary-monochrome-400);
}

.pagingSETinactive, a.pagingSETactive:link, a.pagingSETactive:active, a.pagingSETactive:visited, a.pagingSETactive:hover {
	background: #fff;
	font-weight: bold;
	padding: 0 5px;
	text-align: center;
}

.pagingSETinactive {
	border: solid 1px #ccc;
	color: #ccc;
}

a.pagingSETactive:hover, a.pagingSETactive:link, a.pagingSETactive:active, a.pagingSETactive:visited {
	background: #fff;
	border: solid 1px var(--bs-primary-monochrome-400);
	color: var(--bs-primary-monochrome-400);
	text-decoration: none;
}

a.pagingSETactive:hover {
	border: solid 1px var(--bs-primary-monochrome-300, #FFF7A7); /* not sure why we wanted this hover to be yellow when primary otherwise, leaving old value as default for reference */
	color: var(--bs-primary-monochrome-300, #FFF7A7);
}

.pagingNUMBERset {
	background: var(--bs-primary);
	border: solid 1px var(--bs-primary);
}

.pagingNUMBERinactive, a.pagingNUMBERactive:link, a.pagingNUMBERactive:active, a.pagingNUMBERactive:visited, a.pagingNUMBERactive:hover {
	padding-left: 1px;
	padding-right: 1px;
	text-align: center;
}

.pagingNUMBERinactive {
	color: var(--bs-gray-200);
	font-weight: normal;
}

a.pagingNUMBERactive:link, a.pagingNUMBERactive:active, a.pagingNUMBERactive:visited, a.pagingNUMBERactive:hover {
	color: #fff;
	font-weight: bold;
}

.pagingPAGEinactive, a.pagingPAGEactive:link, a.pagingPAGEactive:visited, a.pagingPAGEactive:hover, a.pagingPAGEactive:active {
	font-weight: bold;
	padding: 0 5px;
	margin: 0 2px;
	text-align: center;
}

.pagingPAGEinactive {
	background: #ccc;
	border: solid 1px #999;
	color: #999;
}

a.pagingPAGEactive:link, a.pagingPAGEactive:visited, a.pagingPAGEactive:hover, a.pagingPAGEactive:active {
	background: var(--bs-primary);
	border: solid 1px var(--bs-primary);
	color: #fff;
	text-decoration: none;
}

/* Sitemap styles */
a.ui_sitemap_main_link:link, a.ui_sitemap_main_link:visited, a.ui_sitemap_main_link:active,
a.hover.ui_sitemap_main_link:hover {
	text-decoration: none;
}

div.ui_sitemap_main, div.ui_sitemap_main_Hover {
	padding-top: 12px;
}

	div.ui_sitemap_main a.ui_sitemap_main_link {
		font-weight: bold;
		color: var(--bs-primary);
	}

	div.ui_sitemap_main_Hover a.ui_sitemap_main_link {
		color: var(--bs-primary);
	}

a.ui_sitemap_item_link:link, a.ui_sitemap_item_link:visited, a.ui_sitemap_item_link:hover, a.ui_sitemap_item_link:active {
	font-weight: normal;
}

.ui_sitemap_item, .ui_sitemap_item_Hover {
	font-weight: normal;
	padding: 5px 5px 5px 12px;
}

/* End Sitemap Styles */

.languageDropdown {
	margin-top: 1px;
	color: #666;
	font-size: 9px;
	float: left;
}

.ui_validation_text {
	font-size: 10px;
	font-weight: normal;
	color: red;
}

#sectionHeader, .sectionHeader {
	background-color: #ffffff;
	padding: 0px 15px 10px 15px;
	text-align: left;
	vertical-align: top;
	width: auto;
		font-weight: normal;
	/*	color: #333333;*/
		font-size: 40px;
		/*font-family: Open Sans,Arial,sans-serif !important;*/
	}

.spacedTable {
	padding-top: 10px;
	padding-right: 15px;
}

.tdColor8 {
	background: var(--bs-primary);
}

/* Styles specific to DCA ====================================================== */

/* start filter container styles */

.filterContainer {
	width: 100%;
	margin: 15px -15px 5px 15px;
	border: solid 1px #ccc;
}

.filterContainerAlt, div#filterContainer {
	width: 100%;
	padding: 15px 15px 15px 15px;
	border: solid 1px #ccc;
}

/* end filter container styles */

#menuHeader {
	-moz-border-radius: 0px 0px 0 0;
	border-radius: 0px 0px 0 0;
	background: var(--bs-primary);
	border-right: solid 1px var(--bs-primary);
	color: var(--bs-primary-contrast);
	font-weight: normal;
	font-size: 16px;
	padding: 4px 4px 5px 9px;
}

.menuHeader {
	font-weight: bold;
}

.dataLabel {
	color: var(--bs-primary);
	font-weight: bold;
}

.pickerFilter {
	border: solid 0px #ccc;
	padding: 15px 15px 15px 15px;
}

TABLE.pickerPageTable {
	width: 100%;
	border: 0;
	padding: 0;
	margin: 0;
}

	TABLE.pickerPageTable TD {
		vertical-align: top;
	}

		TABLE.pickerPageTable TD#basketCell {
			width: 165px;
		}

DIV#pickerContainer {
	width: 150px;
	margin-right: 15px;
	float: left;
	padding: 0;
	text-align: center;
	border: 0;
}

	DIV#pickerContainer DIV.pickerHeader {
		border: solid 0px #999999;
		border-width: 1px 1px 0 1px;
		width: 100%;
	}

	DIV#pickerContainer DIV.pickerBasket {
		border: solid 1px #999999;
		background: #eeeeee;
		overflow: auto;
		width: 100%;
		height: 200px;
		text-align: left;
		font-size: smaller;
	}

		DIV#pickerContainer DIV.pickerBasket table {
			border-width: 0;
			width: 100%;
		}

	DIV#pickerContainer INPUT {
		margin-top: 5px;
		display: block;
		width: 100%;
	}

td.certStatusHeader a:link {
	color: #fff;
	font-weight: bold;
	text-decoration: none;
}

td.certStatusHeader a:visited {
	color: #fff;
	font-weight: bold;
}

td.certStatusHeader a:active {
	color: #fff;
	font-weight: bold;
}

td.certStatusHeader a:hover {
	color: #fff;
	font-weight: bold;
}

td.certStatusContent a:link {
	color: var(--bs-primary);
	font-weight: bold;
	text-decoration: none;
}

td.certStatusContent a:visited {
	color: var(--bs-primary-monochrome-400);
	font-weight: bold;
}

td.certStatusContent a:active {
	color: var(--bs-primary-monochrome-400);
	font-weight: bold;
}

td.certStatusContent a.certLink:hover {
	color: var(--bs-primary-monochrome-400);
	font-weight: bold;
}

.certStatusTable {
	border: solid 1px #999; /*width:100%;*/
}

.certStatusHeader {
	background: var(--bs-primary-monochrome-400);
	font-weight: bold;
	color: #fff;
	border: solid 1px #999;
	padding: 8px;
	vertical-align: bottom;
}

.certStatusContent {
	background: #fff;
	border: solid 1px #999;
	padding: 8px;
}

.certStatusComplete a {
	color: #666;
}

.certStatusComplete {
	background: #eee;
	font-size: 14px;
	font-weight: bold;
	color: #666;
	width: 20px;
	border: solid 1px #999;
}

.certStatusCurrent a {
	color: #fff;
}

.certStatusCurrent {
	background: #666;
	font-size: 14px;
	font-weight: bold;
	color: #fff;
	width: 30px;
	border: solid 1px #333;
}

.certStatusAvailable {
	background: #fff;
	font-size: 14px;
	font-weight: bold;
	color: #666;
	width: 30px;
	border: solid 1px #999;
}

.certStatusSet {
	font-size: 14px;
	font-weight: bold;
	color: #666;
	width: 20px;
	border: solid 1px #999;
}

.certNoStatus {
	font-size: 14px;
	font-weight: bold;
	color: #666;
	width: 20px;
	border: solid 1px #999;
}

.certStatusPaging {
	/*border: 1px solid #f00 ;
	margin-top: 15px; */
	padding: 0;
}

.certStatusPagingNext {
	float: right;
}

.certStatusPagingBack {
	float: left;
}

a.certStatusPagingLinkActive:link, a.certStatusPagingLinkActive:active, a.certStatusPagingLinkActive:visited {
	display: block;
	background: #fff;
	border: solid 1px var(--bs-primary-monochrome-400);
	color: var(--bs-primary-monochrome-400);
	font-weight: bold;
	font-size: 10px;
	padding: 0 5px;
	text-align: center;
	text-decoration: none;
}

a.certStatusPagingLinkActive:hover {
	display: block;
	background: #fff;
	border: solid 1px var(--bs-primary-monochrome-300, #FFF7A7);
	color: var(--bs-primary-monochrome-300, #FFF7A7);
	font-weight: bold;
	font-size: 10px;
	padding: 0 5px;
	text-align: center;
	text-decoration: none;
}

.certLegend {
	text-align: right;
	padding: 5px 3px 3px 3px;
}

	.certLegend div {
		display: inline;
	}

.certLegendCompleted {
	background: #eee;
	font-size: var(--bs-body-font-size);
	font-weight: bold;
	color: #666;
	text-align: center;
	border: solid 1px #999;
	padding: 2px;
	width: 15px;
}

.certLegendCurrentGoal {
	background: #666;
	font-size: var(--bs-body-font-size);
	font-weight: bold;
	color: #fff;
	text-align: center;
	width: 15px;
	border: solid 1px #333;
	padding: 2px;
}

.certLegendSetGoal {
	font-size: var(--bs-body-font-size);
	font-weight: bold;
	color: #666;
	text-align: center;
	width: 15px;
	border: solid 1px #999;
	padding: 2px;
}

.certLegendText {
	padding: 3px 8px 3px 0px;
	font-size: 9px;
}
/*  End View Managed Students  */
/* ================= Cetification Primary and Generic Rules, and Detail styles ====================== */

/* Primary Rules */
div.certPrimRuleWrapper {
	/*border: solid 1px var(--bs-primary-monochrome-400);
	background-color: #E0EFFF;*/
	padding-bottom: 4px;
	margin-bottom: 8px;
}

table.certPrimRule {
	width: 100%;
	margin-top: 8px;
}

	table.certPrimRule th {
		border: none;
		border-right: solid 0px #69c;
		background: #ffffff;
		color: var(--bs-primary);
		padding: 4px;
		text-align: left;
		vertical-align: top;
		font-size: 14px;
		font-weight: bold;
		width: 66%;
	}

	table.certPrimRule td {
		background: #ffffff;
		color: var(--bs-primary);
		font-size: 14px;
		padding: 4px;
		width: 34%;
		vertical-align: top;
	}

/* Generic Rules */
div.certGenRule2 /* cert tab and my goals */ {
	padding-left: 10px;
	border: 1px #666666;
}

table.certGenRule {
	color: var(--bs-primary);
	width: 100%;
	margin-top: 30px;
}

	table.certGenRule th {
		background: #ffffff;
		border: none;
		border-right: solid 0px #FFF7A7;
		padding: 4px;
		text-align: left;
		font-size: 14;
		font-weight: bold;
		width: 66%;
	}

	table.certGenRule td {
		background: #ffffff;
		font-size: 14;
		padding: 4px;
		text-align: left;
		width: 34%;
		vertical-align: top;
	}

/* Generic Rule details */

table.certDetail {
	border: solid 1px #eeeeee !important;
	width: 100%;
}

	table.certDetail thead th {
		background: #ffffff;
		color: #000;
		font-weight: normal;
		text-align: left;
	}

	table.certDetail thead td {
		background: #eee;
		color: #000000;
		font-weight: bold;
		text-align: left;
	}

	table.certDetail td, th {
		border-right: solid 0px #fff;
		border-bottom: solid 0px #fff;
		padding: 4px;
	}

	table.certDetail th {
		background: #eee;
		color: #666;
		text-align: right;
	}

	table.certDetail tr.hTableContent td {
		text-align: left;
	}


	table.certDetail thead th b {
		color: #336;
	}

#courseList table.grd_Child {
	border: solid 1px #eee !important;
	width: 100%;
	background: #fff;
}

#courseList td, tr.child_header {
	border-right: solid 0px #fff;
	border-bottom: solid 0px #fff;
	padding: 4px;
	text-align: left;
}

#courseList tr.child_header {
	background: #eee;
	color: #666;
	font-weight: bold;
}

/* =================== END of Cetification Primary and Generic Rules, and Detail styles ====================== */

/* start form field label styles */
.formFieldLabel {
	color: var(--bs-primary);
	font-weight: bold;
	font-size: var(--bs-body-font-size);
	float: left;
	margin-bottom: .1em; /* Also see CSS class named subheader */
}

input, select, textarea {
	clear: left;
}

input, textarea {
	/* vertical-align: middle; */
	margin-bottom: 3px;
	/* margin-left: 8px; */
}

select {
	vertical-align: middle;
}

option {
	vertical-align: middle;
}

label {
}

/* end form field label styles */

/* start wrapper styles */

div#wrapper {
	background: #ffffff;
	/*Frame Width */
	/* Remove following settings to make the style full-width
	width: 1200px;
	margin: 0 auto; */
	text-align: left;
}

	div#wrapper.wrapper-margin, div#wrapper:has(> lms-navbar-header-wrapper) {
		margin-top: 72px;
	}
/* end wrapper styles */



/* start breadcrumb navigation styles */

div#breadcrumbContainer {
	display: none;
	background: #ffffff;
	padding: .3em 0 .3em 9px;
	color: #fff;
	font-size: x-small;
	font-weight: bold;
	position: relative; /*	Required or else breadcrumb disappears */
	z-index: 1; /*	behind blue background in IE 6 */
	border-top: 0px solid #ccc;
	vertical-align: middle;
}

	/* .breadcrumb and breadcrumblink are soon to be obsolete...fingers crossed */

	.breadcrumb, div#breadcrumbContainer a {
		font-size: x-small;
		font-weight: bold;
		color: #666;
	}

.breadcrumbHere {
	font-weight: normal;
	padding-right: .3em;
	display: none; /* hide "user - You are here:" on breadcrumb*/
}

div#breadcrumbContainer a:link, div#breadcrumbContainer a:visited, div#breadcrumbContainer a:active {
	color: var(--bs-primary);
	font-weight: bold;
	text-decoration: none;
	/*color: #006;*/
}

div#breadcrumbContainer a:hover {
	color: var(--bs-primary-monochrome-300);
	text-decoration: none;
}

/* end breadcrumb navigation styles */

/* start content styles */

div#content {
	/*	margin: 0 0 0 203px; */
	padding: 0;
}

/* end content styles */
/*
#cellPrimary {
	width: 200px;
	border: 20px solid #f7f7f7;
	border: 20px solid #fff;
}*/

#cellMainBody {
	border: 1em solid #FFF;
}

#cellSecondary {
	width: 0%;
}

div#content {
	background: #FFF7A7;
}

/* start page content styles */

div#pageContent {
	padding: 15px;
	border: 0 !important;
}

/* end page content styles */

/* start results table styles */

div#results {
	margin-top: 15px; /* For Netscape */
	width: 100%;
}

	div#results table {
		width: 100%;
	}

/* end results table styles */

/* Change margin side to siwtch primary and secondary columns */

/* start footer styles */
div#footer {
	background: #ffffff;
	clear: both;
	color: #3f3f3f;
	font-size: xx-small;
	height: 24px;
	padding: .6em 10px;
	text-align: right;
	border-bottom-left-radius: 0px;
	border-bottom-right-radius: 0px;
	-moz-border-radius-bottomleft: 0px;
	-moz-border-radius-bottomright: 0px;
	/*border-radius: 0px;
        -moz-border-radius: 0px;*/
}
/* end footer styles */

/* start menu footer styles */

div#menuFooter {
	background: #69c;
	height: 0px;
	width: 200px;
}

/* end menu footer */

/* start header styles */

div.headerContainer {
	font-size: xx-small;
	height: 100px;
	background: #ffffff;
	width: 100%;
}

.headerMenuContainer {
	z-index: 3;
	position: absolute;
	background: #ffffff;
	padding-right: 3px;
	left: 340px; /* header image width */
}

div.headerContainer .globalNavDividers {
	color: #666;
	padding: 4px 4px 0 4px;
	font-size: 1em;
}

div.headerContainer a:link, div.headerContainer a:visited,
div#ctlTemplate_regMainBody_ctlTrainingContent_adminTrainingDiv a:link,
div#ctlTemplate_regMainBody_ctlTrainingContent_adminTrainingDiv a:visited,
.headerText {
	color: var(--bs-primary);
	font-weight: normal;
	text-decoration: none;
}

div.headerContainer div.switch-profiles a.btn-primary {
	color: #fff;
}

.headerText {
	font-size: x-small;
	padding-right: 3px;
}

div.headerContainer a:active {
	color: #000;
}

div.headerContainer a:hover {
	color: var(--bs-primary-monochrome-300);
}

.helpIcon {
	vertical-align: middle;
}

.top-nav-menu-link {
	/* sitemap,help,logoff that show next to the user information, not in the flyover */
}

@media(max-width:1169px) {
	.max-width {
		width: auto !important;
	}
}

.maxwidth {
	max-width: 1200px;
}

input.course-search + i.fa-search {
	color: #888;
	font-size: x-large;
}

input.course-search:focus + i.fa-search {
	color: unset;
}

input.course-search {
	z-index: 50;
}

	input.course-search::-ms-clear {
		display: none;
	}

input#ctlTemplate_regMainBody_txtFilterCourseName {
	padding-right: 22.5px;
}

i.courseSearch {
	margin-left: -20px;
	margin-top: 0.3em;
	position: absolute;
}

i.fa-search {
	z-index: 100;
	pointer-events: auto; /* IE doesn't seem to like unset */
	cursor: pointer;
}

.light {
	-webkit-text-stroke: 1px #f8f8f8;
}

li.dropdown {
	display: block !important;
}

.navbar-login {
	width: auto;
	min-width: 14em;
	padding: 10px;
	padding-bottom: 0px;
}

/* phones < 400px have sizing issues */
@media (max-width: 390px){
	.navbar-login {
		min-width: unset;
		padding: .25em;
		font-size: small;
	}
}
.navbar-login-session {
	padding: 10px;
	padding-bottom: 0px;
	padding-top: 0px;
}

.icon-size {
	font-size: 87px;
}

.navbar-nav > li > a.link-no-icon {
	top: 0.3rem;
}

.navbar-nav > li > a:hover {
	color: #777;
}

.navbar-right a i {
}

	.navbar-right a i:hover {
	}

.navbar-right li a {
	text-decoration-color: black;
	line-height: 1.75;
}

/*.navbar-brand {
    padding: 10px;
}*/

.nav-shadow {
	box-shadow: 0 2px 5px 0 rgba(0,0,0,0.24);
}

.navbar-darkgrey {
	background-color: #ccc;
	border-color: #bbb;
}

div.headerContainer .headerLogo,
.navbar-sm-brand,
.brand-image {
	max-width: 300px;
	width: auto;
	max-height: 45px;
	height: auto !important;
}

div.headerContainer .headerLogo,
div.headerContainer .brand-image {
	z-index: 3;
	float: none;
	top: 0;
	bottom: 0;
	margin: 0 !important;
}

@media(max-width:640px) {
	div.headerContainer .headerLogo,
	.navbar-sm-brand,
	.brand-image {
		max-width: 80%;
	}
	/* aspx site button types render text in a span if there is an icon so the button can shrink to icon for mobile */
	a.btn .btntxt {
		display: none;
}
}

@media (min-width: 768px) {
	div.headerContainer .headerLogo,
	.navbar-sm-brand,
	.brand-image {
		max-width: 300px;
		width: auto;
		max-height: 45px;
		height: auto !important;
	}
}

@media (min-width: 992px) {
	div.headerContainer .headerLogo,
	.navbar-sm-brand,
	.brand-image {
		max-width: 300px;
		width: auto;
		max-height: 45px;
		height: auto !important;
	}
}

@media (min-width: 1200px) {
	div.headerContainer .headerLogo,
	.navbar-sm-brand,
	.brand-image {
		max-width: 300px;
		width: auto;
		max-height: 45px;
		height: auto !important;
	}
}

.fs-2 {
	font-size: 2rem;
}

.user-info {
	margin: -10px;
	padding-top: 10px;
	border-bottom: lightgrey solid 1px;
}

.switch-profiles {
	padding: 20px 2px;
}

	.switch-profiles label {
		color: #7b7b7b;
		position: absolute;
		right: 15px;
		top: -2px;
		transition: 0.2s ease all;
		display: none;
	}

.link {
	color: inherit !important;
}

/* form starting stylings ------------------------------- */

a.activate {
	color: #7b7b7b;
	position: absolute;
	right: 15px;
	top: 5px;
	transition: 0.2s ease all;
	display: none;
}

/* div.Loc-profile input.typeahead { */
input.typeahead {
	border: 0;
	width: 100%;
	background-image: linear-gradient(#D2D2D2, #D2D2D2);
	background-size: 100% 2px;
	background-repeat: no-repeat;
	background-position: center bottom;
	font-size: x-small;
}

	/* div.Loc-profile input.typeahead:focus { */
	input.typeahead:focus {
		background-image: linear-gradient(#7b7b7b, #7b7b7b), linear-gradient(#D2D2D2, #D2D2D2);
		animation: input 0.5s forwards;
		box-shadow: none;
		outline: 0;
		background-size: 0% 2px;
	}

		/* div.Loc-profile input.typeahead:focus a.activate { */
		input.typeahead:focus a.activate,
		input.typeahead:focus ~ label, input.typeahead:valid ~ label {
			display: block;
		}

/* ANIMATIONS ================ */
@keyframes input {
	0% {
		background-size: 0% 2px, 100% 2px;
	}

	100% {
		background-size: 100% 2px, 100% 2px;
	}
}

.no-width {
	width: unset;
}

no-mb {
	margin-bottom: unset;
}

a.has-subordinate-location:active + div {
	display: block;
}


.header-container {
	height: inherit !important;
}

div.headerContainer a:link {
	font-size: 13px;
}

input[id$='txtSearch'] {
	color: black;
}

.nav > li > a:focus, .nav > li > a:hover {
	background-color: inherit;
}

app-administration .nav > li.nav-item > a {
  text-indent: -0.5em;
  padding-left: 0.5em;
}
app-administration .nav > li.nav-item > a:hover {
  background-color: var(--bs-gray-200); /* match hamburger menu */
}
/* uncomment to hide logoff text and replace with an icon image and hover image */
/*
.nav-logoff
{
	width: 18px;
	background: transparent 0px -4px url(../general/images/close.png) no-repeat;
	overflow-x: hidden;
	text-indent: -3000px;
	white-space: nowrap;
}
.nav-logoff:hover
{
	background: transparent 0px -4px url(../general/images/close-hover.png) no-repeat;
}
*/

/* end header styles */

form {
	margin: 0;
	padding: 0;
}

/* start section header styles */

.collapsableBlockHeader {
	margin-top: 25px;
	margin-bottom: 8px;
	color: var(--bs-primary);
	font-weight: normal;
	/*font-size: 20px;*/
	border-bottom: solid 0px #ccc; /* This CSS class is for many form filed labels. Also see CSS class named

formFieldLabel */
}

.collapsableBlockHeaderText {
	font-size: 20px; /* This CSS class is for many form filed labels. Also see CSS class named formFieldLabel */
}

/* end section header styles */

/* start no results styles */

div#noResults {
	margin-top: 15px;
	width: 100%;
}

/* For those messages not in a panel */
.noResults {
	border-top: 15px solid #f00;
}

.noResultsPanel {
	margin-top: 15px;
	margin-bottom: 15px;
}
/* end no results styles */

/* start new menu styles */

/* shared styles among top level and second level links */

div.ui_menu_main {
	background-color: #d7e7f6;
	width: 200px;
}

	div.ui_menu_main a, div.ui_menu_item a {
		border-bottom: solid 0px #ccc;
		border-right: solid 0px #ccc;
		border-left: solid 0px #ccc;
		background: #ffffff url(../images/MenuArrow.gif) no-repeat 5% 50%;
		display: block;
		text-decoration: none;
	}

	/* top level links */

	div.ui_menu_main a {
		background: #ffffff url(../images/MenuArrow.gif) no-repeat 5% 50%;
		padding: 5px 5px 5px 20px;
	}

		div.ui_menu_main a:link, div.ui_menu_main a:visited, div.ui_menu_main a:active {
			/* color: #727272; */
			font-weight: normal;
			text-decoration: none;
			color: #999;
			font-size: 14px;
		}

		div.ui_menu_main a:hover {
			color: var(--bs-primary-monochrome-300); /*#7088B4*/
		}

div.ui_menu_main_open a {
	background: #ffffff url(../images/MenuDnArrow.gif) no-repeat 3% 50%;
}

div.ui_menu_main_noimg a {
	background: #ffffff;
}
/* second level item links */

div.ui_menu_item a {
	background: #ffffff;
	padding: 5px 5px 5px 30px;
	color: #999;
	font-weight: normal;
	font-size: 14px;
}


	div.ui_menu_item a:link, div.ui_menu_item a:visited {
		color: #999;
		font-weight: normal;
		font-size: 14px;
		text-decoration: none;
		/*color: #666;*/
	}

	div.ui_menu_item a:hover {
		color: var(--bs-primary-monochrome-300);
		font-size: 14px;
		background: #ffffff;
		/* color: #555; */
	}

/* end new menu styles */

.borderless, div.DListStyle fieldset.borderless {
	border: none;
}

.confirmBox {
	background-color: #ffc;
	border: solid 1px #336699;
	/*font-family: "Trebuchet MS", Helvetica, sans-serif;*/
	font-size: 10px;
	margin: 5px;
	position: absolute;
	top: 200px;
	width: 360px;
	z-index: 10;
	padding: 5px;
	font-size: inherit;
}

.searchFilterSeparator {
	border-top: #999 0px solid;
	border-bottom: #999 0px solid;
	margin-bottom: 5px;
	margin-top: 0px;
}

.wsExpandContent {
	background-color: #fff;
	border: solid 1px #ccc;
	display: none;
	padding: 2px;
}


.expandedContent, .expandoContent {
	border: solid 0px #ccc;
	padding: 2px;
	background-color: #fff;
}

.expandedContent {
	margin-top: 2px;
}

.primaryDealerLegend {
	text-align: right;
}

/* System Health Styles */
.systemStatusTable TR TD {
	padding: 3px;
	border-top: 1px solid #999999;
}

.systemStatusItemHealthGood {
	background-color: #ffffff;
}

.systemStatusItemHealthMarginal {
	background-color: #ffffcc;
}

.systemStatusItemHealthBad {
	background-color: #ffcccc;
}

.nowrap {
	white-space: nowrap;
}

.wrap {
	white-space: normal !important;
}

.ctr {
	text-align: center;
}
/* Hide and View section Styles on Homepage */
/*  Live Courses section Styles on Homepage */
#ctlTemplate_regMainBody_mySchedule_tLRowHeader {
	display: block;
}

#ctlTemplate_regMainBody_mySchedule_tLRowData {
	display: block;
}
/* SelfStudy section Styles on Homepage */
#ctlTemplate_regMainBody_mySchedule_tWRowHeader {
	display: block;
}

#ctlTemplate_regMainBody_mySchedule_tWRowData {
	display: block;
}
/* Interest List section Styles on Homepage */
#ctlTemplate_regMainBody_mySchedule_tIRowHeader {
	display: block;
}

#ctlTemplate_regMainBody_mySchedule_tIRowData {
	display: block;
}
/* Subscription section Styles on Homepage */
#ctlTemplate_regMainBody_mySchedule_tSRowHeader {
	display: block;
}

#ctlTemplate_regMainBody_mySchedule_tSRowData {
	display: block;
}
/* Messaging section Styles on Homepage */
#ctlTemplate_regMainBody_mySchedule_tMRowHeader {
	display: block;
}

#ctlTemplate_regMainBody_mySchedule_tMRowData {
	display: block;
}
/* client html content section Styles on Homepage */
#ctlTemplate_regMainBody_mySchedule_ClientContentHeader {
	display: block;
}

#ctlTemplate_regMainBody_mySchedule_ClientContentData {
	display: block;
}

#ctlTemplate_regMainBody_rowEditStatus_rowEditStatus {
	border-radius: 0px;
	-moz-border-radius: 0px;
}

/* roweditstatus using svg and bootstrap alerts */
div[id$="rowEditStatus"] .bi {
    width: 1em;
    height: 1em;
    vertical-align: -.125em;
    fill: currentcolor
}

/* header Course Search */
#ctlTemplate_regHeader_ctlHeaderUser_headerCourseSearch, div#headerCourseSearch {
	position: absolute;
	right: 10px;
	top: 47px;
	color: var(--bs-primary);
	font-weight: bold;
	font-size: var(--bs-body-font-size);
	/*display: none;*/
}

#ctlTemplate_regHeader_ctlHeaderUser_ctlSimpleCourseSearch_lnkAdvancedSearch {
	float: right;
	font-size: xx-small;
	padding-right: 10px;
	text-decoration: none;
	height: 9px;
}

#ctlTemplate_regHeader_ctlHeaderUser_ctlSimpleCourseSearch_imgCourseSearch {
	border-style: none;
	vertical-align: top;
}

/* Course Search */
/* Taxonomy */
#ctlTemplate_regMainBody_ctlCourseSearch_pnlSearchFilter_lstCourseTaxonomies_lblCourseTaxonomy {
	/*display: none;*/
}

#ctlTemplate_regMainBody_ctlCourseSearch_pnlSearchFilter_lstCourseTaxonomies_lstCourseTaxonomyParent {
	/*display: none;*/
}

#ctlTemplate_regMainBody_ctlCourseSearch_pnlSearchFilter_lstCourseTaxonomies_lstCourseTaxonomyLevel1 {
	/*display: none;*/
}

#ctlTemplate_regMainBody_ctlCourseSearch_pnlSearchFilter_lstCourseTaxonomies_lstCourseTaxonomyLevel2 {
	/*display: none;*/
}
/* Majors */
#ctlTemplate_regMainBody_ctlCourseSearch_pnlSearchFilter_dlistCourseMajor {
	/*display: none;*/
}

#ctlTemplate_regMainBody_ctlCourseSearch_pnlSearchFilter_dlistCourseMajor_lblFilterCourseMajor {
	/*display: none;*/
}

#ctlTemplate_regMainBody_ctlCourseSearch_pnlSearchFilter_dlistCourseMajor_lblCourseMajorSubheader {
	/*display: none;*/
}

#ctlTemplate_regMainBody_ctlCourseSearch_pnlSearchFilter_dlistCourseMajor_lstFilterCourseMajor {
	/*display: none;*/
}
/* Publisher */
#ctlTemplate_regMainBody_ctlCourseSearch_pnlSearchFilter_dlistBrand {
	display: none;
}

#ctlTemplate_regMainBody_ctlCourseSearch_pnlSearchFilter_dlistBrand_lblFilterCourseBrand {
	display: none;
}

#ctlTemplate_regMainBody_ctlCourseSearch_pnlSearchFilter_dlistBrand_lblCourseBrandSubheader {
	display: none;
}

#ctlTemplate_regMainBody_ctlCourseSearch_pnlSearchFilter_dlistBrand_lstFilterCourseBrand {
	display: none;
}
/* Delivery Method */
#ctlTemplate_regMainBody_ctlCourseSearch_pnlSearchFilter_dlistDeliveryType {
	/*display: none;*/
}

#ctlTemplate_regMainBody_ctlCourseSearch_pnlSearchFilter_dlistDeliveryType_lblFilterCourseDeliveryType {
	/*display: none;*/
}

#ctlTemplate_regMainBody_ctlCourseSearch_pnlSearchFilter_dlistDeliveryType_lblCourseDeliveryTypeSubheader {
	/*display: none;*/
}

#ctlTemplate_regMainBody_ctlCourseSearch_pnlSearchFilter_dlistDeliveryType_lstFilterCourseDeliveryType {
	/*display: none;*/
}
/* Course code */
#ctlTemplate_regMainBody_ctlCourseSearch_pnlSearchFilter_dListCourseNumber_lblFilterCourseNumber {
	/*display: none;*/
}

#ctlTemplate_regMainBody_ctlCourseSearch_pnlSearchFilter_dListCourseNumber_txtFilterCourseNumber {
	/*display: none;*/
}

/* Browse by category */
.custom-lnav {
	margin-top: 10px;
	background: #ffffff;
	/* display: none; */
}
/* Browse by category */
.course-tax {
	/*display: none;*/
}

.course-tax-search, .custom-lnav-content {
	border: solid 0px #ccc;
}

	.custom-lnav-content a, .custom-lnav-content a:visited {
		color: #727272;
	}

		.custom-lnav-content a:hover, .custom-lnav-content a:active {
			color: var(--bs-primary-monochrome-300);
		}

div#dvTaxonomySelectionTitle {
	margin-top: 5px;
	background: var(--bs-primary);
	color: var(--bs-primary-contrast);
	font-size: 16px;
	padding: 4px 4px 5px 9px;
	font-weight: normal;
	-moz-border-radius: 0px 0px 0 0;
	border-radius: 0px 0px 0 0;
}

div#dvTaxonomyListItems {
	padding: 5px;
	background: #ffffff;
	border-bottom: 0px solid #CCCCCC;
}

#ctlTemplate_regLeftNav_ctlMenuFooter_ctlCourseTaxonomySearch_lblCurrentTaxonomyName {
	font-weight: bold;
}

#ctlTemplate_regLeftNav_ctlMenuFooter_ctlCourseTaxonomySearch_pnlCurrentTaxonomyName {
	background: #ffffff;
	border-bottom: 0px solid #CCCCCC;
}

button.HeaderSearchbutton, .HeaderSearchbutton {
	margin: 0px;
	padding: 0px;
	background-color: transparent;
	border-collapse: collapse;
	border-style: none;
}

/* Cert Tree */
a.info, a.info:link, a.info:visited {
	position: relative; /*this is the key*/
	z-index: 24;
	color: #000;
	font-weight: normal;
	text-decoration: none;
}

a.white, a.white:link, a.white:visited {
	color: #fff;
	font-weight: bold;
}

a.dark, a.dark:link, a.dark:visited {
	color: #666;
	font-weight: bold;
}

a.info:hover {
	z-index: 25;
	background-color: #ccc;
}
/* ff0 */
a.info span.fi {
	display: none;
}

a.info:hover span.fi { /*the span will display just on :hover state*/
	display: block;
	position: absolute;
	top: 0em;
	left: 2em;
	width: 6em;
	border: 1px solid #ccc;
	background-color: var(--bs-primary-monochrome-400);
	color: #fff;
	text-align: center;
}

.noPrint {
	display: none;
}

.nodeheader {
	font-size: 8pt;
	padding: 4px 2px 4px 2px;
}

.nodedocuments {
	font-size: 8pt;
	border-style: none;
}

.margined {
	padding: 4px;
}

.padded {
	font-size: 8pt;
	padding: 2px 2px 2px 2px;
}

/*
DUPLICATE- To DELETE
body {
    font-family: "Trebuchet MS", Helvetica, sans-serif;
}
*/
.noPrint {
	display: block;
	text-align: center;
}

.ico {
	background-color: #69c;
	border: outset 1px lightgray;
	font-weight: bold;
	color: white;
	padding: 2px;
	margin-left: 4px;
	margin-right: 3px;
}

.ico2 {
	background-color: var(--bs-primary-monochrome-400);
	border: outset 1px lightgray;
	font-weight: bold;
	color: white;
	padding: 2px;
	margin-left: 4px;
	margin-right: 3px;
}

.treeButton {
	background-color: #69c;
	color: white;
	font-weight: bold;
	font-size: 10px;
	cursor: hand;
	/* font-family: "Trebuchet MS", Helvetica, sans-serif; */
	border: ridge 1px var(--bs-primary-monochrome-400);
	height: 20px;
}

.customlogin {
	background-color: #Ffffff;
}

.ico { /* icons for certification, primary rule, generic rule */
	background-color: var(--bs-primary);
}

.ico2 { /* icons for course, ase */
	background-color: var(--bs-primary);
}

.treeButton { /* expand all, collapse all, print buttons */
	background-color: var(--bs-primary);
}

/* Hide Classic User Search Links */
.classicUserSearch {
	display: none;
}


/******************************************************************STYLESHEET CSS END******************************************************************************************/

/******************************************************************STYLESHEET_RESPONSIVE CSS BEGIN******************************************************************************************/

/****
* styles from stylesheet_responsive.css
****/

/* page width */
.max-width {
	max-width: 100%; /* 1170px; */
	position: relative; /* so all contained absolute positioned items are relative to this div.*/
}
/* end page width */

/*
    font awesome
*/

#reports > p > i.fa-lg,
#mypeople > p > i.fa-lg,
#trainingHistory > p > i.fa-lg,
#account > p > i.fa-lg,
#trainingNews > p > i.fa-lg,
#messages > p > i.fa-lg,
#traininggoals > p > i.fa-lg,
#coursecatalog > p > i.fa-lg,
#certification > p > i.fa-lg,
#completedtraining > p > i.fa-lg,
#myteachingschedule > p > i.fa-lg,
#whatsnew > p > i.fa-lg,
#mylearning > p > i.fa-university,
#trainingcalendar > p > i.fa-lg,
#offeringsearch > p > i.fa-lg,
#featuredcourses > p > i.fa-lg,
#approvals > p > i.fa-lg,
#subscriptioncourses > p > i.fa-lg,
#skillprofile > p > i.fa-lg,
#resourcelibrary > p > i.fa-lg,
#coursestocomplete > p > i.fa-lg,
#support > p > i.fa-lg,
#chatsupport > p > i.fa-lg,
#customerportal > p > i.fa-lg,
#navedit > p > i.fa-lg {
	font-size: 1.33333333em;
	line-height: 0.75em;
	vertical-align: -15%;
}
/*end font awesome*/

/*landing page icon*/
div#reports > p > i.lp-icon,
div#mypeople > p > i.lp-icon,
div#trainingHistory > p > i.lp-icon,
div#account > p > i.lp-icon,
div#trainingNews > p > i.lp-icon,
div#messages > p > i.lp-icon,
div#traininggoals > p > i.lp-icon,
div#coursecatalog > p > i.lp-icon,
div#certification > p > i.lp-icon,
div#completedtraining > p > i.lp-icon,
div#myteachingschedule > p > i.lp-icon,
div#whatsnew > p > i.lp-icon,
div#mylearning > p > i.lp-icon,
div#trainingcalendar > p > i.lp-icon,
div#offeringsearch > p > i.lp-icon,
div#resourcelibrary > p > i.lp-icon,
div#featuredcourses > p > i.lp-icon,
div#approvals > p > i.lp-icon,
div#subscriptioncourses > p > i.lp-icon,
div#skillprofile > p > i.lp-icon,
div#coursestocomplete > p > i.lp-icon,
div#certification > p > i.lp-icon,
div#navedit > p > i.lp-icon,
div#support > p > i.lp-icon,
div#chatsupport > p > i.lp-icon,
div#customerportal > p > i.lp-icon,
div#usermanage > p > i.lp-icon,
div#learningpath > p > i.lp-icon,
div#announcements > p > i.lp-icon,
div#chatbot > p > i.lp-icon,
div#contentselection > p > i.lp-icon {
	color: #fff;
}

/* oddly, if you leave this in commented out, it still shows up in the inspector */
/*margin-top: 4rem;*/ /*latitude specific*/

/* left hand nav overrides */
div#lhn-reports > a > div#reports > p > i.lp-icon,
div#lhn-mypeople > a > div#mypeople > p > i.lp-icon,
div#lhn-trainingHistory > a > div#trainingHistory > p > i.lp-icon,
div#lhn-account > a > div#account > p > i.lp-icon,
div#lhn-trainingNews > a > div#trainingNews > p > i.lp-icon,
div#lhn-messages > a > div#messages > p > i.lp-icon,
div#lhn-traininggoals > a > div#traininggoals > p > i.lp-icon,
div#lhn-coursecatalog > a > div#coursecatalog > p > i.lp-icon,
div#lhn-certification > a > div#certification > p > i.lp-icon,
div#lhn-completedtraining > a > div#completedtraining > p > i.lp-icon,
div#lhn-myteachingschedule > a > div#myteachingschedule > p > i.lp-icon,
div#lhn-whatsnew > a > div#whatsnew > p > i.lp-icon,
div#lhn-mylearning > a > div#mylearning > p > i.lp-icon,
div#lhn-trainingcalendar > a > div#trainingcalendar > p > i.lp-icon,
div#lhn-offeringsearch > a > div#offeringsearch > p > i.lp-icon,
div#lhn-resourcelibrary > a > div#resourcelibrary > p > i.lp-icon,
div#lhn-featuredcourses > a > div#featuredcourses > p > i.lp-icon,
div#lhn-approvals > a > div#approvals > p > i.lp-icon,
div#lhn-subscriptioncourses > a > div#subscriptioncourses > p > i.lp-icon,
div#lhn-skillprofile > a > div#skillprofile > p > i.lp-icon,
div#lhn-coursestocomplete > a > div#coursestocomplete > p > i.lp-icon,
div#lhn-certification > a > div#certification > p > i.lp-icon,
div#lhn-navedit > a > div#navedit > p > i.lp-icon,
div#lhn-support > a > div#support > p > i.lp-icon,
div#lhn-chatsupport > a > div#chatsupport > p > i.lp-icon,
div#lhn-customerportal > a > div#customerportal > p > i.lp-icon,
div#lhn-announcements > a > div#announcements > p > i.lp-icon,
div#lhn-usermanage > a > div#usermanage > p > i.lp-icon,
div#lhn-learningpath > a > div#learningpath > p > i.lp-icon
div#lhn-chatbot > a > div#chatbot > p > i.lp-icon,
div#lhn-contentselection > a > div#contentselection > p > i.lp-icon
{
	margin-top: 0rem;
}

/* this one just isn't as selective
div[id|="lhn"] > a > div > p > i.fa.lp-icon.lp-icon-color {
  margin-top: 0rem;
}
*/
/* stop the icons from growing on hover in lhn */
/*div[id|="lhn"] > a > div > p > i.fa.lp-icon-color:hover {
    font-size: 1.0em;
}*/
/* make lhn badges smaller */
div[id|="lhn"] > a > div > span.badge.badge-pill.badge-danger {
	/*bottom: 3rem;
    top: 0.5rem;
    left: 3.5rem;
    font-size: small;
    position: absolute;*/
	bottom: 1.5rem;
	/* top: 0.5rem; */
	/* left: 3.5rem; */
	font-size: 10px;
	position: absolute;
}

/* update text layout in second div to be more centered vertically and left aligned */
.col-xs-9.text-capitalize.icon-text {
	text-align: left;
	margin-top: 1rem;
}

div#reports > p > i.lp-icon:before,
div#reports.nav-edit-icon-container i.lp-icon:before {
	content: "\f080";
}

div#mypeople > p > i.lp-icon:before,
.my-people > i.icon:before,
div#mypeople.nav-edit-icon-container i.lp-icon:before {
	content: "\f0c0";
}

div#account > p > i.lp-icon:before,
div#account.nav-edit-icon-container i.lp-icon:before {
	content: "\f2c2";
}

div#messages > p > i.lp-icon:before,
.my-messages > i.icon:before,
div#messages.nav-edit-icon-container i.lp-icon:before {
	content: "\f003";
}

div#traininggoals > p > i.lp-icon:before,
.traininggoals > i.icon:before,
div#traininggoals.nav-edit-icon-container i.lp-icon:before {
	content: "\f0a3";
}

div#coursecatalog > p > i.lp-icon:before,
.course-catalog > i.icon:before,
div#coursecatalog.nav-edit-icon-container i.lp-icon:before {
	content: "\f002";
}

div#coursestocomplete > p > i.lp-icon:before,
.courses-to-complete > i.icon:before,
div#coursestocomplete.nav-edit-icon-container i.lp-icon:before {
	content: "\f02d";
}

div#certification > p > i.lp-icon:before,
div#certification.nav-edit-icon-container i.lp-icon:before {
	content: "\f19d";
}

div#traininghistory > p > i.lp-icon:before,
.traininghistory > i.icon:before,
div#traininghistory.nav-edit-icon-container i.lp-icon:before,
div#completedtraining > p > i.lp-icon:before,
.completed-training > i.icon:before,
div#completedtraining.nav-edit-icon-container i.lp-icon:before {
	content: "\f1da";
}

div#whatsnew > p > i.lp-icon:before,
.whats-new > i.icon:before,
div#whatsnew.nav-edit-icon-container i.lp-icon:before {
	content: "\f0a1";
}

div#mylearning > p > i.lp-icon:before,
.my-learning > i.icon:before,
div#mylearning.nav-edit-icon-container i.lp-icon:before {
	content: "\f19c";
}

div#myteachingschedule > p > i.lp-icon:before,
.my-training-schedule > i.icon:before,
div#myteachingschedule.nav-edit-icon-container i.lp-icon:before {
	content: "\f0a2";
}

div#trainingcalendar > p > i.lp-icon:before,
div#trainingcalendar.nav-edit-icon-container i.lp-icon:before {
	content: "\f073";
}

div#offeringsearch > p > i.lp-icon:before,
div#offeringsearch.nav-edit-icon-container i.lp-icon:before {
	content: "\f133";
}

div#usermanage > p > i.lp-icon:before,
.usermanage > i.icon:before,
div#usermanage.nav-edit-icon-container i.lp-icon:before {
	content: "\f0c0";
}

div#chatbot > p > i.lp-icon:before,
.chatbot > i.icon:before,
div#chatbot.nav-edit-icon-container i.lp-icon:before {
	content: "\f544";
}
div#contentselection > p > i.lp-icon:before,
.contentselection > i.icon:before,
div#contentselection.nav-edit-icon-container i.lp-icon:before {
	content: "\e187";
}

div#learningpath > p > i.lp-icon:before,
.learningpath > i.icon:before,
div#learningpath.nav-edit-icon-container i.lp-icon:before {
	content: "\f4d7";
}

div#resourcelibrary > p > i.lp-icon:before,
.resourcelibrary > i.icon:before,
div#resourcelibrary.nav-edit-icon-container i.lp-icon:before {
	content: "\f0f6";
}

div#featuredcourses > p > i.lp-icon:before,
.featuredcourses > i.icon:before,
div#featuredcourses.nav-edit-icon-container i.lp-icon:before {
	content: "\f11d";
}

div#approvals > p > i.lp-icon:before,
.approvals > i.icon:before,
div#approvals.nav-edit-icon-container i.lp-icon:before {
	content: "\f087";
}

div#subscriptioncourses > p > i.lp-icon:before,
div#subscriptioncourses.nav-edit-icon-container i.lp-icon:before {
	content: "\f1ea";
}

div#skillprofile > p > i.lp-icon:before,
.skill-profile > i.icon:before,
div#skillprofile.nav-edit-icon-container i.lp-icon:before {
	content: "\f0f0";
}

div#navedit > p > i.lp-icon:before,
.navigation-editor > i.icon:before,
div#navedit.nav-edit-icon-container i.lp-icon:before {
	content: "\f0c4";
}

div#announcements > p > i.lp-icon:before,
div#announcements.nav-edit-icon-container i.lp-icon:before {
	content: "\f130";
}

div#support > p > i.lp-icon:before,
div#support.nav-edit-icon-container i.lp-icon:before {
	content: "\f1cd";
}

div#chatsupport > p > i.lp-icon:before,
div#chatsupport.nav-edit-icon-container i.lp-icon:before {
	content: "\f086";
}

div#customerportal > p > i.lp-icon:before,
div#customerportal.nav-edit-icon-container i.lp-icon:before {
	content: "\f145";
}

.favorite-tools > .fa-stack {
	font-size: 50%;
	vertical-align: text-top;
	margin-top: 0.3%;
}
.favorite-tools > .fa-stack i.icon:nth-child(2) { top: 3px; }

.favorite-tools > .fa-stack i.icon:nth-child(1):before {
	color: var(--bs-primary);
	content: "\f005"; /* star - background icon */
}
.favorite-tools > .fa-stack i.icon:nth-child(2):before {
	content: "\f0ad"; /* wrench - foreground icon */
}


div#managegoals > p > i.lp-icon:before,
.manage-goals > i.icon:before,
div#managegoals.nav-edit-icon-container i.lp-icon:before {
	content: "\f140";
}

div#mypeople.lp-icon-bg {
}

div#trainingHistory.lp-icon-bg {
}

div#account.lp-icon-bg {
}

div#trainingNews.lp-icon-bg {
}

div#messages.lp-icon-bg {
}

div#traininggoals.lp-icon-bg {
}

div#coursecatalog.lp-icon-bg {
}

div#certification.lp-icon-bg {
}

div#coursestocomplete.lp-icon-bg {
}

div#completedtraining.lp-icon-bg {
}

div#whatsnew.lp-icon-bg {
}

div#mylearning.lp-icon-bg {
}

div#myteachingschedule.lp-icon-bg {
}

div#trainingcalendar.lp-icon-bg {
}

div#offeringsearch.lp-icon-bg {
}

div#resourcelibrary.lp-icon-bg {
}

div#featuredcourses.lp-icon-bg {
}

div#approvals.lp-icon-bg {
}

div#subscriptioncourses.lp-icon-bg {
}

div#skillprofile.lp-icon-bg {
}

div#navedit.lp-icon-bg {
}

div#support.lp-icon-bg {
}

div#chatsupport.lp-icon-bg {
}

div#customerportal.lp-icon-bg {
}

div#reports > p > i.lp-icon-color,
.report-pagename-container > i.icon,
div#reports.nav-edit-icon-container i.lp-icon-color {
	color: #ED8B00;
}

div#mypeople > p > i.lp-icon-color,
.my-people > i.icon,
div#mypeople.nav-edit-icon-container i.lp-icon-color {
	color: #f2613f;
}

div#account > p > i.lp-icon-color,
div#account.nav-edit-icon-container i.lp-icon-color {
	color: #963CBD;
}

div#messages > p > i.lp-icon-color,
.my-messages > i.icon,
div#messages.nav-edit-icon-container i.lp-icon-color {
	color: #6dcd96;
}

div#traininggoals > p > i.lp-icon-color,
.traininggoals > i.icon,
div#traininggoals.nav-edit-icon-container i.lp-icon-color {
	color: #ED8B00;
}

div#coursecatalog > p > i.lp-icon-color,
.course-catalog > i.icon,
div#coursecatalog.nav-edit-icon-container i.lp-icon-color {
	color: #00B2A9;
}

div#certification > p > i.lp-icon-color,
div#certification.nav-edit-icon-container i.lp-icon-color {
	color: #7dcbd6;
}

div#coursestocomplete > p > i.lp-icon-color,
.courses-to-complete > i.icon,
div#coursestocomplete.nav-edit-icon-container i.lp-icon-color {
	color: #00954d;
}

div#completedtraining > p > i.lp-icon-color,
.completed-training > i.icon,
div#completedtraining.nav-edit-icon-container i.lp-icon-color {
	color: #418FDE;
}

div#whatsnew > p > i.lp-icon-color,
.whats-new > i.icon,
div#whatsnew.nav-edit-icon-container i.lp-icon-color {
	color: #FF5252;
}

div#mylearning > p > i.lp-icon-color,
.my-learning > i.icon,
div#mylearning.nav-edit-icon-container i.lp-icon-color {
	color: #FF5252;
}

div#myteachingschedule > p > i.lp-icon-color,
.my-training-schedule > i.icon,
div#myteachingschedule.nav-edit-icon-container i.lp-icon-color {
	color: #FF5252;
}

div#trainingcalendar > p > i.lp-icon-color,
div#trainingcalendar.nav-edit-icon-container i.lp-icon-color {
	color: #e03d3d;
}

div#offeringsearch > p > i.lp-icon-color,
div#offeringsearch.nav-edit-icon-container i.lp-icon-color {
	color: #e03d3d;
}

div#resourcelibrary > p > i.lp-icon-color,
.resourcelibrary > i.icon,
div#resourcelibrary.nav-edit-icon-container i.lp-icon-color {
	color: #ED8B00;
}

div#featuredcourses > p > i.lp-icon-color,
.featuredcourses > i.icon,
div#featuredcourses.nav-edit-icon-container i.lp-icon-color {
	color: #D174C0;
}

div#approvals > p > i.lp-icon-color,
.approvals > i.icon,
div#approvals.nav-edit-icon-container i.lp-icon-color {
	color: #00954d;
}

div#subscriptioncourses > p > i.lp-icon-color,
div#subscriptioncourses.nav-edit-icon-container i.lp-icon-color {
	color: #D174C0;
}

div#skillprofile > p > i.lp-icon-color,
.skill-profile > i.icon,
div#skillprofile.nav-edit-icon-container i.lp-icon-color {
	color: #7dcbd6;
}

div#usermanage > p > i.lp-icon-color,
.usermanage > i.icon,
div#usermanage.nav-edit-icon-container i.lp-icon-color {
	color: darkslategrey;
}
div#chatbot > p > i.lp-icon-color,
.chatbot > i.icon,
div#chatbot.nav-edit-icon-container i.lp-icon-color {
	color: var(--bs-primary-monochrome-600);
}

div#contentselection > p > i.lp-icon-color,
.contentselection > i.icon,
div#contentselection.nav-edit-icon-container i.lp-icon-color {
	color: var(--bs-primary);
}

div#learningpath > p > i.lp-icon-color,
.learningpath > i.icon,
div#learningpath.nav-edit-icon-container i.lp-icon-color {
	color: cadetblue;
}

div#navedit > p > i.lp-icon-color,
.navigation-editor > i.icon,
div#navedit.nav-edit-icon-container i.lp-icon-color {
	color: black;
}

div#announcements > p > i.lp-icon-color,
div#announcements.nav-edit-icon-container i.lp-icon-color {
	color: #963CBD;
}

div#support > p > i.lp-icon-color,
div#support.nav-edit-icon-container i.lp-icon-color {
	color: #e03d3d;
}

div#chatsupport > p > i.lp-icon-color,
div#chatsupport.nav-edit-icon-container i.lp-icon-color {
	color: #008000;
}

div#customerportal > p > i.lp-icon-color,
div#customerportal.nav-edit-icon-container i.lp-icon-color {
	color: #008000;
}

.lp-icon-shape {
}

	.lp-icon-shape p {
		/*font: italic 40px Georgia;*/ /* this seemed to only affect the badge in the nav, not the icons. */
		color: #fff;
		vertical-align: middle;
		position: relative;
		top: 25%;
	}

.lp-icon-size {
	font-size: 1.75em;
	line-height: 0.75em;
	vertical-align: -15%;
}

i.lp-icon:hover {
	font-size: 1.80em;
	transition: font-size 0.18s;
}

lp-icon:hover {
	font-size: 1.80em;
	transition: font-size 0.18s;
}


div.lp-icon-shape {
	/* turns out this is what centers the icons in the lh-nav*/
	margin-bottom: 1rem !important;
}

	div.lp-icon-shape p {
		text-align: center
	}

p.text-capitalize.icon-text {
	text-align: center;
}

/*end landing page icon*/

/*badge position*/
.badge-danger {
	background-color: #a3081a;
}


/*
begin commenting out bootstrap styles.
.mx-auto {
    margin-right: auto !important;
    margin-left: auto !important;
}*/

.lp-icon-shape span.badge /*, .badge*/ {
	position: relative;
	bottom: 5rem;
	left: 2rem;
	font-size: large;
}

.badge-notify {
	background: red;
	position: relative;
	top: -30px;
	left: 55px;
	bottom: 33px;
}

/*.people-detail-icon, .people-icon {
    width:30px;
    height:30px;
}*/

.people-icon {
	cursor: auto;
}

/*.people-detail-icon .fa, .people-icon .fa {
    font-size: 4rem;
    color: var(--bs-primary);
}*/

.people-detail-icon .badge {
	font-size: inherit;
	left: 2rem;
	bottom: 4.5rem;
}

.people-icon .badge {
	font-size: inherit;
	left: 4rem;
	bottom: 0;
}

.people-detail-certification {
	text-align: center;
	width: 37px;
}

	.people-detail-certification > .badge {
		background-color: #FFFFFF;
		left: 0rem;
		bottom: 4.7rem;
		color: black;
		padding: 1px 4px;
	}
/*end badge position*/

/* copied in from dropdowns.less just to unset the background color.. ugh
	probably not necessary any more because of the javascript solution.
    now all of these except max-height is overridden, and I don't want max-height.
*/
/*.dropdown-menu {
    background-color: unset;
    max-height: 500px;
    overflow-y: auto;
    overflow-x: hidden;
}*/

li.active > a > h6, li.active > a > h5 {
	color: inherit;
}

/* navbar-default renamed to navbar-light though why we are doing this.. */
.navbar-light {
	background-color: unset;
}
/*Nav bar header start*/
.navbar-bg {
	border-color: #f7f7f7;
	/* include bg-body-tertiary color without !important designation so it can be overridden */
	--bs-bg-opacity: 1;
	background-color: rgba(var(--bs-body-bg-rgb), var(--bs-bg-opacity));
}
.body-bg {
	background-color: rgba(var(--bs-body-bg-rgb), var(--bs-bg-opacity));
}
/*Nav bar header End*/

/* Reporting Engine Start */

/* Nav Tab Background Color */
/* .nav-pills > li.active > a {
} */

/* Report Folders Header */
/* .left-nav-title {
} */

/* Classic Reports Header */
/* .classic-nav-title {
} */

/*Button Background Color */
/* button {
} */

/* Reporting Engine End */

/****
* NOTE: Add styles needed to follow guideline defined in CSS ans styles project.
****/

/* .text {
} */

.body-main {
	margin-top: var(--navbar-height, 6rem);
}

#footerContainer {
}

.copyright-notice {
	text-align: right;
	font-size: xx-small;
	color: #3f3f3f;
}

.lighter-text {
	color: #777777;
}

.icon-text {
	font-weight: normal; /* don't bold the anchors under the icons */
	font-size: 12px;
}

.clickable {
	cursor: pointer;
}

.btn1, a.btn1 {
	cursor: pointer;
	font-family: inherit;
	/* font-size: 20px; */
	line-height: inherit;
	text-transform: none;
	overflow: visible;
	margin-bottom: 4px;
}

.btn-light {
	color: #212529;
	background: #f8f9fa;
	border-color: #f8f9fa;
}

	.btn-light:hover {
		color: #212529;
		background-color: #e2e6ea;
		border-color: #f8f9fa;
	}

.btn-ghost-noborder {
	color: #212529;
	/* background-color: var(--bs-body-bg); */ /* move bg color to the wrapper because of the input-group-text */
	/*border: 1px solid #dedede;*/
	border-left: 0;
	height: 34px;
}

	.btn-ghost-noborder:hover {
		color: #212529;
		/* background-color: #e2e6ea; */
		/* border-color: #dedede; */
	}

.btn-ghost-wrapper {
	background-color: var(--bs-body-bg);
}

	.btn-ghost-wrapper:hover {
		background-color: #e2e6ea;
		border-color: #dedede; /* TODO: vars for both of these, or determine if there is a bootstrap var to apply */
	}

/* should be handeled directly by bootstrap now */
/*.btn-primary, .btn-primary:link {
    background-color: var(--bs-btn-bg);
    color: white;
    border: none;
    padding: 2px 15px;
    min-width: 50px;
}*/

/* should be handeled directly by bootstrap now */
/*.btn-primary:visited, .btn-primary:hover, .btn-primary[disabled]:hover, .btn-primary:active, .btn-primary:focus, .btn-primary[disabled]:focus,
    .btn-primary:active:hover, .btn-primary:hover:focus, .btn-primary:active:focus {
        background-color: var(--bs-primary-monochrome-600);;
        -webkit-box-shadow: none;
        box-shadow: none;
        font-weight: inherit;
    }*/


.action-icon-selected, a.action-icon-selected, a.action-icon-selected:visited, a.action-icon-selected:hover,
a.action-icon-selected[disabled]:hover, a.action-icon-selected:active, a.action-icon-selected:focus, a.action-icon-selected[disabled]:focus,
a.action-icon-selected:active:hover, a.action-icon-selected:hover:focus, a.action-icon-selected:active:focus {
	background-color: white;
	color: #2d71b3;
	border-color: #2d71b3;
	border-style: solid;
	border-width: thin;
}

.action-text {
	font-size: inherit;
	font-weight: inherit;
}

.no-border {
	border: none;
}

.fa-1pt5x {
	font-size: 1.5em;
}

.export-options {
	float: right;
	clear: right;
}

.excel-export {
	color: green;
}

.pdf-export {
	color: red;
}

/*use this class to customise the action buttons*/
.action-icon {
	font-size: 20px;
	line-height: inherit;
	/*padding: 3px 2px;*//* this leaves the icons not centered */
	width: 28px;
}

.action-btn-container .action-link .action-icon {
	font-size: 20px;
	line-height: inherit;
	/*padding: 3px 2px;*/
}

/*use these classes to customise the just the icon for action buttons*/
.fa-trash.action-icon:before {
}

.fa-play.action-icon:before {
}

.fa-check.action-icon:before {
}

.fa-times.action-icon:before {
}

.fa-info.action-icon:before {
}

.fa-calendar.action-icon:before {
}

.fa-sign-in.action-icon:before {
}

.fa-check-square-o.action-icon:before {
}

.fa-pencil.action-icon:before {
}

.fa-clone.action-icon:before {
}

.fa-calendar-plus-o.action-icon:before {
}

.action-btn-container .action-link .action-link {
	padding: 3px, 6px;
}

.page-action-btn-container {
	/* padding: 10px 0px 0px 0px; */
	text-align: right;
}

.panel-action-btn-container {
	/* get padding and  text align from action-btn-contaier */
}

.expando-btn-container,
.action-btn-container {
	padding: 0 0.75em 0 0;
	text-align: left;
}

	.action-btn-container.p0 {
		padding: 0;
	}

/*
div#QueryPanel-EntitiesMenu {
    text-align: left;
}
*/

.eqjs-menu-levelDiv {
	text-align: left;
}

.right-body-alert {
	margin-top: 10px;
	font-size: 14px;
}

.right-body-button-container {
	padding-bottom: 15px;
}


@media (min-width: 768px) {
	/* position the action button containers to the top right of the containing div. Needs containing div to have position: relative or some such. */
	/* this was in here twice. */
	/*.panel-action-btn-container {
        position: absolute;
        top: 22px;
        right: 18px;
    }*/

	.panel-bottom-action-btn-container {
		/* position: absolute; */
		/* bottom: 10px; */
		/* right: 58px; */
		float: right;
		padding-right: 15px;
		padding-bottom: 10px;
	}

	.panel-bottom-action-btn-container-0 {
		position: absolute;
		right: 58px;
	}

	.page-action-btn-container {
		position: absolute;
		top: 7px;
		right: 18px;
	}

	.expando-btn-container,
	.action-btn-container {
		text-align: right;
	}

	.right-body-container {
		padding-left: 0px;
	}

	.left-column-container {
	}

	.list-header-right {
		text-align: right;
	}
}


.common-pagename-container {
	font-size: 40px;
	text-align: left;
	display: flow-root;
}

	.common-pagename-container .icon {
	}

	.common-pagename-container .text {
	}

.folder-view-name {
	color: #666;
	background-image: initial;
	background-position-x: initial;
	background-position-y: initial;
	background-size: initial;
	background-repeat: initial;
	/* background-repeat-y: initial; */
	background-attachment: initial;
	-moz-background-origin: initial;
	-webkit-background-origin: initial;
	background-origin: initial;
	-moz-background-clip: initial;
	-webkit-background-clip: initial;
	background-clip: initial;
	font-style: normal;
	font-variant-ligatures: normal;
	font-variant-caps: normal;
	font-variant-numeric: normal;
	font-weight: normal;
	font-stretch: normal;
	font-size: 18pt;
	line-height: normal;
	font-family: 'Open Sans',sans-serif;
}


.left-column-container {
	/* display: inline-block; */
	/*padding: 20px;*/
	/* background-color: #f7f7f7; */
	/* text-align: left; */
	/* margin-top: 10px; */
}

.panel-default.left-column-panel {
	/* border: 0px; */
	/* -webkit-box-shadow: 0px 0px; */
	/* box-shadow: 0px 0px; */
	/* background-color: #FFFFFF */
}

.left-column-panel {
	/* border-bottom: 1px solid #1777B1; */
	/* background: #F9F9F9; */
	/* background-color: #1777b1; */
}

/* need to override panel-heading */
.panel-heading.left-column-panel-header {
	padding-top: 5%;
	/* font-size: 16px; */
	padding-left: 10%;
	color: white;
	text-align: center;
	border-bottom: 1px solid #1777B1;
	/*min-width: 200px;*/
	background: #F9F9F9;
	background-color: #1777b1;
}

.panel-heading.left-justify-panel-header {
	padding-top: 5px;
	padding-left: 5px;
	text-align: left;
	background-color: transparent;
}

/* need to override panel-title to keep font size consistent */
.panel-title.text {
	font-size: inherit;
}

.panel-title > a {
	display: block;
}

.rule-card {
	margin: 0px;
	/* border: 0px; */
}

.card-header.rule-card-heading {
	background-color: white;
}

.list-header-container.rule-card-heading {
	background-color: white;
	color: #727272;
	font-weight: bold;
}

.list-item-container.rule-card-text {
	background-color: white;
	color: #727272;
}

.rule-title {
	color: #727272;
	font-size: var(--bs-body-font-size);
}

.list-item-grouping {
	border-left: 2px solid #1777b1;
	border-radius: 20px;
}

.left-column-list-item {
	/* color: #999; */
	/* margin: 4px 0; */
	/* cursor: pointer; */
	/*font-size: 14px;*/
	/* line-height: 25px; */
	/* display: table-row; */
}

/* .left-column-list-top { */
/* color: #727272; */
/* box-shadow: 0 2px 2px rgba(0,0,0,.05); */
/* margin-bottom: 25px; */
/* } */

/* .left-column-list-bottom { */
/* /*max-width: 200px;*/ */
/* color: #727272; */
/* box-shadow: 0 2px 2px rgba(0,0,0,.05); */
/* } */
/* .left-column-title-header { */
/* font-style: normal; */
/* font-variant-ligatures: normal; */
/* font-variant-caps: normal; */
/* font-variant-numeric: normal; */
/* font-weight: normal; */
/* font-stretch: normal; */
/* line-height: normal; */
/* font-family: 'Open Sans',sans-serif; */
/* color: white; */
/* padding-top: 5%; */
/* font-size: 16px; */
/* padding-left: 10%; */
/* } */
.body-container {
	/*padding: 20px;*/
	/*background-color: #f7f7f7;*/
	border: none;
	box-shadow: none;
}

.body-container-alert {
	margin-top: 10px;
}

.body-header,
.panel-default > .body-header {
	/*font-size: 28px;
    font-weight: 500;*/
	color: #666;
	border: none;
	margin-top: 10px;
	margin-bottom: 10px;
}

	.body-header .text {
		font-size: inherit;
		font-weight: inherit;
		color: inherit;
	}

.body-header-title {
	font-size: x-large;
}

.body-header-text {
	font-size: small;
	width: 60%;
}

.body-subheader {
	padding: 5px 0px;
}

.body-subheader-title,
.pie-chart svg > g:first-of-type > text {
	font-size: large;
	font-weight: normal;
}

.body-subheader-text {
	font-size: small;
}

.panel,
.body-content {
	background-color: inherit;
}

.alert-save-result {
	font-weight: bold;
	position: fixed;
	top: var(--navbar-height, 6rem);
	z-index: 999;
	/*width: 30%;*/
	left: 50%;
	transform: translateX(-50%);
}

/* was details-block */
.form-container {
	/*font-size: 14px;*/
	line-height: normal;
	/*font-family: 'Open Sans',sans-serif;*/
	margin-bottom: 30px;
	/*color: #727272;*/
	padding-left: 15px;
	padding-right: 15px;
}

.form-header {
}

.form-header-title {
	font-size: x-large;
}

.form-header-text {
	font-size: small;
}

/*list styles*/
.list-container {
	padding: 5px 15px;
	text-align: left;
	/*background-color: white;*/
}

	.list-container .list-item-container .list-item.row {
		padding: 3px 0px;
	}

/* unset white background when used in filter block */
.filters-block .list-item-container {
	background-color: inherit;
}


#reportResultContentContainer {
	text-align: left;
	background-color: #f7f7f7;
}

.list-item-container {
}

.course-list-container div.list-item {
	padding: 0.5em 0 0.5em 0;
	border-bottom: 1px solid lightgrey;
	overflow: hidden;
}

.course-list-meeting-list-room
/* these two are put in to normalize message html content */
.list-item .row .panel-collapse {
	color: black;
}

.list-item .row .panel-collapse p {
	color: black; /* override shop.style.css p colors*/
	font-size: inherit; /* override shop.style.css p font size*/
}

/*
	datepicker_mod.css kills the angular material datepicker
	ie 11 doesn't like unset
*/
.list-item .datepicker {
	height: auto;
	border: none;
	width: 120px;
	padding: 0;
}

	.list-item .datepicker .datepicker__input {
		width: 100%;
		display: block;
		height: 34px;
		padding: 6px 12px;
		font-size: 14px;
		line-height: 1.42857143;
		color: #555;
		background-color: #fff;
		background-image: none;
		border: 1px solid #ccc;
		border-radius: 4px;
		-webkit-box-shadow: inset 0 1px 1px rgba(0,0,0,.075);
		box-shadow: inset 0 1px 1px rgba(0,0,0,.075);
		-webkit-transition: border-color ease-in-out .15s,-webkit-box-shadow ease-in-out .15s;
		-o-transition: border-color ease-in-out .15s,box-shadow ease-in-out .15s;
		transition: border-color ease-in-out .15s,box-shadow ease-in-out .15s;
	}

.list-item-short-description {
}

.list-header-container {
	font-weight: bold;
	text-align: left;
	margin-bottom: 5px;
}

	.list-header-container.team-skills-header > .row {
		font-weight: normal;
		color: #000;
		background: transparent;
	}

	.list-header-container .row,
	.content-panel > .content-panel-heading {
		background: var(--bs-primary);
		color: var(--bs-primary-contrast);
		text-align: center;
		font-weight: bold;
		padding: 10px 0px;
	}

		.list-header-container .row a {
			color: #fff;
		}

	.list-header-container .action-btn .list-header {
		padding: 6px 0px;
	}

div.list-header-container .list-header {
	padding: 0px 5px;
}

div.list-item-container {
}

.list-header-left {
	text-align: left;
}
/* in mobile left align all headers */
.list-header-right {
	text-align: left;
	/* text-align:right; */
}

div.list-item-container .list-item .icon {
}

div.list-item-container .list-item .action-btn-container .action-link,
.action-link {
	padding: 3px 6px;
	/* color: white; */ /* let bootstrap handle color */
}

div.list-item-container .list-item .list-item-name,
tbody.list-item-container .list-item .list-item-name {
	font-size: 1rem;
}

div.list-item-container .list-item .action-btn-container .action-link .action-icon {
	font-size: 20px;
	line-height: inherit;
}

div.list-item-container .list-item .list-item-name > a,
tbody.list-item-container .list-item .list-item-name > a {
	color: var(--bs-link-color);
	font-size: 1rem;
}

	div.list-item-container .list-item .list-item-name > a:hover {
		color: var(--bs-link-hover-color);
	}

div.list-header-container .sortable-header:hover {
	cursor: pointer;
}



.vertical-align {
}

.pagination-control {
	text-align: center;
	margin: 0px;
}

/*.prettyButtons, .prettyButtonsDark, .prettyButtonsDisabled, a.prettyButtonsDark, a.prettyButtonsDark:link, a.prettyButtonsDark:visited,
a.prettyButtonsDark:active,
a.prettyButtonsDark:hover, a.prettyButtonsDisabled, a.prettyButtonsDisabled:link, a.prettyButtonsDisabled:visited,
a.prettyButtonsDisabled:active, a.prettyButtonsDisabled:hover, a.prettyButtons, a.prettyButtons:link, a.prettyButtons:visited,
a.prettyButtons:active, a.prettyButtons:hover {
    padding: 1px 6px;
}*/

.todayButton, .clearButton {
	font-size: 12px;
}

/* have to do it this way because the Angular build will overwrite classes you try to add */
/* could inject custom classes if using ngx-bootstrap 2.0 (still in development) */
.tabset-container > .nav-pills {
	margin-bottom: 10px;
}

tabset.tabset-container > .nav-pills > .nav-item > .nav-link {
	font-size: 14px;
	color: var(--bs-primary);
	padding: 12px;
	border-style: solid;
	border-color: #EEEEEE;
	border-width: 1px;
}

.tabset-container .nav-pills .nav-item > .nav-link:hover,
.tabset-container > .nav-pills > .nav-item > .nav-link:hover {
	background: #EEEEEE;
}

.tabset-container > .nav-pills > .nav-item.active > .nav-link,
.tabset-container > .nav-pills > .nav-item > .nav-link.active {
	color: #FFFFFF;
	border-color: var(--bs-primary);
	background: var(--bs-primary);
}

	.tabset-container > .nav-pills > .nav-item.active > .nav-link:hover,
	.tabset-container > .nav-pills > .nav-item > .nav-link.active:hover {
		background: var(--bs-primary);
	}

.labeled-text-container {
	font-weight: normal;
	color: #333333;
}

.labeled-text-label {
	font-weight: bold;
}

.labeled-text {
}

.list-item-container,
.course-list-container .list-item-container {
	background-color: #fff;
}

.people-list {
	word-wrap: break-word;
	-ms-word-wrap: break-word;
	overflow-wrap: break-word;
}

@media (max-width: 767px) {
	.course-list-container {
		padding: 0px;
	}
}

.course-list-icon {
	font-size: 36px;
}

.course-detail-container {
	background: #F7F7F7;
	padding: 12px;
	overflow: hidden;
}

	.course-detail-container .sections {
		padding: 5px 0px;
		overflow: auto;
	}

	.course-detail-container .action-button-container-course {
		padding: 0px;
	}

.action-button-container-course {
	z-index: 10;
}

@media (max-width: 767px) {
	.action-button-container-course {
		text-align: center;
	}
}

a.action-btn-course {
}

.course-list-facility-info-container {
}

.course-list-facility-name {
	font-weight: bold;
}

.course-list-facility-address {
}

.course-list-facility-map-icon {
	color: #2d71b3;
}

.course-list-meeting-container {
	padding: 0;
	text-align: left;
}

.course-list-meeting-header-container {
	text-align: left;
}

.course-list-container .course-list-meeting-list-item {
	padding: 2px 0px;
	border-bottom: none;
}

.course-list-meeting-list-room {
}

.course-list-child-container {
}

.course-list-child-header-container {
}

/* Had to to it this way to override Bootstrap */
.table > thead > tr.course-list-child-header > th {
	padding: 0px 8px 0px 0px;
}

tbody.course-list-child-item-container .course-list-child-item .course-list-child-name > a {
	font-size: var(--bs-body-font-size);
}

.course-list-child-item-container {
}

.course-list-child-item {
	border-bottom: none;
}

/* Had to to it this way to override Bootstrap */
.table > tbody > tr.course-list-child-item > td {
	vertical-align: middle;
	border-top: none;
	padding: 4px 8px 4px 0px;
}

.course-list-child-name {
	width: 65%;
}

a.action-btn-course-child {
	font-size: 14px;
	min-width: 35px;
}

.action-btn-course-child i {
	vertical-align: -5%;
}

#iframemodal {
	height: 95vh;
	width: 95vw;
	overflow: hidden;
	margin: 0px;
}

	#iframemodal .modal-body, #iframemodal iframe {
		width: calc(100vw - 120px);
		height: calc(100vh - 120px);
		padding: 0px;
	}


/* Navigation Editor */
/* Dragula (library for Nav Edit) */
.gu-mirror {
	position: fixed !important;
	margin: 0 !important;
	z-index: 9999 !important;
	opacity: 1.0;
	-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
	filter: alpha(opacity=100);
}

.gu-hide {
	display: none !important;
}

.gu-unselectable {
	-webkit-user-select: none !important;
	-moz-user-select: none !important;
	-ms-user-select: none !important;
	user-select: none !important;
}

.gu-transit {
	opacity: 0.4;
	-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=40)";
	filter: alpha(opacity=40);
}
/* End Dragula */

.nav-edit-hidden-body, .nav-edit-displayed-body {
	height: 500px;
	overflow-x: hidden;
	overflow-y: auto;
}

.mylearning-edit-hidden-body, .mylearning-edit-displayed-body {
	height: auto;
	min-height: 50px;
	overflow-x: hidden;
	overflow-y: auto;
}

.mylearning-profile-avatar {
	height: auto;
	width: auto;
	max-height: 80px;
	max-width: 60px;
}

/* replaced with BS util classes */
/* .mylearning-profile-info-container { */
/* display:flex; */
/* flex-direction:column; */
/* align-content:stretch; */
/* } */

/* replaced with BS util classes */
/* .mylearning-profile-name-block { */
/* margin-bottom: 0px; */
/* word-wrap: break-word; */
/* -ms-word-wrap: break-word; */
/* overflow-wrap: break-word; */
/* } */

/* replaced with BS util classes */
/* .mylearning-profile-locationposition-block { */
/* margin-bottom: 0px; */
/* } */

/* replaced with BS util classes */
/* .mylearning-profile-email-block { */
/* } */

.nav-edit-icon-container {
	margin: 10px;
	padding: 10px;
	background-color: #f7f7f7;
	transition: opacity 0.4s ease-in-out;
	cursor: move;
	cursor: grab;
	cursor: -moz-grab;
	cursor: -webkit-grab;
}

/* End Navigation Editor */

/* Remove ASE picker from elective rule*/
#ctlTemplate_regMainBody_oCertEvalType_ctlASEMixedElectivePicker_lnkPicker {
	display: none;
}

#ui-datepicker-div {
	width: auto;
}

.ui-timepicker-div {
	display: none;
}

.dropdown-menu.navbar-login {
	overflow: inherit;
}

/** Avoid horizontal vertical scroll bar  **/
.navbar-collapse.in {
	overflow-y: unset;
}
/* iPhone X and Xs Max */
@media only screen and (min-device-width: 375px) and (min-device-height: 812px) and (-webkit-device-pixel-ratio: 3) and (orientation: portrait) {
	.row.safari-fix [class*="col-xs-6"] {
		width: 100%;
	}
}

/* iPhone XR */
@media only screen and (min-device-width: 414px) and (min-device-height: 896px) and (-webkit-device-pixel-ratio: 2) and (orientation: portrait) {
	.row.safari-fix [class*="col-xs-6"] {
		width: 100%;
	}
}

@media only screen and (max-width: 768px) {
	.navbar-default .navbar-nav .open .dropdown-menu > .active > a,
	.navbar-default .navbar-nav .open .dropdown-menu > .active > a:focus,
	.navbar-default .navbar-nav .open .dropdown-menu > .active > a:hover {
		background-color: var(--bs-primary);
	}

	.navbar-fixed-top .navbar-collapse,
	.navbar-fixed-bottom .navbar-collapse {
		max-height: 80vh;
	}

	.navbar-right {
		float: none !important;
	}

	ul.nav.navbar-nav.navbar-right > li {
		display: inline-block;
	}

		ul.nav.navbar-nav.navbar-right > li:first-child {
			display: inherit;
			margin: auto 5px;
		}

		ul.nav.navbar-nav.navbar-right > li:last-child {
			display: inline-block;
		}

	.navbar-fixed-top {
		top: 0;
		border-width: 0 0 1px;
	}

	.navbar-toggle {
		/*display: block;
        margin-top: 10px;*/
		margin-left: 10px;
	}

	.navbar-collapse {
		border-top: 1px solid transparent;
		box-shadow: inset 0 1px 0 rgba(255,255,255,0.1);
	}

		.navbar-collapse.collapse {
			display: none !important;
		}

	.collapse.in {
		display: block !important;
		text-align: left;
	}

	.navbar-header {
		float: none;
	}

	typeahead-container {
		position: inherit !important;
		border: 1px solid rgba(0, 0, 0, 0.15);
		border-radius: 4px;
	}
}
/* End Navigation Editor */

div#pnlStudentIDSearch > dl > dt {
	width: 20em;
}

div#pnlStudentIDSearch > dl > dd > div.criteriaRow {
	display: flex;
}

div#pnlStudentIDSearch > dl > dd > div > div.selectize-control, #divAseConfiguration .selectize-control {
	width: 25em;
}



@media(max-width:839px) {
	/*have to use !important here because EasyQuery adds css directly on page and has highest priority even in mobile*/
	.eqjs-qp-row {
		height: initial !important;
	}

	.eqjs-qp-condition-buttonsBlock {
		right: 0px !important;
		width: 60px !important;
	}
}
/*added specifically for Launch content button on self-study courses*/
a[id$='_lnkResourceURL'].prettyButtons:link {
	margin-bottom: 2px;
}

a[id$='_lnkResourceURL'].prettyButtons > i {
	padding-top: 8px;
}
/* report scheduling */



ul.days {
	-webkit-padding-start: 0px;
}

.input-group-addon-suedo {
	border: 0px none;
	background-color: inherit;
}

.pt-1 {
	padding-top: 1rem;
}

@media (max-width: 768px) {
	.weekly .days li {
		width: 50%;
	}
}

@media (min-width: 768px) {
	.weekly .days li {
		width: 14.286%;
	}
}

.days .btn {
	margin-left: -1px;
	margin-top: -1px;
}

.weekly > .days .btn {
	margin-left: -1px;
	margin-top: 0px;
}

.monthly .days li {
	width: 14.286%;
}

.days li {
	height: 62px;
	padding: 10px;
	text-align: right;
	font-weight: bold;
	font-size: 14px;
}

.weekly > .days li {
	height: auto;
	padding: 10px 5px;
	font-weight: normal;
	font-size: inherit;
	text-align: center;
}
/*end: report scheduling*/
dl#dlResourceContent.alt {
	overflow: visible;
}
/*certification step in wizard*/
.fa-close-custom-color {
	color: #999;
}

.ie-fix {
	padding-left: 2rem;
	display: table;
}
/*end certification step in wizard*/
/*wizard component*/
div.wizard.card {
	height: 100%;
}

/* only the top card header */
div.wizard > .card-header {
	padding: 0;
	font-size: 1.25rem;
}

div.wizard .card-block {
}

div.wizard .card-footer {
	border-top: 0 none;
	padding-top: 10px;
	padding-left: 0px;
	padding-right: 0px;
	padding-bottom: 0px;
	background-color: var(--bsbody-bg);
}

div.wizard li.nav-item {
	border-bottom: 0.5rem solid #ccc;
	transition: all .3s;
}

	div.wizard li.nav-item.active {
		color: var(--bs-primary);
		border-bottom-color: #1976D2 !important;
	}

	div.wizard li.nav-item.enabled {
		color: var(--bs-primary);
		cursor: pointer;
		border-bottom-color: #80D8FF;
	}

		div.wizard li.nav-item.enabled a {
			display: block;
		}

	div.wizard li.nav-item.disabled {
		color: #ccc;
		cursor: not-allowed;
	}

		div.wizard li.nav-item.disabled > a {
			cursor: not-allowed;
		}

	div.wizard li.nav-item.completed {
		cursor: default;
	}

	/*div.wizard li.nav-item:not(.disabled):hover {
        background-color: #1976D2;
    }

    div.wizard li.nav-item.enabled > a:hover {
        color: white;
    }*/

	div.wizard li.nav-item > a:hover {
		font-weight: normal;
	}

div.wizard div.step {
	padding-top: 1rem;
}
/*up*/
/*for the panels in wizard last step*/
div.wizard .card-block .step:last-child .panel-default
/*.panel-default*/ {
	border-color: rgb(221, 221, 221);
}

	div.wizard .card-block .step:last-child .panel-default > .panel-heading
	/*.panel-default > .panel-heading*/ {
		color: rgb(51, 51, 51);
		background-color: rgb(245, 245, 245);
		border-color: rgb(221, 221, 221);
	}
	/*panel title*/
	div .wizard .nav .nav-item > a,
	div.wizard .card-block .step:last-child .panel-default > .panel-heading
	/*.panel-default > .panel-heading*/ {
		font-size: 16px;
	}
/*wizard component*/
/*auto-assign*/
/*start step - user preview*/
.items-per-page {
}
/*end step - user preview*/
/*charts*/


/* .mylg-stacked-bar-chart {
  width: 100%;
  height: 60px;
} */

.mylg-stacked-bar-chart svg > g:first-of-type > text {
	font-size: medium;
	font-weight: normal;
}

.panel-heading.left-column-panel-header.past-due {
	/* background-color: #FF5C6F; */
	/* font-size: 16px; */
	/* text-align: left; */
	/* border-bottom: 1px solid #FF5C6F; */
	/* padding-left: 10px; */
}

.panel-heading.left-column-panel-header.due-soon {
	/* background-color: #A6D3F9; */
	/* font-size: 16px; */
	/* text-align: left; */
	/* border-bottom: 1px solid #A6D3F9; */
	/* padding-left: 10px; */
}

.panel-heading.left-column-panel-header.no-due-date {
	/* background-color: #65B3F7; */
	/* font-size: 16px; */
	/* text-align: left; */
	/* border-bottom: 1px solid #65B3F7; */
	/* padding-left: 10px; */
}

.left-column-list-container {
	/* padding: 0.5em 0 0.5em 0; */
	/* margin-left: -10px; */
	/* border: 1px solid lightgray; */
	/* border-left: 1px solid lightgray; */
	/* border-bottom: 1px solid lightgray; */
	/* border-right: 1px solid lightgray; */
	/* background-color: #fff; */
	/* padding-left: 10px; */
}

.padding-15 {
	padding-right: 15px;
	padding-left: 15px;
}

.padding-15-left {
	padding-left: 15px;
}

.bar-chart svg > g:first-of-type > text {
	font-size: medium;
	font-weight: normal;
}

.bar-chart {
	width: 100%;
	min-height: 250px;
	max-height: 400px;
	overflow-x: hidden;
	overflow-y: auto;
}

/* moved to pie-chart.component.css */
/*.pie-chart {
    width: 100%;
    min-height: 250px;
}

td .pie-chart {
    width: auto;
    min-height: 0px;
}

.hide-donut {
    display: none;
}

*/

.chart-container {
	margin: 0 !important;
}

td > div > lms-pie-chart > div {
	display: table-cell;
}

.skills-expanded-row lms-pie-chart rect {
	fill: #F7F7F7;
}

/* moved to pie-chart.component.css */
.chart-data-center {
	text-align: center;
	position: absolute;
	left: 50%;
	top: 50%;
	transform: translate(-50%, -50%);
}

td .chart-data-center {
	top: 3.6rem;
}
/*
[lms-skill-status-detail] td .chart-data-center {
    top: 8rem;
    left: 9.5rem;
}
*/
.hide-donut-text {
	position: static;
	transform: translate(0%, 0%);
}
/* moved to pie-chart.component.css */
/*.chart-data-center > strong {
    font-size: 3.5em;
    font-weight: lighter;
    font-variant-numeric: slashed-zero;
}*/

[lms-skill-status-detail] .chart-data-center > strong {
	font-size: 16px;
	font-weight: lighter;
	font-variant-numeric: slashed-zero;
}

modal-container [lms-skill-status-detail] .chart-data-center > strong {
	font-size: 24px;
	font-weight: lighter;
	font-variant-numeric: slashed-zero;
}

modal-container [lms-skill-status-detail] .chart-data-center {
	top: 2.6rem;
	position: absolute;
	transform: translate(-50%, -50%);
}

@media (min-width: 1100px) {
	[lms-skill-status-detail] .chart-data-center > hr,
	[lms-skill-status-detail] .chart-data-center > p {
		display: none;
	}

	[lms-skill-status-detail] .chart-data-center {
		text-align: center;
		position: relative;
		left: 50%;
		top: 50%;
		transform: translate(-50%,-240%);
	}
}

@media (max-width: 1099px) {
	[lms-skill-status-detail] .pie-chart {
		display: none;
	}

	[lms-skill-status-detail] .chart-data-center {
		position: static;
		transform: none;
	}
}

[lms-skill-area-summary] .chart-data-center > strong {
	font-size: 1.6em;
	font-weight: lighter;
	font-variant-numeric: slashed-zero;
}

.chart-data-center p {
	margin: 0px;
	font-weight: bold;
}

[lms-skill-area-summary] .chart-data-center p {
	font-size: 0.8em;
}
/*end charts*/

/*common css*/
/*css for outline button primary*/
a.btn.outline,
a:link.btn.outline {
	background: none;
	padding: 8px 20px;
}

a.btn-primary.outline,
a:link.btn-primary.outline {
	border: 2px solid #2d71b3;
	color: #2d71b3;
}

	a.btn-primary.outline:hover, a.btn-primary.outline:active, a.btn-primary.outline.active, .open > .dropdown-toggle.btn-primary {
		color: #fff;
		border-color: #2d71b3;
		background: #2d71b3;
	}

	a.btn-primary.outline:focus {
		box-shadow: 0 0 0 0.2rem rgba(220,53,69,.5);
	}

.btn-primary.outline:active, .btn-primary.outline.active {
	border-color: #007299;
	color: #007299;
	box-shadow: none;
}
/*end btn outline*/

/* adding this because a:link is otherwise more selective */
/*a.btn.btn-primary {
	color: var(--bs-btn-color);
	background: var(--bs-btn-bg);
}
*/

.shadow1 {
	transition: all .3s;
}

	.shadow1:hover {
		border-radius: 4px;
		box-shadow: 0 8px 8px rgba(1,67,163,.24), 0 0 8px rgba(1,67,163,.12), 0 6px 18px rgba(43,133,231,.12);
		transform: translateY(-2px);
	}

.icon-set {
	margin: 19px 50px 4px 50px;
	padding: 7px;
}

hr {
	margin: -4px 0px 0px 0px;
	border-top: 1px solid lightgrey;
}
/*end common css*/

/* Mobile Specific Styling */
/* This gets rid of gray border and extra padding in mobile to free up screen space */
@media(max-width:768px) {
	.body-main {
		padding: 0px;
	}

	.body-container {
		padding: 0px;
	}

	.no-margin-left {
		margin-left: 0px;
	}
}
/* End Mobile Specific Styling */
.capitalize {
	text-transform: capitalize;
}

.tag span {
	border: 1px solid #c9c4c4;
	padding: 5px;
	vertical-align: middle;
	background-color: whitesmoke;
	width: fit-content;
}

	.tag span:not(:first-child) {
		margin: 0px 5px
	}


.tags ul,
.tags-sm ul {
	margin: 0;
	padding: 0;
	list-style: none;
}

	.tags ul li,
	.tags-sm ul li {
		display: inline-block;
		margin: 0 .3em 0 0;
		padding: 0;
	}

		.tags ul li span,
		.tags-sm ul li span {
			display: inline-block;
			max-width: fit-content;
			height: 2.5rem;
			line-height: 2.5;
			padding: 0 1em;
			background-color: #fff;
			border: 1px solid #aaa;
			/*background-color: #f5faff;
            border: 1px solid #c2e0ff;*/
			white-space: nowrap;
			overflow: hidden;
			color: #333;
			font-size: 10px;
			text-decoration: none;
			-webkit-transition: .2s;
			transition: .2s;
		}

		.tags ul li span {
			height: 2.5rem;
			line-height: 2.5;
			padding: 0 1em;
			font-size: inherit;
		}

.tags-md ul li span {
	line-height: 2;
	padding: 5px;
	font-size: 10px;
}

.tags-sm ul li span {
	height: 19px;
	line-height: 16px;
	padding: 0 0.5em;
	font-size: 11px;
}

	.tags ul li span p,
	.tags-md ul li span p,
	.tags-sm ul li span p {
		display: inline-block;
		padding: 0px 2px;
		font-weight: bold;
		font-size: 10px;
	}

		.tags ul li span p:hover,
		.tags-sm ul li span p:hover {
			cursor: pointer;
		}

.schedule .input-group .input-group-addon {
	border-left: 0;
}

.ng-select.ng-select-multiple .ng-select-container .ng-value-container {
	overflow-x: hidden;
}

/*.input-group a.input-group-addon {
    color: var(--lms-theme-color);
}

    .input-group a.input-group-addon:hover {
        background-color: var(--lms-theme-color);
        color: var(--lms-theme-bg-color);
    }

.form-group .ng-select.ng-select-multiple .ng-select-container .ng-value-container .ng-value .ng-value-icon {
    color: var(--lms-theme-color);
}

    .form-group .ng-select.ng-select-multiple .ng-select-container .ng-value-container .ng-value .ng-value-icon:hover {
        background-color: var(--lms-theme-color-light);
    }

.form-group .ng-select.ng-select-multiple .ng-select-container .ng-value-container .ng-value {
    background-color: var(--lms-theme-color-lighter);
    border: 1px solid var(--lms-theme-color);
    border-radius: 0px;
}

.ng-select .ng-dropdown-panel .ng-dropdown-panel-items .ng-option.ng-option-marked,
.ng-select .ng-option-marked {
    background-color: var(--lms-theme-color) !important;
    color: var(--lms-theme-bg-color) !important;
}*/
/*calendar in new UI*/
/*.bs-datepicker .bs-calendar-container .bs-datepicker-head {
    background-color: var(--lms-theme-color);
}

.bs-datepicker .bs-calendar-container .bs-datepicker-body table td span.selected,
.bs-datepicker .bs-calendar-container .bs-datepicker-body table td.selected span,
.bs-datepicker .bs-calendar-container .bs-datepicker-body table td span[class*="select-"]::after,
.bs-datepicker .bs-calendar-container .bs-datepicker-body table td[class*="select-"] span::after {
    background-color: var(--lms-theme-color);
}

.bs-datepicker .bs-datepicker-body table td {
    color: var(--lms-theme-color);
}*/
/*end calendar in new UI*/
/*css standard for collapsible button in new ui. Ex: filter in goals page*/
.btn-collapsable1 {
	text-align: left;
}
/*TODO: remove*/
.filter-container .btn-collapsable1 {
	font-size: large;
	font-weight: normal;
}

.eqjs-menu-applyDiv button {
	background-color: #2d71b3;
	border: none;
}

.detail-container {
	background-color: #F7F7F7;
	margin: 10px 0;
	padding: 15px;
}

.form-static label {
	margin-bottom: 0;
}

.label-optional {
	color: #737373;
	font-style: italic;
}

.red {
	color: #FF5C6F;
}

.detail-container.form-static .form-group {
	margin-bottom: 10px;
	min-height: 47px;
}

.detail-container.form-static p.form-control-static {
	padding: 0px;
}

fieldset.duedate {
	padding-bottom: 10px;
}

.form-control.date-control[readonly] {
	background-color: #fff;
}

.detail-container.form-static a.btn {
	margin-bottom: 0px;
	border: 1px solid transparent;
}

.collapse1 {
	/* setup transition however you like */
	-webkit-transition: max-height 0.7s Fast ease-out, Slow In;
	-moz-transition: max-height 0.7s cubic-bezier(0, 0.2, 0.8, 0.2);
	-o-transition: max-height 0.7s cubic-bezier(0, 0.2, 0.8, 0.2);
	-ms-transition: max-height 0.7s cubic-bezier(0, 0.2, 0.8, 0.2);
	transition: max-height 0.7s ease-in;
	/* override display, overflow and visibility */
	display: block !important;
	overflow: hidden !important;
	visibility: visible !important;
	max-height: 0;
}

	.collapse1.in {
		/* set max-height to something high so that
    it can fit whatever you have inside your collapsible tag.
    Not too high though, because the animation time will be based
    on this value, so if it's too high the animation will be
    very fast */
		max-height: 1000px;
	}
/**
    my people
*/

.fa-stack > .fa-badge {
	position: absolute;
	right: -10%;
	/*bottom: -23%;*/
	font-size: 60%;
	height: 60%;
	width: 60%;
	line-height: 120%;
	text-align: center;
}

.fa-outline-inverse {
	text-shadow: -0.12ex 0 #FFF,-0.1ex -0.1ex #FFF, 0 -0.12ex #FFF, 0.1ex -0.1ex #FFF, 0.12ex 0 #FFF, 0.1ex 0.1ex #FFF, 0 0.12ex #FFF, -0.1ex 0.1ex #FFF;
}

/** end my people*/

/** border radius fix*/
div.rosterTabs a, .nav-pills > li > a,
.modal-content, .MooDialog,
.pagination > li:first-child > a, .pagination > li:first-child > span,
.pagination > li:last-child > a, .pagination > li:last-child > span {
	border-radius: 0px;
}
/* end border radius fix*/
.card-panel1 {
	padding: 20px;
	margin-bottom: 15px;
	border: 1px solid #e1eaea;
	border-radius: 0px;
	background: #fff;
	border: none;
	box-shadow: 0 0 15px rgba(174, 195, 209, 0.5);
}

	.card-panel1 .body .icon:hover {
		box-shadow: 0 0 15px rgba(174, 195, 209, 0.5)
	}
/* animating a icon on click like accordion open/close
 * -------------------------- */
.rotate {
	-moz-transform: rotate(-90deg);
	-ms-transform: rotate(-90deg);
	-webkit-transform: rotate(-90deg);
	transform: rotate(-90deg);
}

.rotate-icon {
	-moz-transition-duration: 0.4s;
	-o-transition-duration: 0.4s;
	-webkit-transition-duration: 0.4s;
	transition-duration: 0.4s;
	display: inline-block;
}

.list-pagination-container .page-counts {
	padding: 8px 0px;
}

.list-pagination-container select.items-perpage {
	padding: 0px;
	height: 34px;
	/*border: none;*/
	font-size: larger;
}

	.list-pagination-container select.items-perpage:focus {
		/*border: none;*/
	}

.list-container > .list-pagination-container label {
	font-weight: inherit;
}

.list-container > .list-pagination-container {
	padding: 6px 0px;
}

.btn-filter.no-filter {
}

	.btn-filter.no-filter:hover {
	}

.no-line-height {
	line-height: inherit;
}

.text.left-column-list-item.row.no-line-height::after {
	margin-bottom: 8px;
}



.transcript-status-history-list {
	list-style-type: circle;
	padding-left: 1.1em;
}

.transcript-attachment-list {
	display: list-item;
	list-style: circle;
	margin-left: 1.1em;
}

.trainingHistory-code-indent {
	margin-left: -18.5px;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}

/*bs 4 navbar fix*/
/*.bg-light {
    background-color: #fff !important;
}

@media (min-width: 992px) {
    .navbar-expand-lg .navbar-nav .nav-link {
        padding-left: 0.8rem;
        padding-right: 0.8rem;
    }
}

li.nav-item.dropdown {
    display: flex !important;
    flex-grow: 1;
    align-items: center;
}*/
/*end bs 4 navbar fix*/

.margin-left-15 {
	margin-left: 15px !important;
}

.normalWeight {
	font-weight: normal !important;
}

.list-item-text {
	word-break: break-word;
}

.imgUserImage {
	height: auto;
	max-height: 100px;
	width: auto;
	max-width: 100px;
}

.courseImagePreviewBox {
	border-width: 1px;
	border-style: dashed;
	height: 114px;
	width: 196px;
	text-align: center;
}

.imgCourseImage {
	display: block;
	height: auto;
	max-height: 112px;
	width: auto;
	max-width: 194px;
	margin: auto;
}

.imgCourseImagePreview {
	position: relative;
	top: 50%;
	transform: translateY(-50%);
}

.course-image-icon {
	font-size: 130px;
	display: block;
	height: auto;
	max-height: 150px;
	width: auto;
	max-width: 350px;
	margin-top: 5px;
}

.course-image-icon-preview {
	position: relative;
	top: 50%;
	transform: translateY(-50%);
}

/* User Skills Profile */
.table-bordered > tbody > tr[lms-skill-matrix-row] > td {
	vertical-align: middle;
}

.skills-achieved-color {
	color: #00954d;
}

.skills-goal-color {
	color: #ED8B00;
}

.skills-chevron-color {
	color: #727272;
}

.skills-expanded-row,
.skills-selected-cell {
	background-color: #F7F7F7;
}

tr[lms-skill-status-detail] lms-pie-chart {
	display: inline-block;
	vertical-align: top;
}

tr[lms-skill-status-detail] lms-cert-status-card {
	display: inline-block;
	vertical-align: top;
	width: 100%;
}

.team-skill-achieved {
	background-color: #5CB85C;
}

.progress-bar-yellow {
	background-color: yellow;
}

.team-skill-selected-gradient {
	background-image: -moz-linear-gradient(top, rgba(92,184,92,0) 0%, rgba(247,247,247,1) 100%);
	background-image: -webkit-gradient(left top, left bottom, color-stop(0%, rgba(92,184,92,0)), color-stop(100%, rgba(247,247,247,1)));
	background-image: -webkit-linear-gradient(top, rgba(92,184,92,0) 0%, rgba(247,247,247,1) 100%);
	background-image: -o-linear-gradient(top, rgba(92,184,92,0) 0%, rgba(247,247,247,1) 100%);
	background-image: -ms-linear-gradient(top, rgba(92,184,92,0) 0%, rgba(247,247,247,1) 100%);
	background-image: linear-gradient(to bottom, rgba(92,184,92,0) 0%, rgba(247,247,247,1) 100%);
}

tr[lms-team-skill-matrix-row] .badge {
	position: static;
	background: #FFFFFF;
	color: #000000;
}

.table-bordered > tbody > tr[lms-team-skill-matrix-row] > td {
	vertical-align: middle;
}

.team-skills-goal-count {
	font-family: "Trebuchet MS", Helvetica, sans-serif;
	font-size: x-large;
}

.skill-area-name {
	font-size: 16px;
}

.skill-level-name {
	font-size: 16px;
}

.skill-key-contaier {
	display: flex;
	align-items: center;
}

.skill-key-item {
	flex: initial;
	display: flex;
	align-items: center;
	padding: 5px;
}

.skill-key-color-box {
	min-width: 20px;
	border: thin solid #999;
}

.skill-key-text {
	margin-left: 5px;
}
/* End User Skills Profile */

.tile {
	transition: 0.3s;
	background-color: #fafafa;
	/* Add shadows to create the "card" effect */
	box-shadow: 0 1px 4px 0 rgba(0,0,0,0.2);
	padding: 6px;
	box-sizing: border-box;
}

	/* On mouse-over, add a deeper shadow */
	.tile:hover {
		box-shadow: 0 3px 8px 0 rgba(0,0,0,0.2);
	}

.row > div:first-child > .tile {
	margin-left: 10px;
}

.row > div:last-child > .tile {
	margin-right: 10px;
}

.tile-next-meeting {
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}

.tile-image {
	max-height: 100px;
	max-width: 100%;
}

.tile-image-icon {
	font-size: 73px;
	margin-right: auto;
	margin-left: auto;
	display: table;
}

.triangle-down {
	width: 100%;
	height: 30px;
	z-index: 2;
	position: relative;
}

.tile-arrow-spacer {
	background-color: #ededed;
	height: 10px;
}

.course-detail-down-arrow {
	background-color: #F7F7F7;
	margin-right: 0px;
	margin-left: 0px;
}

.past-due-oval {
	/* width: 40px; */
	/* height: 20px; */
	background: red;
	border-radius: 100px / 50px;
	color: white;
	font-size: 10px;
}

	.past-due-oval > span {
		display: table;
		margin-right: auto;
		margin-left: auto;
	}

.new-oval {
	/* width: 40px; */
	/* height: 20px; */
	background: green;
	border-radius: 100px / 50px;
	color: white;
	font-size: 10px;
}

	.new-oval > span {
		display: table;
		margin-right: auto;
		margin-left: auto;
	}

.padding-top-bottom {
	padding-top: 5px;
	padding-bottom: 5px;
}

.featured-course-name {
	font-size: 16px;
}

.featured-course-expando-bg {
	background: #F7F7F7;
}

.courseTypeChip {
	display: inline-block;
	padding: 0 10px 0 5px;
	height: 25px;
	font-size: var(--bs-body-font-size);
	line-height: 25px;
	border-radius: 12px;
	background-color: #ededed;
	float: right;
}

	.courseTypeChip i {
		float: left;
		margin: 0 5px 0 -5px;
		padding: 2px 5px;
		height: 25px;
		width: 25px;
		border-radius: 50%;
		font-size: 15px;
		background-color: #787878;
	}

.expando-subheader {
	font-size: 11px;
	font-weight: bold;
}

.tile-view-detail {
	position: relative;
	top: -30px;
	padding-bottom: 10px;
	z-index: 1;
}

.entity-check {
	text-align: center;
}

.h-40 {
	height: 40px;
}

.h-30 {
	height: 30px;
}

.h-50 {
	height: 50px;
}

.mh-100 {
	max-height: 100px;
	min-height: 100px;
}



.br-1 {
	/*border-right: 1px solid black;*/
}

.ta-c {
	text-align: center;
}

@media (max-width:767px) {
	.ta-c {
		text-align: initial;
	}

	.br-1 {
		border: initial;
	}

	.skills-expanded-row {
		background-color: #fff !important;
	}
}

.green {
	color: green;
}

.fs-11 {
	font-size: 11px;
}


.collapse .row {
	margin-left: 0;
	margin-right: 0;
}

	.collapse .row.status-gray {
		background: lightgray;
	}

	.collapse .row.status-green {
		background: lightgreen;
	}

	.collapse .row.status-yellow {
		background: lightgoldenrodyellow;
	}

	.collapse .row.status-blue {
		background: lightblue;
	}

	.collapse .row.status-red {
		background: lightpink;
	}

.disable-pointer-events {
	pointer-events: none;
}

.collapse .row.status-gray {
	background: lightgray;
}

.collapse .row.status-blue {
	background: lightblue;
}

/*
    these should be moved to the css in the component.
    also input-group-lg is no longer a bootstrap class.
*/
.input-group-lg > .form-control,
.input-group-lg > .input-group-addon,
.input-group-lg > .input-group-btn > .btn {
	height: 41.6px;
	border-radius: 0px;
}

.course-filter {
	text-align: left;
}

	.course-filter > .panel-body {
		padding: 10px 10px 20px 10px;
	}

span.btn-chevron-ud {
	padding: 5px;
}

span.btn-chevron-lr {
	padding: 5px 8px;
}

span.btn-chevron-r,
span.btn-chevron-d {
	padding: 2px 6px;
}

span.btn-chevron-d,
span.btn-chevron-r {
	text-align: center;
	border-radius: 50%;
	/*transition: .5s;*/
	width: 30px;
	/*margin-right: 5px;*/
}

li.tree-item span.btn-chevron-d:hover,
li.tree-item span.btn-chevron-r:hover {
	background: #d2d2d2;
}

li.tree-item a {
	align-content: center;
}

	li.tree-item a span,
	li.tree-item a label,
	li.tree-item a input[type=checkbox],
	li.tree-item a i {
		vertical-align: middle;
		margin-bottom: 0px;
	}

span.btn-chevron-d:hover,
span.btn-chevron-r:hover {
	background-color: #1862a2;
}

.btn-chevron-lr > i.fa {
	transition: all 0.75s 0.25s;
	transform: rotate(0);
}


.sidenav {
	height: 100%;
	width: 25%;
	position: fixed;
	z-index: 50;
	top: 0;
	left: 0;
	background-color: white;
	border: 1px solid lightgrey;
	overflow-x: hidden;
	transition: 0.5s;
	padding-top: 60px;
}

	.sidenav ul > li.tree-item > a:not(.end-node):hover,
	.sidenav ul > li.tree-item > a:not(.end-node):visited,
	.sidenav ul > li.tree-item > a.active {
		background-color: #eeeeee;
	}

	.sidenav ul > li.list-group-item.menu > a:hover,
	.sidenav ul > li.list-group-item.menu > a:visited,
	.sidenav ul > li.list-group-item.menu > a.active {
		background-color: var(--bs-primary);
		color: white;
	}

	.sidenav ul.list-group {
		margin-bottom: 0px;
		/*line-height: 0em;*/
		list-style: none;
		background-color: white;
	}

	.sidenav li.list-group-item.menu > a {
		background-color: #eeeeee;
		padding: 8px;
	}

	.sidenav a {
		padding: 8px 8px 8px 6px;
		text-decoration: none;
		color: #818181;
		display: block;
		transition: 0.3s;
		font-size: 17px;
		font-weight: normal;
	}

	.sidenav li.list-group-item {
		padding: 3px 1px 3px 10px;
	}

		.sidenav li.list-group-item:not(.menu) a {
			padding-top: 3px;
			padding-bottom: 3px;
		}

	.sidenav a[role="button"]:hover {
		font-size: 17px;
		font-weight: normal;
	}

	.sidenav .closebtn {
		position: absolute;
		top: 50px;
		right: 10px;
		font-size: 40px;
	}

	.sidenav .panel-body h3 {
		font-size: 24px;
	}

	.sidenav .panel {
		border: none;
	}

	.sidenav div.tags,
	.sidenav div.tags-sm {
		margin-top: 14px;
	}

@media screen and (max-width: 768px) {
	.sidenav {
		width: 70%;
	}

		.sidenav a {
			/*font-size: x-large;*/
		}
}

div.panel.course-filter div.tags-sm {
	padding: 10px;
	margin: 10px 0;
	background-color: #f9f9f9;
}

div.panel.course-filter .list-group-item {
	border: none;
}

.vh-75 {
	height: 75vh;
}

.centered {
	position: absolute;
	top: 50%;
	left: 50%;
	margin-top: -50px;
	margin-left: -50px;
	width: 100px;
	height: 100px;
}

.custom-slider {
	padding: 0 20px 0 40px;
}

	.custom-slider .ng5-slider .ng5-slider-pointer {
		width: 14px;
		height: 14px;
		top: -6px; /* to remove the default positioning */
	}

		.custom-slider .ng5-slider .ng5-slider-pointer:after {
			width: 6px;
			height: 6px;
			position: absolute;
			top: 4px;
			left: 3.8px;
		}

	.custom-slider .ng5-slider .ng-slider-bubble {
		font-size: 14px;
	}

/*.course-catalog .input-group-lg > .form-control {
    height: 41.44px;
}*/

.nav-footer {
	position: fixed;
	bottom: 0em;
	left: 0em;
	right: 0em;
	background-color: #fff;
	padding: 0.7em 0em;
	z-index: 50;
	border-top: solid 1px #dadada;
}

.nav-footer ul {
	list-style-type: none;
	display: flex;
	flex-wrap: nowrap;
	justify-content: space-between;
	padding: 0px 7px;
	margin: 0;
}

	.nav-footer ul li a {
		letter-spacing: 1px;
		text-decoration: none;
		color: black;
		line-height: 1;
		vertical-align: middle;
		display: flex;
		align-items: center;
		padding: .90em 1.25em;
		transition: .6s ease-in-out;
	}

		.nav-footer ul li a .fa {
			font-size: 2.1em;
			transition: .6s ease-in-out;
		}

		.nav-footer ul li a span {
			display: inline-block;
			overflow: hidden;
			max-width: 0;
			opacity: 0;
			padding-left: .5em;
			font-size: 1em;
			transform: translate3d(-.5em, 0, 0);
			transition: opacity .6s, max-width .6s, transform .6s;
			transition-timing-function: ease-in-out;
		}

		.nav1-footer ul li a:hover,
		.nav-footer ul li a.show-text,
		.nav1-footer ul li a.is-active {
			color: royalblue;
			background-color: buttonface;
		}

			.nav-footer ul li a span.show-text,
			.nav1-footer ul li a:hover span,
			.nav1-footer ul li a.is-active span {
				opacity: 1;
				max-width: min-content;
				transform: translate3d(0, 0, 0);
				transition-timing-function: ease-in-out;
			}

@media (max-width: 767px) {
	.row {
		margin: 0px;
	}

	.btn-primary,
	.btn-primary:link {
		min-width: 40px;
	}

	nav.nav-footer .btn-primary,
	nav.nav-footer .btn-primary:link {
		min-width: -webkit-fill-available;
		padding: 6px 10px;
	}

	div.list-item-container .list-item .action-btn-container .action-link, .action-link {
		padding: 0px 8px;
	}

	.col-lg-1, .col-lg-10, .col-lg-11, .col-lg-12, .col-lg-2, .col-lg-3, .col-lg-4, .col-lg-5, .col-lg-6, .col-lg-7, .col-lg-8, .col-lg-9, .col-md-1, .col-md-10, .col-md-11, .col-md-12, .col-md-2, .col-md-3, .col-md-4, .col-md-5, .col-md-6, .col-md-7, .col-md-8, .col-md-9, .col-sm-1, .col-sm-10, .col-sm-11, .col-sm-12, .col-sm-2, .col-sm-3, .col-sm-4, .col-sm-5, .col-sm-6, .col-sm-7, .col-sm-8, .col-sm-9, .col-xs-1, .col-xs-10, .col-xs-11, .col-xs-12, .col-xs-2, .col-xs-3, .col-xs-4, .col-xs-5, .col-xs-6, .col-xs-7, .col-xs-8, .col-xs-9 {
		padding: 0px 7px;
	}
}

.page-action-btn-container a.btn-primary {
	min-width: 70px;
	margin-left: 0.5rem;
}

.checkbox-inline-block {
	display: inline-block;
}

.sidenav input[type="checkbox"] {
	display: none;
}

	.sidenav input[type="checkbox"] + .end-node {
		padding-left: 33px;
	}

	.sidenav input[type="checkbox"] + .label-text:before {
		content: "\f096";
		color: var(--bs-primary);
		font-family: "FontAwesome";
		/* speak: none; */
		font-style: normal;
		font-weight: normal;
		font-variant: normal;
		text-transform: none;
		line-height: 0.7;
		-webkit-font-smoothing: antialiased;
		width: 1em;
		display: inline-block;
		margin-right: 5px;
		font-size: 20px;
		vertical-align: middle;
	}

	.sidenav input[type="checkbox"] + .unchecked:before {
		content: "\f096";
	}

	.sidenav input[type="checkbox"] + .checked:before {
		content: "\f14a";
		animation: tick 150ms ease-in;
		font-size: 20px;
	}

	.sidenav input[type="checkbox"]:disabled + .label-text {
		color: #aaa;
	}

		.sidenav input[type="checkbox"]:disabled + .label-text:before {
			content: "\f0c8";
			color: #ccc;
		}

.module {
	width: 100%;
	/*margin: 0 0 1em 0;*/
	overflow: hidden;
}

	.module p {
		margin: 0;
	}

.line-clamp {
	display: -webkit-box;
	-webkit-line-clamp: 1;
	-webkit-box-orient: vertical;
}

.overflow {
	/*--max-lines: 3;*/
	position: relative;
	max-height: 18px;
	overflow: hidden;
	/*padding-right: 1rem;*/ /* space for ellipsis */
}

	.overflow:before {
		position: absolute;
		/*content: "...";*/
		/*   inset-block-end: 0;
  inset-inline-end: 0; */
		bottom: 0;
		right: 0;
	}

	.overflow::after {
		content: "";
		position: absolute;
		/*   inset-inline-end: 0; */
		right: 0;
		width: 1rem;
		height: 1rem;
		background: white;
	}


.fade1 {
	position: relative;
	height: 3.6em; /* exactly three lines */
}

	.fade1:after {
		content: "";
		text-align: right;
		position: absolute;
		bottom: 0;
		right: 0;
		width: 70%;
		height: 1.2em;
		background: linear-gradient(to right, rgba(255, 255, 255, 0), rgba(255, 255, 255, 1) 50%);
	}

input[type="search"]::-webkit-search-cancel-button {
	-webkit-appearance: searchfield-cancel-button;
	/* Remove default */
	/*-webkit-appearance: none;*/
	/* Now your own custom styles */
	/*height: 10px;
    width: 10px;
    background: red;*/
	/* Will place small red box on the right of input (positioning carries over) */
}

body > my-app > div > lms-skills-base > div > lms-skill-profile > div > div > div > div > div > div > lms-skill-matrix > div > div.panel-body.overflow-a > table > tbody >
tr.skills-expanded-row > td > div > div > div.col-sm-11 > lms-cert-status-card > div > div > lms-primary-rule-status > div > lms-generic-rule-status >
div.panel.panel-default.rule-panel > div.panel-body > div > div > div > div > div.panel-body > div > lms-completion-rule-status > div >
lms-course-list-item > div > div > div > course-detail > div.course-detail-container > div > div.sections:nth-child(2) > action-icon {
	display: none;
}



.flyout.animated.left.open {
	z-index: 1029;
}

.backdrop.open {
	z-index: 1029;
}

.list-inline > li.list-item-navbar {
	padding: 12px 7px 0px 7px;
}

ul.list-inline.navbar-nav {
	margin: auto;
	width: -webkit-fill-available;
}

.navbar-header ul.list-inline {
	/*position: absolute;
    top: 13px;
    right: 64px;*/
}

.profile-picture {
	/*position: absolute;
    top: 5px;
    right: 5px;*/
}

	.profile-picture img {
		padding: 1px 1px;
		width: 30px;
		height: 30px;
		border: 1px solid lightgray;
		border-radius: 50%;
	}

/*.navbar-collapse.collapse.in .hidden {
    display: block;
}*/
/*@media (min-width: 812px) {
    .navbar-collapse.collapse {
         display: block!important;
        height: auto !important;
        padding-bottom: 0;
        overflow: visible !important;
    }
}

@media (min-width: 812px) {
    .navbar-collapse {
        width: auto;
        border-top: 0;
        -webkit-box-shadow: none;
        box-shadow: none;
    }
}*/
a[id$="btnGotoAttachments"].prettyButtons {
	padding: 8px;
}

.tab-attachments-badge {
	position: relative;
	bottom: 1px;
	left: 4px;
	font-size: inherit;
}

.cursor-default {
	cursor: default;
}

@media print {
	/* Hide body scroll bars in print mode */
	body {
		overflow: hidden !important;
	}

	.body-main {
		margin-top: 0;
	}

	nav.navbar.navbar-bg {
		display: none;
	}

	.print-team-skills header, .print-manage-people .page-action-btn-container, .print-manage-people .my-people, .print-manage-people .nav-pills, .print-team-skills-matrix .btn, .btn {
		display: none !important;
	}

	.skills-achieved-color, .skills-achieved-color:before {
		color: #00954D !important;
	}

	.skills-goal-color, .skills-goal-color:before {
		color: #ED8B00 !important;
	}

	#skills-print-header:before {
		display: block;
		content: "My Team Skills Report";
		margin-bottom: 10px;
		font-size: x-large;
		padding: 3px;
	}

	.print-team-skills-matrix .progress-bar-success {
		background-color: #5cb85c !important;
	}

	.progress-bar-success {
		background-color: #5cb85c !important;
	}

	.print-team-skills-matrix .progress-bar-yellow {
		background-color: #FFFF00 !important;
	}

	.progress-bar-yellow {
		background-color: #FFFF00 !important;
	}

	.print-team-skills-matrix .progress-bar-danger {
		background-color: #d9534f !important;
	}

	.progress-bar-danger {
		background-color: #d9534f !important;
	}

	.panel-primary > .report-header {
		background-color: #EEEEEE !important;
		border: 1px solid #DDDDDD;
	}

	/* below are styles to fix Bootstrap 3 Chrome print issues */
	.print-team-skills-matrix .col-sm-1, .print-team-skills-matrix .col-sm-2, .print-team-skills-matrix .col-sm-3, .print-team-skills-matrix .col-sm-4, .print-team-skills-matrix .col-sm-5, .print-team-skills-matrix .col-sm-6, .print-team-skills-matrix .col-sm-7, .print-team-skills-matrix .col-sm-8, .print-team-skills-matrix .col-sm-9, .print-team-skills-matrix .col-sm-10, .print-team-skills-matrix .col-sm-11, .print-team-skills-matrix .col-sm-12 {
		float: left;
	}

	.print-team-skills-matrix .col-sm-12 {
		width: 100%;
	}

	.print-team-skills-matrix .col-sm-11 {
		width: 91.66666667%;
	}

	.print-team-skills-matrix .col-sm-10 {
		width: 83.33333333%;
	}

	.print-team-skills-matrix .col-sm-9 {
		width: 75%;
	}

	.print-team-skills-matrix .col-sm-8 {
		width: 66.66666667%;
	}

	.print-team-skills-matrix .col-sm-7 {
		width: 58.33333333%;
	}

	.print-team-skills-matrix .col-sm-6 {
		width: 50%;
	}

	.print-team-skills-matrix .col-sm-5 {
		width: 41.66666667%;
	}

	.print-team-skills-matrix .col-sm-4 {
		width: 33.33333333%;
	}

	.print-team-skills-matrix .col-sm-3 {
		width: 25%;
	}

	.print-team-skills-matrix .col-sm-2 {
		width: 16.66666667%;
	}

	.print-team-skills-matrix .col-sm-1 {
		width: 8.33333333%;
	}

	.print-team-skills-matrix .col-sm-pull-12 {
		right: 100%;
	}

	.print-team-skills-matrix .col-sm-pull-11 {
		right: 91.66666667%;
	}

	.print-team-skills-matrix .col-sm-pull-10 {
		right: 83.33333333%;
	}

	.print-team-skills-matrix .col-sm-pull-9 {
		right: 75%;
	}

	.print-team-skills-matrix .col-sm-pull-8 {
		right: 66.66666667%;
	}

	.print-team-skills-matrix .col-sm-pull-7 {
		right: 58.33333333%;
	}

	.print-team-skills-matrix .col-sm-pull-6 {
		right: 50%;
	}

	.print-team-skills-matrix .col-sm-pull-5 {
		right: 41.66666667%;
	}

	.print-team-skills-matrix .col-sm-pull-4 {
		right: 33.33333333%;
	}

	.print-team-skills-matrix .col-sm-pull-3 {
		right: 25%;
	}

	.print-team-skills-matrix .col-sm-pull-2 {
		right: 16.66666667%;
	}

	.print-team-skills-matrix .col-sm-pull-1 {
		right: 8.33333333%;
	}

	.print-team-skills-matrix .col-sm-pull-0 {
		right: auto;
	}

	.print-team-skills-matrix .col-sm-push-12 {
		left: 100%;
	}

	.print-team-skills-matrix .col-sm-push-11 {
		left: 91.66666667%;
	}

	.print-team-skills-matrix .col-sm-push-10 {
		left: 83.33333333%;
	}

	.print-team-skills-matrix .col-sm-push-9 {
		left: 75%;
	}

	.print-team-skills-matrix .col-sm-push-8 {
		left: 66.66666667%;
	}

	.print-team-skills-matrix .col-sm-push-7 {
		left: 58.33333333%;
	}

	.print-team-skills-matrix .col-sm-push-6 {
		left: 50%;
	}

	.print-team-skills-matrix .col-sm-push-5 {
		left: 41.66666667%;
	}

	.print-team-skills-matrix .col-sm-push-4 {
		left: 33.33333333%;
	}

	.print-team-skills-matrix .col-sm-push-3 {
		left: 25%;
	}

	.print-team-skills-matrix .col-sm-push-2 {
		left: 16.66666667%;
	}

	.print-team-skills-matrix .col-sm-push-1 {
		left: 8.33333333%;
	}

	.print-team-skills-matrix .col-sm-push-0 {
		left: auto;
	}

	.print-team-skills-matrix .col-sm-offset-12 {
		margin-left: 100%;
	}

	.print-team-skills-matrix .col-sm-offset-11 {
		margin-left: 91.66666667%;
	}

	.print-team-skills-matrix .col-sm-offset-10 {
		margin-left: 83.33333333%;
	}

	.print-team-skills-matrix .col-sm-offset-9 {
		margin-left: 75%;
	}

	.print-team-skills-matrix .col-sm-offset-8 {
		margin-left: 66.66666667%;
	}

	.print-team-skills-matrix .col-sm-offset-7 {
		margin-left: 58.33333333%;
	}

	.print-team-skills-matrix .col-sm-offset-6 {
		margin-left: 50%;
	}

	.print-team-skills-matrix .col-sm-offset-5 {
		margin-left: 41.66666667%;
	}

	.print-team-skills-matrix .col-sm-offset-4 {
		margin-left: 33.33333333%;
	}

	.print-team-skills-matrix .col-sm-offset-3 {
		margin-left: 25%;
	}

	.print-team-skills-matrix .col-sm-offset-2 {
		margin-left: 16.66666667%;
	}

	.print-team-skills-matrix .col-sm-offset-1 {
		margin-left: 8.33333333%;
	}

	.print-team-skills-matrix .col-sm-offset-0 {
		margin-left: 0%;
	}

	.print-team-skills-matrix .visible-xs {
		display: none !important;
	}

	.print-team-skills-matrix .hidden-xs {
		display: block !important;
	}

	.print-team-skills-matrix table.hidden-xs {
		display: table;
	}

	.print-team-skills-matrix tr.hidden-xs {
		display: table-row !important;
	}

	.print-team-skills-matrix th.hidden-xs,
	.print-team-skills-matrix td.hidden-xs {
		display: table-cell !important;
	}

	.print-team-skills-matrix .hidden-xs.hidden-print {
		display: none !important;
	}

	.print-team-skills-matrix .hidden-sm {
		display: none !important;
	}

	.print-team-skills-matrix .visible-sm {
		display: block !important;
	}

	.print-team-skills-matrix table.visible-sm {
		display: table;
	}

	.print-team-skills-matrix tr.visible-sm {
		display: table-row !important;
	}

	.print-team-skills-matrix th.visible-sm,
	.print-team-skills-matrix td.visible-sm {
		display: table-cell !important;
	}
}

.course-cover {
	max-width: 100%;
	max-height: 100%;
	display: block;
	margin: auto;
	object-fit: contain !important;
}

.br-radius {
	border-radius: 4px;
}
/*.slide-panel__content > .list-item-container > .list-item {
    border: 1px solid #b3b3ff;
    border-radius: 4px;
    padding: 8px 8px;
    margin: 8px 0px;
    background: aliceblue;
}*/

/*.fa-clipboard-list {
	background-image: url(svg/clipboard-list.svg)
}*/
.fa-clipboard-list1 {
	height: 25px;
	background-color: white;
	-webkit-mask-image: url(svg/checklist-on-clipboard-svgrepo-com.svg);
	mask-image: url(svg/checklist-on-clipboard-svgrepo-com.svg);
}

button.btn-primary.indicator {
	position: relative;
}

	button.btn-primary.indicator > span {
		width: 10px;
		height: 10px;
		background: red;
		border-radius: 100%;
		position: absolute;
		top: 5px;
		right: 5px;
	}

.audit-info {
	padding-right: 15px;
	padding-left: 0;
	text-align: right;
	color: #777;
}

/* help desk */

.helpdesk-skills-profile-info-container {
	display: flex;
	flex-direction: row;
	align-content: stretch;
}

.helpdesk-skills-profile-info-colmun {
	display: flex;
	flex-direction: column;
	align-content: stretch;
}

	.helpdesk-skills-profile-info-colmun strong {
		font-weight: 700;
	}

/* end help desk */
.flex {
	display: flex;
}

.tt {
	font-size: 16px;
	font-weight: normal;
	position: relative;
	bottom: 5px;
}

.bubble {
	position: relative;
	left: 110%;
	bottom: 100%;
	opacity: 0;
	margin-bottom: 1em;
	padding: 1em;
	background-color: #000;
	font-size: .75em;
	line-height: 1.6;
	text-align: left;
	white-space: nowrap;
	transform: translate(-50%, 1em);
	transition: all .15s ease-in-out;
	color: white;
	z-index: 100;
}

	.bubble:before {
		content: '';
		position: absolute;
		top: 100%;
		left: 50%;
		width: 0;
		height: 0;
		border: .5em solid transparent;
		border-top-color: #000;
		transform: translate(-50%, 0);
	}

.tt:hover {
	cursor: help;
}

	.tt:hover > .tooltip-spacing > .bubble {
		opacity: 1;
		transform: translate(-50%, 0);
	}

.tooltip-spacing {
	height: 20px;
	margin: 8px;
	position: relative;
	width: 20px;
}

.tooltip-bg1 {
	background-color: #000;
	border-radius: 10px;
	content: " ";
	display: flex;
	height: 20px;
	position: absolute;
	top: 0;
	width: 20px;
}

.tooltip-bg2 {
	background-color: #fff;
	border-radius: 8px;
	content: " ";
	display: flex;
	height: 16px;
	left: 2px;
	position: absolute;
	top: 2px;
	width: 16px;
}

.tooltip-text {
	font-size: 14px;
	font-weight: bold;
	line-height: 20px;
	position: relative;
	text-align: center;
	width: 20px;
}

.esdSpacing {
	padding-top: 5px;
}

.fl-l {
	float: left;
	clear: left;
}

.error-msg {
	background-color: rgb(255, 247, 247);
	border: 1px solid rgb(210, 0, 0);
	border-radius: 4px;
	display: flex;
	margin-bottom: 15px;
	padding: 10px;
}

.error-msg-icon {
	flex: 0 0 18px;
	height: 18px;
}

.error-msg-text {
	color: rgb(44, 46, 47);
	font-size: 15px;
	line-height: 1.35;
	margin: 0px 0px 0px 9px;
	width: calc(100% - 27px);
	word-break: break-word;
	overflow-wrap: break-word;
}

.striped:nth-of-type(odd) {
	background-color: var(--lat-striped-row-bg);
}

.striped:nth-of-type(even) {
	background-color: inherit;
}

div.header-bg {
	background-color: var(--bs-primary) !important;
}

.header-bg > .panel-title > a, .header-bg > .panel-title > span {
	color: white;
}

.badge-due-date {
	background-color: var(--bs-danger);
	color: var(--bs-danger-contrast, #fff);
}

.badge-next-meeting {
	background-color: var(--bs-primary);
	color: var(--bs-primary-contrast, #fff);
}


.badge-course-type {
	display: flex;
	align-items: center;
	gap: 4px;
	font-size: 12px;
	line-height: 16px;
	font-weight: 600;
	color: rgba(12, 17, 29, .5);
	white-space: nowrap;
	flex-shrink: 0;
}

	.badge-course-type i {
		font-size: 16px;
		height: 16px;
	}


/* some classes for the updated mootools calendar control trying to use bootstrap input-group classes */

/*
    mootools renders an input with an empty class attribute.
    input[class=""] appears to win, but for safety I am
    also maintaining input:not([class])
    because mootols adds a dynamic hidden div, basically breaking
    the input group, we need to replicate some of the input group stuff here.
*/
div.input-group.input-group-sm.mb-1 > input[type="text"][class=""] {
	/* while the !important stuff sucks, to basicaly make it more selective that the bootstrap input-group with 6 nots, I'd have to add a bunch of other useless psuedo classes*/
	margin-bottom: 4px;
	margin-left: 0px !important; /* have to override this somehow as well since it really IS the first child.*/
	border-width: var(--bs-border-width);
	border-top-left-radius: var(--bs-border-radius) !important;
	border-bottom-left-radius: var(--bs-border-radius) !important;
	padding-left: 0.75rem; /* this matches date pickers in angular */
}

div.input-group.input-group-sm.mb-1 input[type="text"]:not([class]) {
	margin-bottom: 4px;
	margin-left: 0px !important; /* have to override this somehow as well since it really IS the first child.*/
	border-width: var(--bs-border-width);
	border-top-left-radius: var(--bs-border-radius) !important;
	border-bottom-left-radius: var(--bs-border-radius) !important;
	padding-left: 0.75rem; /* this matches date pickers in angular */
}

div.input-group.input-group.mb-1 .btn {
	margin-bottom: 3px;
}

div.input-group.input-group-sm.mb-1 .btn {
	margin-bottom: 4px; /* match above margin so they line up */
}

button.calButton.btn {
	/*font-size: 1em;*/
	background-color: var(--bs-tertiary-bg);
	color: var(--bs-primary);
}

	button.calButton.btn:hover {
		background-color: var(--bs-primary);
		color: var(--bs-primary-contrast, white);
	}

.small-audit {
	font-size: 0.75rem;
	color: var(--bs-secondary);
}

.passwordEye {
	float: right;
	position: relative;
	top: -2.5rem;
	margin-right: 1rem;
	cursor:pointer;
	color: darkslategray;
}

.shareButton {
	border: none;
	background: none;
	margin-right: 10px;
	width: 4rem;
}

.textDiv {
	display: inline-block;
	border: 1px solid #CCC;
	border-radius: 4px;
	height: 6rem;
	width: 80%;
	padding: 5px;
	overflow-y: auto;
	background-color: #EEE;
}

.copyShare {
	float: right;
}

.linkLabel {
	display: block;
	margin-top: 20px;
	margin-bottom: 5px;
	margin-left: 5px;
}

.badgeThumbNail {
	width: 50px;
	cursor: pointer;
}

.badgeImageContainer {
	margin: auto;
	padding: 20px;
}

.badgeImage {
	max-width: 400px;
	width: 100%;
}

.smallIconButton {
	text-decoration: none;
}

.action-bar {
	margin-top: 1em;
	font-size: var(--bs-btn-font-size);
}

#pageContent .action-bar {
	margin-top: -1.5em;
}

.schedule-glance-table {
	width: 100%;
}
.goOffering {
	width: 8em !important;
}
#wrapper .subText {
	margin-bottom: 1.5em;
	/*border-bottom: 1px solid var(--bs-dark-border-subtle);*/
	display: block;
	color: var(--bs-dark-border-subtle);
}
.scorm-manifest-panel {
	position: relative;
	height: 5em;
}
.csoListDiv {
	clear: both;
}