rustdoc.css

/* See FiraSans-LICENSE.txt for the Fira Sans license. */
@font-face {
	font-family: 'Fira Sans';
	font-style: normal;
	font-weight: 400;
	src: local('Fira Sans'),
		url("FiraSans-Regular.woff2") format("woff2");
	font-display: swap;
}
@font-face {
	font-family: 'Fira Sans';
	font-style: normal;
	font-weight: 500;
	src: local('Fira Sans Medium'),
		url("FiraSans-Medium.woff2") format("woff2");
	font-display: swap;
}

/* See SourceSerif4-LICENSE.md for the Source Serif 4 license. */
@font-face {
	font-family: 'Source Serif 4';
	font-style: normal;
	font-weight: 400;
	src: local('Source Serif 4'),
		url("SourceSerif4-Regular.ttf.woff2") format("woff2");
	font-display: swap;
}
@font-face {
	font-family: 'Source Serif 4';
	font-style: italic;
	font-weight: 400;
	src: local('Source Serif 4 Italic'),
		url("SourceSerif4-It.ttf.woff2") format("woff2");
	font-display: swap;
}
@font-face {
	font-family: 'Source Serif 4';
	font-style: normal;
	font-weight: 700;
	src: local('Source Serif 4 Bold'),
		url("SourceSerif4-Bold.ttf.woff2") format("woff2");
	font-display: swap;
}

/* See SourceCodePro-LICENSE.txt for the Source Code Pro license. */
@font-face {
	font-family: 'Source Code Pro';
	font-style: normal;
	font-weight: 400;
	/* Avoid using locally installed font because bad versions are in circulation:
	 * see https://github.com/rust-lang/rust/issues/24355 */
	src: url("SourceCodePro-Regular.ttf.woff2") format("woff2");
	font-display: swap;
}
@font-face {
	font-family: 'Source Code Pro';
	font-style: italic;
	font-weight: 400;
	src: url("SourceCodePro-It.ttf.woff2") format("woff2");
	font-display: swap;
}
@font-face {
	font-family: 'Source Code Pro';
	font-style: normal;
	font-weight: 600;
	src: url("SourceCodePro-Semibold.ttf.woff2") format("woff2");
	font-display: swap;
}

/* Avoid using legacy CJK serif fonts in Windows like Batang. */
@font-face {
	font-family: 'NanumBarunGothic';
	src: url("NanumBarunGothic.ttf.woff2") format("woff2");
	font-display: swap;
	unicode-range: U+AC00-D7AF, U+1100-11FF, U+3130-318F, U+A960-A97F, U+D7B0-D7FF;
}

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

/* This part handles the "default" theme being used depending on the system one. */
html {
	content: "";
}
@media (prefers-color-scheme: light) {
	html {
		content: "light";
	}
}
@media (prefers-color-scheme: dark) {
	html {
		content: "dark";
	}
}

/* General structure and fonts */

body {
	/* Line spacing at least 1.5 per Web Content Accessibility Guidelines
	   https://www.w3.org/WAI/WCAG21/Understanding/visual-presentation.html */
	font: 1rem/1.5 "Source Serif 4", NanumBarunGothic, serif;
	margin: 0;
	position: relative;
	/* We use overflow-wrap: break-word for Safari, which doesn't recognize
	   `anywhere`: https://developer.mozilla.org/en-US/docs/Web/CSS/overflow-wrap */
	overflow-wrap: break-word;
	/* Then override it with `anywhere`, which is required to make non-Safari browsers break
	   more aggressively when we want them to. */
	overflow-wrap: anywhere;

	-webkit-font-feature-settings: "kern", "liga";
	-moz-font-feature-settings: "kern", "liga";
	font-feature-settings: "kern", "liga";

	background-color: var(--main-background-color);
	color: var(--main-color);
}

h1 {
	font-size: 1.5rem; /* 24px */
}
h2 {
	font-size: 1.375rem; /* 22px */
}
h3 {
	font-size: 1.25rem; /* 20px */
}
h1, h2, h3, h4, h5, h6 {
	font-weight: 500;
}
h1, h2, h3, h4 {
	margin: 20px 0 15px 0;
	padding-bottom: 6px;
}
.docblock h3, .docblock h4, h5, h6 {
	margin: 15px 0 5px 0;
}
h1.fqn {
	margin: 0;
	padding: 0;
	border-bottom-color: var(--headings-border-bottom-color);
}
h2, h3, h4 {
	border-bottom-color: var(--headings-border-bottom-color);
}
.main-heading {
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	padding-bottom: 6px;
	margin-bottom: 15px;
}
.main-heading a:hover {
	text-decoration: underline;
}
#toggle-all-docs {
	text-decoration: none;
}
/* The only headings that get underlines are:
	 Markdown-generated headings within the top-doc
	 Rustdoc-generated h2 section headings (e.g. "Implementations", "Required Methods", etc)
	Underlines elsewhere in the documentation break up visual flow and tend to invert
	section hierarchies. */
h2,
.top-doc .docblock > h3,
.top-doc .docblock > h4 {
	border-bottom: 1px solid var(--headings-border-bottom-color);
}
h3.code-header {
	font-size: 1.125rem; /* 18px */
}
h4.code-header {
	font-size: 1rem;
}
.code-header {
	font-weight: 600;
	border-bottom-style: none;
	margin: 0;
	padding: 0;
	margin-top: 0.6em;
	margin-bottom: 0.4em;
}
.impl,
.impl-items .method,
.methods .method,
.impl-items .type,
.methods .type,
.impl-items .associatedconstant,
.methods .associatedconstant,
.impl-items .associatedtype,
.methods .associatedtype {
	flex-basis: 100%;
	font-weight: 600;
	position: relative;
}

h1, h2, h3, h4, h5, h6,
.sidebar,
.mobile-topbar,
a.source,
.search-input,
.search-results .result-name,
.item-left > a,
.out-of-band,
span.since,
#source-sidebar, #sidebar-toggle,
details.rustdoc-toggle > summary::before,
.content ul.crate a.crate,
a.srclink,
#help-button > button,
details.rustdoc-toggle.top-doc > summary,
details.rustdoc-toggle.top-doc > summary::before,
details.rustdoc-toggle.non-exhaustive > summary,
details.rustdoc-toggle.non-exhaustive > summary::before,
.scraped-example-title,
.more-examples-toggle summary, .more-examples-toggle .hide-more,
.example-links a,
/* This selector is for the items listed in the "all items" page. */
#main-content > ul.docblock > li > a {
	font-family: "Fira Sans", Arial, NanumBarunGothic, sans-serif;
}

