/*
	CSS Stylesheet „letters“
	Version 2023-11-16a
	© 2023 m-ds GmbH
*/

#letters {
	display         : flex;
	flex-wrap       : wrap;
	gap             : 0.5em;
	justify-content : center;
	padding         : 1em;
}

#letters > button {
	background    : linear-gradient(var(--child-list-gradient-angle), hsl(var(--child-list-hue-none), 10%, 60%), hsl(var(--child-list-hue-none), 10%, 90%));
	border        : none;
	border-radius : 50%;
	color         : hsl(var(--child-list-hue-none), 10%, 20%);
	cursor        : pointer;
	font-size     : 25px;
	height        : 50px;
	text-shadow   : 0 1px 1px hsl(var(--child-list-hue-none), 10%, 80%);
	width         : 50px;
}

@media (hover: hover) {
	#letters > button:hover {
		background : linear-gradient(#fff, #b9f);
		color      : white;
	}
}