@font-face {
	font-family: BenchNine;
	src: url("data:font/woff2;charset=utf-8;base64,[encoded data, 16844 characters]") format("woff2");
	font-weight: 700;
	font-display: swap;
	unicode-range: U+20-7E,U+2014,U+2019;
}

* {
	box-sizing: border-box;
}
body {
	font-family: system-ui, sans-serif;
	margin: 0;
	color: #222;
}
img {
	border: 0;
}
a,
a:visited,
a[href] {
	color: #222;
}

strong,
b {
	font-weight: 600;
}
hr {
	margin: 3em 0;
	border: none;
	border-top: 1px solid #ddd;
}
p {
	max-width: 42em;
	line-height: 1.5;
}

/* Blockquotes */
blockquote {
	font-family: Georgia, serif;
	font-size: 1.1875em; /* 19px /16 */
	color: #666;
	margin: 1.5em 0;
	padding: 0 1em;
	max-width: 31.57894736842em; /* 600px /19 */
	border-left: 6px solid #ddd;
	/*text-indent: -0.3684210526316em;*/ /* 7px /19 */
}
blockquote + blockquote {
	margin-top: 2em;
}
blockquote img {
	height: 1.3em;
	width: 1.3em;
	border-radius: 50%;
	vertical-align: text-top;
	margin-left: 2px;
	margin-right: 6px;
}

/* Main */
main {
	font-size: 1.125em; /* 18px /16 */
}
main:not(:empty) {
	padding-bottom: 3em;
	margin-bottom: 3em;
}

/* Tables */
table {
	border-collapse: collapse;
	margin-bottom: 2em;
}
table th,
table td {
	text-align: left;
	border-top: 1px solid #eee;
	border-bottom: 1px solid #eee;
	padding: .4em;
	font-size: 0.8125em; /* 13px /16 */
}
table th:first-child,
table td:first-child {
	padding-left: 0;
}
table th {
	border-color: #ddd;
}
h2 + table {
	margin-top: -0.625em; /* -10px /16 */
}

@media (min-width: 37.5em) { /* 600px */
	table th,
	table td {
		padding: .4em .8em;
		font-size: 1em; /* 16px /16 */
	}
}


/* Headings */
h1,
h2,
h3,
h4,
h5 {
	font-family: BenchNine, system-ui, sans-serif;
}
h1 {
	font-size: 2.666666666667em; /* 48px /18 */
	margin: 0;
}
main .elv-toc + h1 {
	margin-top: 1em;
}
main h1:first-child,
main .elv-toc + h1 {
	border-bottom: 2px dotted #666;
}
@media (min-width: 80em) {
	main .elv-toc + h1,
	main .elv-toc + h2 {
		margin-top: 0;
	}

}
h2 {
	font-size: 2.222222222222em; /* 40px /18 */
	border-bottom: 1px solid #ddd;
	margin: 1em 0 .25em;
}
h3 {
	font-size: 1.666666666667em; /* 30px /18 */
	margin-bottom: .5em;
}
h4 {
	font-size: 1.444444444444em; /* 26px /18 */
	margin-bottom: .5em;
}
h5 {
	font-size: 1.277777777778em; /* 23px /18 */
	margin-bottom: .5em;
}
main h1,
main h2,
main h3 {
	text-transform: uppercase;
}
h1 code,
h2 code,
h3 code,
h4 code,
h5 code {
	font-family: inherit;
	text-transform: none;
}

/* Lists */
ul {
	padding: 0 1em;
}
li {
	padding: .25em 0;
        line-height: 1.5;
}
li ul {
        list-style-type: disc;
        padding-left: 2em;
}
li li:last-child {
	padding-bottom: 0em;
}

/* Syntax highlighting and Code blocks */
pre {
	display: block;
	padding: .5em;
	margin: 1em -.5em 2em -.5em;
	overflow-x: auto;
	background-color: #fafafa;
	font-size: 0.75em; /* 12px /16 */
}
pre,
code {
	font-family: Monaco, monospace;
}
code {
	-ms-word-break: break-all;
	word-break: break-word;
	-webkit-hyphens: manual;
	-moz-hyphens: manual;
	hyphens: manual;
	background-color: #fafafa;
}
pre + pre[class*="language-"] {
	margin-top: 1em;
}
pre + .note {
	font-size: 0.6666666666667em; /* 16px /24 */
	margin-top: -2.875em; /* 46px /16 */
	margin-bottom: 2.5em; /* 40px /16 */
	text-align: right;
}
@media (min-width: 37.5em) { /* 600px */
	pre {
		font-size: 0.75em; /* 16px /16 */
	}
}


