/* Generated by LaTeX DogWagger Version 4.0.5 from file <readme_400.tex>*/
/* Date: [2024-12-13 21:28:20] */
/* Do NOT edit this file. Edit the LaTeX source!!*/

/* - <Section 4> - */
/************************************************************************
*                                                                       *
*                  Sinorcaish Screen-based Style Sheet                  *
*                 Copyright (C) 2004-07, John Zaitseff                  *
*                                                                       *
************************************************************************/

/* Author:  John Zaitseff <J.Zaitseff@zap.org.au>
   Version: 1.3

   $Id: sinorcaish-screen.css 189 2007-03-22 01:35:44Z john $

   This file provides the Sinorcaish style sheet for screen-based user
   agents (ie, for ordinary Web browsers).  This file conforms to the
   Cascading Style Sheets 2.1 specification.

   The design of Sinorcaish is influenced by Sinorca (available from the
   Open Source Web Design site, http ://www.oswd.org/), which in turn was
   based on the Acronis company web site (http ://www.acronis.com/).  You
   can find more information about this design from its home page on the
   ZAP Group web site, http ://www.zap.org.au/documents/styles/sinorcaish/.

   This file may be redistributed and/or modified on the condition that
   the original copyright notice is retained.
*/

  /* Some modifications by J van Schalkwyk on various dates */

 
/********** Global Styles **********/

				/* The global font size is set to 90% as  */
				/* most browsers' normal font size is too */
				/* large, at least when using Verdana     */

body {
   font-family:"Lucida Sans", Arial, Helvetica, Verdana, "DejaVu Sans", "Bitstream Vera Sans", sans-serif ;

   /* font-size:90% ; */	/* Allow IE/Win to resize the document */
   /* what about something like:
   font-size: calc(0.5rem + 0.7vw);
   font-size: calc(100vw / 40);
   */

   font-size: calc(100vw / 80);

   overscroll-behavior: contain; 

   color:black ;
  /* background:#F2F2FF ; */
   background:#F4F0EC ; 
   margin:0 ;
   padding:0 ;
   border:none ;
}

.hidden {			/* Used for content that should be displayed */
				/* by non-stylesheet-aware browsers          */
   display:none !important ;
}

.notprinted {			/* Used for content that should not be */
}				/* printed to paper                    */



/* Headings 
   Headings (H1-H6) should only be used in */
  /* margin amended here and below */ 

h1 { font-weight:bold ;
     text-align:center ;   /* e.g. chapter heading */ 
     margin:0.4em 0 0 0 ;  /* JvS:Top margin fiddled with */
     padding:0 0 0 0 ;
     font-size:175% ; 
     color:white ;
     background-color:black ; 
   }


h2,				/* the main content area                   */
h3 { font-weight:bold ;
     text-align:left ;
     margin:0.8em 0 0 0 ;  /* JvS:Top margin fiddled with */
     padding:0 0 0 0 ;
 }

h4,
h5,
h6 {
   font-weight:bold ;
   text-align:left ;
   margin:0.8em 0 0 0 ;  /* JvS:Top margin fiddled with */
   padding:0 0 0 0 ;
}

h2 { font-size:145% }
h3 { font-size:120% }
h4 { font-size:105% }
h5 { font-size:80%  }
h6 { font-size:65%  }



/* Anchors */
/* JvS:initially tried to increase the area of clickable links */
/* courtesy of:
   http ://stackoverflow.com/questions/11078509/how-to-increase-the-clickable-area-of-a-a-tag-button */
a {     
display:inline-block ;     
  /* position:relative ;  */
z-index:1 ;     
}
/* I've now removed the padding on the a element as it was moving the box position [explore]
padding:0.4em  0.5em  0.5em  0.5em ; 
margin:-0.4em -0.5em -0.5em -0.5em ; 
*/
/* the idea behind the negative margins was not to enlarge the size 
   CONSIDER having a different <a styling for Jo's markdown!
*/ 



a:link {
   text-decoration:none ;
   color:#7851A9 ;  /* royal purple */ 
   background:transparent ;
}

a:visited {
   text-decoration:none ;
   color:#003399 ;
   background:transparent ;
}

a:hover,
a:active {
   text-decoration:underline ;
}

/* Inline elements and classes */
				/* This style sheet assumes B, BIG, EM, I, */
				/* SMALL, STRONG, SUB and SUP are defined  */
				/* by the browser as per the HTML4 sample  */
				/* style sheet.                            */
