#picker {
	background: #a1b3ec;
	font-family:arial, sans-serif;
	
	body {
		background: #a1b3ec;	
	}

	#submit:active,
	#generate:active {
		color:#fefefe;
		background:#7a7a7a;
	}

	#grid_data {
		text-align:center;
		width:180px;
		padding:20px;
		margin:-160px 0 0 -80px;
		border-radius: 4px;
		position:absolute;
		left:50%;
		top:50%;
		background:rgba(0,0,0,.8);
		input {
			text-align:center;
		}

		input[type="text"] {
			color:#888;
			width: 176px;
			height:12px;
			padding:3px;
			border:1px solid #fefefe;
			margin-bottom:20px;
		}

		#submit {
			color:#888;
			text-shadow:0 1px #111;
			font-size:11px;
			cursor:pointer;
			width: 80px;
			padding:3px;
			border:0 none;
			border-radius:4px;
			margin:0 auto;
			background:#444;
			box-shadow:0 1px 0 0 #777;
			display:inline-block;
		}

	}

	#floor {
		position:fixed;
		left:30%;
		top:30%;
	}

	.tile {
		background:#4eb6d8;
		border:1px solid #fff;
		&.selected {
			background:#d657c9;
		}
	}

	.tile:hover {
		background:#8ed7ed;
	}

	#generate {
		color:#888;
		text-shadow:0 1px #111;
		font-size:14px;
		text-align:center;
		width: 80px;
		padding:10px;
		border:0 none;
		border-radius:4px;
		position:fixed;
		left:20px;
		top:20px;
		background:#444;
		box-shadow:0 1px 0 0 #777;
		cursor:pointer;
	}

	#results {
		color:#fefefe;
		text-align:left;
		width:60%;
		padding:20px;
		border-radius:4px;
		margin-left:-30%;
		position:absolute;
		left:50%;
		top:40px;
		z-index:9999;
		background:rgba(0,0,0,.8);
		h1, pre {
			margin-bottom:20px;
		}

		pre {
			color:#fefefe;
			text-shadow:0 1px 0 #333;
			white-space: pre-wrap;
			padding:20px;
			border-radius:4px;
			background:#222;
		}

		#close {
			width:20px;
			height:20px;
			position:absolute;
			right:10px;
			top:10px;
			cursor:pointer;
			div {
				width:1px;
				height:20px;
				position:absolute;
				left:10;
				top:0;
				background:#fefefe;
				.rotate(45deg);
			}

			div + div {
				.rotate(-45deg);
			}
		/* close - END */
		}
	/* results - END */
	}
/* picker - END */
}