h1, h2, h3, h4,
a#toggle-all-docs,
a.anchor,
.small-section-header a,
#source-sidebar a,
pre.rust a,
.sidebar h2 a,
.sidebar h3 a,
.mobile-topbar h2 a,
.in-band a,
.search-results a,
.module-item .stab,
.import-item .stab,
.result-name .primitive > i, .result-name .keyword > i,
.content .method .where,
.content .fn .where,
.content .where.fmt-newline {
	color: var(--main-color);
}

ol, ul {
	padding-left: 24px;
}
ul ul, ol ul, ul ol, ol ol {
	margin-bottom: .625em;
}

p {
	/* Paragraph spacing at least 1.5 times line spacing per Web Content Accessibility Guidelines.
	   Line-height is 1.5rem, so line spacing is .5rem; .75em is 1.5 times that.
	   https://www.w3.org/WAI/WCAG21/Understanding/visual-presentation.html */
	margin: 0 0 .75em 0;
}

summary {
	outline: none;
}

/* Fix some style changes due to normalize.css 8 */

td,
th {
	padding: 0;
}

table {
	border-collapse: collapse;
}

button,
input,
optgroup,
select,
textarea {
	color: inherit;
	font: inherit;
	margin: 0;
}

button {
	/* Buttons on Safari have different default padding than other platforms. Make them the same. */
	padding: 1px 6px;
}

/* end tweaks for normalize.css 8 */

.rustdoc {
	display: flex;
	flex-direction: row;
	flex-wrap: nowrap;
}

main {
	position: relative;
	flex-grow: 1;
	padding: 10px 15px 40px 45px;
	min-width: 0;
}

.source main {
	padding: 15px;
}

.width-limiter {
	max-width: 960px;
	margin-right: auto;
}

.source .width-limiter {
	max-width: unset;
}

details:not(.rustdoc-toggle) summary {
	margin-bottom: .6em;
}

code, pre, a.test-arrow, .code-header {
	font-family: "Source Code Pro", monospace;
}
.docblock code, .docblock-short code {
	border-radius: 3px;
	padding: 0 0.125em;
}
.docblock pre code, .docblock-short pre code {
	padding: 0;
}
pre {
	padding: 14px;
}
.docblock.item-decl {
	margin-left: 0;
}
.item-decl pre {
	overflow-x: auto;
}

.source .content pre {
	padding: 20px;
}

img {
	max-width: 100%;
}

li {
	position: relative;
}

.source .content {
	max-width: none;
	overflow: visible;
	margin-left: 0px;
}

.sub-container {
	display: flex;
	flex-direction: row;
	flex-wrap: nowrap;
}

.sub-logo-container {
	display: none;
	margin-right: 20px;
}

.source .sub-logo-container {
	display: block;
}

.source .sub-logo-container > img {
	height: 60px;
	width: 60px;
	object-fit: contain;
}

.sidebar, .mobile-topbar, .sidebar-menu-toggle {
	background-color: var(--sidebar-background-color);
}

.sidebar {
	font-size: 0.875rem;
	width: 250px;
	min-width: 200px;
	overflow-y: scroll;
	position: sticky;
	height: 100vh;
	top: 0;
	left: 0;
}

.sidebar-elems,
.sidebar > .location {
	padding-left: 24px;
}

.sidebar .location {
	overflow-wrap: anywhere;
}

.rustdoc.source .sidebar {
	width: 50px;
	min-width: 0px;
	max-width: 300px;
	flex-grow: 0;
	flex-shrink: 0;
	flex-basis: auto;
	border-right: 1px solid;
	overflow-x: hidden;
	/* The sidebar is by default hidden  */
	overflow-y: hidden;
}

.rustdoc.source .sidebar .sidebar-logo {
	display: none;
}

.source .sidebar, #sidebar-toggle, #source-sidebar {
	background-color: var(--sidebar-background-color);
}

#sidebar-toggle > button:hover, #sidebar-toggle > button:focus {
	background-color: var(--sidebar-background-color-hover);
}

.source .sidebar > *:not(#sidebar-toggle) {
	opacity: 0;
	visibility: hidden;
}

.source-sidebar-expanded .source .sidebar {
	overflow-y: auto;
}

.source-sidebar-expanded .source .sidebar > *:not(#sidebar-toggle) {
	opacity: 1;
	visibility: visible;
}

#all-types {
	margin-top: 1em;
}

/* Improve the scrollbar display on firefox */
* {
	scrollbar-width: initial;
	scrollbar-color: var(--scrollbar-color);
}
.sidebar {
	scrollbar-width: thin;
	scrollbar-color: var(--scrollbar-color);
}

/* Improve the scrollbar display on webkit-based browsers */
::-webkit-scrollbar {
	width: 12px;
}
.sidebar::-webkit-scrollbar {
	width: 8px;
}
::-webkit-scrollbar-track {
	-webkit-box-shadow: inset 0;
	background-color: var(--scrollbar-track-background-color);
}
.sidebar::-webkit-scrollbar-track {
	background-color: var(--scrollbar-track-background-color);
}
::-webkit-scrollbar-thumb, .sidebar::-webkit-scrollbar-thumb {
	background-color: var(--scrollbar-thumb-background-color);
}

/* Everything else */

.hidden {
	display: none !important;
}

.sidebar .logo-container {
	display: flex;
	margin-top: 10px;
	margin-bottom: 10px;
	justify-content: center;
}

.version {
	overflow-wrap: break-word;
}

.logo-container > img {
	height: 100px;
	width: 100px;
}

.location:empty {
	border: none;
}

.location a:first-of-type {
	font-weight: 500;
}

.block {
	padding: 0;
}
.block ul, .block li {
	padding: 0;
	margin: 0;
	list-style: none;
}

.block a,
h2.location a {
	display: block;
	padding: 0.25rem;
	margin-left: -0.25rem;

	text-overflow: ellipsis;
	overflow: hidden;
}

.sidebar h2 {
	border-bottom: none;
	font-weight: 500;
	padding: 0;
	margin: 0;
	margin-top: 0.7rem;
	margin-bottom: 0.7rem;
}

.sidebar h3 {
	font-size: 1.125rem; /* 18px */
	font-weight: 500;
	padding: 0;
	margin: 0;
}

.sidebar-elems .block {
	margin-bottom: 2em;
}

