/*@import url('https://fonts.googleapis.com/css2?family=Noto+Serif:ital,wght@0,400;0,700;1,400&display=swap');*/

body {
  display: flex;
  justify-content: space-around;
  font-family: "Noto Serif";
  font-size: 13pt;
  line-height: 20pt;
  margin: 0;
}

main {
  flex: 2;
  
  margin-right: 2rem;
  margin-left: 3rem;
  padding-bottom: 2rem;
  max-width: 37rem;
  text-align: justify;
  position: relative;
}

h1 {
  font-weight: normal;
  text-align: center;
  font-size: 24pt;
  line-height: 20pt;
  letter-spacing: 1px;
  margin: 2rem 0 2rem 0;
}

h2 {
  font-weight: normal;
  text-align: center;
  font-size: 20pt;
  line-height: 20pt;
  letter-spacing: 1px;
  margin: 2rem 0 2rem 0;
}

h3 {
  font-weight: normal;
  font-variant: small-caps;
  text-align: center;
  font-size: 16pt;
  line-height: 20pt;
  margin: 2rem 0 1rem 0;
}

h4 {
  font-weight: normal;
  text-align: center;
  font-size: 12pt;
  font-style: italic;
  font-variant: normal;
}

p {
  margin: 0rem;
  text-indent: 1.5rem;
}


#Place-Names p,
#Notes p {
  margin-left: 0rem;
  text-indent: -1.5rem;
}

#common_words p {
  margin-left: 1.5rem;
  margin-top: 0;
  margin-bottom: 0;
  text-indent: -2rem;
  padding-left: 2rem;
  font-size: 12pt;
}

p.note {
  font-size: 80%;
  text-align: center;
}

p.by {
  text-align: center;
  margin: 0;
}

table.percentages {
  margin-left: 3rem;
}

td.language {
  min-width: 5rem;
}

td.space {
  min-width: 12rem;
  text-align: left;
}

td.no {
  min-width: 4rem;
  text-align: right;
}

td.ditto {
  text-align: center;
  min-width: 5rem;
}

td.percent {
  text-align: center;
  min-width: 5rem;
}

td.right-bracket::after {
  vertical-align: middle;
  font-size: 300%;
  font-weight: 100;
  content: "} ";
}

.no {
  text-align: center;
}

.ditto {
  text-align: center;
}

table.Abbreviations_Table td {
  padding-left: 2rem;
  text-indent: -2rem;
  vertical-align: top;
}

.col1 {
  min-width: 6rem;
}

p.Notes {
  margin: 0.5rem;
  text-indent: -1em;
}

p.no_indent {
  margin: 0;
  text-indent: 0em;
}

.hw {
  font-variant: small-caps;
  font-size: 14pt;
}

em {
  font-style: italic;
}

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

sup {
  vertical-align: super;
  font-size: smaller;
}

.note {
  vertical-align: super;
  font-size: smaller;
}

span.pb > a {
  text-decoration: none;
  font-size: 11pt;
  color: var(--page-number-color);
  position: absolute;
  right: 100%;
  padding-right: 4em;
  font-style: normal;
  font-weight: normal;
  color: #0000ee;
}

/*span.pb>a::before {
  content: 'p';
}*/

span.pb > a:hover {
  text-decoration: underline;
}

span.pb > a:visited {
  color: #551a8b;
}


/*Nav*/

.nav {
  width: fit-content;
  position: fixed;
  z-index: 1;
  top: 10px;
  left: 10px;
  padding: 0px 0;
  background-color: #333;
}

.nav li {
  margin: 0;
  background-color: #333;
  border: none;
  text-align: left;
  display: flex;
  position: relative;
  padding: 2px 8px 2px 8px;
}

.nav li:hover {
  /*background-color: #f36f25;*/
  color: #f2f2f2;
  text-decoration: underline;
}

.nav li a {
  font-size: 14px;
  color: #f2f2f2;
  text-decoration: none;
  display: block;
}

.nav li.current {
  background-color: #F36F25;
  border-width: 10px;

}

.nav li.current a {
  color: #FFFFFF;
}

nav ul li ul {
  display: none;
  list-style-type: none;
  width: 125px;
  padding: 0px;
  margin-top: 3px;
  margin-left: -5px;
}

nav ul li:hover ul {
  display: block;
}

nav ul li:hover ul li {
  background-color: #22a13e;
  width: 125px;
  height: 30px;
  display: inline-block;
}

nav ul li ul li:hover {
  background-color: #6b1c1c;
}

nav ul li ul li a {
  color: #FFF;
  text-decoration: underline;
}

nav ul li ul li a:hover {
  text-decoration: none;
}

.nav li ul {
  display: none;
  padding: 0;
}


.nav .Parish:hover ul {
  display: block;
  position: absolute;
  left: 100%;
  /*Brings the dropdown menus up to level.*/
  top:-17px;
}

.nav .G-L:hover ul {
  display: block;
  position: absolute;
  left: 100%;
  /*Brings the dropdown menu up to level.*/
  top:-18px;
}

.sub-menu li {
  width: auto;
  white-space: nowrap;
  display: block;
  z-index: 1;
}


@media screen and (max-width: 1000px) {

  main {
   top: 3rem;
      
  }

  .nav {
      width: 100%;
      height: fit-content;
      position: fixed;
      top: 0;
      left: 0;
      text-align: center;
    
  }

  .nav li {
      margin: 0;
      background-color: #333;
      border: none;
      text-align: left;
      display: inline-block;
      position: relative;
      padding: 6px 8px 6px 8px;
  }

  .nav .Parish:hover ul, .nav .G-L:hover ul {
      display: block;
      position: absolute;
      top: 22px;
      left: 0;
      width: 150px;
  }

  .sub-menu li {
      width: auto;
      white-space: nowrap;
      display: block;
      z-index: 1;
      padding-top:0;
      padding-bottom: 0;
  }

}

@media screen and (max-width: 500px) {
  .nav a {
      text-align: center;
      float: none;
  }
}