.accordion-1 {
  width: 100%;
  margin: 20px auto;
}
.accordion-1 h1, h2, h3, h4 {
  cursor: pointer;
}
.accordion-1 h2, h3, h4 {
  font-family: 'PT Sans', sans-serif;
  font-weight:400;
}
.accordion-1 h1 {
  padding:15px 20px 15px 50px;
  background-color: #15a484;
  font-family: 'Acme', sans-serif;
  font-size: 1.5rem;
  font-weight: normal;
  color: #FFF;
  text-transform:uppercase;
  background-image:url(../images/play.png);
  background-repeat:no-repeat;
  background-position:10px center;
  box-sizing:border-box;
  
}

.accordion-1 h1:hover {
  color: #4afcdc;
}
.accordion-1 h1:first-child {
  border-radius: 0 0 0 0;
}
.accordion-1 h1:last-of-type {
  border-radius: 0 0 0 0;
}
.accordion-1 h1:not(:last-of-type) {
  border-bottom: 1px dotted #1abc9c;
}
.accordion-1 div, .accordion-1 p {
  display: none;
}
.accordion-1 h2 {
  padding: 12px 25px;
  background-color: #f4f4f4;
  font-size: 1.1rem;
  color: #F00;
  border-top: 1px solid #4a494a;
}
.accordion-1 h2:hover {
}
.accordion-1 h3 {
  padding: 5px 30px;
  background-color: #b94152;
  font-size: .9rem;
  color: #ddd; 
}
.accordion-1 h3:hover {
  background-color: #a93142;
}
.accordion-1 h4 {
  padding: 5px 35px;
  background-color: #ffc25a;
  font-size: .9rem;
  color: #af720a; 
}
.accordion-1 h4:hover {
  background-color: #e0b040;
}
.accordion-1 p {
  padding: 15px 35px;
  background-color: #ddd;
  font-family: 'PT Sans', sans-serif;
  font-size: .8rem;
  color: #333;
  line-height: 1.3rem;
}
.accordion-1 .opened-for-codepen {
  display: block;
}