.sidebar-elems .block li a {
	white-space: nowrap;
}

.mobile-topbar {
	display: none;
}

.source .content pre.rust {
	white-space: pre;
	overflow: auto;
	padding-left: 0;
}

.rustdoc .example-wrap {
	display: inline-flex;
	margin-bottom: 10px;
}

.example-wrap {
	position: relative;
	width: 100%;
}

.example-wrap > pre.line-number {
	overflow: initial;
	border: 1px solid;
	padding: 13px 8px;
	text-align: right;
	border-top-left-radius: 5px;
	border-bottom-left-radius: 5px;
}

.example-wrap > pre.rust a:hover {
	text-decoration: underline;
}

.line-numbers {
	text-align: right;
}
.rustdoc:not(.source) .example-wrap > pre:not(.line-number) {
	width: 100%;
	overflow-x: auto;
}

.rustdoc:not(.source) .example-wrap > pre.line-numbers {
	width: auto;
	overflow-x: visible;
}

.rustdoc .example-wrap > pre {
	margin: 0;
}

#search {
	position: relative;
}

.search-loading {
	text-align: center;
}

.content > .example-wrap pre.line-numbers {
	position: relative;
	-webkit-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	user-select: none;
}
.line-numbers span {
	cursor: pointer;
}

.docblock-short {
	overflow-wrap: break-word;
	overflow-wrap: anywhere;
}
.docblock-short p {
	display: inline;
	overflow: hidden;
	text-overflow: ellipsis;
	margin: 0;
}
/* Wrap non-pre code blocks (`text`) but not (```text```). */
.docblock > :not(pre) > code,
.docblock-short > :not(pre) > code {
	white-space: pre-wrap;
}

.top-doc .docblock h2 { font-size: 1.375rem; }
.top-doc .docblock h3 { font-size: 1.25rem; }
.top-doc .docblock h4,
.top-doc .docblock h5 {
	font-size: 1.125rem;
}
.top-doc .docblock h6 {
	font-size: 1rem;
}

.docblock h5 { font-size: 1rem; }
.docblock h6 { font-size: 0.875rem; }
.docblock h1, .docblock h2, .docblock h3, .docblock h4, .docblock h5, .docblock h6 {
	border-bottom-color: var(--headings-border-bottom-color);
}

.docblock {
	margin-left: 24px;
	position: relative;
}

.docblock > :not(.information):not(.more-examples-toggle) {
	max-width: 100%;
	overflow-x: auto;
}

.content .out-of-band {
	flex-grow: 0;
	font-size: 1.125rem;
	font-weight: normal;
	float: right;
}

.method > .code-header, .trait-impl > .code-header {
	max-width: calc(100% - 41px);
	display: block;
}

.content .in-band {
	flex-grow: 1;
	margin: 0px;
	padding: 0px;
	/* We use overflow-wrap: break-word for Safari, which doesn't recognize
	   `anywhere`: https://developer.mozilla.org/en-US/docs/Web/CSS/overflow-wrap */
	overflow-wrap: break-word;
	/* Then override it with `anywhere`, which is required to make non-Safari browsers break
	   more aggressively when we want them to. */
	overflow-wrap: anywhere;
	background-color: var(--main-background-color);
}

.in-band > code, .in-band > .code-header {
	display: inline-block;
}

.docblock code, .docblock-short code,
pre, .rustdoc.source .example-wrap {
	background-color: var(--code-block-background-color);
}

#main-content {
	position: relative;
}

.content table {
	border-spacing: 0 5px;
}
.content td { vertical-align: top; }
.content td:first-child { padding-right: 20px; }
.content td p:first-child { margin-top: 0; }
.content td h1, .content td h2 { margin-left: 0; font-size: 1.125rem; }
.content tr:first-child td { border-top: 0; }

.docblock table {
	margin: .5em 0;
	width: calc(100% - 2px);
	overflow-x: auto;
	display: block;
}

.docblock table td {
	padding: .5em;
	border: 1px dashed var(--border-color);
}

.docblock table th {
	padding: .5em;
	text-align: left;
	border: 1px solid var(--border-color);
}

.content .item-list {
	list-style-type: none;
	padding: 0;
}

.content > .methods > .method {
	font-size: 1rem;
	position: relative;
}
/* Shift "where ..." part of method or fn definition down a line */
.content .method .where,
.content .fn .where,
.content .where.fmt-newline {
	display: block;
	font-size: 0.875rem;
}

.item-info {
	display: block;
}

.content .item-info code {
	font-size: 0.875rem;
}

.content .item-info {
	position: relative;
	margin-left: 24px;
}

.content .impl-items .docblock, .content .impl-items .item-info {
	margin-bottom: .6em;
}

#main-content > .item-info {
	margin-top: 0;
	margin-left: 0;
}

nav.sub {
	position: relative;
	font-size: 1rem;
	flex-grow: 1;
	margin-bottom: 25px;
}
.source nav.sub {
	margin-left: 32px;
}
nav.sum { text-align: right; }
nav.sub form { display: inline; }

a {
	text-decoration: none;
	background: transparent;
}

.small-section-header {
	display: flex;
	justify-content: space-between;
	position: relative;
}

.small-section-header:hover > .anchor {
	display: initial;
}

.in-band:hover > .anchor, .impl:hover > .anchor, .method.trait-impl:hover > .anchor,
.type.trait-impl:hover > .anchor, .associatedconstant.trait-impl:hover > .anchor,
.associatedtype.trait-impl:hover > .anchor {
	display: inline-block;
	position: absolute;
}
.anchor {
	display: none;
	position: absolute;
	left: -0.5em;
	background: none !important;
}
.anchor.field {
	left: -5px;
}
.small-section-header > .anchor {
	left: -15px;
	padding-right: 8px;
}
h2.small-section-header > .anchor {
	padding-right: 6px;
}
.anchor::before {
	content: '§';
}

.docblock a:not(.srclink):not(.test-arrow):not(.scrape-help):hover,
.docblock-short a:not(.srclink):not(.test-arrow):not(.scrape-help):hover, .item-info a {
	text-decoration: underline;
}

.block a.current.crate { font-weight: 500; }

