/** Video insert **/

.video--wrapper.video--vimeo--wrapper {}

.video--thumbnail.video--vimeo--thumbnail {
    display: none
}

.video.video--vimeo {}

:root {
  --font-size: 20px;
  --line-height: 24px;
  --header-height: 1.2;
  --font-size--header: 45px;
  --font-size--subheader: 30px;
  --font-size--author: 20px;
  --font-style--header: italic;
  --line-height--header: 50px;
 --line-height--subheader: 32px;
  --body-font: "Fortescue";
  --header-font: "Fortescue";
  --highlight-font: "Apercu";
  --link-color: magenta;
  --link-color--visited: black;
  --link-color--hover: magenta;
  --highlight-color: magenta;
  --body-background-color: #f4f3f0;
}

html::before {
  content: '';
  background: var(--highlight-color);
  position: fixed;
  top: 0;
  bottom: 0;
  right: 0px;
  width: 20px;
}

html {
  background: var(--body-background-color);
}

html, body {
  font-size: var(--font-size);
  line-height: var(--line-height);  
  font-family: var(--body-font);
}

body {
  max-width: 100ch;
  margin: calc(2 * var(--line-height)) auto;
  display: grid;
  grid-template-rows: min-content 1fr;
  grid-template-columns: 3fr 1fr;
  padding-left: 10ch;
  column-gap: calc(2 * var(--line-height));
}

h1 {
 font-family: var(--header-font);
 font-style: var(--font-style--header);
 font-size: var(--font-size--header);
 line-height: var(--line-height--header);
 margin: 0 0 calc(2 * var(--line-height)) 0
}

*/h2 {
 font-family: var(--header-font);
 font-style: var(--font-style--header);
 font-size: var(--font-size--author);
 font-color: magenta;
margin: calc(0 * var(--line-height)) 0 0 0;
 line-height: var( --line-height--subheader);
}*/

h2 {
 font-family: Fortescue;
 font-style: italic;
 font-size: 30;
margin-bottom: 0;
}

h3 {
 font-family: var(--highlight-font);
 font-style: none;
 font-size: 20;
margin: calc(2 * var(--line-height)) 0 0 0;
}

h4, h5, h6 {
margin: var(--line-height) 0 0 0;
 font-style: var(--font-style--header);
}

a {
    color: var(--link-color);
}

a:hover {
    color: var(--link-color--hover);
    text-decoration: none;
}

a:visited {
    color: var(--link-color--visited);
}

header {
  display: flex;
  vertical-align: baseline;
  margin: 2em 0;
  margin-bottom: 6em;
  grid-column-end: span 2;
}
 
nav ul {
  list-style-type: none;
  /*display: flex;*/ /* Disable flex to make it a vertical list. */
  align-items: baseline;
  margin: 0;
  padding: 0;
}
 
nav ul li {
  margin: 0 2ch 0 0;
}

/* Hide unnecessary links */
li.navbar--labels,
li.navbar--reports,
li.navbar--pages
{
  display: none;
}

.navbar--organisation {
    margin-left: -100px;
    margin-bottom: 2em;
}

.navbar--organisation a::before {
	content: url(https://etherport.org/media/filer_public/b2/9f/b29f3d8e-398f-4cad-8a74-c74bf1baba93/feature_image_letter_mask_awaw_outline.svg); 
	display: block;
	width: 200px;
}

.navbar--organisation a {
    color: transparent;
}

.navbar--index {
    font-family: var(--highlight-font); 
    margin-bottom: 1em
}

.navbar--chapter {
    font-family: var(--highlight-font); 
    color: var(--link-color);
    text-decoration: none
}

/* Number the chapters through a CSS counter. */
nav#nav {
  counter-reset: chapter;
}

.navbar--chapter::before {
  counter-increment: chapter;
  content: counter(chapter) '.';
  color: var(--highlight-color);
  padding-right: 2ch;
  font-family: var(--highlight-font);
}


/* Position print button. Slightly adjust the grid. */

