:root {
	--margin: 10px;
}

html, body{
	overflow-x: hidden;
	margin: 0;
}

body {
	background-color: #EEE;
	color: #444;

	font-family: "Noto Sans Mono", monospace;
	font-weight: <weight>;
	font-style: normal;
	font-size: 14px;
}

html {
	-webkit-text-size-adjust: 100%;
	scrollbar-color: #999 #DDD;
}

#text-column {
	padding-top: 100px;
	text-align: right;

	h2, p {
		margin-right: 40px;
		margin-left: 40px;
	}

	h2 {
		margin-bottom: 0px;

		a {
			text-decoration: none;
			color: #444;
		}

		a:hover {
			color: #339;
		}
	}

	p.small {
		margin-bottom: 2em;
		margin-top: 0px;
		font-size: 10px;
		color: #666;

		a {
			text-decoration: none;
			color: #666;
		}

		a:hover {
			color: #55A;
		}
	}

	p.small2 {
		margin-top: 2em;
		font-size: 10px;
		color: #666;

		a {
			text-decoration: none;
			color: #666;
		}

		a:hover {
			color: #55A;
		}
	}
}

#photo-column-1, #photo-column-2 {
	padding: 0px;
	z-index: 99;
	margin: 0px;

	padding-bottom: var(--margin);

	transition: transform 0.75s ease;
	transform: translate(0, 0);

	img {
		transition: transform 0.25s ease, opacity 0.5s ease;
		padding-right: var(--margin);
		padding-top: var(--margin);
		box-sizing: border-box;
		display: block;
		width: 100%;
	}

	img:hover {
		transform: scale(1.02);
	}
}

div.fade-out > img {
	opacity: 0 !important;
}

div.no-swap {
	transition: none !important;
}

div.no-transform > img:hover {
	transform: none !important;
}

#backdrop {
	background-color: "black";
}