.reviews {
  padding-top: 5px;
}

.review_section {
  overflow: hidden; /* needed for sliding */
  transition: height 0.3s ease;
  padding-top: 10px;
  display: flex;
  flex-direction: column;
  gap: 10px;
}

.review_header {
  color: black;
  text-align: center;
  font-size: 1.4em;
  border: 3px solid black;
  border-radius: 5px;
  cursor: pointer;
  list-style: none;
  height: 30px;
  line-height: 30px;
  display: grid;
  grid-template-columns: 1fr auto 1fr;
  align-items: center;
  align-self: normal;
}
.review_header > span {
    grid-column: 2;
    text-align: center;
}
.review_header::-webkit-details-marker {
  display: none;
}
.review_header::after {
  content: "";
  grid-column: 3;
  justify-self: end;  
  width: 25px;
  height: 25px;
  padding-right: 5px;
}
.review_section .review_header::after {
  transition: transform 0.2s ease;
  background: url("../resources/global/expand.svg") center / contain no-repeat;
}
.review_section[open] .review_header::after {
  transition: transform 0.2s ease;
  background: url("../resources/global/collapse.svg") center / contain no-repeat;
  transform: rotate(180deg);
}

.review {
  display: flex;
  font-size: 1.3em;
  padding: 10px;
  gap: 10px;
}

.review_content {
  width: 100%;
}

.review_title {
  font-size: 2em;
  text-align: center;
  line-height: 90px;
  display: flex;             
  align-items: center;      
  justify-content: center;   
  gap: 10px;         
  padding: 10px;  
  border-right: 2px solid;
  white-space: nowrap  
}

.review_title > img {
  width: 100px;
  height: 100px;
}

.review_preamble {
  display: flex;
  flex-direction: row;
  width: 100%;
  font-size: 0.8em;
  border-bottom: 1px solid;
}

.review_tags {
  align-self: flex-start;
  
}

.review_notes {
  align-self: flex-end;
  margin-left: auto;
  padding-right: 10px;
}

/*Rank colors*/
#SSS > .review_header {
  background-color: #ff00ff;
}
#S > .review_header {
  background-color: #ff7f7f;
}
#A > .review_header {
  background-color: #ffbf7f;
}
#B > .review_header {
  background-color: #ffdf7f;
}
#C > .review_header {
  background-color: #ffff7f;
}
#D > .review_header {
  background-color: #bfff7f;
}
#F > .review_header {
  background-color: #bf7fbf;
}