1/* Set the margin to 0 so we'll know that the target will be there if the content isn't flowing into a region */
2body {
3    margin: 0;
4}
5#msg-complete {
6    color: blue;
7}
8/* Set the width of the content div so that the blocks will wrap downward when they're not flowing into a region */
9#content {
10	flow-into: content;
11	width: 125px;
12}
13/* Set regions to float left so the blocks will be laid out horizontally when they're flowing into the regions */
14.region {
15	flow-from: content;
16	width: 125px;
17	height: 125px;
18	float:left;
19}
20/* Basic block */
21.block {
22	background-color: gray;
23	display: inline-block;
24    width: 100px;
25    height: 100px;
26}
27/* Set color on the target to be different than the others */
28#target-block {
29	background-color: rgb(0, 0, 0);
30}
31#target-block:hover {
32	background-color: rgb(0, 255, 0);
33}
34input:focus {
35	background-color: rgb(0, 255, 0);
36}
37#outside-region {
38	clear: both;
39	width: 125px;
40	height: 125px;
41	background-color: rgb(255, 191, 0);
42	margin: 25px;
43}
44#outside-region:hover {
45	background-color: rgb(0, 255, 0);
46}
47#log {
48	clear: both;
49}
50