html, body { margin: 0; padding: 0; height: 100%; width: 100%; } body { background-color: #333; } .hex { float: left; margin-left: 3px; margin-bottom: -26px; } .hex .top, .hex.disabled .top { width: 0; border-bottom: 30.02221px solid #6C6; border-left: 52px solid transparent; border-right: 52px solid transparent; } .hex .middle { width: 104px; height: 60.04443px; background: #6C6; } .hex .bottom { width: 0; border-top: 30.02221px solid #6C6; border-left: 52px solid transparent; border-right: 52px solid transparent; } .hex.disabled .top { border-bottom-color: #efefef; } .hex.disabled .middle { background: #efefef; } .hex.disabled .bottom { border-top-color: #efefef; } .hex-row { clear: left; } .hex-row.even { margin-left: 53px; } /*# sourceMappingURL=style.css.map */