/*  In most contexts we use `overflow-wrap: anywhere` to ensure that we can wrap
	as much as needed on mobile (see
	src/test/rustdoc-gui/type-declaration-overflow.goml for an example of why
	this matters). The `anywhere` value means:

	"Soft wrap opportunities introduced by the word break are considered when
	 calculating min-content intrinsic sizes."

	https://developer.mozilla.org/en-US/docs/Web/CSS/overflow-wrap#values

	For table layouts, that becomes a problem: the browser tries to make each
	column as narrow as possible, and `overflow-wrap: anywhere` means it can do
	so by breaking words - even if some other column could be shrunk without
	breaking words! This shows up, for instance, in the `Structs` / `Modules` /
	`Functions` (etcetera) sections of a module page, and when a docblock
	contains a table.

	So, for table layouts, override the default with break-word, which does
	_not_ affect min-content intrinsic sizes.
*/
table,
.item-table {
	overflow-wrap: break-word;
}

.item-table {
	display: table;
}
.item-row {
	display: table-row;
}
.item-left, .item-right {
	display: table-cell;
}
.item-left {
	padding-right: 1.25rem;
}

.search-container {
	position: relative;
	display: flex;
	height: 34px;
	margin-top: 4px;
}
.search-container > * {
	height: 100%;
}
.search-results-title {
	margin-top: 0;
	white-space: nowrap;
	/* flex layout allows shrinking the <select> appropriately if it becomes too large */
	display: inline-flex;
	max-width: 100%;
	/* make things look like in a line, despite the fact that we're using a layout
	with boxes (i.e. from the flex layout) */
	align-items: baseline;
}
#crate-search-div {
	display: inline-block;
	/* ensures that 100% in properties of #crate-search-div:after
	are relative to the size of this div */
	position: relative;
	/* allows this div (and with it the <select>-element "#crate-search") to be shrunk */
	min-width: 5em;
}
#crate-search {
	min-width: 115px;
	padding: 0;
	/* keep these two in sync with "@-moz-document url-prefix()" below */
	padding-left: 4px;
	padding-right: 23px;
	/* prevents the <select> from overflowing the containing div in case it's shrunk */
	max-width: 100%;
	/* contents can overflow because of max-width limit, then show ellipsis */
	text-overflow: ellipsis;
	border: 1px solid var(--border-color);
	border-radius: 4px;
	outline: none;
	cursor: pointer;
	-moz-appearance: none;
	-webkit-appearance: none;
	/* Removes default arrow from firefox */
	text-indent: 0.01px;
	background-color: var(--main-background-color);
}
/* cancel stylistic differences in padding in firefox
for "appearance: none"-style (or equivalent) <select>s */
@-moz-document url-prefix() {
	#crate-search {
		padding-left: 0px; /* == 4px - 4px */
		padding-right: 19px; /* == 23px - 4px */
	}
}
/* pseudo-element for holding the dropdown-arrow image; needs to be a separate thing
so that we can apply CSS-filters to change the arrow color in themes */
#crate-search-div::after {
	/* lets clicks through! */
	pointer-events: none;
	/* completely covers the underlying div */
	width: 100%;
	height: 100%;
	position: absolute;
	top: 0;
	left: 0;
	content: "";
	background-repeat: no-repeat;
	background-size: 20px;
	background-position: calc(100% - 2px) 56%;
	/* image is black color, themes should apply a "filter" property to change the color */
	background-image: /* AUTOREPLACE: */url("down-arrow.svg");
}
#crate-search > option {
	font-size: 1rem;
}
.search-input {
	/* Override Normalize.css: it has a rule that sets
	   -webkit-appearance: textfield for search inputs. That
	   causes rounded corners and no border on iOS Safari. */
	-webkit-appearance: none;
	/* Override Normalize.css: we have margins and do
	 not want to overflow - the `moz` attribute is necessary
	 until Firefox 29, too early to drop at this point */
	-moz-box-sizing: border-box !important;
	box-sizing: border-box !important;
	outline: none;
	border: 1px solid var(--border-color);
	border-radius: 2px;
	padding: 8px;
	font-size: 1rem;
	width: 100%;
	background-color: var(--button-background-color);
}
.search-input:focus {
	border-color: var(--search-input-focused-border-color);
}

.search-results {
	display: none;
	padding-bottom: 2em;
}

.search-results.active {
	display: block;
	/* prevent overhanging tabs from moving the first result */
	clear: both;
}

.search-results .desc > span {
	white-space: nowrap;
	text-overflow: ellipsis;
	overflow: hidden;
	display: block;
}

.search-results > a {
	display: block;
	width: 100%;
	/* A little margin ensures the browser's outlining of focused links has room to display. */
	margin-left: 2px;
	margin-right: 2px;
	border-bottom: 1px solid #aaa3;
}

.search-results > a > div {
	display: flex;
	flex-flow: row wrap;
}

.search-results .result-name, .search-results div.desc, .search-results .result-description {
	width: 50%;
}
.search-results .result-name {
	padding-right: 1em;
}

.search-results .result-name > span {
	display: inline-block;
	margin: 0;
	font-weight: normal;
}

.popover {
	font-size: 1rem;
	position: absolute;
	right: 0;
	z-index: 2;
	display: block;
	margin-top: 7px;
	border-radius: 3px;
	border: 1px solid var(--border-color);
	font-size: 1rem;
}

/* This rule is to draw the little arrow connecting the settings menu to the gear icon. */
.popover::before {
	content: '';
	position: absolute;
	right: 11px;
	border: solid var(--border-color);
	border-width: 1px 1px 0 0;
	display: inline-block;
	padding: 4px;
	transform: rotate(-45deg);
	top: -5px;
}

.popover, .popover::before {
	background-color: var(--main-background-color);
	color: var(--main-color);
}

#help-button .popover {
	max-width: 600px;
}

#help-button .popover::before {
	right: 48px;
}

#help-button dt {
	float: left;
	clear: left;
	display: block;
	margin-right: 0.5rem;
}
#help-button span.top, #help-button span.bottom {
	text-align: center;
	display: block;
	font-size: 1.125rem;
}
#help-button span.top {
	text-align: center;
	display: block;
	margin: 10px 0;
	border-bottom: 1px solid var(--border-color);
	padding-bottom: 4px;
	margin-bottom: 6px;
}
#help-button span.bottom {
	clear: both;
	border-top: 1px solid var(--border-color);
}
.side-by-side {
	text-align: initial;
}
.side-by-side > div {
	width: 50%;
	float: left;
	padding: 0 20px 20px 17px;
}

