@media print {
  .acordeon input { display: none; }
  .acordeon label {
	  display: block;
    color: white;
    background: #666;
  }
  .pregunta-respuesta {
    page-break-inside: avoid; 
  }
}
@media screen {

.acordeon {
  padding: 5px;
  background: #ccc;
	border-radius: .4em;
}
.acordeon input {
	display: none;
}
.acordeon label {
  background: #666;
  background: -moz-linear-gradient(top,  #666 0%, #444 100%);
  background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#666), color-stop(100%,#444));
  background: -webkit-linear-gradient(top,  #666 0%,#444 100%);
  background: -o-linear-gradient(top,  #666 0%,#444 100%);
  background: -ms-linear-gradient(top,  #666 0%,#444 100%);
  background: linear-gradient(top,  #666 0%,#444 100%);

  color: #eee;
  text-shadow: 2px 2px 0px rgba(0,0,0, .3);
	border-radius: .25em;
	cursor: pointer;
	display: block;
	margin-bottom: .125em;
	padding: .25em 1em;
	z-index: 10;
}
.acordeon label:hover {
	background: #333;
  color: orange;
  text-shadow: 1px 1px 0px rgba(0,0,0, .3);
	padding-left: 30px;
  -webkit-transition: color,background,padding 1s ease;
  -moz-transition: color,background,padding 1s ease;
  -ms-transition: color,background,padding 1s ease;
  -o-transition: color,background,padding 1s ease;
  transition: color,background,padding 1s ease; 
}

.acordeon input:checked + label {
  color: purple;
  text-shadow: 0px 1px 0px rgba(255,255,255, .5);

  background: #eee;
  background: -moz-linear-gradient(top,  #eee 0%, #666 100%);
  background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#eee), color-stop(100%,#666));
  background: -webkit-linear-gradient(top,  #eee 0%,#666 100%);
  background: -o-linear-gradient(top,  #eee 0%,#666 100%);
  background: -ms-linear-gradient(top,  #eee 0%,#666 100%);
  background: linear-gradient(top,  #eee 0%,#666 100%);
	border-bottom-right-radius: 0;
	border-bottom-left-radius: 0;
}
.acordeon .respuesta {
	background: #eee;
	height:0px;
	max-height:0px;
	overflow:hidden;
	z-index: 9;

-webkit-transition: max-height 2s linear;
  -moz-transition: max-height 2s linear;
  -ms-transition: max-height 2s linear;
  -o-transition: max-height 2s linear;
  transition: max-height 2s linear; 

}
.acordeon .respuesta p { }
.acordeon input:checked .respuesta { }
.acordeon input:checked ~ .respuesta {
  padding: 20px;
  padding-bottom: 0px;
	border-bottom-left-radius: .25em;
	border-bottom-right-radius: .25em;
	height: auto;
	max-height: 2000px;
	overflow-y:auto;
	margin-bottom: .25em;
}

} /* Fin de media screen */
/* Tratamiento especial para móviles */
@media screen and (max-width: 750px) {
  .acordeon input:checked ~ .respuesta { padding: 0px 7px; }
}

