@font-face {
    font-family: 'source_sans_probold';
    src: url('../font/sourcesanspro-bold.woff2') format('woff2'),
         url('../font/sourcesanspro-bold.woff') format('woff');
    font-weight: normal;
    font-style: normal;

}
@font-face {
    font-family: 'source_sans_prolight';
    src: url('../font/sourcesanspro-light.woff2') format('woff2'),
         url('../font/sourcesanspro-light.woff') format('woff');
    font-weight: normal;
    font-style: normal;

}
@font-face {
    font-family: 'source_sans_proregular';
    src: url('../font/sourcesanspro-regular.woff2') format('woff2'),
         url('../font/sourcesanspro-regular.woff') format('woff');
    font-weight: normal;
    font-style: normal;

}
@font-face {
    font-family: 'source_sans_prosemibold';
    src: url('../font/sourcesanspro-semibold.woff2') format('woff2'),
         url('../font/sourcesanspro-semibold.woff') format('woff');
    font-weight: normal;
    font-style: normal;

}
* {
  box-sizing: border-box;
  margin: 0;
  padding: 0;
}

html {
	-webkit-tap-highlight-color: rgba(0, 0, 0, 0);
}

.hide {
  display: none;
}

/* Acordeón */
.acordeon {
  margin-bottom: 25px;
  width: 100%;
  max-width: 700px;
  margin: 2em auto;
      top: 0px;
    margin-top: 0px;
}

/* Contenedor del los títulos del acordeón e iconos "+" tally */
.acordeon .ctn-title-content-acordeon {
  -webkit-box-align: center;
          align-items: center;
	background-color: #d1d1d1;
	border-bottom: 1px solid #a4a4a4;
  cursor: pointer;
  display: -webkit-box;
  display: flex;
	-webkit-box-pack: justify;
	        justify-content: space-between;
	padding: 10px;
  width: 100%;
}

/* Títulos del acordeón */
.acordeon .ctn-title-content-acordeon .title-content-acordeon {
  color: #404040;
	font: bold 1.2em 'source_sans_proregular', sans-serif;
}

/* Iconos del acordeón y efecto para cuando el acordeón se cierra tally */
.acordeon .ctn-title-content-acordeon .icon-acordeon {
  color: #404040;
	-webkit-transform: rotateZ(-180deg);
	        transform: rotateZ(-180deg);
	-webkit-transition: 0.5s ease all;
	transition: 0.5s ease all;
}

/* Efecto en el icono para cuando el acordeón se abre tally */
.acordeon .ctn-title-content-acordeon .rotate-icon-acordeon {
	-webkit-transform: rotateZ(45deg);
	        transform: rotateZ(45deg);
}

/* Contenido del acordeón tally */
.acordeon .ctn-content-acordeon .content-acordeon {
	background-color:#F0ECD5;
	padding: 1em;
  line-height: 25px;
  background-color: #fdfcf4;
    padding: 1em;
    line-height: 25px;
    text-align: left;
    color: #777;
}