.wrap {
  margin: 2em 0;
  padding: 0;
  text-align;center;
}

.wrap label {
  display: block;
  padding : 8px;
  font-family: 'Playfair Display', serif;
  font-size: 22px;
  font-weight: bold;
  cursor: pointer;
}

.wrap input[type="checkbox"] {
  display: none;
}

.wrap .hidecontent {
  height: 0;
  padding: 0;
  overflow: hidden;
  margin: 0 auto;
  border: 1px solid #ccc;
  width: 90%;
  text-align: left;
}

.switch:checked + .hidecontent {
  height: auto;
  padding: 8px;
  background: #f7f7f7;
}

  @media screen and (min-width: 768px) {
	.wrap .hidecontent {
	width: 65%;
	}

}