body {
	overflow-y: scroll;
}

:root {
	/** Redefine some variable that affects `info` buttons and other such things. **/
	--bs-info-rgb:13,174,182;
}

img { max-width: none; }

/** Bootstrap v5 underlines links by default. We don't want that **/
a { text-decoration: none; }
a:hover { text-decoration: underline; }
a.btn, a.nav-link, a.badge { text-decoration: none; }

/* Override Bootstrap default hover color */
.dropdown-menu>li>a:hover {
	background-color: #C9C7C7;
}

.dropdown-menu {
	z-index: 10000;
}

.ui-datepicker {
	z-index: 10000 !important;
}

/* Twitter Bootstrap uses a not-allowed cursor, which is wrong. Override it. */
input[readonly], select[readonly], textarea[readonly] { cursor: default; }

.form-control[disabled], .form-control[readonly], fieldset[disabled] .form-control { background-color: #f7f7f7; }

/* Decrease default Bootstrap form-group (row) spacing - 15px is too much. */
.form-group {
	margin-bottom: 10px;
}

blockquote {
	border-left: 4px solid #d4cfcf;
	padding-left: 0.5rem;
	background-color: white;
}

/* Make the suggestor.js suggestions container appear above the custom Select2 select widgets */
.suggestor-container { z-index: 2; }

/* Make `<code>..</code>` colorful in suggestions (wrapped in `a` tags) */
.suggestor-suggestion a>code { color: #d63384; }

.arg-navbar { overflow: visible; color: #777; }
.arg-navbar-inner {
	padding: 0;
	background-color: #FAFAFA;
	background-image: -moz-linear-gradient(top, white, #F2F2F2);
	background-image: -webkit-gradient(linear, 0 0, 0 100%, from(white), to(#F2F2F2));
	background-image: -webkit-linear-gradient(top, white, #F2F2F2);
	background-image: -o-linear-gradient(top, white, #F2F2F2);
	background-image: linear-gradient(to bottom, white, #F2F2F2);
	background-repeat: repeat-x;
	filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffffffff', endColorstr='#fff2f2f2', GradientType=0);
	border-bottom: 1px solid #D4D4D4;
	margin-top: -1px;
	-webkit-box-shadow: 0 1px 4px rgba(0, 0, 0, 0.065);
	-moz-box-shadow: 0 1px 4px rgba(0, 0, 0, 0.065);
	box-shadow: 0 1px 4px rgba(0, 0, 0, 0.065);
}

.arg-navbar .navbar-nav > li > a.nav-link {
	padding: 5px 8px;
	color: #555;
	text-decoration: none;
	text-shadow: 0 1px 0 white;
	line-height: 20px;
	font-weight: bold;
	border-radius: 5px;
}

.arg-navbar .navbar-nav > .active > a,
.arg-navbar .navbar-nav > .active > a:hover,
.arg-navbar .navbar-nav > .nav-item > a:hover,
.arg-navbar .navbar-nav > .active > a:focus {
	color: #444;
	text-decoration: none;
	background-color: #E5E5E5;
	-webkit-box-shadow: inset 0 3px 8px rgba(0, 0, 0, 0.125);
	-moz-box-shadow: inset 0 3px 8px rgba(0, 0, 0, 0.125);
	box-shadow: inset 0 3px 8px rgba(0, 0, 0, 0.125);
}
.arg-navbar .navbar-nav a.attention { color: #DD4B39 !important; }
.arg-navbar .navbar-nav a.relocated { color: #5068c0 !important; }

.arg-navbar-dev { background-color: #373737; }
.arg-navbar-dev .navbar-nav > li > a.nav-link {
	color: #e1dbdb;
	text-shadow: none;
}
.arg-navbar-dev .navbar-nav .nav-link:focus, .arg-navbar-dev .navbar-nav .nav-link:hover {
    color: white;
}
.arg-navbar-dev .navbar-nav > .active > a, .arg-navbar-dev .navbar-nav > .active > a:hover, .arg-navbar-dev .navbar-nav > .nav-item > a:hover, .arg-navbar-dev .navbar-nav > .active > a:focus {
	background-color: #686868;
	color: white !important;
}

/* Restore the original Twitter Bootstrap textarea color, which the jQuery UI-Bootstrap theme incorrectly changed. */
textarea { color: #555; }

/** Make jQuery UI button's active state different than its normal one (needed because of jquery-ui-month-picker) **/
.ui-state-active, .ui-widget-content .ui-state-active, .ui-widget-header .ui-state-active {
	background-color: #337ab7 !important;
	background-image: none !important;
	color: white !important;
}

.arg-backcolor-good { background-color: #e1ffb5 !important; }
.arg-backcolor-bad { background-color: #ffe1cb !important; }

tr.arg-backcolor-good td { background-color: #e1ffb5 !important; }
tr.arg-backcolor-good:hover td { background-color: #dcfbb0 !important; }

.arg-backcolor-bad { background-color: #ffe1cb !important; }
tr.arg-backcolor-bad td { background-color: #ffe1cb !important; }
tr.arg-backcolor-bad:hover td { background-color: #f9d9c2 !important; }

/** Override to make it darker. The default is too non-contrasting on white **/
.text-warning, .btn-outline-warning { color: #c89703 !important; }

/** text-info doesn't need to be redefined, as it's defined in terms of our custom `--bs-info-rgb` variable **/
.btn-outline-info {
	color: #0daeb6;
	border-color: #0daeb6;
}
.btn-check:active + .btn-outline-info, .btn-check:checked + .btn-outline-info, .btn-outline-info.active, .btn-outline-info.dropdown-toggle.show, .btn-outline-info:active, .btn-outline-info:hover {
	background-color: #0daeb6;
	color: white;
}

/** We don't like that btn-info defaults to black text in Bootstrap v5. White yields a better contrast **/
.btn-info, .btn-info:hover, .btn-check:active + .btn-info, .btn-check:checked + .btn-info, .btn-info.active, .btn-info:active, .show > .btn-info.dropdown-toggle {
	color: white;
}

.middle-aligned { vertical-align: middle; }

.arg-site-content-wrapper { width: 1200px; }
@media (max-width: 1180px) {
	.arg-site-content-wrapper { width: 990px !important; }
}

.arg-site-content-spaced-by-1-menus { padding-top: 45px; }
.arg-site-content-spaced-by-1-menus .page-anchor { position: relative; top: -45px; }

.arg-site-content-spaced-by-2-menus { padding-top: 75px; }
.arg-site-content-spaced-by-2-menus .page-anchor { position: relative; top: -75px; }

@media (max-width: 1180px) {
	.arg-site-content-spaced-by-1-menus,
	.arg-site-content-spaced-by-2-menus {
		padding-top: 75px;
	}
}

.fbold { font-weight: bold; }
.fitalic { font-style: italic; }
.centered { margin: 0 auto; }
.clearboth { clear: both; }
.cursor-pointer { cursor: pointer; }

.icon128 { width: 128px; height: 128px; display: inline-block; background-repeat: no-repeat; background-size: cover; background-position: center; }

/**
 * It's important that icon128-unkown is defined before the other icons,
 * so we can do supply multiple icon classes on an element and have the others win,
 * while being able to fall back to unkown if the other classes do not define an icon.
 **/
.icon128-help, .icon128-unknown { background-image: url('/images/icons/svg/help-svgrepo-com.svg'); }

.icon128-network { background-image: url('/images/icons/svg/network-group-svgrepo-com.svg'); }
.icon128-calendar { background-image: url('/images/icons/svg/calendar-svgrepo-com-generic.svg'); }
.icon128-hardware-replacement { background-image: url('/images/icons/svg/computer-tv-svgrepo-com-replacement.svg'); }
.icon128-checklist { background-image: url('/images/icons/svg/checklist-svgrepo-com.svg'); }
.icon128-form-timeclockAdjustment { background-image: url('/images/icons/svg/clock-watch-svgrepo-com.svg'); }
.icon128-form-timeOff { background-image: url('/images/icons/svg/calendar-svgrepo-com.svg'); }
.icon128-form-travel { background-image: url('/images/icons/svg/airplane-svgrepo-com.svg'); }
.icon128-form-deskFile { background-image: url('/images/icons/svg/curriculum-vitae-portfolio-svgrepo-com.svg'); }
.icon128-form-writtenWarning { background-image: url('/images/icons/svg/curriculum-vitae-portfolio-svgrepo-com-warning.svg'); }
.icon128-form-verbalWarning { background-image: url('/images/icons/svg/chat-talk-svgrepo-com.svg'); }
.icon128-objects { background-image: url('/images/icons/svg/boxes-box-svgrepo-com.svg'); }
.icon128-contact { background-image: url('/images/icons/svg/curriculum-information-svgrepo-com.svg'); }
.icon128-computer { background-image: url('/images/icons/svg/computer-tv-svgrepo-com.svg'); }
.icon128-search { background-image: url('/images/icons/svg/search-svgrepo-com.svg'); }
.icon128-software { background-image: url('/images/icons/svg/software-svgrepo-com.svg'); }
.icon128-printer { background-image: url('/images/icons/svg/printer-print-svgrepo-com.svg'); }
.icon128-router { background-image: url('/images/icons/svg/router-svgrepo-com.svg'); }
.icon128-ups { background-image: url('/images/icons/svg/battery-svgrepo-com.svg'); }
.icon128-network-device { background-image: url('/images/icons/svg/networking-monitor-svgrepo-com.svg'); }
.icon128-inbox { background-image: url('/images/icons/svg/inbox-svgrepo-com.svg'); }
.icon128-outbox { background-image: url('/images/icons/svg/outbox-svgrepo-com.svg'); }
.icon128-user { background-image: url('/images/icons/svg/user-profile-svgrepo-com.svg'); }
.icon128-log { background-image: url('/images/icons/svg/programming-monitor-svgrepo-com.svg'); }
.icon128-download { background-image: url('/images/icons/svg/download-svgrepo-com.svg'); }
.icon128-documents { background-image: url('/images/icons/svg/documents-files-and-folders-svgrepo-com.svg'); }
.icon128-rush-request { background-image: url('/images/icons/svg/hurry-worker-svgrepo-com.svg'); }
.icon128-chemical-inventory { background-image: url('/images/icons/svg/flask-chemistry-svgrepo-com.svg'); }
.icon128-exchange { background-image: url('/images/icons/svg/exchange-change-svgrepo-com.svg'); }
.icon128-video { background-image: url('/images/icons/svg/video-travel-image-svgrepo-com.svg'); }
.icon128-engineer { background-image: url('/images/icons/svg/engineer-worker-svgrepo-com.svg'); }
.icon128-ticket { background-image: url('/images/icons/svg/ticket-svgrepo-com.svg'); }
.icon128-to-do { background-image: url('/images/icons/svg/check-lists-svgrepo-com.svg'); }
.icon128-safe-place { background-image: url('/images/icons/svg/document-svgrepo-com.svg'); }
.icon128-temperature-tracking { background-image: url('/images/icons/svg/thermometer-temperature-svgrepo-com.svg'); }
.icon128-time-tracking { background-image: url('/images/icons/svg/time-clock-svgrepo-com.svg'); }
.icon128-power-monitor { background-image: url('/images/icons/svg/gas-station-electricity-svgrepo-com.svg'); }
.icon128-car { background-image: url('/images/icons/svg/car-svgrepo-com.svg'); }
.icon128-conference-room { background-image: url('/images/icons/svg/meeting-interview-svgrepo-com.svg'); }
.icon128-supervisor-protocols { background-image: url('/images/icons/svg/note-notepad-svgrepo-com.svg'); }
.icon128-sales { background-image: url('/images/icons/svg/promotion-stairs-svgrepo-com.svg'); }
.icon128-air-quality-tracking { background-image: url('/images/icons/svg/factory-pollution-svgrepo-com.svg'); }
.icon128-calendar-checkboxes { background-image: url('/images/icons/svg/calendar-green-red-svgrepo-com.svg'); }
.icon128-pay-stubs { background-image: url('/images/icons/svg/check-payment-method-svgrepo-com.svg'); }

.arg-block-section-title {
	display: block;
	background-color: #f5f5f5;
	border: 1px solid #dedede;
	border-radius: 5px;
	padding: 2px 5px 3px 5px;
	font-size: 116%;
	font-weight: bold;
	border-top-left-radius: 3px;
	border-top-right-radius: 3px;
}
.arg-block-section-title.borderless { border: 0; }
.arg-block-section-title.dark { background-color: #838383; color: white; }
.arg-block-section-title.highlighted { background-color: #f7f0c3; }

.separator-subtle { border: 0; border-top: 1px solid #DEDEDE; }
hr.separator-subtle { margin: 5px 0; }

.box-bordered { border: 1px solid #e5e5e5; }

.box-rounded-corners-5 {
	-webkit-border-radius: 5px;
	-moz-border-radius: 5px;
	border-radius: 5px;
}
.box-shadowed { box-shadow: 0 0 4px #dbdbdb; }

.user-photo-shadow-danger { box-shadow: 0 0 4px #EC5A5A; }

.avatar-bubble {
	padding-left: 55px;
	margin-bottom: 7px;
}

.avatar-bubble.compact {
	margin-bottom: 4px;
}

.avatar-bubble .avatar {
	float: left;
	position: relative;
	margin-left: -55px;
}

.avatar-bubble .avatar img {
	width: 50px;
	border: 1px solid #e5e5e5;
}

.avatar-bubble.size-32 {
	padding-left: 40px;
}
.avatar-bubble.size-32 .avatar {
	margin-left: -40px;
}
.avatar-bubble.size-32 .avatar img {
	width: 32px;
}

.bubble .comment {
	border-radius: 3px;
	border: 1px solid #e6e4e4;
}
.comment .cmeta {
	height: 23px;
	padding: 0 5px;
	background-color: #f5f5f5;
	vertical-align: middle;
	line-height: 23px;
}
.comment .cmeta.executive-comment {
	background-color: #fff7a3;
}
.comment .cmeta.progress-update {
	background-color: #b6ffa3;
}
.comment .body {
	border-top: 1px solid #dedede;
	background-color: #fbfbfb;
	padding: 7px 5px;
	word-break: break-word;
}

.comment-delete-button {
	font-size: 10px;
}

::-webkit-scrollbar { width: 12px; height: 12px; background-color: #fefefe; border-left: 1px solid #cdcdcd; }
::-webkit-scrollbar-thumb {
	background-color: #919191;
}
::-webkit-scrollbar-thumb:hover {
	background-color: #5f5f5f;
}

.arg-scrollable-box {
	overflow-y: auto;
	padding-right: 3px;
}
.arg-scrollable-box::-webkit-scrollbar { width: 9px; height: 9px; background-color: #dbdbdb; border: 0; }
.arg-scrollable-box::-webkit-scrollbar-thumb {
	-webkit-border-radius: 4px;
	-moz-border-radius: 4px;
	border-radius: 4px;
}

ul.validation-errors {
    color: #e33904;
    font-weight: bold;
    margin: 5px 0 0 0;
    padding: 0;
    list-style: none;
}

.box-sizing-border-box {
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
}

.arg-nav-chemical-inventory-nav-horizontal-compact a {
	font-size: 14px;
	padding: 0.5rem 9px !important;
}

.arg-chemical-inventory-nav-transfer-filters a {
	padding: 0.5rem !important;
	font-size: 14px;
}

.arg-nav-tabs-compact li a { padding: 5px; }
.arg-nav-tabs-compact li { margin-bottom: 5px; }

.sidebar-flattened li { float: left; }
.sidebar-flattened .arg-sidebar-separator { display: none; }
.sidebar-flattened ul { margin-bottom: 0; }
.sidebar-flattened ul > li > a { padding: 5px 10px; }

.arg-well-light { background-color: #fefefe; }

.engineering-request-section-main {
	float: left;
	width: 64%;
}
.engineering-request-section-activity {
	float: right;
	width: 35%;
}

.print-only-block, .print-only-inline, .print-only-inline-block { display: none; }

.container-login {
	width: 410px;
	margin: 0 auto;
	text-align: center;
}
@media (max-width: 567px) {
	.container-login {
		width: auto !important;
	}
}

.card .control-label { color: #013663; }

/**
 * The 1st line deals with our old way of styling "required", when we had our own form_div_layout.html.twig implementation.
 * The 2nd line deals with the new way of styling "required", when're using the Symfony default bootstrap_5_horizontal_layout.html.twig implementation.
 * The former may still be in use in some manually-created forms, so we keep it around.
 **/
.control-label.required:after, .control-label>label.required:after,
.col-form-label.required:after, .col-form-label>label.required:after {
	content: "*";
	color: #BC2D2D;
	padding-left: 5px;
}

/**
 * We used to use `form-group row` for rows, which adds 10px of bottom margin to the row.
 * Now that we're using the Symfony default bootstrap_5_horizontal_layout.html.twig implementation,
 * rows use a `row mb-3` class, which adds a larger margin (1rem).
 * This is stretching pages too much, so we reduce it to the same margin we had before.
 **/
.row.mb-3 {
	margin-bottom: 10px !important;
}

/**
 * For some reason, Bootstrap pushes form labels down.
 * This makes forms look odd, so we remove the padding.
 **/
.col-form-label {
	padding-top: 0 !important;
	padding-bottom: 0 !important;
}

.arg-card-compact > .card-header { padding: 5px 10px; }
.arg-card-compact > .card-body { padding: 5px 10px; }
.arg-card-compact > .card-body .form-group { margin-bottom: 3px; }

.card-footer-compact {
	padding: 0px 10px 3px;
}

.arg-link-underlined-dotted { border-bottom: 1px dotted #2A6496; text-decoration: none; }
.arg-link-underlined-dotted:hover { text-decoration: none; }

.spin-animate {
	-webkit-animation-name: spin-animate;
	-webkit-animation-duration: 2500ms;
	-webkit-animation-iteration-count: infinite;
	-webkit-animation-timing-function: linear;
	animation-name: spin-animate;
	animation-duration: 2500ms;
	animation-iteration-count: infinite;
	animation-timing-function: linear;
}

@-moz-keyframes spin-animate {
	from { -moz-transform: rotate(0deg); }
	to { -moz-transform: rotate(360deg); }
}
@-webkit-keyframes spin-animate {
	from { -webkit-transform: rotate(0deg); }
	to { -webkit-transform: rotate(360deg); }
}
@keyframes spin-animate {
	from {transform:rotate(0deg);}
	to {transform:rotate(360deg);}
}

/** Fix a bug that causes input-group textboxes to appear above the jQuery UI datepicker */
.input-group .form-control {
	z-index: 1;
}

@media (min-width: 768px) {
	.text-lg-right {
		text-align: right;
	}
	.text-lg-left {
		text-align: left;
	}
}

.arg-branch-icon-wrap:before { background-color: white; border-radius: 100%; }
.arg-branch-text-wrap { position: relative; text-align: center; }
.arg-branch-color-light-michigan { color: #0a6b9c; }
.arg-branch-color-heavy-michigan { color: #003b1f; }
.arg-branch-color-light-colorado { color: #fcc918; }
.arg-branch-color-heavy-colorado { color: #f86d08; }
.arg-branch-color-light-unknown { color: #b1b1b1; }
.arg-branch-color-heavy-unknown { color: #7a7a7a; }

.border-transparent {
	border-color: transparent !important;
}
/** This will be part of Bootstrap 5.3 and could be removed when we upgrade to it **/
.border-success-subtle { border-color: #a3cfbb !important; }

.grayscale { filter: grayscale(100%); }

.navbar {
	margin-bottom: 0;
	min-height: 0;
	border: none;
}

.navbar-default {
	background-color: inherit;
}

@media (min-width: 768px) {
	.navbar-nav {
		float: none;
	}
}

@media (max-width: 376px) {
	.arg-site-content-spaced-by-2-menus {
	    padding-top: 16px;
	}
}

@media (max-width: 767px) {
	.arg-fixed-top {
		position: relative;
		top: auto;
	}
	.dropdown-item-responsive {
		word-wrap: break-word;
		white-space: normal;
	}
}

@media (min-width: 960px) {
	.pull-left-lg {
		float: left!important;
	}
	.pull-right-lg {
		float: right!important;
	}
}

.submenu > li > a {
	padding-left: 35px !important;
}

.md-editor > textarea {
	font-family: inherit !important;
	background: white !important;
	padding: 0.5rem !important;
}

.md-preview {
	padding: 0.5rem !important;
}

/**
 * Added because of a bug with the combo of elastic textareas and markdown textareas
 */
arclones > .md-editor {
	display: none;
}

@media (min-width: 767px) {
	.dropdown-long-menu {
		margin-left: -306px;
	}
}
@media (min-width: 960px) {
	.dropdown-long-menu {
		margin-left: -236px;
	}
}

.video-container {
	position: relative;
	overflow: hidden;
	width: 100%;
}

.video-container::after {
	display: block;
	content: "";
	padding-top: 56.25%;
}

.video-container iframe {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}

html[data-turbo-preview] {
	opacity: 0.7;
}

.external-link::before {
	content: "\f08e ";
	font: normal normal normal 14px/1 FontAwesome;
	margin-right: 4px;
}

abbr {
	text-decoration: underline dotted;
}