/* Global */
html {
	background-repeat: repeat;
	background-color: #111111;

	font-family: "Open Sans", sans-serif;
	font-weight: 400;
	font-size: 24px;
	color: white;

	overflow-x: hidden;
}

body {
	margin: 0;
	padding: 0;
}

div {
	margin: 0;
	padding: 0;
}

button {
	border-color: #333333;
	border-style: solid;
	border-radius: 6px;
	border-width: 2px;

	color: black;
	background-color: white;

	padding: 6px;
	margin: 6px 6px 12px;

	font-size: 18px;
	font-weight: bold;

	box-shadow: 0 5px grey;

	touch-action: manipulation;
}

button:active {
	box-shadow: 0 2px grey;
	transform: translateY(3px);
}

.button-red {
	color: black;
	background-color: lightcoral;
}

.button-yellow {
	color: black;
	background-color: lightyellow;
}

.button-green {
	color: black;
	background-color: lightgreen;
}

.popup-modal {
	z-index: 100;
	width: 100%;
	height: 100%;
	min-height: 100%;
	min-width: 100%;
	position: absolute;
	top: 0;
	left: 0;
	align-content: center;
	text-align: center;
	background-color: black;
}

input[type="text"] {
	text-align: center;

	background-color: white;
	color: black;

	border: 1px solid white;

	font-size: 18px;
	line-height: 18px;
	min-height: 24px;

	width: 80%;
	max-width: 256px;
}

input[type="checkbox"] {
	transform: scale(2);
	margin: 12px;
}

.response {
	font-size: 18px;
}

h1 {
	font-size: 28px;
	text-align: center;
	font-weight: bold;

	color: white;

	padding: 0;
	margin: 0;
}

h2 {
	font-size: 18px;
	text-align: center;
	font-weight: normal;

	padding: 0;
	margin: 0;
}

progress {
	width: 80%;
	max-width: 400px;
	height: 24px;

	color: green;
	background-color: white;
}

a:link { color: #dddddd; text-decoration: none; }
a:visited { color: #dddddd; text-decoration: none; }
a:hover { color: white; text-decoration: none; }
a:active { color: #dddddd; text-decoration: none; }

/* Header */
.rown-logo {
	margin: 0 auto;
	padding: 0;

	width: 85%;
	max-width: 768px;

	display: block;
}

hr {
	border: 0;
	height: 8px;
	box-shadow: white;
	color: white;
	background-color: white;

	margin: 0;
	padding: 0;
}


/* Body */
.content-center {
	margin: 0 auto;
	padding: 0;

	text-align: center;
}

.album-container {
	height: auto;
}

.gallery-item {
	width: 100%;
	height: 100%;

	max-width: 85vw;
	max-height: 60vh;

	object-fit: scale-down;
}

table {
	margin-left: auto;
	margin-right: auto;

	background-color: #121212;
}

td {
	border: 12px;
}

tr:nth-child(even) {
	background-color: #444444;
}

.text-notice {
	color: yellow;
	font-weight: bold;
}


/* Footer */
.content-footer {
	text-align: center;
}

.footer-logos {
	display: inline-block;
	margin-left: auto;
	margin-right: auto;
	height: 96px;
}

.host-credit {
	margin: 0;
	padding: 0 0 12px;

	color: #dddddd;

	line-height: 18px;
	font-size: 18px;
}

.host-credit a img {
	width: 18px;
	height: 18px;

	margin: 0;
	padding: 0;
}

.album-gallery-wrapper {
	display: flex;
	flex-direction: column;
	width: 100%;
	height: 100%;
	position: absolute;
}

.album-gallery-header {
	height: fit-content;
}

.album-gallery-content {
	flex: 1;
	font-weight: bold;
	display: flex;
	justify-content: center;
	align-items: center;
}

.album-gallery-footer {
	height: fit-content;
}

.album-gallery-format {
	padding: 0;
	margin: 0;
}

.album-gallery-fill {
	background-size: contain;
	background-position: center;
	background-repeat: no-repeat;

	min-height: 256px;

	background-color: transparent;
}

.album-gallery-notice {
	width: 100%;
	font-weight: normal;
}