/* Sidebar/Topbar/Footer
-------------------------------------------------- */
html, body {
	height: 100%;
	overflow-y: auto;
}

#all-container {
	position: fixed;
	width: 100%;
	height: 100%;
	top: 0;
}

#main-container {
	overflow-y: scroll;
}

#sidebar {
	position: relative;
	top: 0;
	bottom: 0;
	left: 0;
	z-index: 100;
	padding: 0;
}

.sidebar-sticky {
	position: relative;
	top: 0;
	height: 100%;
	overflow-x: hidden;
	overflow-y: auto;
}

@supports ((position: -webkit-sticky) or (position: sticky)) {
	.sidebar-sticky {
		position: -webkit-sticky;
		position: sticky;
	}
}

.sidebar-logo {
	/*	max-width: 50%;
		max-height: 8vh;
			*/
	width: 8em;
	max-width: 8em;
}

.top-nav {
	/*min-height: 74px;*/ /* I don't know why this is here but it's causing problems with tall custom headers */
}

.img-logged-in-user {
	max-height: 32px;
}

.modal-backdrop {
	/* have to remove the modal backdrop, since fixed sidebar elements break modals */
	display: none;
}

.modal-dialog {
	/* use a box shadow to kinda replace the modal backdrop... */
	box-shadow: 0 2rem 4rem rgba(0, 0, 0, .4) !important;
}

.mw-50em {
	max-width: 50em;
}
/* Hover Color and Active Color
-------------------------------------------------- */
.nav-colors > a:hover {
	opacity: .5;
}
.nav-colors > a.active {
	color: #89CFF0 !important;
}
/* Counteract Bootstrap Quirks and Aggressive Padding
-------------------------------------------------- */
select, input {
	line-height: 1rem;
}

/* these styles were breaking things; just use the -sm classes to make things smaller */
/*select, input, .btn-tts-open {
	height: auto !important;
	padding: .125rem .375rem !important;
	margin: 0 !important;
	position: unset !important;
}*/

/* Header Tweaks */
div.card-header {
	padding: .5rem 1rem;
}

.card-header h1 {
	margin: 0;
}

h5 {
	font-size: 1.125rem;
}

h4 {
	font-size: 1.25rem;
}

h3 {
	font-size: 1.375rem;
	margin: .2rem 0 .3rem 0
}

h2 {
	font-size: 1.5rem;
}

h1 {
	font-size: 1.625rem;
}

/* Placeholder styles
-------------------------------------------------- */

.form-control::-webkit-input-placeholder { /* WebKit, Blink, Edge */
	color: #BBB;
}

:-moz-placeholder.form-control { /* Mozilla Firefox 4 to 18 */
	color: #BBB;
	opacity: 1;
}

.form-control::-moz-placeholder { /* Mozilla Firefox 19+ */
	color: #BBB;
	opacity: 1;
}

:-ms-input-placeholder.form-control { /* Internet Explorer 10-11 */
	color: #BBB;
}

.form-control::-ms-input-placeholder { /* Microsoft Edge */
	color: #BBB;
}

.form-control::placeholder { /* Most modern browsers support this now. */
	color: #BBB;
}

/* Table styles
-------------------------------------------------- */
.compact-row td {
	padding-top: .25rem !important;
	padding-bottom: .25rem !important;
}

.compact-row th {
	padding-top: .5rem !important;
	padding-bottom: .5rem !important;
}

.clickable-row {
	cursor: pointer;
}

.code-blue {
	background-color: #007bff;
	color: #fff;
	font-weight: bold;
}

.code-blue:hover {
	background-color: #0072f0 !important;
}

.code-blue a {
	color: #fff !important;
}

/* put more space between the sort arrows so they don't become one */
table.dataTable.table-sm .sorting::before, table.dataTable.table-sm
.sorting_asc::before, table.dataTable.table-sm .sorting_desc::before {
	right: 1.1em !important;
}

/* change the processing overlay to cover the whole table and be slightly transparent */
div.dataTables_wrapper div.dataTables_processing {
	width: 100% !important;
	height: 100% !important;
	margin: 0 !important;
	left: 0 !important;
	top: 0 !important;
	opacity: 0.9;
}

/* RCare color styles
-------------------------------------------------- */
.bg-rcblue {
	background-color: #0e579f;
}

.bg-rcorange {
	background-color: #f08e2e;
}

.bg-rclightblue {
	background-color: #dbeaf5;
}

.underline-rcorange {
	border-bottom: solid 3px #f08e2e;
}

/* Silly PCC login button
-------------------------------------------------- */
.pcc-login {
	width: 366px;
	height: 75px;
}

/* Specific page styles
-------------------------------------------------- */
.list-photo {
	max-height: 48px;
}

.user-edit-photo {
	max-width: 80%;
}

.account-photo {
	width: 300px;
}

.embed-playlist {
	max-height: 27em;
}

.embed-playlist .list-group {
	overflow-y: auto;
	overflow-x: hidden;
	max-height: 27em;
}

.chosen-container .chosen-results li.group-result {
	cursor: pointer;
}

.chosen-container .chosen-results li.group-result:hover {
	font-weight: bold;
}

@media (max-width:768px) {
	#sidebar {
		top: 0;
		bottom: 0;
		padding: 0;
		margin-left: -200px;
		left: 0;
		width: 200px;
		position: fixed;
		height: 100%;
		overflow-y: auto;
		z-index: 1000;
		transition: all 0.4s ease 0s;
	}

	#sidebar .close {
		position: absolute;
		top: 0;
		right: 0.3em;
	}

	#all-container.show-sidebar #sidebar {
		left: 200px;
	}
}

.scrollableContainer {
	overflow-y: auto;
	height: 300px;
	margin-top: 15px;
}

/* fingerprinting locator assign page styles
-------------------------------------------------- */
.dual-listbox .dual-listbox__search {
	display: none;
}

.dual-listbox  .dual-listbox__container {
	justify-content: center;
}

.dual-listbox .dual-listbox__title {
	background-color: #f08e2e;
	border: 1px solid #f08e2e;
	color: #ffffff;
}

.dual-listbox .dual-listbox__available,
.dual-listbox .dual-listbox__selected {
	border: 1px solid #b7b7b7;
	height: 400px;
}

.dual-listbox .dual-listbox__button {
	border-radius: 4px;
	margin-left: 10px;
	margin-right: 10px;
}

.dual-listbox .dual-listbox__button:hover {
	filter: brightness(90%);
}

.dual-listbox .dual-listbox__item:hover {
	background-color: #089de31f;
}

#add_btn {
	background-color: #28a745;
}

#addall_btn {
	background-color: #1e7e34;
}

#rem_btn {
	background-color: #dc3545;
}

#remall_btn {
	background-color: #bd2130;
}