.item-info .stab {
	width: fit-content;
	/* This min-height is needed to unify the height of the stab elements because some of them
	   have emojis.
	*/
	min-height: 36px;
	display: flex;
	align-items: center;
	white-space: pre-wrap;
}
.stab {
	padding: 3px;
	margin-bottom: 5px;
	font-size: 0.875rem;
	font-weight: normal;
}
.stab p {
	display: inline;
	margin: 0;
}

.stab .emoji {
	font-size: 1.25rem;
	margin-right: 0.3rem;
}

/* Black one-pixel outline around emoji shapes */
.emoji {
	text-shadow:
		1px 0 0 black,
		-1px 0 0 black,
		0  1px 0 black,
		0 -1px 0 black;
}

.module-item .stab,
.import-item .stab {
	border-radius: 3px;
	display: inline-block;
	font-size: 0.875rem;
	line-height: 1.2;
	margin-bottom: 0;
	margin-left: 0.3125em;
	padding: 2px;
	vertical-align: text-bottom;
}

.module-item.unstable,
.import-item.unstable {
	opacity: 0.65;
}

.since {
	font-weight: normal;
	font-size: initial;
}

.rightside {
	padding-left: 12px;
	padding-right: 2px;
	position: initial;
	float: right;
}

.rightside:not(a),
.out-of-band {
	color: var(--right-side-color);
}


.impl-items .srclink, .impl .srclink, .methods .srclink {
	/* Override header settings otherwise it's too bold */
	font-weight: normal;
	font-size: 1rem;
}

td.summary-column {
	width: 100%;
}

.summary {
	padding-right: 0px;
}

pre.rust .question-mark {
	font-weight: bold;
}

a.test-arrow {
	display: inline-block;
	visibility: hidden;
	position: absolute;
	padding: 5px 10px 5px 10px;
	border-radius: 5px;
	font-size: 1.375rem;
	top: 5px;
	right: 5px;
	z-index: 1;
}
.example-wrap:hover .test-arrow {
	visibility: visible;
}
a.test-arrow:hover {
	text-decoration: none;
}

.code-attribute {
	font-weight: 300;
	color: var(--code-attribute-color);
}

.item-spacer {
	width: 100%;
	height: 12px;
}

.out-of-band > span.since {
	position: initial;
	font-size: 1.25rem;
}

h3.variant {
	font-weight: 600;
	font-size: 1.125rem;
	margin-bottom: 10px;
	border-bottom: none;
}

.sub-variant h4 {
	font-size: 1rem;
	font-weight: 400;
	border-bottom: none;
	margin-top: 0;
	margin-bottom: 0;
}

.sub-variant {
	margin-left: 24px;
	margin-bottom: 40px;
}

.sub-variant > .sub-variant-field {
	margin-left: 24px;
}

:target > code, :target > .code-header {
	opacity: 1;
}

:target {
	padding-right: 3px;
}

.information {
	position: absolute;
	left: -25px;
	margin-top: 7px;
	z-index: 1;
}

.tooltip {
	position: relative;
	display: inline-block;
	cursor: pointer;
}

.tooltip::after {
	display: none;
	text-align: center;
	padding: 5px 3px 3px 3px;
	border-radius: 6px;
	margin-left: 5px;
	font-size: 1rem;
	border: 1px solid var(--border-color);
}

.tooltip.ignore::after {
	content: "This example is not tested";
}
.tooltip.compile_fail::after {
	content: "This example deliberately fails to compile";
}
.tooltip.should_panic::after {
	content: "This example panics";
}
.tooltip.edition::after {
	content: "This code runs with edition " attr(data-edition);
}

.tooltip::before {
	content: " ";
	position: absolute;
	top: 50%;
	left: 16px;
	margin-top: -5px;
	border-width: 5px;
	border-style: solid;
	display: none;
}

.tooltip:hover::before, .tooltip:hover::after {
	display: inline;
}

.tooltip.compile_fail, .tooltip.should_panic, .tooltip.ignore {
	font-weight: bold;
	font-size: 1.25rem;
}

.notable-traits-tooltip {
	display: inline-block;
	cursor: pointer;
}

.notable-traits:hover .notable-traits-tooltiptext,
.notable-traits .notable-traits-tooltiptext.force-tooltip {
	display: inline-block;
}

.notable-traits .notable-traits-tooltiptext {
	display: none;
	padding: 5px 3px 3px 3px;
	border-radius: 6px;
	margin-left: 5px;
	z-index: 10;
	font-size: 1rem;
	cursor: default;
	position: absolute;
	border: 1px solid;
}

.notable-traits-tooltip::after {
	/* The margin on the tooltip does not capture hover events,
	   this extends the area of hover enough so that mouse hover is not
	   lost when moving the mouse to the tooltip */
	content: "\00a0\00a0\00a0";
}

.notable-traits .notable, .notable-traits .docblock {
	margin: 0;
}

.notable-traits .notable {
	margin: 0;
	margin-bottom: 13px;
	font-size: 1.1875rem;
	font-weight: 600;
	display: block;
}

.notable-traits .docblock code.content{
	margin: 0;
	padding: 0;
	font-size: 1.25rem;
}

/* Example code has the "Run" button that needs to be positioned relative to the pre */
pre.rust.rust-example-rendered {
	position: relative;
}

pre.rust {
	tab-size: 4;
	-moz-tab-size: 4;
}

.search-failed {
	text-align: center;
	margin-top: 20px;
	display: none;
}

.search-failed.active {
	display: block;
}

.search-failed > ul {
	text-align: left;
	max-width: 570px;
	margin-left: auto;
	margin-right: auto;
}

#titles {
	height: 35px;
}

#titles > button {
	float: left;
	width: 33.3%;
	text-align: center;
	font-size: 1.125rem;
	cursor: pointer;
	border: 0;
	border-top: 2px solid;
}

#titles > button:first-child:last-child {
	margin-right: 1px;
	width: calc(100% - 1px);
}

#titles > button:not(:last-child) {
	margin-right: 1px;
	width: calc(33.3% - 1px);
}

#titles > button > div.count {
	display: inline-block;
	font-size: 1rem;
}

.notable-traits {
	cursor: pointer;
	z-index: 2;
	margin-left: 5px;
}

