* {
    font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif;
  }
  
  .release-sub-container > h1 {
    margin-bottom: 10px;
    display: none;
  }
  .release-sub-container > p {
    margin-bottom: 20px;
    font-size: 20px;
  }
  .release p {
    font-size: 18px;
    background-color: white;
  }
  
  .release {
    border: 1px solid lightgrey;
    margin-bottom: 10px;
    background-color: lightgray
  }
  .release-header {
      display: flex;
      align-items: center;
      padding: 5px 10px;
  }
  .release-header h3 {
    font-size: 14px;
    text-align: right;
    flex: 1
  }
  .release.latest > .release-header > h2::after {
    content: "new";
    margin-left: 10px;
    text-transform: uppercase;
    font-size: 12px;
    color: red;
  }
  
  /* Initially hide the paragraph under the 'release' class */
  .release .release-content {
      display: none;
      padding: 10px 30px;
  }
  
  /* Style the toggle button */
  .toggle-release {
      background-color: transparent;
      color: #0074d9;
      border: none;
      padding: 0;
      cursor: pointer;
      font-size: 20px;
      margin-right: 10px;
      outline: none;
  }
  
  /* Show the paragraph when 'active' class is applied to the release container */
  .release .release-content.active {
      display: block;
  }
  
  /* Update the arrow based on the 'active' class */
  .toggle-release.active::before {
      content: "▼";
      color: #ff851b;
  }
  
  .toggle-release::before {
      content: "▲";
  }
  
  /* Hide the arrow when the release is active */
  .release.active .toggle-release::before {
      content: none;
  }