html,
body {
	margin: 0;
	padding: 0;
	height: 100%;
	font-family: "Ms Gothic", sans-serif; color: black;
}

.about-wrapper {
	display: flex;
	flex-direction: row;
	height: 100%;
	gap: 10px;
	box-sizing: border-box;
	padding: 10px;
	background-color: white;
}

.left-col {
	display: flex;
	flex-direction: column;
	width: 300px;
	height: 100%;
	gap: 10px;
	flex-shrink: 0;
}

.scroll-box {
	height: 240px;
	overflow-y: auto;
	background-image: url("../img/bg/pattern-rainbow-stars.png");
	border: 2px inset #d5d5d5;
	padding: 8px;
}

.portrait-img {
	flex-grow: 1;
	width: 100%;
	object-fit: contain;
	max-width: 300px;
}

.right-col {
	flex-grow: 1;
	overflow-y: auto;
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	text-align: justify;
	padding-right: 10px;

}

.right-col p {
	margin-bottom: 1em;
	font-size: 0.9em;
}

.scroll-box ul {
	column-count: 2;
	font-size: smaller;
	margin: 5px;
}

.about-me-div {
	  height: 60px;
	margin: 1px;
	  background: url("../img/dividers/div-balloon-dog.gif");
	  border: none;
}