#sidebar-toggle {
	position: sticky;
	top: 0;
	left: 0;
	font-weight: bold;
	font-size: 1.25rem;
	border-bottom: 1px solid;
	display: flex;
	height: 40px;
	justify-content: center;
	align-items: center;
	z-index: 10;
}
#source-sidebar {
	width: 100%;
	z-index: 1;
	overflow: auto;
}
#source-sidebar > .title {
	font-size: 1.5rem;
	text-align: center;
	border-bottom: 1px solid var(--border-color);
	margin-bottom: 6px;
}
#sidebar-toggle > button {
	background: none;
	color: inherit;
	cursor: pointer;
	text-align: center;
	border: none;
	outline: none;
	position: absolute;
	top: 0;
	bottom: 0;
	left: 0;
	right: 0;
	/* work around button layout strangeness: https://stackoverflow.com/q/7271561 */
	width: 100%;
	/* iOS button gradient: https://stackoverflow.com/q/5438567 */
	-webkit-appearance: none;
	opacity: 1;
}
#settings-menu, #help-button {
	margin-left: 4px;
	outline: none;
}

#settings-menu > a, #help-button > button, #copy-path {
	padding: 5px;
	width: 33px;
	border: 1px solid var(--border-color);
	border-radius: 2px;
	cursor: pointer;
}

#settings-menu > a, #help-button > button {
	padding: 5px;
	height: 100%;
	display: block;
	background-color: var(--button-background-color);
}

#copy-path {
	color: var(--copy-path-button-color);
}
#copy-path > img {
	filter: var(--copy-path-img-filter);
}
#copy-path:hover > img {
	filter: var(--copy-path-img-hover-filter);
}

@keyframes rotating {
	from {
		transform: rotate(0deg);
	}
	to {
		transform: rotate(360deg);
	}
}
#settings-menu.rotate > a img {
	animation: rotating 2s linear infinite;
}

.setting-line .radio-line input:checked {
	box-shadow: inset 0 0 0 3px var(--main-background-color);
	background-color: var(--settings-input-color);
}
.setting-line .radio-line input:focus {
	box-shadow: 0 0 1px 1px var(--settings-input-color);
}
/* In here we combine both `:focus` and `:checked` properties. */
.setting-line .radio-line input:checked:focus {
	box-shadow: inset 0 0 0 3px var(--main-background-color),
		0 0 2px 2px var(--settings-input-color);
}
.setting-line .radio-line input:hover {
	border-color: var(--settings-input-color) !important;
}
input:checked + .slider {
	background-color: var(--settings-input-color);
}

#help-button > button {
	text-align: center;
	/* Rare exception to specifying font sizes in rem. Since this is acting
	   as an icon, it's okay to specify their sizes in pixels. */
	font-size: 20px;
	padding-top: 2px;
}

#copy-path {
	height: 34px;
	background-color: var(--main-background-color);
	margin-left: 10px;
	padding: 0;
	padding-left: 2px;
	border: 0;
}

kbd {
	display: inline-block;
	padding: 3px 5px;
	font: 15px monospace;
	line-height: 10px;
	vertical-align: middle;
	border: solid 1px var(--border-color);
	border-radius: 3px;
	cursor: default;
}

#main-content > ul {
	padding-left: 10px;
}
#main-content > ul > li {
	list-style: none;
}

.non-exhaustive {
	margin-bottom: 1em;
}

details.dir-entry {
	padding-left: 4px;
}

details.dir-entry > summary {
	margin: 0 0 0 13px;
	list-style-position: outside;
	cursor: pointer;
}

details.dir-entry div.folders, details.dir-entry div.files {
	padding-left: 23px;
}

details.dir-entry a {
	display: block;
}

/* The hideme class is used on summary tags that contain a span with
	placeholder text shown only when the toggle is closed. For instance,
	"Expand description" or "Show methods". */
details.rustdoc-toggle > summary.hideme {
	cursor: pointer;
}

details.rustdoc-toggle > summary {
	list-style: none;
}
details.rustdoc-toggle > summary::-webkit-details-marker,
details.rustdoc-toggle > summary::marker {
	display: none;
}

details.rustdoc-toggle > summary.hideme > span {
	margin-left: 9px;
}

details.rustdoc-toggle > summary::before {
	content: "";
	cursor: pointer;
	width: 16px;
	height: 16px;
	background-repeat: no-repeat;
	background-position: top left;
	display: inline-block;
	vertical-align: middle;
	opacity: .5;
}

details.rustdoc-toggle > summary.hideme > span,
details.rustdoc-toggle > summary::before,
.more-examples-toggle summary, .more-examples-toggle .hide-more {
	color: var(--toggles-color);
}

/* Screen readers see the text version at the end the line.
	Visual readers see the icon at the start of the line, but small and transparent. */
details.rustdoc-toggle > summary::after {
	content: "Expand";
	overflow: hidden;
	width: 0;
	height: 0;
	position: absolute;
}

details.rustdoc-toggle > summary.hideme::after {
	/* "hideme" toggles already have a description when they're contracted */
	content: "";
}

details.rustdoc-toggle > summary:focus::before,
details.rustdoc-toggle > summary:hover::before {
	opacity: 1;
}

details.rustdoc-toggle.top-doc > summary,
details.rustdoc-toggle.top-doc > summary::before,
details.rustdoc-toggle.non-exhaustive > summary,
details.rustdoc-toggle.non-exhaustive > summary::before {
	font-size: 1rem;
}

details.non-exhaustive {
	margin-bottom: 8px;
}

details.rustdoc-toggle > summary.hideme::before {
	position: relative;
}

details.rustdoc-toggle > summary:not(.hideme)::before {
	position: absolute;
	left: -24px;
	top: 4px;
}

.impl-items > details.rustdoc-toggle > summary:not(.hideme)::before {
	position: absolute;
	left: -24px;
}

/* When a "hideme" summary is open and the "Expand description" or "Show
	methods" text is hidden, we want the [-] toggle that remains to not
	affect the layout of the items to its right. To do that, we use
	absolute positioning. Note that we also set position: relative
	on the parent <details> to make this work properly. */
details.rustdoc-toggle[open] > summary.hideme {
	position: absolute;
}

details.rustdoc-toggle {
	position: relative;
}

details.rustdoc-toggle[open] > summary.hideme > span {
	display: none;
}

details.rustdoc-toggle[open] > summary::before,
details.rustdoc-toggle[open] > summary.hideme::before {
	background-image: /* AUTOREPLACE: */url("toggle-minus.svg");
}

details.rustdoc-toggle > summary::before {
	background-image: /* AUTOREPLACE: */url("toggle-plus.svg");
}

details.rustdoc-toggle[open] > summary::before,
details.rustdoc-toggle[open] > summary.hideme::before {
	width: 16px;
	height: 16px;
	background-repeat: no-repeat;
	background-position: top left;
	display: inline-block;
	content: "";
}

