body {
	margin: 0;
	padding: 0;
	height: auto;
	overflow: auto
}

div {
	position: relative;
	display: flex;
}

.Bold {
	font-weight: bold;
}

div.DocsContent {
	flex-wrap: wrap;
}

div.Header {
	background-color: #222937;
	height: 4em;
	width: 100%;
}

div.Header img {
	margin: 0.5em;
}

div.ViewContent {
	flex-wrap: wrap;
	width: 100%;
	height: calc(100vh - 4em);
}

@media (orientation: portrait) {
	div.Content {
		width: 100%;
		min-height: calc(100vh - 4em);
	}
}

@media (orientation: landscape) {
	div.Content {
		width: calc(100% - 20em);
	}
}

div.TopicDoc {
	width: 100%;
	flex-wrap: wrap;
    flex-direction: column;
}

div.Paragraph {
	display: inline-block;
	width: calc(100% - 2em);
	margin: 1em;
}

div.TopicImage {
	width: 100%;
    justify-content: center;
}

div.TopicImage img {
	width: 80%;
	height: auto;
}

iframe.ContentIframe {
	width: 100%;
	height: 100%;
	border: none;
}