details {
  border: 1px solid #ddd;
  border-radius: 4px;
  margin: 0.5em 0;
  display: block;
}

details summary {
  background: linear-gradient(#eee, #f5f5f5);
  cursor: pointer;
  padding: 0.5em;
  text-shadow: none;
  border-radius: 4px;
  color: #3b3b3b;
  font-size: 1em;
  display: block;
}
details summary::-webkit-details-marker {
  color: #3b3b3b;
}

details summary .details-title {
  text-decoration: none;
  color: #3b3b3b;
}

details.collapse-processed summary::before {
  background: transparent url(menu-expanded.png) no-repeat scroll 0px 100%;
  content: "";
  float: left;
  height: 1em;
  width: 1em;
}

details.collapse-processed:not([open]) summary::before {
  background-position: 25% 35%;
  transform: rotate(-90deg);
}

details .details-wrapper {
  padding: 1em 1.5em;
  margin: 0 0 1em;
  font-size: 1em;
  line-height: 1.5em;
}