details.rustdoc-toggle[open] > summary::after,
details.rustdoc-toggle[open] > summary.hideme::after {
	content: "Collapse";
}

/* This is needed in docblocks to have the "▶" element to be on the same line. */
.docblock summary > * {
	display: inline-block;
}

/* Media Queries */

/*
WARNING: RUSTDOC_MOBILE_BREAKPOINT MEDIA QUERY;
If you update this line, then you also need to update the line with the same warning
in storage.js plus the media query with (max-width: 700px)
*/
@media (min-width: 701px) {
	/* In case there is no documentation before a code block, we need to add some margin at the top
	to prevent an overlay between the "collapse toggle" and the information tooltip.
	However, it's not needed with smaller screen width because the doc/code block is always put
	"one line" below. */
	.docblock > .information:first-child > .tooltip {
		margin-top: 16px;
	}

	/* When we expand the sidebar on the source code page, we hide the logo on the left of the
	search bar to have more space. */
	.source-sidebar-expanded .source .sidebar + main .width-limiter .sub-logo-container.rust-logo {
		display: none;
	}

	.source-sidebar-expanded .source .sidebar {
		width: 300px;
	}
}

/*
WARNING: RUSTDOC_MOBILE_BREAKPOINT MEDIA QUERY
If you update this line, then you also need to update the line with the same warning
in storage.js plus the media query with (min-width: 701px)
*/
@media (max-width: 700px) {
	/* When linking to an item with an `id` (for instance, by clicking a link in the sidebar,
	   or visiting a URL with a fragment like `#method.new`, we don't want the item to be obscured
	   by the topbar. Anything with an `id` gets scroll-margin-top equal to .mobile-topbar's size.
	*/
	*[id] {
		scroll-margin-top: 45px;
	}

	.rustdoc {
		padding-top: 0px;
		/* Sidebar should overlay main content, rather than pushing main content to the right.
		   Turn off `display: flex` on the body element. */
		display: block;
	}

	main {
		padding-left: 15px;
		padding-top: 0px;
	}

	.main-heading {
		flex-direction: column;
	}

	.content .out-of-band {
		text-align: left;
		margin-left: initial;
		padding: initial;
	}

	.content .out-of-band .since::before {
		content: "Since ";
	}

	#copy-path {
		display: none;
	}

	/* Hide the logo and item name from the sidebar. Those are displayed
	   in the mobile-topbar instead. */
	.sidebar .sidebar-logo,
	.sidebar .location {
		display: none;
	}

	.sidebar {
		position: fixed;
		top: 45px;
		/* Hide the sidebar offscreen while not in use. Doing this instead of display: none means
		   the sidebar stays visible for screen readers, which is useful for navigation. */
		left: -1000px;
		margin-left: 0;
		margin: 0;
		padding: 0;
		z-index: 11;
		/* Reduce height slightly to account for mobile topbar. */
		height: calc(100vh - 45px);
	}

	/* The source view uses a different design for the sidebar toggle, and doesn't have a topbar,
	   so don't bump down the main content or the sidebar. */
	.source main,
	.rustdoc.source .sidebar {
		top: 0;
		padding: 0;
		height: 100vh;
		border: 0;
	}

	.sidebar.shown,
	.source-sidebar-expanded .source .sidebar,
	.sidebar:focus-within {
		left: 0;
	}

	.rustdoc.source > .sidebar {
		position: fixed;
		margin: 0;
		z-index: 11;
		width: 0;
	}

	.mobile-topbar .location a {
		padding: 0;
		margin: 0;
	}

	.mobile-topbar .location {
		border: none;
		padding: 0;
		margin: auto 0.5em auto auto;
		text-overflow: ellipsis;
		overflow: hidden;
		white-space: nowrap;
		/* Rare exception to specifying font sizes in rem. Since the topbar
		   height is specified in pixels, this also has to be specified in
		   pixels to avoid overflowing the topbar when the user sets a bigger
		   font size. */
		font-size: 24px;
	}

	.mobile-topbar .logo-container {
		max-height: 45px;
	}

	.mobile-topbar .logo-container > img {
		max-width: 35px;
		max-height: 35px;
		margin-left: 20px;
		margin-top: 5px;
		margin-bottom: 5px;
	}

	.mobile-topbar {
		display: flex;
		flex-direction: row;
		position: sticky;
		z-index: 10;
		font-size: 2rem;
		height: 45px;
		width: 100%;
		left: 0;
		top: 0;
	}

	.source .mobile-topbar {
		display: none;
	}

	.sidebar-menu-toggle {
		width: 45px;
		/* Rare exception to specifying font sizes in rem. Since this is acting
		   as an icon, it's okay to specify its sizes in pixels. */
		font-size: 32px;
		border: none;
	}

	.sidebar-elems {
		margin-top: 1em;
		background-color: var(--sidebar-background-color);
	}

	.content {
		margin-left: 0px;
	}

	.source .content {
		margin-top: 10px;
	}

	#search {
		margin-left: 0;
		padding: 0;
	}

	.anchor {
		display: none !important;
	}

	.notable-traits {
		position: absolute;
		left: -22px;
		top: 24px;
	}

	#titles > button > div.count {
		float: left;
		width: 100%;
	}

	#titles {
		height: 50px;
	}

	/* Because of ios, we need to actually have a full height sidebar title so the
	 * actual sidebar can show up. But then we need to make it transparent so we don't
	 * hide content. The filler just allows to create the background for the sidebar
	 * title. But because of the absolute position, I had to lower the z-index.
	 */
	#sidebar-filler {
		position: fixed;
		left: 45px;
		width: calc(100% - 45px);
		top: 0;
		height: 45px;
		z-index: -1;
		border-bottom: 1px solid;
	}

	#main-content > details.rustdoc-toggle > summary::before,
	#main-content > div > details.rustdoc-toggle > summary::before {
		left: -11px;
	}

	#sidebar-toggle {
		position: fixed;
		left: 1px;
		top: 100px;
		width: 30px;
		font-size: 1.5rem;
		text-align: center;
		padding: 0;
		z-index: 10;
		border-top-right-radius: 3px;
		border-bottom-right-radius: 3px;
		cursor: pointer;
		font-weight: bold;
		border: 1px solid;
		border-left: 0;
	}

	.source-sidebar-expanded #sidebar-toggle {
		left: unset;
		top: unset;
		width: unset;
		border-top-right-radius: unset;
		border-bottom-right-radius: unset;
		position: sticky;
		border: 0;
		border-bottom: 1px solid;
	}

	#source-sidebar {
		z-index: 11;
	}

	#main-content > .line-numbers {
		margin-top: 0;
	}

	.notable-traits .notable-traits-tooltiptext {
		left: 0;
		top: 100%;
	}

	/* We don't display the help button on mobile devices. */
	#help-button {
		display: none;
	}

	/* Display an alternating layout on tablets and phones */
	.item-table {
		display: block;
	}
	.item-row {
		display: flex;
		flex-flow: column wrap;
	}
	.item-left, .item-right {
		width: 100%;
	}

	/* Display an alternating layout on tablets and phones */
	.search-results > a {
		border-bottom: 1px solid #aaa9;
		padding: 5px 0px;
	}
	.search-results .result-name, .search-results div.desc, .search-results .result-description {
		width: 100%;
	}
	.search-results div.desc, .search-results .result-description, .item-right {
		padding-left: 2em;
	}

	.source-sidebar-expanded .source .sidebar {
		max-width: 100vw;
		width: 100vw;
	}

	/* Position of the "[-]" element. */
	details.rustdoc-toggle:not(.top-doc) > summary {
		margin-left: 10px;
	}
	.impl-items > details.rustdoc-toggle > summary:not(.hideme)::before,
	#main-content > details.rustdoc-toggle:not(.top-doc) > summary::before,
	#main-content > div > details.rustdoc-toggle > summary::before {
		left: -11px;
	}

	/* Align summary-nested and unnested item-info gizmos. */
	.content .impl-items > .item-info {
		margin-left: 34px;
	}
}