code,
kbd,
samp,
tt {
   font-family:"Courier New", Courier, monospace ;
   font-size:100% ;	/* Amended from 115% to 100% */
   line-height:1.0 ;	/* Otherwise lines tend to spread out */
}

/* code { color:#002366 ; }*/
code { color:red ; } 

kbd,
code.markup,			/* HTML/CSS markup */
span.markup,			/* Alternative form for HTML/CSS markup */
.title {			/* Title in floating boxes / left sidebar */
   font-weight:bolder ;
}

abbr,
acronym {
   font:inherit ;	/* Don't use small-caps, etc. */
}

.tooltip {
   cursor:help ;
   border-bottom:1px dotted #CCCCCC ;
}

abbr[title],
acronym[title] {
   cursor:help ;
   border-bottom:1px dotted #CCCCCC ;
}

cite,
dfn,
var,
.fn,				/* Filename */
.url,				/* Uniform Resource Locator */
.email {			/* E-mail address */
   font-style:italic ;
}

.program,			/* Command-line name of a computer program */
.window,			/* Window or dialog box name */
.menu,				/* Menu item in a computer program */
.gui,				/* Generic GUI element in a computer program */
.key {				/* Keypress in a computer program */
   font-weight:bolder ;
}

.clearboxes {			/* Clear navboxes and floatboxes */
   clear:right ;
}

.unicode {
   font-family:"Arial Unicode MS", "Lucida Sans Unicode", Verdana, "DejaVu Sans", "Bitstream Vera Sans", "Lucida Sans", Arial, Helvetica, sans-serif ;
}

/* Block-inline elements and classes */
img {
   vertical-align:baseline ;
   margin:0 ;
   padding:0 ;
   border:none ;
}

img.icon16 {			/* For 16x16 file-type icons */
   vertical-align:-2px ;
}

del,
del * {				/* Required for Mozilla */
   text-decoration:line-through ;
}

ins,
ins * {				/* Required for Mozilla */
   text-decoration:underline ;
}

.floatnone { margin:0 0 0 0 ;
             float:none ;
}

.floatleft {			/* Left-floating images and spans */
   margin:0em 1.0em 0em 0 ;
   float:left ;
}

.floatright {			/* Right-floating images and spans */
   margin:0em 0 0em 1.0em ;
   float:right ;
}

.nowrap {
   white-space:nowrap ;
}

/* Block elements */
p {
   margin:0 0 0 0 ;  /* ? no default top margin as stuffs up centering! ; was 1em 0 ; */ 
   padding:0 ;
}                    /* we thus provide .bip i.e. bigpara */ 

.bip { margin:1em 0 0 0; 
  }

blockquote {			/* Should only be used in main content area, */
				/* floating boxes or left sidebar.           */
   margin:1em 2.5em ;
   padding:0 ;
   color:#708090;   /* slate gray, added */ 
}

pre {				/* Should only be used in main content area  */
				/* and floating boxes.                       */
   font-family:"Courier New", Courier, monospace ;
   font-size:100% ;	/* Amended by JvS from 115%   */
   line-height:1.1 ;        /* Line height also amended */
   margin:0.7em 2em ;  /* margin contracted a bit  */
   padding:0 ;
}

pre code,
pre kbd,
pre samp,
pre tt {
   font-size:100% ;	/* PRE is already enlarged above   */
   line-height:1.1 ;	/* Use same value as for PRE above */
}

hr {
   color:#999999 ;
   background:transparent ;
   height:1px ;	/* Required for IE/Win */
   margin:0 ;
   padding:0 ;
   border-color:#999999 ;
   border-width:1px ;
   border-style:none none solid none ;
}

hr.lighter {			/* Warn:not printed out on paper */
   color:#F0F0F0 ;
   background:transparent ;
   border-color:#F0F0F0 ;
}

/* Lists */
ol {
   list-style:decimal outside ;
   margin:0.5em 0 ;  /* JvS:less margin above, was 1em */
   padding:0 0 0 2em ; /* JvS:a bit less bottom padding was 2.5 */
}

ol.alpha {
   list-style-type:lower-alpha ;
}

ol.number {
   list-style-type:decimal ;
}

ul {
   list-style:square outside ;
   margin:0.5em 0 ;   /* JvS:less margin above, was 1em */
   padding:0 0 0 2em ; /* likewise less, was 2.5 */
}

ol ol,
ol ul,
ul ol,
ul ul {
   margin-top:0 ;
   margin-bottom:0 ;
}

