.collapsible {
  cursor: pointer;
  user-select: none;
  display: flex;
  align-items: center;
  font-weight: bold;
  font-size: 1.2em;
  margin: 10px 0;
}

.collapsible .arrow {
  display: inline-block;
  width: 8px;
  height: 8px;
  border: solid white; /* strelica u bijeloj boji za tamnu pozadinu */
  border-width: 0 2px 2px 0;
  padding: 3px;
  transform: rotate(45deg); /* strelica udesno */
  transition: transform 0.3s ease;
  margin-left: auto; /* gura strelicu skroz desno */
}

.collapsible.active .arrow {
  transform: rotate(135deg); /* strelica prema dolje */
}

.content {
  max-height: 0;
  overflow: hidden;
  transition: max-height 0.3s ease;
  padding-left: 20px;
  margin: 0;
}

.content.show {
  max-height: 1000px; /* dovoljno veliko da se otvori sadržaj */
}