/* Base reset */
html, body {
	margin: 0;
	padding: 0;
}

body, h1, h2, h3, h4, h5, h6, p, blockquote, pre, ul, ol, li, dl, dt, dd {
	margin: 0;
	padding: 0;
}

h1, h2, h3, h4, h5, h6 {
	font-size: 100%;
	font-weight: normal;
}

ul, ol {
	padding: 0;
}

img {
	border: 0;
}

table {
	border-collapse: collapse;
	border-spacing: 0;
}

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

pre, code, kbd, samp, tt {
	font-family: Consolas, Menlo, Monaco, monospace;
	font-size: 1em;
}

:root {
	--text-color: #192943;
	--muted-color: #919191;
}

body {
	font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
	font-size: 100%;
	line-height: 150%;
	text-align: center;
	color: var(--text-color);
}

.header ul, .header li,
.toc ul, .toc ol, .toc li {
	list-style: none;
	margin: 0;
	padding: 0;
}

.muted, .footer, .breadcrumb {
	color: var(--muted-color);
}

strong {
	font-weight: bold;
}

em {
	font-style: oblique;
}

.content ol > li {
	list-style-type: decimal;
	margin-left: 28px;
	margin-bottom: 8px;
}

.content ul > li {
	list-style-type: disc;
	margin-left: 28px;
	margin-bottom: 8px;
}

.content li ul li {
	list-style: circle;
}

a {
	text-decoration: none;
	color: #0969DA;
}

.content a:hover {
	text-decoration: underline;
}


.content a:visited {
	/* color: #8b09da; */
}

h1 {
	font-size: 200%;
	margin-top: 10px;
	margin-bottom: 0.7rem;

}

.entry-head {
	margin-bottom: 1rem;
}

.entry-head > h1 {
	margin-bottom: 0.25rem;
}

div.meta {
	font-size: 85%;
	color: var(--muted-color);
	margin-top: 0.35rem;
}

div.meta::before {
	content: "";
	display: inline-block;
	width: 1.1rem;
	height: 1.1rem;
	margin-right: 0.45rem;
	background-color: #37527f;
	mask-image: url('/rez/ico/calendar.svg');
	-webkit-mask-image: url('/rez/ico/calendar.svg');
	mask-repeat: no-repeat;
	-webkit-mask-repeat: no-repeat;
	mask-size: contain;
	-webkit-mask-size: contain;
	vertical-align: text-bottom;
}

body.type-cookbook div.meta.pubdate {
	display: none;
}

h2 {
	font-size: 180%;
	margin-top: 3rem;
	margin-bottom: 0.7rem;
}

h3 {
	font-size: 145%;
	margin-top: 3rem;
	margin-bottom: 0.7rem;
}

.toc.box h3 {
	margin-top: 1rem;
}

div.wrap {
	margin-left: auto;
	margin-right: auto;
	width: 1100px;
	text-align: left;
	text-wrap: pretty;
}

.header h4 a {
	font-size: 180%;
	line-height: 12px;
	display: block;
	margin-right: 15px;
}

hr {
	margin-top: 30px;
	margin-bottom: 30px;
	border: 0;
	border-top: 1px solid #ccc;
}

.header {
	margin-top:10px;
	background-color: #37527f;
	border-radius: 4px;
	height: 40px;
	padding-left: 10px;
}

.header .nav-sections > ul > li {
	float: left;
}

.header .nav-sections > ul > li + li {
	border-left: 1px solid #37527f;
}

.header .nav-sections li  a {
	color: #fff;
	text-decoration: none;	
	padding: 5px;
	padding-top: 10px;
	padding-bottom: 10px;
	display: block;
	height: 20px;
}

body.n1-home .n1-home a, body.n1-news .n1-news a, body.n1-bugs .n1-bugs a, body.n1-discussion .n1-discussion a, body.n1-download .n1-download a, body.n1-api .n1-api a, body.n1-cookbook .n1-cookbook a, body.n1-try .n1-try a {
	background-color: #416196;
}