.navbar--print a::before {
   content: url(https://etherport.org/media/filer_public/68/76/68762ff0-8b37-4503-a41d-5c077632588a/feature_image_letter_mask_awaw_outline_p-02.svg); 
    display: block;
    width: 90px;
}

.navbar--print {
    position: absolute;
    top: 0px;
    left: calc(100% + 2 * var(--line-height));
}

.navbar--print a {
    color: transparent;
}

/* Make header relative and only one column wide to align
    print button with label list. */
header {
    position: relative;
    grid-column-end: span 1;
}

/* Make sure main starts on column 1 now that header is not
    covering both columns. */
main {
    grid-column: 1;
}

.navbar--reports--subnav,
.navbar--pages--subnav,
.navbar--labels--subnav
{
  display: none;
}
 
 
/** Adjust label listing,  */
 
.etherport--labels ul {
  list-style-type: none;
  padding: 0;
  font-family: var(--highlight-font);
}

main {
  position: relative;
}
 
/** References which aren't direct links (they don't have the data-direct-link attribute) */

[data-link-target-type="label"],
[data-link-target-type="label"]:visited {
    color: inherit;
    text-decoration: none;
    font-weight: normal
}

[data-link-target-type="label"]:hover {
    color: var(--link-color);
}

[data-link-target-type="label"] .reference--target {
  float: right;
  width: 20ch;
  margin-right: -25ch;
  clear: right;
  text-decoration: none;
   font-family: var(--highlight-font);
  color: var(--link-color);
}

[data-link-target-type="label"]:hover .reference--target {
    text-decoration: underline;
}

[data-link-target-type="label"] .reference--label--inline {
    text-decoration: underline;
    text-decoration-style: solid;
}

 
[data-link-target-type="label"][data-direct-link] .reference--label,
[data-link-target-type="label"] .reference-label--target .reference-label--target--label {
  display: inline-block;
  background: #efefef;
  padding: .5ch;
  margin-top: -.5ch;
  font-family:var(--body-font);
}
 
.link-source {
/*  float: right; */ to not place it on the side
  width: 100ch;
  margin-right: -25ch;
  clear: right;
  margin-top: 0;
  font-size: 75%;
  font-family: var(--highlight-font);
}

ul.label--context-list {
  padding: 0;
  list-style-type: none;
}

ul.label--context-list li {
  margin-bottom: calc(2 * var(--line-height));
}

/** Hide elements which were marked as instructions in the pad */
.instruction {
    display: none;
}
 
.tag--question {
  font-size: 110%;
  color: green;
}
 
.tag--important  {
    text-decoration-line: underline;
    text-decoration-style: double;
}
 
.tag--trouble {
    text-decoration-line: underline;
    text-decoration-style: wavy;
}
 
.tag--commentary {
    text-decoration-line: underline;
    text-decoration-style: dotted;
}
 
.tag--citation {
    background-color: beige;
}
 
b {
    border: solid black 2px;
}


.going-hybrid--labels ul {
    margin: 0;
    padding: 0;
    list-style-type: none;
}
.going-hybrid--labels ul li {
    margin-top: var(--line-height);
}
.going-hybrid--labels ul li a {
    padding: .3em .5em;
    border: 2px solid;
    text-decoration: none;
}
.going-hybrid--labels ul li a:hover {
    background: white;
}
 
img {
    max-width: 100%;
}


 
/**Anwhich aren't direct links (they don't have the data-direct-link attribute) */

[data-link-target-type="label"],
[data-link-target-type="label"]:visited {
    color: inherit;
    text-decoration: none;
    /*background-color: magenta;*/
}

[data-link-target-type="label"]:hover {
    color: var(--link-color);
}

[data-link-target-type="label"] .reference--target {
  float: right;
  width: 20ch;
  margin-right: -25ch;
  clear: right;
  text-decoration: none;
  color: var(--link-color);
}

[data-link-target-type="label"]:hover .reference--target {
    text-decoration: underline;
}

[data-link-target-type="label"] .reference--label--inline {
    text-decoration: underline;
text-decoration-style: solid;
    text-decoration-color: magenta;
}