/*
 * Cleaner Alternative Museum
 * Copyright (c) 1996-2024, Frederic Cambus
 * https://cleaner.ansilove.org
 *
 * Last Updated: 2020-10-14
 */

@font-face {
	font-family: 'Blockzone';
	src: url('/fonts/blockzone.woff2') format('woff2'),
	     url('/fonts/blockzone.woff') format('woff');
	font-weight: normal;
	font-style: normal;
}

@font-face {
	font-family: 'Spleen';
	src: url('/fonts/spleen-16x32.woff2') format('woff2'),
	     url('/fonts/spleen-16x32.woff') format('woff');
	font-weight: normal;
	font-style: normal;
}

body { background: #000; color: #fff; font-family: 'Spleen'; font-size: 32px; line-height: 32px; margin: 0; padding: 0 }

/*****************************************************************************/

a:link,a:visited { color: #ff0; text-decoration: none }
table a:link,table a:visited { color: #ffa500 }
a:hover { color: #ffa500 }

/*****************************************************************************/

img { border: 0px }
img + img { margin-left: 8px }

h1,h2 { background: #444; border-top-left-radius : 10px; color: #ff0; font-size: 32px; font-weight: normal; line-height: 32px; margin: 20px 0 0; padding: 5px 10px; }

dl { margin-top: 0 }
dt:after { content: ': ' }
dd { margin-left: 0 }

p { margin: 10px 0; text-align: justify }
p.updates { color: #aaa }
p.updates:before { content: 'Added: ' }
p.updates:after { content: '.' }
p.instructions { text-align: center }

/****************************************************************************/

table { border-spacing: 0; width: 100% }
th { color: #ff0; font-weight: normal; text-align: left; padding-top: 15px }
tr:nth-child(even) { background: #333 }

/****************************************************************************/

.content { background: #222; border-bottom-right-radius : 10px; padding: 16px; margin-bottom: 20px }
.content > p:first-child { margin-top: 0px }
.content > p:last-child { margin-bottom: 0px }

/****************************************************************************/

.artwork tr:hover { background: #ffa500 }
.artwork tr:hover a { color: #ff0 }
.artwork td:nth-child(1) { width: 15% }
.artwork td:nth-child(2) { width: 40% }
.artwork td:nth-child(3) { width: 25%; text-align: right }
.artwork td:nth-child(4) { width: 20%; text-align: right }

.demoparties td:nth-child(1) { width: 25% }
.demoparties td:nth-child(2) { width: 50% }
.demoparties td:nth-child(3) { width: 25%; text-align: right}

.statistics td:nth-child(1) { width: 80% }
.statistics td:nth-child(2) { width: 20%; text-align: right}

.releases tr:hover { background: #ffa500 }
.releases tr:hover a { color: #ff0 }
.releases td:nth-child(1) { width: 20% }
.releases td:nth-child(2) { width: 20%; text-align: center }
.releases td:nth-child(3) { width: 30%; text-align: right }
.releases td:nth-child(4) { width: 10%; text-align: center }
.releases td:nth-child(5) { width: 20%; text-align: right }

.credits li { list-style: none; text-align: center  }
.credits dt,dd { display: inline  }
.credits dt:before { content: ' - ' }
.credits dt:first-child:before { content: '' }

ul.links { margin: 0; padding: 0; text-align: center }
.links li { display: inline; list-style: none; margin: 0; padding: 0; text-align: center }
.links > li:first-child:before { content: '' }
.links > li:before { content: '- ' }

ul.bbs { margin: 10px 0 0; padding: 0 }
.bbs li { list-style: none }
.bbs dt,dd { display: inline }
.bbs dt:before { content: ' - ' }
.bbs dt:first-child:before { content: '' }

.gallery { margin: 0 32px }
.grid-item { width: 320px }

.screenshots { text-align: center }

/*****************************************************************************/

#header { background: url(/assets/cleaner.png) no-repeat center; height: 416px }
#container { width: 1400px; padding: 0; margin: 0 auto }

#footer { padding: 0 4px }
#copyright { float: left }
#validator { float: right }

/*****************************************************************************/

#menu { height: 80px; width: 1400px; margin: 16px auto; padding: 0 }
#menu li { display: inline }
#menu li a { float: left; border-top-left-radius: 10px; border-bottom-right-radius: 10px; background: #222; color: #fff; margin: 0 20px 0 0; padding: 16px 32px; overflow: hidden }
#menu a#selected { color: #ff0 }


/*****************************************************************************/

#biography img { display:block; float: left; }
#biography dl { margin-left: 274px }

/*****************************************************************************/

#caption { color: #000 }
#cboxContent { font-family: 'Blockzone'; font-size: 16px; line-height: 16px }