ol ul,				/* Override possible browser styles */
ol ol ul,
ol ul ul,
ul ul,
ul ol ul,
ul ul ul {
   list-style:square outside ;
}

li {
   margin:0 0 0.3em 0 ; /* JvS:increase bottom margin [explore] */ 
   padding:0 ;
}

  /* substantial modification of dl/dd/dt by JvS to fit to same line */ 
dl {
  width: 100%;
  overflow: hidden;
  background: white;
  padding: 0;
  margin: 0
}

dt {
  float: left;
  width: 20%;
  font-weight : bold; 
  /* adjust the width; make sure the total of both is 100% */
  background: white;
  padding: 0;
  margin: 0 0 0.3em 0 ; 
}

dd {
  float: left;
  width: 80%;
  /* adjust the width; make sure the total of both is 100% */
  background: white; 
  padding: 0;
  margin: 0 0 0.3em 0 ; 
}

/* Tables */
				/* Tables should never be used for visual */
				/* formatting:that is the role of CSS!   */
table.simple {
   color:inherit ;
   background:inherit ;	/* Don't make tables transparent */
   border-collapse:collapse ;
   border-spacing:0 ;
   empty-cells:show ;
   margin:0.5em 2.5em ;
   padding:0 ;
   border:1px solid #999999 ;
}

table.simple caption {
   text-align:center ;
   caption-side:top ;
   margin:0 2.5em 0.75em ;
   padding:0 ;
   border:none ;
}

table.simple td,
table.simple th {
   text-align:center ;
   vertical-align:middle ;
   margin:0 ;
   padding:0.25em 0.5em ;
   border:1px solid #999999 ;
}

table.simple th,
table.simple td.highlight,
table.simple th.highlight {
   font-weight:bold ;
   color:inherit ;
   background:#F0F0F0 ;
}

table.simple td.lighter,
table.simple th.lighter {
   color:inherit ;
   background:#F8F8F8 ;
}

table.simple td.left,
table.simple th.left {
   text-align:left ;
}

table.simple td.center,
table.simple th.center {
   text-align:center ;
}

table.simple td.right,
table.simple th.right {
   text-align:right ;
}


/* Forms */
form {
   margin:1em 0 ;
   padding:0 ;
   border:none ;
}

input,
button,
select,
fieldset,
legend {
 font-family:Verdana,"DejaVu Sans","Bitstream Vera Sans","Lucida Sans",Arial,Helvetica,sans-serif ;
   font-size:95% ;
   color:black ;
   /* background:#f9f9ff; */ /* if enable, mucks up checkbox in IE */ 
   vertical-align:middle ;
}

button { border-radius : 10px ;
  } /* added JvS 10/10/2018 */ 

textarea {
   font-family:"Courier New", Courier, monospace ;
   font-size:100% ;
   color:black ;
   background:white ; /* changed by JvS to white from inherit */ 
   vertical-align:middle ;
}

fieldset {
   font-size:100% ;
   margin:1em 0 ;
   border:1px solid #999999 ;
}

legend {
   font-size:100% ;
   margin:0 0.5em ;
   padding:0 0.25em ;
   border:none ;
}

table.formtable {
   color:inherit ;
   background:inherit ;
   border-collapse:collapse ;
   border-spacing:0 ;
   empty-cells:show ;
   margin:0 ;
   padding:0 ;
   border:none ;
}

table.formtable td,
table.formtable th {
   text-align:justify ;
   vertical-align:middle ;
   margin:0 ;
   padding:0.25em 0.5em ;
   border:none ;
}

table.formtable th {
   text-align:center ;
   font-weight:bold ;
}

table.formtable td.label,
table.formtable th.label {
   text-align:right ;
   vertical-align:top ;
}

table.formtable td.vertspace,
table.formtable th.vertspace {
   empty-cells:show ;
   margin:0 ;
   padding:0.5em 0 ;
   height:1em ;	/* Required for IE/Win */
}

table.formtable fieldset {
   margin:0 ;
}

/* a modification for table centreing */
table.centretable {
   margin-left:auto ;
   margin-right:auto ;
}

td.centrecell {
  text-align:center ; 
  }

table.formtable fieldset td,
table.formtable fieldset th {
   margin:0.25em 0.5em ;
}

.reqfield {
   color:red ;
   background:transparent ;
   font-weight:bolder ;
}

.info {
   color:gray ;
   background:transparent ;
   font-size:90% ;
}