.header .nav-sections a:hover{
	color: #fff;
	text-decoration: none;
	background-color: #476aa2;
}

.breadcrumb {
	margin-left: 10px;
	margin-right:  10px;
	padding: 5px;
	background-color: #f1f0f2;
	border-radius: 0 0 4px 4px;
	font-size: 85%;
}

.breadcrumb a {
	color: var(--muted-color);
}

.breadcrumb .seperator {
	margin-left: 2px;
	margin-right: 2px;
}

.footer {
	clear: both;
	margin-left: 10px;
	margin-right:  10px;
	margin-top: 60px;
	padding: 5px;
	background-color: #f1f0f2;
	color: #808080;
	border-radius: 4px 4px 0 0;
	font-size: 75%;
}

.footer a {
	color: #606060;	
}

.content {
	clear:both;	
	margin-left: 10px;
}

.content .col1 {
	width: 800px;
	float: left;
	margin-bottom: 60px;
	padding-top: 16px;
}


.content .col2 {
	float: left;
	margin-left: 15px;
	width: 265px;
	margin-bottom: 15px;
	padding-top: 16px;
	text-wrap: balance;
}

.content p {
	margin-bottom: 14px;
}

.content pre  {
	font-family: Consolas, monospace;
	background-color: #f2f4f8;
	padding: 10px;
	margin-bottom: 10px;
	overflow: auto;
	border-radius: 2px;
	line-height: 140%;
}

.content pre.chroma {
	padding-top: 6px;
	padding-bottom: 6px;
}

.content p code, .content li code {
	font-size: 15px;
	font-family: Consolas, monospace;
	background-color: #f2f4f8;
	padding: 0px;
	padding-left:2px;
	padding-right:2px;
	margin-left: -1px;
	margin-right: -1px;
	border-radius: 2px;
}

.content pre code {
	font-size: 15px;
	font-family: Consolas, monospace;
	background-color: transparent;
	padding: 0;
	margin: 0;
	border-radius: 0;
}

.content p code a {
	text-decoration: none;
}

blockquote {
    background-color: #f2f4f8;
    border-radius: 4px;
    margin-left: 2rem;
    border-left: 4px solid #3e6ab4;
    margin-bottom: 1rem;
    border-radius: 0 4px 4px 0;
}
blockquote p {
	padding: 1rem;
}
blockquote pre {
	font-size: 15px;
	font-family: Consolas, monospace;
	background-color: #f2f4f8;
}

.box {
	background-color: #f1f0f2;
	border-radius: 4px;
	padding: 5px;
	margin-top: 10px;
}

.box h2 {
	margin-top: 0px;
}

.col2 {
	font-size: 90%;
}

.col2 .toc li {
	list-style-type: none;
	margin-left: 0.8rem;
}

.badge {
	display: block;
	float: right;
	margin-left: 1rem;
	margin-bottom: 0.7rem;
}

.badge-html5 {
  background: url('html5-logo.svg');
	width: 100px; height: 100px;
}

.badge-os {
  background: url('osi-logo.svg');
  background-size: 100px;
	width: 100px; height: 138.8px;
}

.badge-gh {
  background: url('github-logo.svg');
	width: 84px; height: 82.2px;
	margin-right: 4px;
}


@media (max-width: 1110px) {
	h1 {
		line-height: 130%;
	}
	.header {
		overflow: auto;
		height: auto;
		margin-left: 10px;
		margin-right: 10px;
	}
	
	div.wrap {
		width: 100%;
	}
	
	.content .col1 {
		width: 95%;
		margin-bottom: 0;
	}

	.content .col2 {
		width: auto;
	}
	
	.breadcrumb {
		clear: both;
		margin-left: 20px;
		margin-right: 20px;
	}
	
	.header .nav-sections > ul > li + li {
		border-left: 0px;
	}
	
	.content .col2 {
		margin-bottom: 10px;
	}
}

