/* || GENERAL STYLES */

html {
  font-size: 100%; }

h1 {
  font-size: 3rem; }
h2 {
  font-size: 2.5rem; }
h3 {
  font-size: 2rem; }
h4 {
  font-size: 1.5rem; }
h5 {
  font-size: 1.25rem; }
/* for most body text, Garamond 20pt is used, i.e. 125% root element */
h6 {
  font-size: 1rem; }

h1, h2, h3, h4, h5, h6 {
  font-family: 'PT Sans', 'Gill Sans', Helvetica, Arial, Geneva, sans-serif; }


/* || DIVISION STYLES */

body {
  width: 1536px; 
  padding-left: 11em;
  font-family: 'Adobe Garamond Pro', Garamond, 'Times New Roman', Cambria, Georgia, serif; 
  font-weight: 500;
  color: purple;
  background-color: #d8da3d; }

nav, main {
  font-size: 1.25rem; }
/* elements using Garamond 20px 15pt, i.e. 125% root element */

address, footer {
  margin-top: 1em;
  padding-top: 1em;
  border-top: thin dotted; }

svg {
  font-family: 'Times New Roman', Cambria, Georgia, serif; 
  font-size: 1rem; 
  font-weight: normal; 
  filL: purple;}


/* || SVG STYLES */

.pathlabelleft { 
  font-family: 'PT Sans', 'Gill Sans', Helvetica, Arial, Geneva, sans-serif; font-size: 0.75em; text-anchor: start;}

.pathlabelright { 
  font-family: 'PT Sans', 'Gill Sans', Helvetica, Arial, Geneva, sans-serif; font-size: 0.75em; text-anchor: end;}

.pathlabel { 
  font-family: 'PT Sans', 'Gill Sans', Helvetica, Arial, Geneva, sans-serif; font-size: 0.75em; text-anchor: middle;}

.pathlabelbold { 
  font-family: 'PT Sans', 'Gill Sans', Helvetica, Arial, Geneva, sans-serif; font-size: 0.75em; text-anchor: middle; stroke: red; }
/* || text style to fit angled train text into available space; em for local use within SVG, 14px 10.5pt  */

.stafflabel { 
  font-size: 1.5em; text-anchor: middle; stroke: darkred; stroke-width: 1.0; fill: none;}
/* || staff or ticket */

.trainsolidblack {
  stroke-width: 2; stroke: black; fill: none;}

.traindashedblack {
  stroke-dasharray: 10, 2; stroke-width: 2; stroke: black; fill: none;}

.trainsolidblue {
  stroke-width: 2; stroke: blue; fill: none;}

.traindashedblue {
  stroke-dasharray: 10, 2; stroke-width: 2; stroke: blue; fill: none;}

.trainsolidgreen  {
  stroke-width: 2; stroke: darkgreen; fill: none;}

.traindashedgreen {
  stroke-dasharray: 10, 2; stroke-width: 2; stroke: darkgreen; fill: none;}

.trainsolidred {
  stroke-width: 2; stroke: red; fill: none;}

.traindashedred {
  stroke-dasharray: 10, 2; stroke-width: 2; stroke: red; fill: none;}

.moyastaleft { 
  font-family: 'PT Sans', 'Gill Sans', Helvetica, Arial, Geneva, sans-serif; font-size: 0.75em; text-anchor: start;}

.moyastaright { 
  font-family: 'PT Sans', 'Gill Sans', Helvetica, Arial, Geneva, sans-serif; font-size: 0.75em; text-anchor: end;}

.moyasta { 
  font-family: 'PT Sans', 'Gill Sans', Helvetica, Arial, Geneva, sans-serif; font-size: 0.75em; text-anchor: middle;}

.key { 
  font-size: 1rem; text-anchor: left; }

.keybig { 
  font-size: 5em; text-anchor: middle;}

.keybold { 
  font-size: 1rem; text-anchor: left; font-weight: bold;}
 

/* not in current use 

.pathdotted { ]


.pathblack {
 stroke-width: 2; stroke: black; fill: none; }

.pathblue {
  stroke: blue; }

.pathred {
  stroke: red; }

.pathgreen {
  stroke: darkgreen; }
}*/





/* || toc (/Table of Contents/List of Links/Buttons) style used for lists of links/choices  */

.toc {
  font-size: 1.25rem;
}

/* not in current use 
a.toc {
  font-size: 1.50rem;
  color: red;
}

p.toc {
  font-size: 1.25rem;
  color: skyblue;
}

#toco p {
  font-size: 1.25rem;
  color: greenyellow;
}
#tocox a {
  font-size: 1.25rem;
  color: green;
}
#tocoy p {
  font-size: 1.25rem;
  color: darkred;
}*/

 /* || NAVIGATION LINK STYLES */

ul.navbar {
  list-style-type: none;
  padding: 0;
  margin: 0;
  position: absolute;
  top: 2rem;
  left: 1rem;
  width: 9rem; }

ul.navbar li {
  background: white;
  margin: 0.5rem 0;
  padding: 0.3rem;
  border-right: 1rem solid black; }

ul.navbar a {
  text-decoration: none }

a:link {
  color: blue; }

a:hover {
  background: magenta; }

a:active {
  background: green; }

a:visited {
  color: blue; }


/* || CONTEXTUAL LINK STYLES */

/* || HEADER */

header a {
  text-decoration: none }

header a:link {
  color: purple; 
  border-bottom: 1px dotted blue; }

header a:hover {
  background: magenta; 
  border-bottom: 1px dotted blue; }

header a:active {
  background: green;
  border-bottom: 1px dotted blue;  }

header a:visited {
  color: purple;
  border-bottom: 1px dotted blue;  }

/* || RADIO BUTTONS */

label {
  border-bottom: 1px dotted blue; }  

/* 
label:hover {
  background-color: magenta; }  
*/

/* || PARAGRAPH */

p a {
  text-decoration: none }

p a:link {
  color: purple; 
  border-bottom: 1px dotted blue; }

p a:visited {
  color: purple;
  border-bottom: 1px dotted blue;  }

p a:hover {
  background: magenta; 
  border-bottom: 1px dotted blue; }

p a:active {
  background: green;
  border-bottom: 1px dotted blue;  }


/* || TEXT LAYOUT STYLES */

.narrative-fullwidth {
  width: 100%;
  margin-top: 0; }

.narrative-1col {
  width: 33%;
  margin-top: 0; }

.narrative-2col {
  width: 67%;
  column-count: 2; 
  column-fill: balance;
  Column-gap: 2em;
  column-rule: 4px double;
  margin-top: 0; }

.narrative-3col {
  width: 100%;
  column-count: 3; 
  column-fill: balance;
  Column-gap: 2em;
  column-rule: 4px double;
  margin-top: 0; }

/* 
 If this class - narrative-3col - is applied to a section, 
 a nested p margin attribute appears to be essential 
 to make the two columns level at the top.
 Thus
 .narrative-2col {
  width: 100%;
  column-count: 2; 
  column-fill: balance;
  Column-gap: 2em;
  column-rule: 2px double;
  p {margin-top: 0; }
}
*/

.page-subtitle-top-zero {
  width: 100%;
  margin-top: 0; }
/* not in current use */

.page-subtitle-bottom-zero {
  width: 100%;
  margin-bottom: 0; }
/* page-subtitle-bottom-zero */


/* || OTHER LAYOUT STYLES */

.alertbox {
  background: #f2f5d5;
  box-sizing: border-box;
  width: 67%;
  height: auto;
  padding: 20px;
  border: 5px solid gray;
  margin: 20px; 
  text-align: center; }

  
/* for image */

.container1028 {
width: 1500x;
height: auto
outline: 1px solid gray;
margin: 2em auto; }

/* NON-ACTIVE STYLES */

/* 
p.toc {
  font-size: 1.25rem; }
|| for p tags in a table of contents */

/* IE fix - not needed 
img {
width: auto;
height: 100%;
}
*/

/* .box {
            width: 1200px;

            height: 100px;
            background-color: lightblue;
            border: 2px solid blue;
            padding: 10px;
            margin: 10px;
        }
*/

/* This is a SINGLE LINE COMMENT in CSS */

/* This is a 
MULTI LINE COMMENT 
in CSS */