/* The following HTML elements should NOT be used in documents using this
   style sheet:
       address - use the #footer style instead
       q       - use &ldquo ; and &rdquo ; instead
*/


/********** Styles for Main Content **********/
#main {
   text-align:justify ;
   line-height:1.5 ;
   color:black ;
   background:white ;
   margin:0 0 0 12.5em ;
   padding:0.25em 1.5em 0.5em 1em ;
   border-left:1px solid #999999 ;
}

#main h1 {			/* Should be used once, following navhead */
   color:#999999 ;
   background:transparent ;
   margin:0 0 0.5em 0 ;
}

#main .highlight {		/* Highlight box (for warnings, etc) */
   color:inherit ;
   background:#F0F0F0 ;
   margin:1em 0 ;
   padding:1em 2.5em ;
   border:1px solid #999999 ;
}

#main .totop {			/* For "Top ^" lines in FAQs, etc */
   font-size:90% ;
   text-align:right ;
   margin:-0.75em 0 1em 0 ;
   padding:0 0 0.25em 0 ;
   border-bottom:1px solid #F0F0F0 ;
}

#main table.simple td.highlight,  /* Else "#main .highlight" will override */
#main table.simple th.highlight {
   margin:0 ;
   padding:0.25em 0.5em ;
}

/* Other styles related to the main content */
#mainlink {			/* "Skip to main content" link */
   display:none !important ;
}

#navhead {			/* "Path to this page" information */
				/* Warn:not printed out on paper */
   font-size:90% ;
}

#navhead hr {
   display:none ;
}

#endmain {
   visibility:hidden ;
   clear:both ;	/* Doesn't always work under IE/Win */
}

/********** Styles for Floating Boxes **********/
				/* "navbox" is used to provide intra/inter- */
				/* page links ; it is NOT printed out on     */
				/* paper.  "floatbox" is used to provide    */
				/* floating boxes that may appear anywhere  */
				/* in the main content ; they ARE printed.   */
.floatbox,
.navbox {
   overflow:visible ;
   font-size:95% ;
   line-height:1.25 ;
   margin:0 0 0.75em 1.5em ;
   padding:0.5em 1em ;
   border:1px solid #999999 ;
   float:right ;
   clear:right ;
}

.floatbox {
   color:black ;
   background:#F0F0F0 ;
   width:35% ;
}

.navbox {
   text-align:left ;
   color:black ;
   background:white ;
   width:12.5em ;
}

.floatbox hr,			/* Used for non-stylesheet-aware browsers */
.navbox hr {
   display:none !important ;
}

.floatbox p,
.navbox p {
   margin:0.75em 0 ;
   padding:0 ;
}

.floatbox ol,
.floatbox ul {
   margin:0.75em 0 ;
   padding:0 0 0 1.5em ;
}

.navbox ol,
.navbox ul {
   margin:0.5em 0 ;
   padding:0 0 0 1.5em ;
}

.floatbox blockquote {
   margin:0.75em 1.5em ;
   padding:0 ;
}

.floatbox pre {
   font-size:95% ;
   margin:0.75em 1.5em ;
   padding:0 ;
}

.floatbox dt {
   margin:0.75em 0 ;
   padding:0 ;
}

.floatbox dt {
   margin:0.75em 0 0.25em 0 ;
   padding:0 ;
}

.floatbox dd {
   margin:0 0 0.75em 1.5em ;
   padding:0 ;
}

#main .floatbox .highlight {
   color:inherit ;
   background:white ;
   margin:0.75em 0 ;
   padding:0.75em 1.5em ;
}

#main .floatbox table.simple {
   margin:0.75em 0 ;
}

#main .floatbox table.simple th,
#main .floatbox table.simple td.highlight,
#main .floatbox table.simple th.highlight {
   color:inherit ;
   background:white ;
   margin:0 ;
   padding:0.25em 0.5em ;
}


/********** Styles for Header **********/
				/* In this style sheet, headers are composed */
				/* of three parts:left, right and subheader */
				/* Left part is ideally an image.            */

#header {			/* Warn:not printed out on paper */
   color:#003399 ;
   background:#8CA8E6 ;
}

#header a:link,
#header a:visited {
   color:#003399 ;
   background:transparent ;
}

#header .highlight,
#header a.highlight:link,
#header a.highlight:visited {
   color:white ;
   background:transparent ;
}

/* Left part of header (ideally an image but may be a link) */
#header div.left {
   float:left ;
   clear:left ;
   margin:0 ;
   padding:0 ;
}