/* dark mode */
@media (prefers-color-scheme: dark) {
	:root {
		--text-color: #f0f6fc;
		--muted-color: #c6d0db;
	}

  html, body {
      background-color: #162234;
  }

	a, .footer a, .breadcrumb a {
		color: #5bb3f4;
	}

	a:visited {
		color: #4493f8;
	}

	.breadcrumb, .footer {
		color: #c6d0db;
		background-color: #2e4364;
	}

	.header {
		background-color: #314d79;
	}

	.header .nav-sections > ul > li + li {
		border-left: 1px solid #314d79;
	}

	.box, .content pre {
		background-color: #223654;
	}

	.content p code, .content li code, blockquote {
		background-color: #223654;
	}

	blockquote {
		border-left-color: #4367a0;
	}

	.badge-html5 {
	  background: url('html5-logo-dark.svg');
	}

	.badge-os {
	  background: url('osi-logo-dark.svg');
	  background-size: 100px;
	}

	.badge-gh {
	  background: url('github-logo-dark.svg');
	}
}

/*
If you want this size in pixels (px)	Declare this percent (%)
10	 77
11	 85
12	 93 (was 93)
13	 100
14	 108 (was 107)
15	 116 (was 114)
16	 123.1 (was 122)
17	 131 (was 129)
18	 138.5 (was 136)
19	 146.5 (was 144)
20	 153.9 (was 152)
21	 161.6 (was 159)
22	 167
23	 174
24	 182
25	 189
26	 197
*/

