.cell {
    width: 10px;
    height: 10px;
    display: block;
    border-bottom: 1px dotted #a7a7a7;
    background: #f0f0f0; /* slightly brighter than bodybgcolour */
    padding: 1px;
}
.cell[state="1"] { background: #9d9d9d } /* medium-dark gray */
.cell:last-child { border: 0 }
.cell:hover{
    background: #fff;
    cursor: pointer;
}

.cell[state="alive"] { background: #9d9d9d } /* medium-dark gray */
.cell[state="dead"] { background: #9d9d9d } /* medium-dark gray */

.column {
    border-right: 1px dotted #a7a7a7;
    float: left;
}
.column:last-child { border: 0 }
#game-wrapper, canvas {
    margin: 0 auto;
    margin-top: 2%;
}
#grid {
    overflow: hidden;
    border: 1px dotted gray;
    float: left;
    margin-bottom: 10%;
}

/* .cell {
    width: 10px;
    height: 10px;
    display: block;
    border-bottom: 1px solid navy;
    padding: 1px;
}
.cell[state="1"] { background: #CDC1C5 }
.cell:last-child { border: 0 }
.column {
    border-right: 1px dashed cadetblue;
    float: left;
}
.column:last-child { border: 0 }
#game-wrapper {
    margin: 0 auto;
    margin-top: 2%;
}
#grid {
    overflow: hidden;
    border: 2px dotted gray;
    float: left;
    margin-bottom: 10%;
} 
*/
.float-right {
	float: right;
}

.float-left {
	float: left;
}