#header div.left img {
   display:block ;	/* Otherwise IMG is an inline, causing gaps */
}

#header div.left,
#header div.left a:link,
#header div.left a:visited {
   font-size:200% ;
   font-weight:bold ;
   text-decoration:none ;
   color:white ;
   background:transparent ;
}

#header div.left p {
   margin:0 0 0 0.25em ;
   padding:0 ;
}

#header div.left .alt {
   color:#FF9800 ;
   background:transparent ;
}

/* Right part of header is for external/global links, search, etc */

#header div.right {
   font-size:90% ;
   text-align:right ;
   margin:0 ;
   padding:0.5em 1.17em 0 1em ;
   float:right ;
   clear:right ;
}

#header div.right a:link,
#header div.right a:visited {
   margin:0 ;
   padding:0 0.5em ;
}

#header div.right form {
   margin:0 ;
   padding:0.25em 0.5em 0 0 ;
}

#header div.right form input {
   font-size:95% ;
   vertical-align:middle ;
}

/* Subheader for global links */

#header div.subheader {
   color:white ;
   background:#003399 ;
   margin:0 ;
   padding:0 ;
   border:1px solid #003399 ; /* Required for IE/Win */
   clear:both ;
}

#header div.subheader p {	/* To overcome an IE/Win unwanted padding */
				/* bug, still present in IE7.             */
   margin:0 ;
   padding:0.5em ;
}

#header div.subheader a:link,
#header div.subheader a:visited {
   font-weight:bolder ;
   color:white ;
   background:transparent ;
   margin:0 ;
   padding:0 0.5em ;
}

#header div.subheader .highlight,
#header div.subheader a.highlight:link,
#header div.subheader a.highlight:visited {
   color:#FDA05E ;
   background:transparent ;
}

/********** Styles for Left Sidebar **********/
#sidebar {			/* Warn:not printed out on paper */
   width:12.5em ;
   border-right:1px solid #999999 ;
   float:left ;
   clear:both ;
}

#sidebar div {
   font-size:95% ;
   text-align:left ;
   margin:0 ;
   padding:0.5em 1em ;
   border-bottom:1px solid #999999 ;
}

#sidebar div.lighter {
   color:inherit ;
   background:white ;
}

#sidebar p {
   margin:0.5em 0 ;
}

#sidebar .title a:link,
#sidebar .title a:visited {
   color:black ;
   background:transparent ;
}

#sidebar ul {
   list-style:none outside ;
   margin:0.5em 0 ;
   padding:0 ;
}

#sidebar ul li {
   margin:0 ;
   padding:0.125em 0 ;
}

#sidebar ul li.highlight {
   color:inherit ;
   background:white ;
   margin-left:-1em ;
   margin-right:-1em ;
   padding-left:1em ;
   border-top:1px solid #999999 ;
   border-bottom:1px solid #999999 ;
}

#sidebar ul li.highlight a:link,
#sidebar ul li.highlight a:visited {
   color:black ;
   background:transparent ;
}


/********** Styles for Footer **********/
#footer {
   font-size:90% ;
   text-align:left ;
   color:white ;
   background:#6381DC ;
   margin:0 ;
   padding:0.5em 1.67em 0.5em 15.25em ;
   clear:both ;
}

#footer a:link,
#footer a:visited {
   text-decoration:underline ;
   color:white ;
   background:transparent ;
}

#footer hr {
   display:none !important ;
}

/* End of the Sinorcaish style sheet */
/* addendum follows */

/* - <Section 5> - */
.bold { font-weight:bold !important ; }
.lighter { font-weight:lighter !important ; }
.italic { font-style:italic !important ; }
.sans {font-family:sans-serif !important ; }
.serif {font-family:serif !important ; }
.mono {font-family:monospace !important ; }

.scrollable { 
  overflow: auto; 
  }   /* allow scrolling */ 

.demo { 
  color: blue; 
  font-family:"Courier New",Courier,monospace;
  }  /* demonstration code, similar to 'pre' */ 
     /* similar to blockquote, but that is gray and not mono */ 

.breakword {
   word-wrap: break-word;
  }   /* allow words and numbers to be broken */

.goodwords {
   word-wrap: normal;
  }  /* normal word wrapping */

.cliptext {
  text-overflow: clip;
  }   /* text clipping */


/* also look at white-space : */ 


.pwd { 
  font-size:140% ; 
  padding-top:0.5em ; 
  }
 /* now, larger font for use if caps lock is on! */
