html, body {
	font-family: 'League Spartan', sans-serif;
}

.alphabet-list .alphabet-list-letter {
	display: block;
	text-decoration: none;
	color: #2c2c2c;
	border-bottom: 4px solid #dcdcdc !important;
	cursor: pointer;
}

.alphabet-list .alphabet-list-letter:hover {
/*	border-color: #4eb1f2 !important;*/
	color: #29a863;
	border-color: #2ebd70 !important;
}

/* Botón de pronunciación  */
.btn-play-pronunciation {
	border: 0;
	background: #eeeeee;
	display: flex;
	align-items: center;
	justify-content: center;
	padding: 0.5rem 1rem;
	border-radius: 6px;
	color: #272727;
}

.btn-play-pronunciation.disabled {
	color: #b1b1b1 !important;
}

.btn-play-pronunciation .btn-play-pronunciation-icon {
	display: block !important;
	margin-right: .3rem;
}

.btn-play-pronunciation .btn-play-pronunciation-text {

}

/* Clase que se activa cuándo se da click a una pronunciación */
.current-pronunciation-button {
	color: #0494c4;
	background: #b5edff;
}

/* Personalizamos los componentes de busqueda  */

.searchModalIsOpen .modal-backdrop.show {
	background: transparent;
}

#searchModal .modal-content {
	box-shadow: 0px 3px 5px 4px rgba(0,0,0,.1);
}

#searchModal #searchResults {
	margin: 0;
	padding: 0;
}

#searchModal #searchResults li {
	list-style-type: none;
}

#searchModal #searchResults li a {
	display: block;
	text-decoration: none;
	padding: .2rem .5rem;
}

#searchModal #searchResults li a:hover {
	background: #efefef;
}

#searchModal #searchResults .character {
	font-size: 1.2rem;
	color: #000;
}

#searchModal #searchResults .characterType {
	font-size: 0.7rem;
	color: #5a5a5a;
}