body {
	margin: 0px;
	/*height: calc(100vh - 16px);*/
	/*height: calc(200vh - 16px);*/
	height: 100%;
	width: 100%;
}

.flex-row {
	display: flex;
}
.flex-col {
	display: flex;
	flex-direction: column;
}
.flex-wrap {
	flex-wrap: wrap;
}
.flex-grow {
	flex-grow: 1;
}

.root {
	padding: 8px;
}
.root .leaf {
	margin: 8px;
	font-size: x-large;
	/*font-size: large;*/
}

.s12 {
	width: 100%;
}
.s6 {
	width: 50%;
}
.leaf.s6 {
	width: calc(50% - 16px);
}

.chords-text-nocols {
	height: 98%;
	overflow: scroll;
}

.chords-text {
	--ncols: 3;

	-webkit-columns: var(--ncols);
	-moz-columns: var(--ncols);
	columns: var(--ncols);

	/*column-count: var(--ncols);*/
	column-gap: 40px;
	column-rule-style: solid;
	/*column-width: 100px;*/
	/*width: 100%;*/
	margin: 10px;
}

.chords {
	height: 100%;
}