@import url('https://fonts.googleapis.com/css2?family=PT+Sans:ital,wght@0,400;0,700;1,400;1,700&display=swap');

body,h1,h2,h3,h4,h5,h6,address {
    font-family: "PT Sans", sans-serif;
}

.title {
    display: none;
}

.reader-ul {
    list-style-type: none;
    margin: 0;
    padding: 0;
}

.reader-button {
    padding-top: 20px;
    padding-bottom: 20px;
}

.reader-navbuttons {
    padding-top: 20px;
    padding-bottom: 20px;
}

.reader-navbuttons button {
    width: 40%;
}

.reader-meta {
    display: inline-block;
}

.center-div
 {
    margin: 0 auto;
    padding: 15px;
 }

.pkp_block, .block_browse {
    padding-left: 15px;
    padding-right: 15px;
    position: relative;
}

.header_view {
    text-decoration: none;
    background-color: black;
    padding-left: 20px;
}

.header_view a {
    color: white;
}

.reader-indent {
    margin-left: 48px;
    margin-right: 0;
}

.reader-tooltip {
  position: relative;
  display: inline-block;
  text-indent: 0em;
  border-bottom: 1px dotted black;
  line-height: 1em;
}

.reader-tooltip .reader-tooltiptext {
  visibility: hidden;
  width: 44vw;
  max-width: max-content;
  background-color: white;
  color: #000;
  /*border-radius: 6px;*/
  border: solid;
  border-color: black;
  border-width: 1px;
  font-size: 1.2em;

  /* Position the tooltip */
  position: absolute;
  z-index: 1;
  padding: 5px;
  top: -999px;
  left: -999px; 
}

.reader-tooltip:hover .reader-tooltiptext {
  visibility: visible;
}

.reader-tooltip::before {
    content: '';
    position: absolute;
    top: -10px; /* Adjust to center the larger target */
    left: -10px; /* Adjust to center the larger target */
    width: calc(100% + 22px); /* Increase width */
    height: calc(100% + 22px); /* Increase height */
    background: transparent; /* Keep it invisible */
    z-index: 1; /* Ensure it's above other elements if needed */
    cursor: pointer; /* Indicate interactivity */
}

/*.reader-tooltip .reader-tooltiptext::after {
  content: " ";
  position: absolute;
  top: 50%;
  right: 100%;
  margin-top: -5px;
  border-width: 5px;
  border-style: solid;
  border-color: transparent black transparent transparent;
}*/

.issue-desc img {
    max-width: 60%;
}

#readerBody {
    overflow: auto;
    margin: auto;
    margin-bottom: 40px;
    width: 100%;
    display:flex;
    height: 100vh;
    scroll-behavior: smooth;
}

#sidebarL {
    width: 16%;
    margin: 6% 10px 10px 10px;
    position: -webkit-sticky;
    position: sticky;
    top: 0;
    padding: 20px;
}

#sidebarR {
    width: 14%;
    margin: 6% 10px 10px 10px;
    position: -webkit-sticky;
    position: sticky;
    top: 0;
    padding: 15px;
}

#centerbar {
    font-size: 1.2em;
    width: 74%;
    margin: 0px;
    padding-top: 20px;
    justify-content: space-between;
    padding: 15px;
}

#readerAuthors {
    color: gray;
    padding-bottom: 20px;
}

#readerAbstract {
    border: solid;
}

#cit1 {
    scroll-margin-top: 124px;
}

#ref1 {
    scroll-margin-top: 124px;
}

@media only screen and (max-width: 722px){
    #readerBody {flex-wrap: wrap;}
    /*#readerBody :nth-child(1) {order: 2;}
    #readerBody :nth-child(2) {order: -1;}
    #readerBody :nth-child(3) {order: 3;}*/
    #centerbar {width: 100%; font-size: 1.1rem;}
    #centerbar h1 {font-size: 2rem;}
    #centerbar h2 {font-size: 1.6rem; padding-top: 10px;}
    #sidebarL {width: 100%; height: auto; margin: auto; background-color: white; font-size: 100%;}
    #sidebarR {width: 20%; text-align: right;}
    .reader-ul {width: 100%; display: flex; flex-wrap: wrap; row-gap: 10px; column-gap: 4%; justify-content: flex-start;}
    .reader-ul > li {padding: 0px;}
    .reader-ul :nth-child(1) {order: -2;}
    .reader-ul :nth-child(6) {order: -1;}
    .reader-button {width: 16%; margin-left: auto;}
    .reader-button button {width: 100%;}
    .reader-navbuttons {width: 80%;}
    .reader-tooltip .reader-tooltiptext {font-size: 1.1em;}
    .issue-desc img {max-width: 100%;}
}

@media only screen and (min-width: 600px) {

}

@media only screen and (min-width: 768px) {

}