.release-date {
	font-weight: bold;
}

.release-container {
	
}

.progress-item {
	margin: 0.25em;
	padding: 0.25em;
	
	position: relative;
}

.release-block {
	width: 50%;
	border: thin solid black;
	padding: 0.5em;
	position: relative;
}


.release-block:not(:last-child) {
	margin-bottom: 0.5em;
}

.progress-container {
	border: thin outset;
	padding: 0.25em;
	border-top-left-radius: 0.5em;
	border-top-right-radius: 0.5em;
	position: relative;
}

@media screen {
	.progress-container {
		max-width: 50%;
	}	
}

@media screen and (max-width: 768px) {
	.progress-container {
		max-width: 100%;
	}
}


.progress-container > .progress-item {
	padding-left: 1em;
}

.progress-container > .progress-item {
	padding-left: 1em;
	background-color: white;
}

.progress-container > .progress-item:hover {
	background-color: #FAFAFA;
}

.progress-container > .progress-item:not(:last-child) {
	border-bottom: thin solid black;
}

.progress-container > .progress-item {
	background-size: 64px 64px;
	background-repeat: no-repeat;
	background-position: top 5px right 5px;
}


.progress-container > .progress-item.video {
	background-image: url('/images/video.png');
}

.progress-container > .progress-item.image {
	background-image: url('/images/image.png');
}

.progress-container > .progress-item.ruby {
	background-image: url('/images/ruby-source.png');
}

.itch {
	background-image: url('/images/itch-io.svg');
	background-size: 32px 32px;
	background-position: top right;
	background-repeat: no-repeat;
	
}

.logos-container {
	position: absolute;
	bottom: 0px;
	right: 0px;
	display: flex;
	/* border: thin solid black; */
}

.logo-32x32 {
	width: 32px;
	height: 32px;
}

.logo-16x16 {
	width: 16px;
	height: 16px;
}

.dragonruby {
	background-image: url('/images/logo-512x512.png');
	background-size: 32px 32px;
	background-position: bottom right;
	background-repeat: no-repeat;}

.itch-logo {
	background-image: url('/images/itch-io.svg');
	background-size: contain;
	background-repeat: no-repeat;
}

.logo-38x32 {
	width: 38px;
	height: 32px;
}

.ag-logo {
	background-image: url('/images/araelium-logo.png');
	background-size: contain;
	background-repeat: no-repeat;
}

.dr-logo {
	background-image: url('/images/logo-512x512.png');
	background-size: contain;
	background-repeat: no-repeat;
}

.link-icon {
	background-image: url('/images/link icon.png');
	background-size: contain;
	background-repeat: no-repeat;
}

a.perma {
	position: absolute;
	display: block;
	top: 0px;
	right: 0px;
	margin: 0.25em;
}

a.perma-br {
	position: absolute;
	display: block;
	bottom: 0px;
	right: 0px;
	margin: 0.25em;
}