#quick-start ~ .language-text {
	border-top: 2px solid #666;
	border-bottom: 2px solid #666;
}
@media (min-width: 42em) { /* 672px */
	#quick-start ~ .language-text {
		border: 2px solid #666;
	}
}
#quick-start ~ .language-text,
#quick-start ~ .language-text code {
	background-color: #fafafa;
	color: #222;
}

/* Layout */
.elv-layout {
	padding: 0 1rem 1rem;
	margin: 0 auto;
	max-width: 42rem;
	clear: both;
}
header.elv-layout {
	padding: 0 1rem;
}
footer.elv-layout {
	margin-bottom: 5em;
}
.elv-layout-full {
	max-width: none;
}
@media (min-width: 80em) {
	.elv-layout-toc {
		padding-left: 15rem;
		max-width: 76rem;
		margin-right: 1rem;
		position: relative;
	}
}
/*.elv-layout-wider {
	max-width: 60rem;
}*/

/* Header */
.elv-header {
	position: relative;
        text-align: center;
}
.elv-header-default {
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: center;
	padding-top: 0;
}
.elv-header-c {
	width: 100%;
}
.elv-header-docs .elv-header-c {
	padding: 1rem 0;
}
.elv-header-docs:before,
.elv-header-docs:after {
	content: " ";
	display: table;
}
.elv-header-docs:after {
	clear: both;
}
/* Header Hero */
.elv-hero {
	background-color: #222;
}
.elv-hero img,
.elv-hero svg {
	width: 42.95774646vh;
	height: 60vh;
}
.elv-hero:hover img,
.elv-hero:hover svg {
	background-color: inherit;
}
.elv-header-default .elv-hero {
	display: flex;
	justify-content: center;
	width: calc(100% + 2rem);
	margin-left: -1rem;
	margin-right: -1rem;
}
.elv-hero:hover {
	background-color: #333;
}

.elv-header-docs .elv-hero {
	float: left;
	margin-right: .5em;
}
.elv-header-default .elv-hero img,
.elv-header-default .elv-hero svg {
	position: relative;
	background-color: transparent;
	z-index: 1;
}
.elv-header-docs .elv-hero img,
.elv-header-docs .elv-hero svg {
	width: auto;
	height: 3em;
}
@media (min-width: 43.75em) { /* 700px */
	.elv-header-docs .elv-hero {
		margin-right: 1em;
	}
	.elv-header-docs .elv-hero img,
	.elv-header-docs .elv-hero svg {
		width: 4.303125em; /* 68.85px /16 */
		height: 6em;
	}
}
/* Header Possum */
.elv-possum-anchor {
	display: block;
}
.elv-possum {
	position: absolute;
	right: .5rem;
	top: 1rem;
	transition: .3s opacity ease-out;
}
.elv-header-docs .elv-possum {
	width: 15vw;
	max-width: 6.25rem; /* 100px /16 */
}
.elv-header-default {
	overflow: hidden;
}
.elv-header-default .elv-possum {
	pointer-events: none;
	width: auto;
	height: calc((60vh - 2rem) / 1.6);
	top: 36%;
	left: 1vw;
	right: auto;
	animation-duration: 180s;
	animation-name: balloonFloat;
}
@media (prefers-reduced-motion: reduce) {
	.elv-header-default .elv-possum {
		display: none;
	}
}

/* Navigation */
.elv-nav {
	padding: 0;
	margin: 1em 0 0 0;
	clear: both;
	list-style: none;
}
.elv-nav-item {
	float: left;
	padding-left: .25em;
	padding-right: .25em;
	font-size: 0.8125rem; /* 13px /16 */
}
.elv-nav-item:first-child {
	padding-left: 0;
}
.elv-nav-item:last-child {
	padding-right: 0;
}
.elv-nav-item a {
		font-weight: 600;
	}
