Malline:Hahmo/styles.css

.kw-infobox {
	width: 320px;
	margin: 0 0 24px 34px;
	float: right;
	border: 1px solid #76501f;
	background: rgba(42, 27, 12, 0.92);
	box-shadow: 0 3px 8px rgba(0, 0, 0, 0.42);
	color: #ead29a;
	font-size: 14px;
}

.kw-infobox__title {
	padding: 8px 12px;
	border-bottom: 1px solid rgba(190, 132, 54, 0.55);
	color: #e7b258;
	font-size: 21px;
	text-align: center;
}

.kw-infobox__image img {
	display: block;
	width: 100%;
	height: auto;
}

.kw-infobox dl {
	display: grid;
	grid-template-columns: 42% 58%;
	margin: 0;
}

.kw-infobox dt,
.kw-infobox dd {
	margin: 0;
	padding: 9px 11px;
	border-top: 1px solid rgba(190, 132, 54, 0.25);
}

.kw-infobox dt {
	color: #d89a42;
	font-weight: bold;
}

.kw-lead {
	font-style: italic;
	font-weight: bold;
}

.kw-runes span {
	display: inline-block;
	margin: 0 5px 5px 0;
	padding: 2px 8px;
	border: 1px solid rgba(91, 52, 11, 0.45);
	background: rgba(240, 211, 151, 0.38);
}

.kw-relations {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(145px, 1fr));
	gap: 18px;
}

.kw-relations h3 {
	margin: 0 0 5px;
	font-size: 18px;
}

.kw-ai-draft {
	margin: 0 0 20px;
	padding: 12px 15px;
	border: 1px solid #9b6727;
	background: rgba(74, 45, 12, 0.12);
	color: #4d2a08;
}

@media (max-width: 640px) {
	.kw-infobox {
		width: 100%;
		margin: 0 0 18px;
		float: none;
	}
}