


 @font-face {
      font-family: 'Internet Friend';
      src: url('/Internet Friends.ttf') format('truetype');
      font-weight: normal;
      font-style: normal;
 }

h1 {
font-family: 'Internet Friend';
font-size: 30px;
color: black ;
text-align: center;

}

body {
  -ms-overflow-style: none;  /* Internet Explorer 10+ */
  scrollbar-width: none;  /* Firefox */
}

body::-webkit-scrollbar { 
  display: none;  /* Safari and Chrome */
}

  p, a, details, li  {
    font-size: 15px;
    margin: 8px;
}

  .wrapper {
    background: transparent;
    background-size: 100%;
    max-width: 800px;
    margin: 10px auto 10px auto;
    padding: 0%;    
}
  

 .top {
     margin-top: 0px;
    text-align: center;
  }

  .year {
    position: -webkit-sticky;
    position: sticky;
    top: 40px;
    margin-left: -100px;
    z-index: -1;
    margin-bottom: -30px;
  }

  .chart {
    display: flex;
  }

  .date, .topdate {
    width: 7%;
    justify-content: center;
  }

  .title, .author, .rating, .date  {
    border: 2px gray;
    border-style: dashed none none solid;
    align-items: center;
    display: flex;
  }

  .title, .toptitle {
    width: 26%;
  }

  .author, .topauthor {
    width: 27%;
  }

  .toprating {
    width: 5%;
    margin-left: -5px;
  }

  #topchart {
     margin-top: 0px;
    margin-bottom: 0px;
    text-align: center;
  }

  .rating {
    width: 5%;
    justify-content: center;
  }

  .review, .topreview {
    width: 35%;
  }

  .review {
    border-style: dashed solid none solid;
    border-color: gray;
    border-width: 2px;
    align-items: center;
    display: flex;
  }
  
  summary {
    cursor: pointer;
    outline: none;
    padding-left: 30px;
    background-image: url('https://forestcake.carrd.co/assets/images/gallery32/ac8b62e5.gif?v=f4645532');
    background-repeat: no-repeat;
    background-position: left center;
    background-size: 20px;
}

summary::-webkit-details-marker {
    display: none;
}

summary::marker {
    content: "";
}

details[open] > summary {
    background-image: url('https://forestcake.carrd.co/assets/images/gallery33/42cd080c.gif?v=f4645532');
}
  