.huge_pwd { 
  font-size:200% ; 
  padding-top:0.5em ; 
  }

/* specific to help menus */
.helpsize { font-size:medium ; }

.tiny { font-size:55% }
.scriptsize { font-size:73% }
.footnotesize { font-size:82% }
.small { font-size:91% }
.normalsize { font-size:100% }
.large { font-size:110% }
.Larger { font-size:131% }
.LARGEST { font-size:158% }
.huge { font-size:189% }
.HUGER { font-size:227% }

/* a tiny rubric:*/
.red { color:red ; }
.blue { color:blue ; }
.gray { color:gray ; }
.green { color:green ; }
.yellow { color:yellow ; }
.orange { color:orange ; }
.purple { color:purple ; }
.aqua { color:aqua ; }
.fuchsia { color:fuchsia ; }
.black { color:black ; }
.white { color:white ; }
.lime { color:lime ; }
.maroon { color:maroon ; }
.navy { color:navy ; }
.olive { color:olive ; }
.teal { color:teal ; }
.silver { color:silver ; }

/*   STANDARD_COLOURS = ['aqua', 'black', 'blue', 'fuchsia', 'gray', 'green', 
       'lime', 'maroon', 'navy', 'olive', 'orange', 'purple', 
       'red', 'silver', 'teal', 'white', 'yellow'] ;
*/

  /* implement this as an overbar! */

.unticked {
   border-top:1px solid #666666 ;
   height:auto ! important ; 
   width:auto ! important ; 
   text-decoration:none ; 
  }

/* - <Section 6> - */

.high_contrast { color:black ; 
   background-color:white ;  }

.muted { color:gray ; } /* an unwise choice of terminology */

.inactive { color:#666666 !important ; 
  }

.disabled {
  color:#333333 ;
  background:#D8D8D8 ;
  }

.danger { color: red ; 
  }

.important { color: black ;
  background:yellow ; 
  } 

.strikethrough {
  text-decoration:line-through ; 
  text-decoration-color:red ; /* speculative */ 
  }

