.hx-redondo {
  padding: 0.25em !important;
  border-radius: 25px;
	border: 3px solid #FFFFFF;
}

.hx-padding1 {
  padding: 1em !important;
	margin-top: 1em !important;
	margin-bottom: 1em !important;	
}

.hx-azul {
  border: 3px solid #0000FF !important;
}

.IMG-text-center {
	text-align:center;
}

/* Diccionario de nombres*/
.button-container {
	display: flex;
  flex-wrap: wrap;
  justify-content: center;
  align-items: center;
  max-width: 960px;
  margin: 0 auto;
}

.button-container a {
  margin: 5px;
  padding: 10px 20px;
    font-size: 16px;
    font-weight: bold;
		text-align: center;
		text-decoration: none;
    color: #fff;
    background-color: #8ED1FC;
    border: 2px solid blue;
    border-radius: 5px;
    cursor: pointer;
    flex-basis: calc(16.66% - 10px);
  }
.button-container a:hover {
	background-color: #00F; 
}

@media screen and (max-width: 480px) {
	.button-container a {
  	padding: 8px 16px;
  	font-size: 14px;
  	flex-basis: calc(50% - 10px);
  }
}
/* Fin diccionario de nombres*/

h2 {
  position: relative;
}

h2::after {
  content: '';
  position: absolute;
  left: 0;
  bottom: -5px; /* Ajusta el valor para cambiar la posición vertical de la línea */
  width: 100%;
  height: 4px; /* Ajusta el valor para cambiar el grosor de la línea */
  background-color: #000; /* Cambia el color de la línea si lo deseas */
}

h3 {
  position: relative;
}

h3::after {
  content: '';
  position: absolute;
  left: 0;
  bottom: -5px; /* Ajusta el valor para cambiar la posición vertical de la línea */
  width: 100%;
  height: 2px; /* Ajusta el valor para cambiar el grosor de la línea */
  background-color: #000; /* Cambia el color de la línea si lo deseas */
}

/* Caja de autor */
.author-box p+p {
    color: #585858;
}

.author-box {
	border: 1px solid #6c726e;
  padding: 10px;
  border-radius: 10px;
  background-color: #ffffff;
  margin-bottom: 1rem;
  box-shadow: 6px 6px 6px #6c726e;
}