html, body{
	width:100%;
	margin:0;
	padding: 0;
	font-family: 'Lato', sans-serif;
	font-weight: 100;
	color: #dedede;
}

body{
	background: #080808;
}

#logo{
	display: block;
	width: 60px;
	margin: 20% auto 0px auto;
}

.pixel{
	fill: #ffffff44;
	transition: fill 0.66s;
}

#char_1{
	transform: translate(8px, 0px);
}

.off{
	display: none;
}

.c0{ fill: #64A6CC;}
.c1{ fill: #146899;}
.c2{ fill: #87FFEA;}
.c3{ fill: #FFCEC7;}
.c4{ fill: #CC585C;}

#textbox{
	margin: 20px auto 0 auto;
	width: 50%;
}

p#text{
	color:#ededfe;
	text-align: center;
	overflow: hidden;
	transition: 0.5s color;
/*	border-width: 0 1px 0 1px;
	border-color: #ededed;
	border-style: solid;*/
}

p#text.working{
	color:#666;
}

p:before{ content: '[';}
p:after{ content: ']';}




/* COLOR SELECTOR */

.selectColor{
	height: 20px;
	width: 20px;
	display: block;
}
.selectColor span{
	display: inline-block;
	width:4px;
	height: 20px;
}

/* COLOR SELECTOR END */