.calm { color:black ;
   background-color:#89cff0 ; }



/* - <Section 7> - */
/* PICK_calendar */
.hide_pick_font {
  font-style:normal ;
  font-weight:normal ;
  font-size:14pt ;
  font-family:tahoma, verdana, sans-serif ;
}

.hide_pick_datetable { 
   background-color:#4682B4 ;
   margin:4px ;
   border-width:medium ;
   border-style:solid ;
   border-collapse:separate ; 
   border-spacing:1px ;
   
   font-style:normal ;
   font-weight:normal ;
   font-size:14pt ;
   font-family:tahoma, verdana, sans-serif ;
  }

/* 6.2 PICK_keyboard */
.hide_pick_keyboardtable { 
   background-color:#4682B4 ;
   margin:1px ;
   border-style:solid ;
   border-collapse:separate ; 
   border-spacing:1px ;
   border-radius:10px ; /* ignore non-standard similar options */
   font-style:normal ;
   font-weight:normal ;
   font-size:14pt ;
   font-family:tahoma, verdana, sans-serif ;
  }

.highlight_kbutton {
  background-color:#FF6961 ; /* pastel red */ 
  color:white ;
}

.hide_kbutton {
  /* -moz-border-radius:10px ; */
  -webkit-border-radius:10px ;
  -khtml-border-radius:10px ;
  border-radius:10px ; 
  background:white ; 
  /* margin-bottom:0.15em ; */
  }
  /* to increase the spacing between keyboard rows, up margin-bottom */

.hide_kenterbutton { /* intended for Enter key, no point in adjusting font size here */ 
  background-color:red ; 
  color:white ;
  width:100% ;
  /* -moz-border-radius:10px ; */
  -webkit-border-radius:10px ;
  -khtml-border-radius:10px ;
  border-radius:10px ;
  }

.hide_kfillbutton { 
  width:100% ;
  /* -moz-border-radius:10px ; */
  -webkit-border-radius:10px ;
  -khtml-border-radius:10px ;
  border-radius:10px ;
  /* margin-bottom:0.15em ; */
  }

.narrowpitch
  { padding:0 0 0 0 ;
    margin:0 0 ;
    line-height:18px ; 
  }
 /* http ://stackoverflow.com/questions/9670383/css-override-line-height-on-word-wrap */

.nowrap { white-space:nowrap ;
  }
  /* the problem with nowrap is the page scrolls right */

.pick_pale { color:white ;
  }

.pick_dark { color:black ;
  }

.padded { padding:1em ;
  }

.pick_std { background-color:#4682B4 ;
  }

.pick_title { background-color:#87CEFA ;
    padding:5px ;
  }

.pick_normal { background-color:white  ;
    padding:5px ;
  }

.pick_weekend { background-color:#DBEAF5 ;
    padding:5px ;
  }

.pick_bright { background-color:#FFB6C1 ;
    padding:5px ;
  }

.floatright {
  float:right ;
  }

.floatleft {
  float:left ;
  }

/* - <Section 8> - */
    .slider {
      width:100%;
      height:100%;
      background-color: #CCCCCC;
    }

/* : horizontal slider: */ 

    .slider .blob {
      position: relative;
      /* width: 15px; */ 
      width: 2%;
      height: 106%;
      background-color: #000033;
      border-radius: 15%;
      border-color: #FF0000; 
      border-width:2px ;
      cursor: pointer;
      top: -3%;
    }


  /* vertical slider */

    .slider .knob {
      position: relative;
      width: 106%;
      /* height: 15px; */ 
      height: 2%;
      background-color: #000033;
      border-radius: 15%;
      border-color: #FF0000; 
      border-width:2px ;
      cursor: pointer;
      left: -3%;
    }


/* - <Section 9> - */
.hide_slider_box{
	width:100% ;
	height:100% ;
	border:1px solid #000 ;
	overflow:hidden ;
	background:#cedce7 ;
}
.hide_slider_bar{
	width:0% ; /* test by e.g. width:33% ; */ 
	height:100% ;
	border-right:1px solid #000000 ;
	background:#d65946 ;
}
.hide_slider_proportion {
	color:#000000 ;
    font-size:15px ;
    font-style:italic ;
    font-weight:bold ;
    left:25px ;
    position:relative ;
    top:-25px ;
}

/* - <Section 10> - */
.yesbutton {
  width:180px ;
  height:60px ;
  background-color:#FF3333 ;
  color:white ;
  font-size:130% ;
  opacity:1 ; 
  }

.nobutton {
  width:180px ;
  height:60px ;
  background-color:#3333FF ;
  color:white ;
  font-size:130% ;
  opacity:1 ; 
  }

/* - <Section 11> - */
.default_selection {
   border-style:dotted ;
   border-width:medium ;
   border-color:#999999 ; 
   font-weight:bold ; 
  }

/* - <Section 12> - */
.w_b {
   color:white ;
   background-color:black ; 
  }

.NB {
  background-color:yellow ; 
  color:black ;
}

.central { 
  margin-left: auto; 
  margin-right: auto;
}

 /* fit contents e.g. video to the container */
.fitting {
  object-fit: contain;
}

.stretched {
  object-fit: fill; 
}
  /* end object-fit */ 

.clips { overflow:hidden;   
}  

.pixelated {
  image-rendering: pixelated;
}

.lucent {
  opacity: 0.5 !important ;
} 

.rounded {
  border-radius: 15px;
} 

.crisp-edges {
  image-rendering: -webkit-optimize-contrast;
  image-rendering: crisp-edges;
}

.quoted { color:#708090; /* cf blockquote, need common code */ 
} 

.shrinkwrapped {
  display: inline-block;
  }


/* - <Section 13> - */

  html { overflow:hidden ; }

/*
 
	body { 
		display:flex ;
		flex-direction:column ;
		height:100vh ;
		width:100% ;
		margin:0 0 ;
	}
*/

/*
	canvas { 
		display:inline-block ; 
		background:#202020 ; 
		width:95% ;
		height:45% ;
		box-shadow:0px 0px 10px blue ;
	}
*/

	#controls {
		display:flex ;
		flex-direction:row ;
		align-items:center ;
		justify-content:space-around ;
		height:20% ;
		width:100% ;
	}
	#record { height:15vh ; }
	#record.recording { 
		background:red ;
		background:-webkit-radial-gradient(center, ellipse cover, #ff0000 0%,lightgrey 75%,lightgrey 100%,#7db9e8 100%) ; 
		background:-moz-radial-gradient(center, ellipse cover, #ff0000 0%,lightgrey 75%,lightgrey 100%,#7db9e8 100%) ; 
	/* background:radial-gradient(center, ellipse cover, #ff0000 0%,lightgrey 75%,lightgrey 100%,#7db9e8 100%) ; */ 
	}
	#save, #save img { height:10vh ; }
	#save { opacity:0.25 ;}
	#save[download] { opacity:1 ;}
	#analyser {
		height:80% ;
		width:100% ;
		display:flex ;
		flex-direction:column ;
		justify-content:space-around ;
		align-items:center ;
	}
	@media (orientation:landscape) {
		body { flex-direction:row ;}
		#controls { flex-direction:column ; height:100% ; width:10% ;}
		#viz { height:100% ; width:90% ;}
	}

