/*
 * Style tweaks
 * --------------------------------------------------
 */
html,
body {
  overflow-x: hidden; /* Prevent scroll on narrow devices */
}
body {
  padding-top: 100px;
  position: relative;
}
footer {
  color: #b8b8b8;
  text-align: center;
  padding-bottom: 1rem;
}

a {
	text-decoration: none;
}

a:hover {
	text-decoration: underline;
}

a.nav-link:hover {
	text-decoration: none;
}

@media print {
  @page { size:auto; margin: 1.5cm 0 1.5cm 0; }
  body { margin: 0 2.5cm 0 2.5cm; padding: 0 }
  h1 { margin-top: 0; padding-top: 0 }
  footer { display: none; }
  .tour-jump { display: none; }
  .tour-jtop { display: none; }
  .callout { display:none; }
  .gui-content { display: block !important; }
  p.poetry { white-space: pre-wrap !important; }
}

/* old styles to remove and retire */
.bullet { margin-right: 2.5em; margin-bottom: 0.3em; border-left: medium none; font-weight: 800 }
.inset { margin-top: 0.3em; margin-right: 3em; margin-left: 2.5em }
.indent  { margin-top: 0.3em; margin-right: 3em; margin-left: 2.5em }
.outdent { margin-left: -20px }
.callout {
	position:absolute;
	width:330px;
	height:428px;
	left:500px;
	padding:5px;
	top:26px;
	background-color:white;
	font-size:12px;
	line-height:13px;
}
.rel-callout {
	position: relative;
}
.reviewed { color:#b8b8b8;}
.msgp { margin-top: .2em; margin-bottom: .2em; font-weight: bold; }
.expp { margin-top: .2em; margin-bottom: 1.5em; padding: 0 0 0 2em; }
/* end of old styles */

p.poetry {margin: 0.0px 0.0px 10px 40px; font-family: Courier; white-space: pre; overflow:scroll; background-color:#FFFFE5; padding:.5em; border: 1px solid #E5E6CE}
span.util {font-style: italic}
span.fsobj {font-family: Courier}
span.context {font-style: italic; color: #CCCCCC}
img.shrunk {cursor: pointer}

.gui-block {margin: 0.0px 0.0px 10px 40px; border: 1px solid black; border-radius: 5px}
.gui-header, .gui-footer {margin:0px; padding:.5em; background-color:#EEEEFF; color:#3333bb; cursor:pointer; border-radius: 5px}
.gui-content {display:none; padding:.5em; background-color:#F8F8FF; border-radius: 5px}
/* .faq-block {margin: 0px 20px 10px 10px; border: 1px solid black; border-radius: 10px} */
.faq-block {margin: 0px 20px 10px 10px;}
.faq-header {margin:0px 20px 0px 0px; padding:.5em; background-color:#eeeeee; color:#0000aa; cursor:pointer; border-radius: 10px}
.faq-content {margin:1px 0px 0px 20px; display:none; padding:.5em; background-color:#eeeeff; border-radius: 10px}
.img-shader {display:none; position:absolute; left:0; top:0; width:100%; background-color:#999999; opacity: 0.4; filter: alpha(opacity=40)}
.img-fullsize {display:none; position:fixed; left:50px; top:80px; max-height:85%; max-width:94%; cursor: pointer; box-shadow: 0 0 35px 10px gray; z-index:100;}
.hrlhover {position: relative; display: inline-block; border-bottom: 1px dotted black;}
.hrlhover .hrltip {visibility: hidden; width: max-content; background-color: #ffffee; color: black; text-align: left; border-radius: 6px; border-width: 2px; border-style: solid; padding: 7px 9px 7px 9px; position: absolute; z-index: 1;}
.hrlhover:hover .hrltip {visibility: visible;}

.nav-grid {
	display: grid;
	grid-template-columns: 1fr 1fr 1fr;
	grid-column-gap: 1rem;
	grid-row-gap: 1rem;
	padding-bottom: 1rem;
}

@media (max-width:992px) {
	.nav-grid {
		grid-template-columns: 1fr;
	}
}

.screenshot img {
	display: block;
	margin: auto
}

.screenshot .caption {
	text-align: center
}

.folder {margin-left: 2em}

.tour-jtop {
	padding: 0.25em 3em;
}
.tour-summ {
	padding: 1em 3em;
	margin-bottom: 1em;
	border-bottom: 1px solid gray;
}
.tour-head { font-size: 125% }
.tour-jump {
  font-size:150%;
  text-align: center;
  padding-top: 0.5em
}

span.keyword {color: blue}
span.literal {color: crimson}
span.comment {color: green}
span.version {color: lightgray; float: right}

.method .name span.pltype {color: SteelBlue; font-weight: normal}
.method .name span.plvar {font-style: italic; font-weight: normal}
.method .desc span.pltype {color: SteelBlue}
.method .desc span.plvar {font-style: italic}

.topic {margin-left: 2em}
.topic h4 {border-bottom: 1px solid gray}
.topic p.subhead {border-bottom: 1px solid gray; font-weight: bold}
.subtopic {margin-top: 1ex; margin-bottom: 2ex}
.subtopic p.subhead {border-bottom: 1px solid gray; font-weight: bold}

.topic h4:hover {cursor: pointer}
.topic:before { content: ">"; color: lightgray; position: absolute; left: 1em }
.topic-collapse {display: none}

div.url {
	color: blue;
	margin: 0.0px 0.0px 10px 40px;
	font-family: Courier;
	padding:.5em;
	border: 1px solid #E5E6CE;
	background-color:#FFFFE5;
}

.img-example {
	box-shadow: 0 0 5px 2px gray;
	margin-left:2rem;
}

.host-example {
	cursor: pointer;
	color: #23527c;
	text-decoration-line: underline;
	text-decoration-style: dashed;
}

.property {margin-top: 2ex}
.method {margin-top: 2ex}
.name {font-weight: bold}
.name, .type, .value {font-family: Courier}
.type, .desc, .code, .value {padding-left: 5em; margin-bottom: .5ex; position: relative}
.desc:before { content: "summary"; color: lightgray; position: absolute; left: 0px }
.code:before { content: "sample"; color: lightgray; position: absolute; left: 0px }
.value:before { content: "value"; color: lightgray; position: absolute; left: 0px }
.property > .type:before { content: "type"; color: lightgray; position: absolute; left: 0px }
.method > .type:before { content: "returns"; color: lightgray; position: absolute; left: 0px }
.name.optional:after { content: "optional"; color: silver; padding-left: 1em; font-style: italic; font-weight: normal }
.name.readonly:after { content: "read-only"; color: silver; padding-left: 1em; font-style: italic; font-weight: normal }

ul.note {
	list-style-image: url(../..//images/note.gif)
}

pre.listing {
	counter-reset: linecounter;
	margin: 0.0px 0.0px 10px 40px;
	font-family: Courier;
	padding:.5em;
	border: 1px solid #E5E6CE;
	background-color:#FFFFE5;
}
pre.listing span.line {
	counter-increment: linecounter;
}
pre.listing span.line:before {
	content: counter(linecounter);
	width: 2em;
	display: inline-block;
	border-right: 1px solid lightgray;
	margin-right: .5em;
}

.code div.url,
.code pre.listing {
	margin-top: .5ex;
	margin-left: 0px;
}

table.possibles {border-collapse: collapse; display: table-cell; margin-top: 1ex}
table.possibles td {border: 1px solid #bbb; padding: 6px; font-size: 12px}
table.possibles tr.head td {background-color: #eee;}

#api-diagram {
	margin-top: 2em;
	margin-bottom: 2em;
}

.perms-item:before,
.perms-item:after {
    background-color: gray;
    content: "";
    display: inline-block;
    height: 1px;
    position: relative;
    vertical-align: middle;
    width: 50%;
}
.perms-item:before {
    right: 0.5em;
    margin-left: -50%;
}
.perms-item:after {
    left: 0.5em;
    margin-right: -50%;
}

.perms-item {
  overflow: hidden;
  text-align: center;
  display: block;
  padding: 0.75em 5px 0.75em 5px;
  font-style: italic;
  color: gray;
}

.interface > div > a.stack-item:hover {
  box-shadow: 0px 0px 4px 2px rgba(51,136,208,0.75) inset;
}

.executable > div > a.stack-item:hover {
  box-shadow: 0px 0px 4px 2px rgba(51,136,208,1) inset;
}

a.stack-item {
  white-space: nowrap;
  text-align: center;
  text-decoration: none;
  display: block;
  padding: 0.75em 0px 0.75em 0px;
  color: black;
}

.stack > div {
  border-style: solid;
  border-color: black;
  border-top-width: 2px;
  border-left-width: 2px;
  border-bottom-width: 2px;
  border-right-width: 0px;
  padding: 0px;
  opacity: 0.75;
}

.stack > div:last-child {
  border-right-width: 2px;
}

.interface > div {
  background-color: #FED354;
}

.interface > div.ro {
  background-color: #FEE188;
}

.executable > div {
  font-weight: bold;
  font-size: 150%;
  background-color: #5A9B3F;
  border-top: 0px;
  border-bottom: 0px;
}

.executable > div.opt {
  font-weight: normal;
  font-style: italic;
  background-color: #A9D097;
}

.server > div {
  font-weight: bold;
  font-size: 200%;
  background-color: #316FB9;
}

.bs-docs-sidebar {
    position: fixed;
}

@media (min-width:768px) {
    .bs-docs-sidebar {
        padding-left: 20px
    }
}

.bs-docs-sidenav {
    margin-top: 20px;
    margin-bottom: 20px
}

.bs-docs-sidebar .nav > li > a {
    display: block;
    padding: 4px 20px;
    font-weight: 500;
    color: #767676;
}

.bs-docs-sidebar .nav > li > a:focus, .bs-docs-sidebar .nav > li > a:hover {
    padding-left: 19px;
    color: #484880;
    text-decoration: none;
    background-color: transparent;
    border-left: 1px solid #484880
}

.bs-docs-sidebar .nav > .active:focus > a, .bs-docs-sidebar .nav > .active:hover > a,
.bs-docs-sidebar .nav > .active > a {
    padding-left: 18px;
    font-weight: 700;
    color: #484880;
    background-color: transparent;
    border-left: 2px solid #484880
}

.bs-docs-sidebar .nav .nav {
    display: none;
    padding-bottom: 10px
}

.bs-docs-sidebar .nav .nav > li > a {
    padding-top: 1px;
    padding-bottom: 1px;
    padding-left: 30px;
    font-weight: 400
}

.bs-docs-sidebar .nav .nav > li > a:focus, .bs-docs-sidebar .nav .nav > li > a:hover {
    padding-left: 29px
}

.bs-docs-sidebar .nav .nav > .active:focus > a, .bs-docs-sidebar .nav .nav > .active:hover > a,
.bs-docs-sidebar .nav .nav > .active > a {
    padding-left: 28px;
    font-weight: 500
}

@media (min-width:992px) {
    .bs-docs-sidebar .nav > .active > ul {
        display: block
    }
}

svg.mode {
	display: none;
}

.toggle-dark-mode.dark svg.dark,
.toggle-dark-mode.light svg.light,
.toggle-dark-mode.auto svg.auto {
	display:block;
}