.elv-nav-item .elv-nav-light {
	font-weight: 300;
}
@media (min-width: 20em) { /* 320px */
	.elv-nav-item {
		font-size: 4vw;
	}
}
@media (min-width: 25em) { /* 400px */
	.elv-nav-item {
		font-size: 1rem; /* 16px /16 */
		padding-left: .45em;
		padding-right: .45em;
	}
}
@media (min-width: 35.625em) { /* 570px */
	.elv-nav {
		clear: none;
		width: auto;
		margin-top: 0;
	}
	.elv-nav-item {
		float: left;
		padding-left: 0;
		padding-right: 0;
	}
	.elv-nav-item a:not(:hover) {
		text-decoration: none;
	}
	.elv-nav-item:not(:first-child):before {
		content: "";
		border-left: 1px solid #ccc;
		padding: 0 0 0 .75em;
		margin-left: .75em;
	}
}

/* Version */
.latestversion {
	font-size: 2em;
	margin-top: 0;
}
.latestversion code {
	font-size: 0.75em; /* 24px /32 */
}
.latestversion {
	font-family: BenchNine, system-ui, sans-serif;
}
.tmpl-docs .latestversion {
	position: absolute;
	top: 1rem;
	right: 1rem;
	margin: 0;
}

/* News */
.news {
	text-align: center;
}

/* Direct Links / Markdown Headers */
.direct-link {
	font-family: sans-serif;
	text-decoration: none;
	font-style: normal;
	margin-left: .1em;
}
a[href].direct-link,
a[href].direct-link:visited {
	color: transparent;
}
a[href].direct-link:focus,
a[href].direct-link:focus:visited,
:hover > a[href].direct-link,
:hover > a[href].direct-link:visited,
:focus > a[href].direct-link,
:focus > a[href].direct-link:visited {
	color: #aaa;
}
/* don’t use a direct link, should be a link to the page */
main .elv-toc + h1 .direct-link {
	display: none;
}

/* Style Guide */
.elv-sg-component {
	background-color: #f9f9f9;
	border-top: 1px dotted #ddd;
	border-bottom: 1px dotted #ddd;
	margin: 2rem 0;
}

/* Screen readers only */
.sr-only {
	position: absolute;
	height: 1px;
	width: 1px; 
	overflow: hidden;
	clip: rect(1px, 1px, 1px, 1px);
}

/* Language List */
.elv-langlist {
	font-size: 0.8333333333333em; /* 15px /18 */
	background-color: #f7f7f7;
	padding: .5rem;
	margin: 2em 0;
}
.elv-langlist-hed {
	margin: 0;
	float: left;
	border: none;
	font-size: 1.4em; /* 21px /15 */
}
.elv-langlist > .inlinelist {
	display: inline;
	margin-left: 1em;
}

@media (min-width: 37.5em) { /* 600px */
	.quicktipstoc {
		margin: 0 0 3% 3%;
		float: right;
		width: 32%;
		border-radius: .25em;
		font-size: 0.8125em; /* 13px /16 */
	}
}

/* Breakpoint Overrides */
@media (max-width: 37.4375em) { /* 599px */
	.bp-notsm.bp-notsm.bp-notsm.bp-notsm {
		display: none;
	}
}
@media (min-width: 37.5em) { /* 600px */
	.bp-sm.bp-sm.bp-sm.bp-sm {
		display: none ;
	}
}

.header-anchor {
    text-decoration: none;
}

.header-anchor:hover::after {
    content: " 🔗";
}

.mdi {
    display: inline-block;
    width: 1em;
    height: 1em;
    background-color: currentColor;
    -webkit-mask: no-repeat center / 100%;
    mask: no-repeat center / 100%;
    -webkit-mask-image: var(--svg);
    mask-image: var(--svg);
}

.mdi.mdi-content-copy {
    --svg: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' width='24' height='24'%3E%3Cpath fill='black' d='M19 21H8V7h11m0-2H8a2 2 0 0 0-2 2v14a2 2 0 0 0 2 2h11a2 2 0 0 0 2-2V7a2 2 0 0 0-2-2m-3-4H4a2 2 0 0 0-2 2v14h2V3h12V1Z'/%3E%3C/svg%3E");
}

#search-entrance {
		padding-bottom: 1em;
}

#search-entrance form {
		display: inline-block;
}

#search {
		padding-top: 1em;
}
