:root, [data-theme=flatly] {
	--alt-bgcol: #ddd;
}

[data-theme=darkly] {
	--alt-bgcol: #313539;
}

html {
	width: 100%;
	height: 100%;
	font-family: 'Noto Sans', sans-serif;
}
body {
	width: 100%;
	padding-bottom: 75px;
	min-height: calc(100% - 75px);
	position: relative;
	font-family: 'Noto Sans', sans-serif;
}

a {
	text-decoration: none;
}

.wip {
	border: 1px dashed red;
	display: none;
}

.popover {
	box-shadow: black 0px 0px 10px;
}

.dashed {
	text-decoration: underline;
	text-decoration-style: dashed;
}

.blockquote {
	margin-left: 1rem;
}

.footer {
	position: absolute;
	bottom: -75px;
	left: 0;
	width: 100%;
}

.flink {
	display: inline-block;
}
.flink img {
	max-width: 250px;
}

.chooser img {
	max-width: 150px;
}
.img-small {
	padding-left: 35px;
	padding-right: 35px;
}

.lecture {
	position: relative;
	white-space: nowrap;
	vertical-align: top;
	overflow: hidden;
}

.video {
	display: inline-block;
	vertical-align: top;
}
#video {
	width: 100%;
	object-fit: contain;
}

.slides {
	display: inline-block;
	vertical-align: top;
}
.slides img {
	width: 100%;
}

.drawer, .options {
	margin-top: 20px;
}

.drawer img {
	height: 75px;
	cursor: pointer;
}

.drawer img.current {
	opacity: 0.5;
}

.flag img {
	height: 16px;
	opacity: 0.5;
}
.flag:hover img, .flag:focus img {
	opacity: 1;
}
.flag-dan {
	margin-left: 6px;
	margin-right: 6px;
}

.ipa:before {
	content: "[";
}
.ipa {
	white-space: nowrap;
}
.ipa:after {
	content: "]";
}

.task-text input, #welcome-sure input, #welcome-words input {
	display: inline-block;
	width: 20ex;
}
#welcome-words input, .structure input, .task-updown input, #shuffled input {
	width: 40ex;
}
.sentence input {
	min-width: 30ex;
}

.task-text-area textarea {
	min-height: 100px;
}

.hyphenate img {
	max-height: 100px;
	background-color: #fff;
	padding: 10px;
}

.q:before {
	content: "Q: ";
}
.a:before {
	content: "A: ";
}

#welcome-words {
	white-space: pre-wrap;
}

.choice {
	position: relative;
}
.ch-item {
	display: inline-block;
	position: relative;
}

.ua {
	white-space: pre;
}

.hint {
	display: block;
	clear: both;
}

.btn-sm {
	padding: 0.15rem 0.3rem;
	font-size: 0.6em;
}

.table {
	width: auto;
}
.center-table {
	margin-left: auto;
	margin-right: auto;
}

.center-table th, .center-table td {
	text-align: center;
}

.body-table th, .body-table td {
	color: var(--bs-body-color);
}

.bg-unused {
	background-color: rgba(var(--bs-secondary-rgb), 0.5) !important;
}
.bg-nonexistent, .bg-nonexistent td {
	background-color: rgba(var(--bs-secondary-rgb), 0.25) !important;
}

lg-fn, lg-fn-def {
	display: none;
}
.link, .tip {
	text-decoration: underline dotted;
}
.link, .tip, .link-info {
	cursor: pointer;
}
code .tip {
	color: inherit;
}
.tip-no {
	cursor: inherit;
	text-decoration: inherit;
}

.text-left {
	text-align: left;
}

@media (max-width: 735px) {
	.ch-item + .ch-item {
		margin-top: 0.5rem;
		margin-bottom: 0.5rem;
	}
}
@media (min-width: 736px) {
	.choice {
		padding-left: calc(150px + 2rem);
		min-height: 120px;
	}
	.ch-item {
		float: left;
		clear: both;
	}
	.ch-img {
		position: absolute;
		left: 15px;
		top: 0;
	}
}
@media (max-width: 575px) {
	.navbar-brand {
		font-size: 1.0rem;
	}
	.navbar-nav {
		font-size: 0.75rem;
	}
}

@media (max-width: 991px) {
	.alternate > div:nth-child(odd) {
		background-color: var(--alt-bgcol);
	}
}
@media (min-width: 992px) {
	.alternate > div:nth-child(4n-3), .alternate > div:nth-child(4n) {
		background-color: var(--alt-bgcol);
	}
}