@import url('https://fonts.googleapis.com/css2?family=Crimson+Text:ital,wght@0,400;0,600;0,700;1,400;1,600;1,700&family=EB+Garamond:ital,wght@0,400..800;1,400..800&family=IM+Fell+DW+Pica:ital@0;1&display=swap');


#mainContent {
  font-family: 'EB Garamond', sans-serif;
  color: hsl(33,60%,12%);
  font-size: 20px;
  font-weight: 400;
}

body {
  background-image: url(../../loretan/img/lore-city-wide-2.jpg);
  background-position: bottom;
  background-size: cover;
  background-attachment: fixed;
    /*height: calc(100vh - 50px);*/
    /*width: calc(100vw - 20em);*/
}

body {
}

td > p:first-of-type {
margin: 0;
}


h1, h2, h3, h4, dt {
  color: hsl(33,50%,25%);
  /*font-family: 'Crimson Text', serif;*/
}
h2 {
  border-bottom: 1px solid black;
}
h1 { font-size: 300%; }
h2 { font-size: 175%; }
h3 { font-size: 150%; color: hsl(225,80%,30%); }
h4 { font-size: 125% }

#articleContent a {
  color: hsl(225,80%,40%);
  -webkit-transition-property: text-shadow, color;
  -webkit-transition-duration: 0.3s;
  -webkit-transition-timing-function: ease-out;
  text-decoration: none;
}
#articleContent a:hover { 
	color: hsl(225,100%,30%);
	text-shadow: 0 0 5px hsl(225,100%,65%); 
}
#articleContent a.inactive {
	color: red;
}
#articleContent a.empty:hover {
	color: rgb(255,230,77);
	text-shadow: 0 0 5px rgb(255,230,77); 
}

.section {
}

.sectionOuter {
      background: rgba(255,255,255,0.7);
    padding: 20px;
  
}

article#mainContent {
  background-color: transparent;
}


table {
  border-collapse: collapse;
}
table td, table th {
  background: hsla(33,60%,30%,0.4);
  vertical-align: top;
  border: 1px solid #DF740C;
  margin: 0;
  padding: 2px 6px;
}
table th {
  background: #243C53;
  color: white;
  text-align: left;
  font-family: 'IM Fell DW Pica', serif;
  font-weight: normal;
}
#articleView th a {
  color: white;
}
table tr:nth-child(odd) td { background: hsla(33,60%,50%,0.4); }


#sidebarContent, #leftContent {
  background: hsl(40,30%,70%);
}

#toc h1 {
  color: hsl(33,50%,25%);
}