@font-face {
  font-family: "figtree";
  src:
    url("./fonts/figtree-latin-400-normal.woff2") format("woff2");
}

html {
  font-family: figtree, Arial, sans-serif;
}

html, body {
  height: 100%;
  margin: 0;
/*   overflow: hidden; */
  overflow-y: scroll;
}

a:link{color:inherit}
a:active{color:inherit}
a:visited{color:inherit}
a:hover{color:var(--ccolor, inherit)}
a{text-decoration: none;}

.main_body {
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;
}

.page_body {
/*   margin-bottom: 1em; */
/*   padding-bottom: 1em; */
}

.box {
/*   display: inline-grid; */
  display: grid;
  column-gap: 1em;
  padding-bottom: 20em;
  /* margin-top: 1em; */
}

.headerbox {
  display: flex;
  justify-content: center;
  column-gap: 4em;
}

.container{
  minimum-width: 80%;
  margin-left: 10%;
  margin-right: 10%;
  margin-bottom: 10%;
  outline: solid;
  border-radius: 20px;
  padding-top: min(1em, 5%);
  padding-bottom: min(1em, 5%);
  padding-right: 5%;
  padding-left: 4%;
  box-shadow: -0.5em 0.5em 0 0.2em var(--ccolor);
}

.container-fill{
  height: 98%;
  padding-left: 3%;
}


.main_link {
  font-size: 2em;
  font-weight: bold;
  padding: 1em;
  width: 5em;
  margin: 0.3em;
  margin-bottom: 0.3em;
  margin-top:0.0em;
  margin-right:0em;
  text-align: center;
  outline: solid;
  background-color: white;  
  border-radius: 0.5em;
  margin: 1em;
  tabindex: "0";
}

.main_link:hover{
  box-shadow:  -0.3em 0.3em 0 var(--hover-color),
   -0.3em 0.3em 0 0.075em black;
}


.main_link:focus{
  box-shadow: -0.3em 0.3em 0 var(--hover-color),
   -0.3em 0.3em 0 0.075em black;
}

.page_link {
  font-size: 1.25em;
  font-weight: bold;
  text-align: center;
  background-color: white;
  text-decoration: underline;
  text-underline-offset: 0.5em;
  text-decoration-thickness: var(--is-main, 0px);
  text-decoration-color: var(--hover-color);
}

.page_link:hover {
  text-decoration-thickness: var(--is-main, 0.15em);
}
.page_link:focus {
  text-decoration-thickness: var(--is-main, 0.15em);
}

.footerbox {
  justify-content: center;
  align-content: center;
  font-weight: bold;
  display: flex;
  column-gap: 30%;
  padding-top: 5%;
}

.paper {
  font-size: 1em;
  margin-bottom: 1em;
  list-style: none;
}

.paper::marker {
  content: var(--paper-year, '[XXXX] ')
}