
#loadingMask {
	width: 100%;
	height: 100%;
	position: fixed;
	top: 0px;
	left: 0px;
	opacity: .8;
	background-color: #383d41;
	z-index: 9999;
	display: flex; 
	justify-content: center; 
	align-items: center; 
	flex-direction: row-reverse;
}

@keyframes loadingMask-spinner {
	to {transform: rotate(360deg);}
}

#loadingMask-spinner:before {
	content: '';
	box-sizing: border-box;
	position: absolute;
	top: 50%;
	width: 1.5rem;
	height: 1.5rem;
	margin-top: -0.6rem;
	margin-left: -0.6rem;
	border-radius: 50%;
	border: 0.2rem solid #f6f;
	border-top-color: #0e0;
	border-right-color: #0dd;
	border-bottom-color: #f90;
	animation: loadingMask-spinner .6s linear infinite;
}

#loadingMask-text {
	font-size: 1.5rem;
	line-height: 1.5rem;
	margin-left: 1.5rem;
	color: #EEE;
}

table caption {
	caption-side: top;
	padding-top: 0rem !important;
	padding-bottom: .5rem;
}

img[alt] {
	cursor: zoom-in
}

nav[data-toggle="toc"] {
	top: 32px;
}

/* small screens */
@media (max-width: 768px) {
	/* override stickyness so that the navigation does not follow scrolling */
	nav[data-toggle="toc"] {
	  margin-bottom: 32px;
	  position: static;
	}

	/* PICK ONE */
	/* don't expand nested items, which pushes down the rest of the page when navigating */
	nav[data-toggle="toc"] .nav .active .nav {
	  display: none;
	}
	/* alternatively, if you *do* want the second-level navigation to be shown (as seen on this page on mobile), use this */
	/*
	nav[data-toggle='toc'] .nav .nav {
	  display: block;
	}
	*/
}

h1 {
	padding: 12px 0px;
	margin-bottom: 6px;
	border-bottom: 1px solid #004080;
	font-size: 2.2rem;
}

h2 {
	font-size: 1.8rem;
	margin: 30px 0px 12px 0px;
}

h2[text=Reference] {
	font-size: 1.1rem
}

h3 {
	font-size: 1.4rem;
	margin-top: .8rem;
}

h4 {
	font-size: 1rem
}

div.card div.card-header h3,
div.card div.card-header h4,
div.card div.card-header h5 {
	margin-top: 0px;
}

div.nav-tabs a.nav-item h3,
div.nav-tabs a.nav-item h4,
div.nav-tabs a.nav-item h5,
div.card div.card-header h3 button,
div.card div.card-header h4 button,
div.card div.card-header h5 button {
	margin: 2px 4px;
	font-size: .9rem;
	font-weight: bold
}

div.card-header {
	padding: .25rem
}

img {
	max-width: 80%
}

.page-footer{
	font-size: .8rem
}

div.tab div.tab {
	margin: 4px;
	background-color: #EEE;
}

.dataTables_filter label {
	margin-bottom: 0px;
}
.dataTables_wrapper {
	margin-top: 25px;
}
.dataTables_wrapper label,
.dataTables_wrapper li.paginate_button,
.dataTables_wrapper div.dataTables_info {
	font-size: .9rem;
}
.dataTables_wrapper > div.row {
	overflow-x: auto;
}
.table.dataTable {
	margin-top: 0px !important
}
figcaption {
	padding-left: 12px;
	padding-bottom: 20px;
}