/* - <Section 14> - */
.console_text {
  color:white ;
  background-color:black ;

  position:absolute;
  word-wrap:break-word;
  overflow:auto;
  opacity:100;
  z-index:90;
  font-family:monospace;
  font-size:11pt;
 /* left:5%;
  top:10%;
  height:90%;
  width:90%; */

  /* background-color:blue; */
  /* Debug txtstyle= style='position:absolute;word-wrap:break-word;overflow:auto;opacity:100;z-index: 90;font-family:monospace;font-size:11pt;left:5%;top:10%;height:90%;width:90%;' */
}
#con_text {
  width: auto !important;
  height: auto !important; 
  overflow-y: auto; 
 /* overflow-y: scroll !important; */ 
}

.con_user {
  color:#8B0000 ;
  font-weight:bold ;
  }

.con_response {
  color:white ;
  }

.console {
  border-radius:6px ;
  border-style:none ;
  }

 /* change style of console input area */
.con_area {
  font-weight:bold ;
  background-color:#FFE4C4 ; 
  border-radius:6px ; 
  }

/* - <Section 15> - */

.clickable span { border-bottom:1px dashed #333399 ;
   height:auto ! important ;  
   width:auto ! important ;  
  } 

   /* text-decoration:none ; */
  
  /* unfortunately if you apply 'clickable' style to a DIV, it shrinks it, preventing
     things like right align. Damned if you do, damned if you don't */ 

  /* the joys of CSS */ 
.suretop {
  height:70%;
  font-size:200%; 
  }
.sureright {
  vertical-align:middle; 
  text-align:right ; 
  width:40%; 
  height:30%; 
  }
.sureleft {
  vertical-align:middle; 
  text-align:left ;
  width:40%; 
  height:30%; 
  }
/* NOT style='vertical-align:middle;align:right;width:40%;' */ 


.bottom_align span {
  position:absolute ; 
  bottom:5px ; 
  }
 /* a complete stuffup in IE */ 

.right_align span {
  right:0.4em ;
  float:right; /* adequate as long as item has width */ 
  } 

.center_align {
  text-align: center;
 }

.center_align span {
  margin-left: -15%;  /* ugh */ 
 }
  /* there is a problem in combination with bottom_align
     as the position:absolute forces the "central alignment"
     of the left margin of the text, so it is unnaturally displaced!
     ideally need a negative left margin half the width of the span element [?]
     cf. https://thoughtbot.com/blog/positioning 
     BUT the -50% seems to refer to the container, not the span tag :( 
     LOOK at calc() cf. https://developer.mozilla.org/en-US/docs/Web/CSS/calc 

    One way is to write style='--width:-50px;' in the span tag, 
      and then use margin-left: var(--width); in CSS 
  */


/* some more legacy stuff from fehr_style_big. nasty but needed */ 

.invisible { 
  display:none ;
  visibility:hidden ;
  }

.numeric {
  text-align:right ;
  }
  /* numbers should be right-aligned by default */

.marginal { 
  margin-left:2em ;
  margin-right:2em ;
  }

.headline { font-family:Helvetica, sans-serif ;
    font-size:110% ;
    padding-top:0.3em ;
    font-weight: bold ;
    /* text-decoration:underline ; */ 
  } 
/* also see:http ://stackoverflow.com/questions/12804419/css-text-decoration-underline-color */

.obscure { color:#AAAAAA ;
  background-color:#666666 ; 
  }

div { margin-top:0em ;
  }

.largetext { font-size:140% ;
  }

.bigtext { font-size:220% ;
  }

.hugetext { font-size:400% ;
  }

.paletext { color:#CCCCCC ; 
  }

.seethrough { background:transparent ;
  }

/* you cannot center e.g. a text headline without a paragraph */
.fixup { 
  /* margin-top:0; */
  text-align:center; 
  }


.Centerer
{
    display:inline-block ;
    height:100% ;
    vertical-align:middle ;
}

.tabular { 
  padding:0 ;
  border-spacing:0 ;
  }


.mostly { width:95% ;
          height:95% ;
  }


/* the end of the style sheet */

/* -END OF FILE- */