@import "https://fonts.googleapis.com/css?family=Open+Sans:400,400italic,400,400italic,600,600italic%7CNoto+Serif:400,400italic,700,700italic%7CDroid+Sans+Mono:400,700";
@import "asciidoctor.css";

/*
 * Use https://www.w3schools.com/colors/colors_picker.asp to find lighter and
 * darker shades of the basic color.
 *
 * Other html color sites:
 *
 * http://www.december.com/html/spec/colorshades.html
 * https://htmlcolorcodes.com/color-names
 * https://www.computerhope.com/htmcolor.htm
 * https://www.rapidtables.com/web/color/html-color-codes.html
 *
 * Online documentation sites:
 *
 * http://www.sphinx-doc.org
 * https://pip.pypa.io
 * https://www.archlinux.org
 * https://www.debian.org/doc/manuals
 * https://www.sphinx-doc.org
 */

/* Hide or show search bar.
 * The Makefile changes this setting automatically
 * depending on ansi2html and php being installed.
 */
.search { display: block }

/* Use Arial font family. */
html{font-family:"Arial";-ms-text-size-adjust:100%;-webkit-text-size-adjust:100%}
body{background:#fff;color:rgba(0,0,0,.8);padding:0;margin:0;font-family:"Arial","DejaVu Serif",serif;font-weight:400;font-style:normal;line-height:1;position:relative;cursor:auto;tab-size:4;-webkit-font-smoothing:antialiased}

/* Decrease font size and line height. */
.paragraph.lead>p,#preamble>.sectionbody>[class="paragraph"]:first-of-type p { font-size:1.0em; line-height:1.3 }
p { line-height:1.3em }					/* Decrease line height */
td, th { padding:.2em .2em!important }			/* Limit height of table rows. */

/* Make lists more compact. */
ol>li p,ul>li p { margin-bottom: .1em }
/* Move list widgets a little bit to the left. */
ol,ul { margin-left: 18px }

/* Make literal monospace text enclosed inside backticks bold (font-weight:700). */
/* code { font-family:"Droid Sans Mono","DejaVu Sans Mono",monospace; font-weight:700; color:rgba(0,0,0,.9) } */

/* Make details more compact. */
details > summary:first-of-type { margin-bottom: .5em }
details { margin-bottom: .1em }
/* details .content { background: LightYellow } */
/* Move collapsible widgets a little bit to the right. */
details { margin-left: 4px }

/* Change bottom padding from 1.25 em to 0.25 em for sections. */
.sect1 { padding-bottom: 0.25em }

/* Links. */
.alpha a { color:Red }					/* Show alpha documents in red on home/index page. */
.draft a { color:Magenta }				/* Show draft documents in magenta on home/index page. */
.final a { color:#2156a5 }				/* Show final documents in default on home/index page. */
.obsolete a { color:Maroon }				/* Show obsolete documents in maroon on home/index page. */
a:hover { color:#2491CF }
a { text-decoration:none }				/* Remove underline style from links. */

/* Set default width to 75%. */
#header, #content, #footnotes, #footer { max-width: 75%!important }

/* Headers. */
#header > h1:first-child { color:DarkSlateGray; font-size:4em }
h1, h2, h3, h4, h5, h6 { color:SteelBlue; }
h2 { background:LightSteelBlue; border:1px solid #93aed2; margin:0px 0px 25px 0px; padding:25px }

body { tab-size:8 }					/* Align tabs for Google Chrome. */

div.literalblock { margin-bottom:15px!important }
div.literalblock { margin-top:5px!important }

/* Tables with horizontal scrollbar. */
.scrollbar div { overflow: auto }
.scrollbar table { margin-bottom: 0 }
.scrollbar table { table-layout: fixed }
.scrollbar table.tableblock colgroup col { width:200px!important }

/* HTML colors. */
.html_aqua    { color:Aqua }
.html_black   { color:Black }
.html_blue    { color:Blue }
.html_cyan    { color:Cyan }
.html_fuchsia { color:Fuchsia }
.html_gray    { color:Gray }
.html_green   { color:Green }
.html_lime    { color:Lime }
.html_magenta { color:Magenta }
.html_maroon  { color:Maroon }
.html_navy    { color:Navy }
.html_olive   { color:Olive }
.html_orange  { color:Orange }
.html_purple  { color:Purple }
.html_red     { color:Red }
.html_silver  { color:Silver }
.html_teal    { color:Teal }
.html_white   { color:White }
.html_yellow  { color:Yellow }

/* ??? */
.caution   { color:Orange }
.date      { background-color:White!important }
.detail    { color:Orange }
.dg        { color:#ce019e }
.done      { background-color:White!important }
.good      { color:Green }
.important { color:Red }
/*
.kbd       { color:#bf0000 }
.kbd       { background-color:Black!important; color:White!important }
.kbd       { background-color:Gray!important; color:White!important }
.kbd       { background-color:DarkGray!important; color:White!important }
*/
.kbd       { background-color:#eaeaea!important; color:Black }
.label     { color:Teal }
.none      { font-weight:normal!important }
.note      { color:Magenta }
.opt       { color:Teal }
.special   { color:Red; background-color:Yellow }
.test      { background-color:White!important; color:Green; font-family:monospace; font-size:1.2em; font-weight:bold }
.tip       { color:Blue }
/* .title     { color:Blue } */
.todo      { color:Red; background-color:Yellow }
.warning   { color:Yellow; background-color:Red }

/* Calendar. */
.backup    { color:Blue }
.birthday  { color:Red; background-color:Yellow }
.duty      { color:Silver }
.holiday   { color:Red }
.leave     { color:Silver }
.license   { color:Magenta }
.meeting   { color:Red; background-color:Yellow }
.party     { color:Red; background-color:Yellow }
.payment   { color:Red }
.renewal   { color:LimeGreen }
.sun       { color:Red }
.tape      { color:Blue }
.task      { color:Blue }
.update    { color:Blue }

/* Priorities. */
.urgent { color:Red; background-color:Yellow }
.high   { color:Red }
.medium { color:Blue }
.low    { color:Black }

/*
 * Admonition blocks:
 *
 * See also https://pythonhosted.org/sphinxjp.themes.basicstrap/sample.html#admonitions-sphinx-additional
 *
 * Use https://www.rapidtables.com/web/color/html-color-codes.html to find the
 * basic colors. Then use https://www.w3schools.com/colors/colors_picker.asp to
 * find the lighter and darker shades of the basic color. For the admonition
 * box set the background color to 90% and the border color to 80%. For
 * keyboard presses and monospace styles set the background color to 80%.
 *
 *				color	color	bckgrnd	border	border
 * Admonition	Color name		50%	90%	80%	75%
 * ----------	----------	------	-------	-------	-------	-------
 * Caution	gold		#ffd700	#ffd700	#fff7cc	#fff099
 * Caution	gold		#ffd700	#ffd700	#fff7cc	#fff099	#ffec80
 * Caution	yellow		#ffff00	#ff0000	#ffffcc	#ffff99
 * Important	red		#ff0000	#ff0000	#ffcccc	#ff9999
 * Important	red		#bf0000	#ff0000	#ffcccc	#ff9999
 * Note		lightblue	#add8e6	#3ca1c3	#d8ecf3	#b1dae7
 * Warning	darkorange	#ff8c00	#ff8c00	#ffe8cc	#ffd199
 * Tip		lightgreen	#90ee90	#22dd22	#d3f8d3	#a7f1a7
 *
 */

kbd { -webkit-box-shadow:none; box-shadow:none }

.admonitionblock span.keyseq { color:inherit }

.admonitionblock td.icon .icon-caution::before   { content:"\f06d"; color:#ffd700 }
.admonitionblock td.icon .icon-note::before      { content:"\f05a"; color:#3ca1c3 }
.admonitionblock td.icon .icon-important::before { content:"\f06a"; color:#bf0000 }
.admonitionblock td.icon .icon-tip::before       { content:"\f0eb"; color:#22dd22 }
.admonitionblock td.icon .icon-warning::before   { content:"\f071"; color:#ff8c00 }

.admonitionblock.caution   > table td.content { background:#ffffcc; border:1px solid #ffec80; color:#000000 }
.admonitionblock.caution   code { background-color:#ffec80; color:inherit }
.admonitionblock.caution   kbd  { background-color:#ffec80; color:inherit }
.admonitionblock.caution   kbd  { border:1px solid #ffd700 }

.admonitionblock.important > table td.content { background:#ffcccc; border:1px solid #ff9999; color:#000000 }
.admonitionblock.important code { background-color:#ff9999; color:inherit }
.admonitionblock.important kbd  { background-color:#ff9999; color:inherit }
.admonitionblock.important kbd  { border:1px solid #bf0000 }

.admonitionblock.note      > table td.content { background:#d8ecf3; border:1px solid #b1dae7; color:#000000 }
.admonitionblock.note      code { background-color:#b1dae7; color:inherit }
.admonitionblock.note      kbd  { background-color:#b1dae7; color:inherit }
.admonitionblock.note      kbd  { border:1px solid #3ca1c3 }

.admonitionblock.tip       > table td.content { background:#d3f8d3; border:1px solid #a7f1a7; color:#000000 }
.admonitionblock.tip       code { background-color:#a7f1a7; color:inherit }
.admonitionblock.tip       kbd  { background-color:#a7f1a7; color:inherit }
.admonitionblock.tip       kbd  { border:1px solid #22dd22 }

/*
.admonitionblock.todo      > table td.content { background:#ffff80; border:1px solid #ff0000; color:#ff0000 }
.admonitionblock.todo      code { background-color:#ffa500; color:#ff0000 }
.admonitionblock.todo      kbd  { background-color:#ffa500; color:#ff0000 }
.admonitionblock.todo      kbd  { border:1px solid #ff0000 }
.admonitionblock.todo      td.icon .icon-note:before { content:"\f069"; background-color:#ffff00; color:#ff0000 }
*/

.admonitionblock.warning   > table td.content { background:#ffe8cc; border:1px solid #ffd199; color:#000000 }
.admonitionblock.warning   code { background-color:#ffd199; color:inherit }
.admonitionblock.warning   kbd  { background-color:#ffd199; color:inherit }
.admonitionblock.warning   kbd  { border:1px solid #ff8c00 }

/*
 * Listing blocks.
 *
 * Use same background and foreground colors as Pygments syntax highlighter.
 * See Pygments stylesheet for details.
 */

.listingblock pre { background:#f8f8f8!important; border:1px solid; border-color:#e6e6e6; color:rgba(0,0,0,.9) }

/* Literal blocks. */
.literalblock pre { background:#d8ecf3!important; border:1px solid; border-color:#b1dae7; color:#000000 }