body{
	text-align:center;
	background-image:url(background.gif);
	text-align:center;
	}
h1{
color:#608060;
}
.container{
	width:550px;
	background-image:url(text_bg.gif);
	border:1px solid black;
	}


#mContainer {
	position:relative;
	width:250px;
	height:100px;
	margin:auto;
	border:1px solid #000;
	background-color:#F8F7E4;
	padding:3px;
	z-index:11;
}

#darkLayer, #lightLayer {
	width:250px;
	height:50px;
	left:5px;
}

#darkLayer {
	background:#000;
	top:50px;
}

#lightLayer {
	background:#FFF;
	top:5px;
}

.swatch {

	display:block;
	float:left;
	width:50px;
	height:50px;
	cursor:pointer;
}


.textContainer {
	text-align:center;
	font-size:12px;
	width:375px;
	position:relative;
	margin:auto;
	z-index:1;
}

.textContainer span {
	width:50px;
	padding:0px 2px 0px 2px;
	text-align:center;
}

#controls {
	width:350px;
	position:relative;
	margin:5px auto 0px auto;
	font-size:12px;
	border-top:1px solid #000;
	padding-top:5px;
	z-index:1;
}

#controls input, select, #previewContainer input {
	border:1px solid #000;
	margin:4px;
	font-size:12px;
	padding:2px;
	width:90px;
}

.txt, select {
	background-color:#F8F7E4;
	width:90px;
}
.btn {
	background-color:#749F91;
	color:#fff;
	cursor:pointer;
}

#controls #txt {
	font-size:12px;
	border:1px solid #000;
	background-color:#F8F7E4;
	color:#000;
	width:250px;
	height:175px;
	display:none;
}

.colorTable {
	width:250px;
	padding:0;
	margin:auto;
	border:1px solid;
}

.colorTable tr td {
	width:10px;
	padding:2px;
	font-size:12px;
	border-bottom:1px solid #000;	
}

.colorTable tr td div {
	width:100%;
	height:100%;
}

#instructions {
	position:relative;
	margin:5px auto 0 auto;
	width:350px;
	text-align:left;
	font-size:12px;
	border-top:1px solid #000;
}

#instructions p {
	line-height:1.5em;
}

#credits {
	position:relative;
	margin:25px auto 0px auto;
	width:250px; 
	font-size:12px;
	border-top:1px solid #000;
	border-bottom:1px solid #000;
	height:90px;
}

#credits img {
	float:left;
	margin:5px 10px 5px 0px;
	border:1px solid #000000;
	width:80px;
	height:79px;
}

.controlsTable {
	width:350px;
	padding:0;
	margin:auto;
	font-size:12px;
}

#scrollContainer {
	width:290px;
	height:200px;
	overflow:auto;
	border-bottom:1px solid #000;
	background-color:#F8F7E4;
}

#previewContainer {
	position:absolute;
	display:none;
	width:290px;
	height:300px;
	top:50px;
	left:-20px;
	margin:auto;
	z-index:10;
	background-color:#FFFFFF;
	border:1px solid #000;
	font-size:12px;
}

#previewContainer .ctrl {
	padding:5px;
	background-color:#FFF;
	z-index:10;
}

.previewColor {
	width:50px;
	height:50px;
	border:1px solid #000;
	cursor:pointer;
	z-index:10;
}

.hr
{
height:1px;
width:550px;
}