@media print {
	nav.sidebar, nav.sub, .content .out-of-band, a.srclink, #copy-path,
	details.rustdoc-toggle[open] > summary::before, details.rustdoc-toggle > summary::before,
	details.rustdoc-toggle.top-doc > summary {
		display: none;
	}

	.docblock {
		margin-left: 0;
	}

	main {
		padding: 10px;
	}
}

@media (max-width: 464px) {
	#titles, #titles > button {
		height: 73px;
	}

	#crate-search {
		border-radius: 4px;
	}

	.docblock {
		margin-left: 12px;
	}

	.docblock code {
		overflow-wrap: break-word;
		overflow-wrap: anywhere;
	}

	.sub-container {
		flex-direction: column;
	}

	.sub-logo-container {
		align-self: center;
	}

	.source .sub-logo-container > img {
		height: 35px;
		width: 35px;
	}

	#sidebar-toggle {
		top: 10px;
	}
	.source-sidebar-expanded #sidebar-toggle {
		top: unset;
	}
}

.method-toggle summary,
.implementors-toggle summary,
.impl {
	margin-bottom: 0.75em;
}

.method-toggle[open] {
	margin-bottom: 2em;
}

.implementors-toggle[open]  {
	margin-bottom: 2em;
}

#trait-implementations-list .method-toggle,
#synthetic-implementations-list .method-toggle,
#blanket-implementations-list .method-toggle {
	margin-bottom: 1em;
}

/* Begin: styles for --scrape-examples feature */

.scraped-example-list .scrape-help {
	margin-left: 10px;
	padding: 0 4px;
	font-weight: normal;
	font-size: 12px;
	position: relative;
	bottom: 1px;
	background: transparent;
	border-width: 1px;
	border-style: solid;
	border-radius: 50px;
}

.scraped-example .code-wrapper {
	position: relative;
	display: flex;
	flex-direction: row;
	flex-wrap: wrap;
	width: 100%;
}

.scraped-example:not(.expanded) .code-wrapper {
	max-height: 240px;
}

.scraped-example:not(.expanded) .code-wrapper pre {
	overflow-y: hidden;
	max-height: 240px;
	padding-bottom: 0;
}

.scraped-example:not(.expanded) .code-wrapper pre.line-numbers {
	overflow-x: hidden;
}

.scraped-example .code-wrapper .prev {
	position: absolute;
	top: 0.25em;
	right: 2.25em;
	z-index: 100;
	cursor: pointer;
}

.scraped-example .code-wrapper .next {
	position: absolute;
	top: 0.25em;
	right: 1.25em;
	z-index: 100;
	cursor: pointer;
}

.scraped-example .code-wrapper .expand {
	position: absolute;
	top: 0.25em;
	right: 0.25em;
	z-index: 100;
	cursor: pointer;
}

.scraped-example:not(.expanded) .code-wrapper:before {
	content: " ";
	width: 100%;
	height: 5px;
	position: absolute;
	z-index: 100;
	top: 0;
}

.scraped-example:not(.expanded) .code-wrapper:after {
	content: " ";
	width: 100%;
	height: 5px;
	position: absolute;
	z-index: 100;
	bottom: 0;
}

.scraped-example .code-wrapper .line-numbers {
	margin: 0;
	padding: 14px 0;
}

.scraped-example .code-wrapper .line-numbers span {
	padding: 0 14px;
}

.scraped-example .code-wrapper .example-wrap {
	flex: 1;
	overflow-x: auto;
	overflow-y: hidden;
	margin-bottom: 0;
}

.scraped-example:not(.expanded) .code-wrapper .example-wrap {
	overflow-x: hidden;
}

.scraped-example .code-wrapper .example-wrap pre.rust {
	overflow-x: inherit;
	width: inherit;
	overflow-y: hidden;
}


.more-examples-toggle {
	max-width: calc(100% + 25px);
	margin-top: 10px;
	margin-left: -25px;
}

.more-examples-toggle .hide-more {
	margin-left: 25px;
	margin-bottom: 5px;
	cursor: pointer;
}

.more-scraped-examples {
	margin-left: 5px;
	display: flex;
	flex-direction: row;
}

.more-scraped-examples-inner {
	/* 20px is width of toggle-line + toggle-line-inner */
	width: calc(100% - 20px);
}

.toggle-line {
	align-self: stretch;
	margin-right: 10px;
	margin-top: 5px;
	padding: 0 4px;
	cursor: pointer;
}

.toggle-line-inner {
	min-width: 2px;
	height: 100%;
}

.more-scraped-examples .scraped-example {
	margin-bottom: 20px;
}

.more-scraped-examples .scraped-example:last-child {
	margin-bottom: 0;
}

.example-links a {
	margin-top: 20px;
}

.example-links ul {
	margin-bottom: 0;
}

/* End: styles for --scrape-examples feature */