:root {
        --hairline: 1px;
	--menu: #A03300;
	--menu-border: #301000;
        --menu-highlight: #FFA000;
        --heading: #C04C00;
        --side-header: #F60;
        --side-border: #803300;
        --ref-border: #000;
        --alternate-row: #EEE;
        --groove: #C0C0C0;
}
.dark {
	--menu: #A03300;
	--menu-border: #301000;
        --menu-highlight: #610;
        --heading: #F84;
        --side-header: #A41;
        --side-border: #D62;
        --ref-border: #FFF;
        --alternate-row: #333;
        --groove: #777;
}
.dark img.light, img.dark {
	display: none;
}
.dark img.dark {
	display: block;
}
@media (resolution: 1.25dppx) { :root { --hairline: 0.8px; } }
@media (resolution: 1.5dppx)  { :root { --hairline: calc(1px / 1.5); } }
@media (resolution: 1.75dppx) { :root { --hairline: calc(2px / 1.75); } }
@media (resolution: 2.25dppx) { :root { --hairline: calc(2px / 2.25); } }
@media (resolution: 2.5dppx)  { :root { --hairline: calc(2px / 2.5); } }
@media (resolution: 3.5dppx)  { :root { --hairline: calc(3px / 3.5); } }
body {
	background-color: #FFF;
	margin: 0;
	padding: 0;
}
.dark body {
	background-color: #1C1C1C;
	color: #FFF;
}
div#top {
	background-color: var(--menu);
	background-image: url(img/header100.png);
	background-position: top center;
	background-repeat: repeat-x;
	background-size: 2160px 108px;
	margin: 0;
	height: 108px;
	width: 100%;
}
div.bulb {
	width: 100%;
}
#bulb {
	position: absolute;
	padding: 6px;
	padding-left: 5px;
	right: 20px;
	background-color: var(--menu);
	border: var(--hairline) solid var(--menu-border);
}
#bulb:hover {
	background-color: var(--menu-highlight);
}
@media (min-width: 415px) {
	#bulb {
		top: 12px;
		box-shadow: 0 0 9px 9px rgba(255, 255, 255, 0.33);
	}
	.dark #bulb {
		box-shadow: 0 0 9px 9px rgba(0, 0, 0, 0.33);
	}
}
@media (max-width: 414px) {
	div#top {
		display: none;
	}
	div.bulb {
		position: relative;
	}
	#bulb {
		right: 0px;
		bottom: 6px;
	}
}
@media (min-resolution: 1.25dppx) and (min-width: 864px) {
	div#top { background-image: url(img/header125.png); }
}
@media (min-resolution: 1.5dppx) and (min-width: 864px) {
	div#top { background-image: url(img/header150.png); }
}
@media (min-resolution: 1.75dppx) and (min-width: 864px) {
	div#top { background-image: url(img/header175.png); }
}
@media (min-resolution: 2dppx) and (min-width: 864px) {
	div#top { background-image: url(img/header200.png); }
}
@media (min-resolution: 2.25dppx) and (min-width: 864px) {
	div#top { background-image: url(img/header225.png); }
}
@media (min-resolution: 2.5dppx) and (min-width: 864px) {
	div#top { background-image: url(img/header250.png); }
}
@media (min-resolution: 3dppx) and (min-width: 864px) {
	div#top { background-image: url(img/header300.png); }
}
@media (max-width: 863px) {
	div#top {
		background-image: url(img/headershort100.png);
		background-size: 900px 108px;
	}
}
@media (min-resolution: 1.25dppx) and (max-width: 863px) {
	div#top { background-image: url(img/headershort125.png); }
}
@media (min-resolution: 1.5dppx) and (max-width: 863px) {
	div#top { background-image: url(img/headershort150.png); }
}
@media (min-resolution: 1.75dppx) and (max-width: 863px) {
	div#top { background-image: url(img/headershort175.png); }
}
@media (min-resolution: 2dppx) and (max-width: 863px) {
	div#top { background-image: url(img/headershort200.png); }
}
@media (min-resolution: 2.25dppx) and (max-width: 863px) {
	div#top { background-image: url(img/headershort225.png); }
}
@media (min-resolution: 2.5dppx) and (max-width: 863px) {
	div#top { background-image: url(img/headershort250.png); }
}
@media (min-resolution: 3dppx) and (max-width: 863px) {
	div#top { background-image: url(img/headershort300.png); }
}
@media (min-resolution: 3.5dppx) and (max-width: 863px) {
	div#top { background-image: url(img/headershort350.png); }
}
@media (min-resolution: 4dppx) and (max-width: 863px) {
	div#top { background-image: url(img/headershort400.png); }
}
#btntop {
	background-color: #E0E0E0;
	width: 100%;
	font-family: Arial, Helvetica, sans-serif;
	border-top: var(--hairline) solid #111;
	border-bottom: var(--hairline) solid #111;
	display: flex;
	justify-content: center;
}
.dark #btntop {
	background-color: #333;
}
#btngrid {
	display: grid;
	grid-template-columns: repeat(6, 1fr);
	row-gap: var(--hairline);
	background-color: var(--menu-border);
	border-right: var(--hairline) solid var(--menu-border);
}
#btngrid div {
	width: 126px;
	box-sizing: border-box;
	padding: 0;
	text-align: center;
	background-color: var(--menu);
	border-left: var(--hairline) solid var(--menu-border);
}
#btngrid a {
	text-decoration: none;
	background: none;
	font-size: 14px;
	line-height: 22px;
	font-weight: normal;
}
#btngrid a:link, #btngrid a:visited, #btngrid a:hover, #btngrid a:active {
	color: #FFF;
}
#btngrid a div:hover {
	background-color: var(--menu-highlight);
}
@media (min-width: 864px) {
	#btngrid div {
		width: 144px;
	}
}
@media (max-width: 756px) {
	#btngrid {
		grid-template-columns: 1fr 1fr 1fr;
	}
}
@media (max-width: 378px) {
	#btngrid {
		grid-template-columns: 1fr 1fr;
	}
}
@media (max-width: 252px) {
	#btngrid {
		grid-template-columns: 1fr;
	}
}
div.topad {
	margin: 20px 0 30px;
	height: 150px;
}
#contents {
	display: flex;
	justify-content: center;
}
div.bodytext {
	margin: 0 10px;
	overflow: hidden;
}
@media (min-width: 748px) {
	div.bodytext {
		width: 728px;
	}
}
@media (max-width: 747px) {
	#contents {
		display: block;
		justify-content: flex-start;
	}
}
@media (max-width: 500px) {
	div.bodytext {
		margin: 0 5px;
	}
}
@media (max-width: 252px) {
	div.bodytext {
		margin: 0;
	}
}
#tableflavor {
	max-width: 1456px;
	margin: 10px;
}
div#copyright {
	padding: 10px 0;
	margin-top: 20px;
	border-top: groove var(--groove) 2px;
}
div#side {
	padding: 0 10px;
}
#cntmobi {
	display: none;
}
@media (max-width: 1023px) {
	div#side {
		display: none;
	}
	#cntmobi {
		display: block;
		margin-top: 20px;
	}
	#cntmobi p {
		line-height: 24px;
		text-align: center;
	}
	#cntmobi a {
		white-space: nowrap;
	}
}
@media (max-width: 660px) {
	div.topad {
		height: 95px !important;
	}
	#tableflavor, #tableflavor tbody {
		display: block;
	}
	#tableflavor tr {
		display: flex;
		flex-wrap: wrap;
	}
	#tableflavor td, #tableflavor th {
		display: block;
		box-sizing: border-box;
		width: 15%;
	}
	#tableflavor td:nth-child(1), #tableflavor th:nth-child(1) {
		width: 30%;
	}
	#tableflavor td:nth-child(2), #tableflavor th:nth-child(2) {
		width: 70%;
		border-right: 0;
	}
	#tableflavor td:nth-child(3), #tableflavor th:nth-child(3) {
		width: 100%;
		border-right: 0;
	}
	#tableflavor td:nth-child(4), #tableflavor th:nth-child(4) {
		width: 70%;
		border-right: 0;
	}
	#tableflavor tr:nth-child(even) {
		background-color: var(--alternate-row);
	}
	#tableflavor td:nth-child(n+4), #tableflavor tr:nth-child(1) th:nth-child(n+4) {
		border-bottom: solid var(--ref-border) 2px;
	}
	#tableflavor tr:last-child th:nth-child(n+4) {
		border-bottom: 0;
	}
	#tableflavor td:nth-child(n+5), #tableflavor th:nth-child(n+5) {
		border-left: var(--hairline) solid var(--ref-border);
		border-right: 0;
	}
}
@media (max-width: 550px) {
	#boostdiff, #boostdiff tbody {
		display: block;
	}
	#boostdiff tr {
		display: flex;
		flex-wrap: wrap;
	}
	#boostdiff td, #boostdiff th {
		display: block;
		box-sizing: border-box;
		width: 25%;
	}
	#boostdiff td:nth-child(1), #boostdiff th:nth-child(1) {
		width: 100%;
		border-right: 0;
	}
	#boostdiff td:last-child, #boostdiff th:last-child {
		border-right: 0;
	}
	#boostdiff tr:nth-child(even) {
		background-color: var(--alternate-row);
	}
	#boostdiff td:nth-child(n+2), #boostdiff tr:nth-child(1) th:nth-child(n+2) {
		border-bottom: solid var(--ref-border) 2px;
	}
	#boostdiff tr:last-child th:nth-child(n+2) {
		border-bottom: 0;
	}
}
@media (max-width: 690px) {
	#posixbrackets, #posixbrackets tbody {
		display: block;
	}
	#posixbrackets tr {
		display: flex;
		flex-wrap: wrap;
	}
	#posixbrackets td, #posixbrackets th {
		display: block;
		box-sizing: border-box;
	}
	#posixbrackets td:nth-child(1), #posixbrackets th:nth-child(1) {
		width: 96px;
		order: 1;
	}
	#posixbrackets td:nth-child(2), #posixbrackets th:nth-child(2) {
		width: calc(100% - 96px);
		border-right: 0;
		order: 2;
	}
	#posixbrackets td:nth-child(3), #posixbrackets th:nth-child(3) {
		width: calc(100% - 96px);
		order: 3;
	}
	#posixbrackets td:nth-child(4), #posixbrackets th:nth-child(4) {
		width: calc(100% - 96px);
		order: 5;
		border-bottom: solid var(--ref-border) 2px;
	}
	#posixbrackets td:nth-child(5), #posixbrackets th:nth-child(5) {
		width: 96px;
		border-right: 0;
		order: 4;
	}
	#posixbrackets td:nth-child(6), #posixbrackets th:nth-child(6) {
		width: 96px;
		border-right: 0;
		order: 6;
		border-bottom: solid var(--ref-border) 2px;
	}
	#posixbrackets tr:nth-child(even) {
		background-color: var(--alternate-row);
	}
	#posixbrackets tr:last-child th:nth-child(4), #posixbrackets tr:last-child th:nth-child(6) {
		border-bottom: 0;
	}
}
@media (min-width: 480px) and (max-width: 690px) {
	#posixbrackets .regexplain {
		display: none;
	}
}
img.big {
	box-sizing: border-box;
	padding: 0 10px;
}
img.screen {
	max-width: 100%;
}
div.about {
	display: flex;
}
@media (min-width: 661px) {
	div.about img {
		float: right;
		margin-left: 10px;
	}
}
@media (max-width: 660px) {
	div.about {
		flex-wrap: wrap;
	}
}
textarea {
	width: 100%;
	box-sizing: border-box;
}
input {
	max-width: 100%;
	box-sizing: border-box;
}
table.side {
	border-style: solid;
	border-width: 2px;
	border-color: var(--side-border);
	width: 250px;
	margin: 20px 0;
}
div.side {
	margin: 45px 0;
}
div.sidead {
	margin: 45px 0;
	height: 508px;
}
#side div.adsense {
	margin: 45px;
}
#side iframe.amazonsingle {
	margin: 45px 65px;
	width: 120px;
	height: 240px;
}
div.amzn-native-container {
	margin: 20px 10px -10px 10px;
}
td.sideheader {
	background-color: var(--side-header);
	color: #FFFFFF;
	text-align: center;
	height: 28px;
}
p {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 14px;
	line-height: 19px;
	font-weight: normal;
	margin: 10px 0;
}
ul {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 14px;
	line-height: 19px;
	font-weight: normal;
	margin-left: 14px;
	margin-right: 0;
	padding-left: 0;
}
ul.noindent {
	margin-left: 0;
}
ul li {
	list-style-position: inside;
}
ol {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 14px;
	line-height: 19px;
	font-weight: normal;
	margin-left: 40px;
	margin-right: 0;
	padding-left: 0;
}
input {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 14px;
	font-weight: normal;
}
select {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 14px;
	font-weight: normal;
}
textarea {
	font-family: 'Andale Mono', 'Lucida Console', monospace;
	font-size: 14px;
	font-weight: normal;
}
th, td {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 14px;
	line-height: 19px;
}
td.small {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 10px;
	line-height: 14px;
}
td.yes {
	background-color: #E0FFE0;
	white-space: nowrap;
}
td.fail {
	background-color: #FFF4E8;
	white-space: nowrap;
}
.dark td.yes {
	background-color: #141;
}
.dark td.fail {
	background-color: #551911;
}
table.reference {
	border-collapse: collapse;
  	border: 2px solid var(--ref-border);
}
table.reference th {
	border-right: var(--hairline) solid var(--ref-border);
	border-bottom: var(--hairline) solid var(--ref-border);
	padding: 4px;
}
table.reference td {
	border-right: var(--hairline) solid var(--ref-border);
	border-bottom: var(--hairline) solid var(--ref-border);
	padding: 4px;
}
h1 {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 20px;
	font-weight: bold;
	font-variant: normal;
	color: var(--heading);
	margin-top: 20px 0 10px;
	border-bottom: solid var(--heading) 3px;
	padding-bottom: 3px;
	width: fit-content;
}
h2, h3 {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 20px;
	font-weight: bold;
	font-variant: normal;
	color: var(--heading);
	margin: 40px 0 10px;
	border-bottom: solid var(--heading) 3px;
	padding-bottom: 3px;
	width: fit-content;
}
.bodytext div.adsense {
	margin: 30px 0;
}
.bodytext div.adsense:first-child {
	margin-top: 20px;
}
a:link {
	color: #0000FF;
}
a:visited {
	color: #000080;
}
a:hover {
	color: #FFF;
	background: #0000FF;
}
a:active {
	color: #FFF;
	background: #FF0000;
}
.dark a:link {
	color: #60C0FF;
}
.dark a:visited {
	color: #C0E0FF;
}
.dark a:hover {
	color: #000;
	background: #60C0FF;
}
.dark a:active {
	color: #FFF;
	background: #FF0000;
}
a.img:hover, a.img:active {
	background: none;
}
tt {
	font-family: 'Andale Mono', 'Lucida Console', monospace;
}
tt.match, tt.string {
	padding-top: var(--hairline);
	padding-bottom: var(--hairline);
}
tt.match {
	background-color: #C0E0FF;
}
tt.string {
	background-color: #C0FFC0;
}
.dark tt.match {
	background-color: #16C;
}
.dark tt.string {
	background-color: #373;
}
tt.match, tt.string, tt.syntax span {
	white-space: nowrap;
}
tt.syntax {
	overflow-wrap: break-word;
}
tt span {
	padding-top: var(--hairline);
	padding-bottom: var(--hairline);
}
pre {
	font-family: 'Andale Mono', 'Lucida Console', monospace;
	font-size: 14px;
	line-height: 19px;
	font-weight: normal;
	margin: 10px 0;
	white-space: pre-wrap;
}
p.indent {
	margin-left: 20px;
}
p.copyright {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 10px;
	line-height: 14px;
	font-weight: normal;
	margin: 0;
}
img.left {
	margin: 5px 0 5px 0;
}
img.right {
	margin: 5px 0 5px 10px;
}
img.iconleft {
	margin: 0 10px 0 0;
}
form {
	margin: 0;
	padding: 0;
}
.characterstring { color: #0000FF; }
.comment { color: #FF0000; font-style: italic; }
.numericconstant { color: #000080; }
.reservedword { font-weight: bold; }
.longcode {
	font-size: 13px;
	line-height: 15px;
}
tt.regexbuddy {
	margin-left: 10px;
}
div.regexbuddyregex {
        margin-top: 10pt;
        margin-bottom: 10pt;
}
div.regexbuddytree {
        margin-top: 10pt;
        margin-bottom: 10pt;
        overflow-y: scroll;
        height: 200%;
}
div.regexbuddyfooter {
        margin-top: 10pt;
        margin-bottom: 10pt;
}
ul.buddy {
	padding-left: 0;
}
.regexplain { background-color: #D8D8D8; }
.regexerr { color: #FFF; background-color: #F00; }
.regexspecial { color: #000080; background-color: #80C0FF; }
.regexescaped { color: #202020; background-color: #C0C0C0; }
.regexcomment { color: #8820A0; font-weight: bold; font-style: italic; }
.regexmeta { color: #300040; background-color: #C080FF; }
.regexccopen { color: #181000; background-color: #FFC040; font-weight: bold; }
.regexccliteral { color: #302000; background-color: #FFC040; }
.regexccspecial { color: #181000; background-color: #F09000; }
.regexccrange { color: #302000; background-color: #F8A820; }
.regexnest1 { color: #000; background-color: #60F040; }
.regexnest2 { color: #000; background-color: #00C000; }
.regexnest3 { color: #FFF; background-color: #006000; }
.regexnest4 { color: #000; background-color: #60D0A0; }
.regexnest5 { color: #000; background-color: #009632; }
.replaceplain { background-color: #FFF860; }
.dark .regexplain { background-color: #555; }
.dark .regexspecial { color: #E0F0FF; background-color: #2080C0; }
.dark .regexescaped { color: #FFF; background-color: #808080; }
.dark .regexcomment { color: #D080FF; }
.dark .regexmeta { color: #F0E0FF; background-color: #8020C0; }
.dark .regexccopen { color: #FFF0E0; background-color: #D08000; }
.dark .regexccliteral { color: #FFE0C0; background-color: #D08000; }
.dark .regexccspecial { color: #FFF0E0; background-color: #904400; }
.dark .regexccrange { color: #FFE0C0; background-color: #B06000; }
.dark .regexnest1 { color: #FFF; background-color: #00A000; }
.dark .regexnest2 { color: #FFF; background-color: #005000; }
.dark .regexnest3 { color: #000; background-color: #00C000; }
.dark .regexnest4 { color: #FFF; background-color: #408040; }
.dark .regexnest5 { color: #0F0; background-color: #005000; }
.dark .replaceplain { background-color: #882; }
