@charset "UTF-8";
@import "/css/reset.css";

/* CSS Document */

body { font: 16px/24px Helvetica, Arial, sans-serif; color: #eee; background: #aaa url(/media/layout/bg.jpg) center 0 no-repeat; }

h1 { font-size: 32px; line-height: 48px; }
h2 { font-size: 26px; line-height: 39px; }


#wrapper { margin: 16px auto; width: 960px; }

#header { margin: 0 0 8px; }
	#header img { border: 0 }
	#logo {  }
	
#main { width: 650px; float: left; }
	#pixels { width: 640px; height: 384px; padding: 2px; border: 3px solid #888; cursor: pointer; }
		div.pixel { width: 15px; height: 15px; border-right: 1px solid #ccc; border-bottom: 1px solid #888; float: left; }
	
#sidebar { width: 280px; height: 384px; float: right; padding: 2px 4px; border: 3px solid #ddd; background-color: #444; color: #fff; }
	#selected { width: 64px; height: 64px; background-color: #000; float: left; margin: 3px 8px 0 0; border: 3px solid #ddd; padding: 2px; }
	#selected-name { float: left; margin-top: 4px; }
	
	#palette { padding-top: 20px; cursor: pointer; position: relative; }
		div.pPixel { float: left; width: 46px; height: 40px; background-color: #000000; }

#footer {  }

/*
	----------------------------
	CLASSES
	____________________________
*/
div.clear { overflow: hidden; height: 1px; clear: both; }
img.alignRight { float: right; margin: 0 0 15px 15px; }
img.alignLeft { float: left; margin: 0 15px 15px 0; }
.error { color: #800; }