/* Syntax highlighting, light (theme monokailight): */
@media (prefers-color-scheme: light) {
    /* PreWrapper */ .chroma { color: #272822; background-color: #fafafa; }
    /* Error */ .chroma .err { color: #960050; background-color: #1e0010 }
    /* LineLink */ .chroma .lnlinks { outline: none; text-decoration: none; color: inherit }
    /* LineTableTD */ .chroma .lntd { vertical-align: top; padding: 0; margin: 0; border: 0; }
    /* LineTable */ .chroma .lntable { border-spacing: 0; padding: 0; margin: 0; border: 0; }
    /* LineHighlight */ .chroma .hl { background-color: #e1e1e1 }
    /* LineNumbersTable */ .chroma .lnt { white-space: pre; -webkit-user-select: none; user-select: none; margin-right: 0.4em; padding: 0 0.4em 0 0.4em;color: #7f7f7f }
    /* LineNumbers */ .chroma .ln { white-space: pre; -webkit-user-select: none; user-select: none; margin-right: 0.4em; padding: 0 0.4em 0 0.4em;color: #7f7f7f }
    /* Line */ .chroma .line { display: flex; }
    /* Keyword */ .chroma .k { color: #00a8c8 }
    /* KeywordConstant */ .chroma .kc { color: #00a8c8 }
    /* KeywordDeclaration */ .chroma .kd { color: #00a8c8 }
    /* KeywordNamespace */ .chroma .kn { color: #f92672 }
    /* KeywordPseudo */ .chroma .kp { color: #00a8c8 }
    /* KeywordReserved */ .chroma .kr { color: #00a8c8 }
    /* KeywordType */ .chroma .kt { color: #00a8c8 }
    /* Name */ .chroma .n { color: #111111 }
    /* NameAttribute */ .chroma .na { color: #75af00 }
    /* NameClass */ .chroma .nc { color: #75af00 }
    /* NameConstant */ .chroma .no { color: #00a8c8 }
    /* NameDecorator */ .chroma .nd { color: #75af00 }
    /* NameEntity */ .chroma .ni { color: #111111 }
    /* NameException */ .chroma .ne { color: #75af00 }
    /* NameLabel */ .chroma .nl { color: #111111 }
    /* NameNamespace */ .chroma .nn { color: #111111 }
    /* NameOther */ .chroma .nx { color: #75af00 }
    /* NameProperty */ .chroma .py { color: #111111 }
    /* NameTag */ .chroma .nt { color: #f92672 }
    /* NameBuiltin */ .chroma .nb { color: #111111 }
    /* NameBuiltinPseudo */ .chroma .bp { color: #111111 }
    /* NameVariable */ .chroma .nv { color: #111111 }
    /* NameVariableClass */ .chroma .vc { color: #111111 }
    /* NameVariableGlobal */ .chroma .vg { color: #111111 }
    /* NameVariableInstance */ .chroma .vi { color: #111111 }
    /* NameVariableMagic */ .chroma .vm { color: #111111 }
    /* NameFunction */ .chroma .nf { color: #75af00 }
    /* NameFunctionMagic */ .chroma .fm { color: #75af00 }
    /* Literal */ .chroma .l { color: #ae81ff }
    /* LiteralDate */ .chroma .ld { color: #d88200 }
    /* LiteralString */ .chroma .s { color: #d88200 }
    /* LiteralStringAffix */ .chroma .sa { color: #d88200 }
    /* LiteralStringBacktick */ .chroma .sb { color: #d88200 }
    /* LiteralStringChar */ .chroma .sc { color: #d88200 }
    /* LiteralStringDelimiter */ .chroma .dl { color: #d88200 }
    /* LiteralStringDoc */ .chroma .sd { color: #d88200 }
    /* LiteralStringDouble */ .chroma .s2 { color: #d88200 }
    /* LiteralStringEscape */ .chroma .se { color: #8045ff }
    /* LiteralStringHeredoc */ .chroma .sh { color: #d88200 }
    /* LiteralStringInterpol */ .chroma .si { color: #d88200 }
    /* LiteralStringOther */ .chroma .sx { color: #d88200 }
    /* LiteralStringRegex */ .chroma .sr { color: #d88200 }
    /* LiteralStringSingle */ .chroma .s1 { color: #d88200 }
    /* LiteralStringSymbol */ .chroma .ss { color: #d88200 }
    /* LiteralNumber */ .chroma .m { color: #ae81ff }
    /* LiteralNumberBin */ .chroma .mb { color: #ae81ff }
    /* LiteralNumberFloat */ .chroma .mf { color: #ae81ff }
    /* LiteralNumberHex */ .chroma .mh { color: #ae81ff }
    /* LiteralNumberInteger */ .chroma .mi { color: #ae81ff }
    /* LiteralNumberIntegerLong */ .chroma .il { color: #ae81ff }
    /* LiteralNumberOct */ .chroma .mo { color: #ae81ff }
    /* Operator */ .chroma .o { color: #f92672 }
    /* OperatorWord */ .chroma .ow { color: #f92672 }
    /* Punctuation */ .chroma .p { color: #111111 }
    /* Comment */ .chroma .c { color: #75715e }
    /* CommentHashbang */ .chroma .ch { color: #75715e }
    /* CommentMultiline */ .chroma .cm { color: #75715e }
    /* CommentSingle */ .chroma .c1 { color: #75715e }
    /* CommentSpecial */ .chroma .cs { color: #75715e }
    /* CommentPreproc */ .chroma .cp { color: #75715e }
    /* CommentPreprocFile */ .chroma .cpf { color: #75715e }
    /* GenericEmph */ .chroma .ge { font-style: italic }
    /* GenericStrong */ .chroma .gs { font-weight: bold }
}

/* Syntax highlighting, dark mode (theme monokai): */
@media (prefers-color-scheme: dark) {
    /* PreWrapper */ .chroma { color: #f8f8f2; background-color: #272822; }
    /* Error */ .chroma .err { color: #960050; background-color: #1e0010 }
    /* LineLink */ .chroma .lnlinks { outline: none; text-decoration: none; color: inherit }
    /* LineTableTD */ .chroma .lntd { vertical-align: top; padding: 0; margin: 0; border: 0; }
    /* LineTable */ .chroma .lntable { border-spacing: 0; padding: 0; margin: 0; border: 0; }
    /* LineHighlight */ .chroma .hl { background-color: #3c3d38 }
    /* LineNumbersTable */ .chroma .lnt { white-space: pre; -webkit-user-select: none; user-select: none; margin-right: 0.4em; padding: 0 0.4em 0 0.4em;color: #7f7f7f }
    /* LineNumbers */ .chroma .ln { white-space: pre; -webkit-user-select: none; user-select: none; margin-right: 0.4em; padding: 0 0.4em 0 0.4em;color: #7f7f7f }
    /* Line */ .chroma .line { display: flex; }
    /* Keyword */ .chroma .k { color: #66d9ef }
    /* KeywordConstant */ .chroma .kc { color: #66d9ef }
    /* KeywordDeclaration */ .chroma .kd { color: #66d9ef }
    /* KeywordNamespace */ .chroma .kn { color: #f92672 }
    /* KeywordPseudo */ .chroma .kp { color: #66d9ef }
    /* KeywordReserved */ .chroma .kr { color: #66d9ef }
    /* KeywordType */ .chroma .kt { color: #66d9ef }
    /* NameAttribute */ .chroma .na { color: #a6e22e }
    /* NameClass */ .chroma .nc { color: #a6e22e }
    /* NameConstant */ .chroma .no { color: #66d9ef }
    /* NameDecorator */ .chroma .nd { color: #a6e22e }
    /* NameException */ .chroma .ne { color: #a6e22e }
    /* NameOther */ .chroma .nx { color: #a6e22e }
    /* NameTag */ .chroma .nt { color: #f92672 }
    /* NameFunction */ .chroma .nf { color: #a6e22e }
    /* NameFunctionMagic */ .chroma .fm { color: #a6e22e }
    /* Literal */ .chroma .l { color: #ae81ff }
    /* LiteralDate */ .chroma .ld { color: #e6db74 }
    /* LiteralString */ .chroma .s { color: #e6db74 }
    /* LiteralStringAffix */ .chroma .sa { color: #e6db74 }
    /* LiteralStringBacktick */ .chroma .sb { color: #e6db74 }
    /* LiteralStringChar */ .chroma .sc { color: #e6db74 }
    /* LiteralStringDelimiter */ .chroma .dl { color: #e6db74 }
    /* LiteralStringDoc */ .chroma .sd { color: #e6db74 }
    /* LiteralStringDouble */ .chroma .s2 { color: #e6db74 }
    /* LiteralStringEscape */ .chroma .se { color: #ae81ff }
    /* LiteralStringHeredoc */ .chroma .sh { color: #e6db74 }
    /* LiteralStringInterpol */ .chroma .si { color: #e6db74 }
    /* LiteralStringOther */ .chroma .sx { color: #e6db74 }
    /* LiteralStringRegex */ .chroma .sr { color: #e6db74 }
    /* LiteralStringSingle */ .chroma .s1 { color: #e6db74 }
    /* LiteralStringSymbol */ .chroma .ss { color: #e6db74 }
    /* LiteralNumber */ .chroma .m { color: #ae81ff }
    /* LiteralNumberBin */ .chroma .mb { color: #ae81ff }
    /* LiteralNumberFloat */ .chroma .mf { color: #ae81ff }
    /* LiteralNumberHex */ .chroma .mh { color: #ae81ff }
    /* LiteralNumberInteger */ .chroma .mi { color: #ae81ff }
    /* LiteralNumberIntegerLong */ .chroma .il { color: #ae81ff }
    /* LiteralNumberOct */ .chroma .mo { color: #ae81ff }
    /* Operator */ .chroma .o { color: #f92672 }
    /* OperatorWord */ .chroma .ow { color: #f92672 }
    /* Comment */ .chroma .c { color: #75715e }
    /* CommentHashbang */ .chroma .ch { color: #75715e }
    /* CommentMultiline */ .chroma .cm { color: #75715e }
    /* CommentSingle */ .chroma .c1 { color: #75715e }
    /* CommentSpecial */ .chroma .cs { color: #75715e }
    /* CommentPreproc */ .chroma .cp { color: #75715e }
    /* CommentPreprocFile */ .chroma .cpf { color: #75715e }
    /* GenericDeleted */ .chroma .gd { color: #f92672 }
    /* GenericEmph */ .chroma .ge { font-style: italic }
    /* GenericInserted */ .chroma .gi { color: #a6e22e }
    /* GenericStrong */ .chroma .gs { font-weight: bold }
    /* GenericSubheading */ .chroma .gu { color: #75715e }
}