body { background-color: #3A3A3A; color: #555; font: 0.75em Verdana, 'Trebuchet MS', arial, sans-serif; text-align: center; margin: 15px 0; }
a { color: #72A545; background: inherit; text-decoration: none; }
a:hover { color: #006699; background: inherit; }
h1, h2, h3 { font-family: 'Trebuchet MS', Arial, sans-serif; font-weight: bold; }
h1 { font-size: 1.5em; color: #205B00; margin: 15px 0px 15px 0px; text-align: center; }
h2 { font-size: 1.3em; color: #339900; margin: 13px 0px 13px 0px; text-align: center; }
h3 { font-size: 1.1em; color: #333; margin: 13px 0px 12px 0px; }
p { margin: 12px 0px }

.hide { display: none }
.gray { color: #CCC }
.msg { margin: 20px 0; padding: 8px; font-size: 1.1em; }
.msg.error { border: 1px solid #AA4444; color: #AA4444; background-color: #EEE; }

ul, ol { margin: 10px 30px; padding: 0 15px; color: #72A545; }
    ul span, ol span { color: #666666 }
code, pre { margin: 15px 0px; padding: 10px; text-align: left; display: block; overflow: auto; font: 1em 'Lucida Console', 'courier new', monospace; background: #FAFAFA; border: 1px solid #EAEAEA; border-left: 5px solid #72A545; }

form { margin: 10px; padding: 10px; border: 1px solid #EAEAEA; background-color: #FAFAFA; text-align: center; }
fieldset { text-align: left; margin: 0 0 10px; padding: 14px; border: 0 none; background-color: #ECECEC; box-shadow: 3px 3px 4px #BBB; }
	fieldset legend { font-weight: bold; }
	fieldset label { width: 100px; margin-right: 5px; font-weight: normal; text-align: right; display: inline-block; }
	#mc label { width: 75px; }
	#mc input { width: 25px; text-align: center; margin-right: 10px; }
	#mv select { width: 75px; margin-right: 10px; }
	#mh label { width: 76px; }
	#mh select { width: 160px; }
	#mse label { width: 75px; }
	#mse input { width: 25px; text-align: center; margin-right: 10px; }
	
label { font-weight: bold; margin: 5px 0; }
select,
input { padding: 2px 3px; border: 1px solid #BBB; font: normal 1em Verdana, sans-serif; color: #777; }
textarea { width: 500px; height: 200px; padding: 4px; margin: 0px auto; font: normal 1em Verdana, sans-serif; border: 1px solid #BBB; height: 100px; display: block; color: #777; }
input[type="submit"] { margin: 10px 5px; border: 1px solid #BEBEBE; background-color: #D8D8D8; color: #333; font-size: 1.2em; padding: 3px 10px; }
input[type="submit"]:hover { background-color: #E4E4E4 }
.button { width: 200px; display: block; margin: 25px auto 10px; padding: 3px 10px; border: 1px solid #BEBEBE; background-color: #D8D8D8; color: #333333; font-size: 1.2em; }
.button:hover { background-color: #E4E4E4 }

table { border: solid 1px #C5C5C5; border-spacing: 2px; margin: 10px auto; }
	tr:nth-child(even) { background: #F8F8F8 }
	tr:nth-child(odd) { background: #EFEFEF }
		th, td.th, td { width: 40px; height: 40px; padding: 0; margin: 0; text-align: center; vertical-align: middle; }
		th, td.th { background-color: #6F6F6F; color: #FFF; border: 1px solid #9e9e9e; font-weight: bold; font-size: 0.9em; }
		td { border: 1px solid #DFDFDF; font-size: 0.85em; }
		td div { width: 100%; height: 100%; position: relative; }
			td .val { line-height: 40px; font-family: Arial; }
			td .arrow { width: 12px; height: 12px; position: absolute; background: url('images/arrows_parent.png') no-repeat; }
			td .arrow.up { bottom: -7px; left: 13px; background-position: 1px 0; }
			td .arrow.right { top: 14px; left: -7px; background-position: -11px 1px; }
			td .arrow.down { top: -7px; left: 14px; background-position: -12px -11px; }
			td .arrow.left { top: 14px; right: -7px; background-position: 0px -12px; }
		td.rock { background-color: #333 }
		td.start { background: #8DDBE4 url('images/start.png') no-repeat center center; }
		td.end { background: #5ED55C url('images/end.png') no-repeat center center; }
		td.route { background-color: #99E48D }
		td.closed { border: 1px solid #CBC574 }
		td.open { border: 1px dashed #666 }
		td.current { background: url('images/robot.png') no-repeat center center; }
		td.closed.route { border-style: solid }
		
#container { width: 650px; margin: 0 auto; padding: 15px; text-align: left; background-color: #FFF; box-shadow: 1px 1px 20px #202020; }

#controls { margin: 15px 0 30px; }
    #controls button { }
    #controls #speedometer { margin: 20px 0 5px; font-size: 1.2em; }
        #controls #speedometer span { font-weight: bold; }
    #controls #speed {  }