/*
 * Basic Improved
 * We inherit the stuff pointed in "Basic Formatting"
 * 
 * Changes cover three aspects:
 * 
 * * missing styles (eg.: missing font-cursive)
 * * prefering Libre resources (eg.: Liberation fonts before Microsoft fonts)
 * * adding styles that emphasize 2/3rds-column design
 * 
 * Revision 1
 * 
 * */

#workskin .indent {
  padding: 0 5em 0 5em;
}

#workskin .book {
  margin: 0 auto;
  text-indent: 3em;
}

#workskin .dropcap {
  font-family: Georgia, serif;
  font-size: 3em;
}

#workskin .flashback {
  font-style: italic;
}

#workskin .caps {
  font-variant-caps: small-caps;
}

/* missing font-variant and decoration details 
 * */
#workskin .all-small-caps {
  font-variant-caps: all-small-caps;
}

#workskin .line-decoration-solid {
  text-decoration-style: solid;
}
#workskin .line-decoration-dotted {
  text-decoration-style: dotted;
}

#workskin .line-decoration-double {
  text-decoration-style: double;
}

#workskin .line-decoration-wavy {
  text-decoration-style: wavy;
}

/* 
 * ----
 * */

#workskin .spoiler {
  background: #333;
  color: #333;
}

/* 
 * a variant of "spoiler" more in line with government docs
 * */
#workskin .REDACTED {
  background: #333;
  color: #333;
  font-family: monospace;
  margin: auto 1em;
}

#workskin .border {
  border: 1px solid;
}

#workskin .border-dotted {
  border: 1px dotted; 
}

/* 
 * modified to prefer libre/free software fonts
 * */
#workskin .font-serif {
  font-family: 'Liberation Serif', 'Gentium', 'Gentium Plus', 'Nimbus Roman', 'Libra Serif Modern', Cambria, Constantia, Palatino, Georgia, serif;
}

#workskin .font-sansserif {
  font-family: 'Liberation Sans', 'Nimbus Sans', 'Open Sans', 'Gidole', 'Isabella Sans', 'Metropolitano', 'Lucida Grande', Verdana, Helvetica, Arial, sans-serif;
}

#workskin .font-monospace {
  font-family: 'Liberation Mono', 'Inconsolata', 'Source Code Pro', consolas, courier, monospace;
}

#workskin .font-cursive {
  font-family: 'Cursive', 'Feltpen Regular', cursive;
}

#workskin .font-fantasy {
  font-family: fantasy;
}

#workskin .font-system {
  font-family: system-ui;
}

#workskin .font-big {
  font-size: 120%;
}

#workskin .font-small {
  font-size: 80%;
}

/* 
 * sometimes this is needed explicitly
 * */
#workskin .align-left {
  text-align: right;
}

#workskin .align-right {
  text-align: right;
}

#workskin .align-center {
  text-align: center;
}

#workskin .align-justify {
  text-align: justify;
}

#workskin hr.third {
  width: 33%;
  margin: auto;
}

#workskin hr.half {
  width: 50%;
  margin: auto;
}

#workskin hr.full {
  width: auto;
  margin: auto;
}

#workskin hr.solid {
  border-style: solid;
}

#workskin hr.dashed {
  border-style: dashed;
}

#workskin hr.double {
  border-style: double;
}

/* 
 * font colors 
 * The listing from AO3 is supplemented with some SVG/X11 colornames.
 * Priority is given to colors that distinguish themselves well on standard white-background pages.
 * 
 * Official listing from https://en.wikipedia.org/wiki/X11_color_names
 * */

#workskin .font-red {
  color: red;
}

#workskin .font-orange {
  color: orange;
}

#workskin .font-yellow {
  color: yellow;
}

#workskin .font-green {
  color: green;
}

#workskin .font-blue {
  color: blue;
}

#workskin .font-purple {
  color: purple;
}

#workskin .font-white {
  color: white;
}

#workskin .font-black {
  color: black;
}

#workskin .font-pink {
  color: pink;
}

#workskin .font-teal {
  color: #008282;
}

#workskin .font-redbrown {
  color: #a15000;
}

#workskin .font-cherryred {
  color: #e00707;
}

#workskin .font-brickred {
  color: #a10000;
}

#workskin .font-dimorange {
  color: #f2a400;
}

#workskin .font-murkyyellow {
  color: #a1a100;
}

#workskin .font-jade {
  color: #4ac925;
}

#workskin .font-dimgreen {
  color: #008141;
}

#workskin .font-leafgreen {
  color: #1f9400;
}

#workskin .font-darkolive {
  color: #416600;
}

#workskin .font-dimblue {
  color: #005682;
}

#workskin .font-midblue {
  color: #0715cd;
}

#workskin .font-mediumskyblue {
  color: #00d5f2;
}

#workskin .font-darknavy {
  color: #000056;
}

#workskin .font-lightpurple {
  color: #f141ef;
}

#workskin .font-midviolet {
  color: #b536da;
}

#workskin .font-verydarkpurple {
  color: #2b0057;
}

#workskin .font-darkplum {
  color: #6a006a;
}

#workskin .font-darkmaroon {
  color: #77003c;
}

#workskin .font-reallydarkgray {
  color: #626262;
}

#workskin .font-x11-bisque {
  color: bisque;
}

#workskin .font-x11-brown {
  color: brown;
}

#workskin .font-x11-chocolate {
  color: chocolate;
}

#workskin .font-x11-coral {
  color: coral;
}

#workskin .font-x11-crimson {
  color: crimson;
}

#workskin .font-x11-forestgreen {
  color: forestgreen;
}

#workskin .font-x11-fuchsia {
  color: fuchsia;
}

#workskin .font-x11-gold {
  color: gold;
}

#workskin .font-x11-goldenrod {
  color: goldenrod;
}

#workskin .font-x11-indigo {
  color: indigo;
}

#workskin .font-x11-lime {
  color: lime;
}

#workskin .font-x11-magenta {
  color: magenta;
}

#workskin .font-x11-olive {
  color: olive;
}

#workskin .font-x11-orange {
  color: orange;
}

#workskin .font-x11-orangered {
  color: orangered;
}

#workskin .font-x11-peru {
  color: peru;
}

#workskin .font-x11-plum {
  color: plum;
}

#workskin .font-x11-purple {
  color: purple;
}

#workskin .font-x11-sandybrown {
  color: sandybrown;
}

#workskin .font-x11-seagreen {
  color: seagreen;
}

#workskin .font-x11-sienna {
  color: sienna;
}

#workskin .font-x11-silver {
  color: silver;
}

#workskin .font-x11-steelblue {
  color: steelblue;
}

#workskin .font-x11-teal {
  color: teal;
}

#workskin .font-x11-violet {
  color: violet;
}

#workskin .font-x11-yellow {
  color: yellow;
}

/**
 * ----
 * */

/**
 * layout for boxes. 
 * Boxes are floated to be either the leftmost 1/3rd of content, or the rightmost 1/3rd of content, with an inner padding.
 * 
 * */

#workskin .box-clear {
  float: clear;
}

#workskin .box-left {
  float: left;
  max-width: 33%;
  margin-right: 8pt;
}

#workskin .box-right {
  float: right;
  max-width: 33%;
  margin-left: 8pt;
}

#workskin .box-left.box-border {
  border-right: 4pt dotted #333;
}

#workskin .box-right.box-border {
  border-left: 4pt dotted #333;
}

#workskin table tr th.cell-important1 {
  background-color: #ddd;
  
}