Skip to content

Instantly share code, notes, and snippets.

@ivkusto
Created November 5, 2019 16:20
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save ivkusto/174179ba3f56f98d3b2230f8bb7e0d28 to your computer and use it in GitHub Desktop.
Save ivkusto/174179ba3f56f98d3b2230f8bb7e0d28 to your computer and use it in GitHub Desktop.
<style>
body {
margin: 0
}
input {
display: none;
}
label {
background: #745853;
width: 30px;
height: 30px;
display: block;
}
label:nth-of-type(2n+1) {
background: #f4cd8d;
}
label:nth-of-type(2n+9) {
background: #745853;
}
label:nth-of-type(2n+10) {
background: #f4cd8d;
}
label:nth-of-type(2n+18) {
background: #745853;
}
label:nth-of-type(2n+17) {
background: #f4cd8d;
}
label:nth-of-type(2n+25) {
background: #745853;
}
label:nth-of-type(2n+26) {
background: #f4cd8d;
}
label:nth-of-type(2n+34) {
background: #745853;
}
label:nth-of-type(2n+33) {
background: #f4cd8d;
}
label:nth-of-type(2n+41) {
background: #745853;
}
label:nth-of-type(2n+42) {
background: #f4cd8d;
}
label:nth-of-type(2n+50) {
background: #745853;
}
label:nth-of-type(2n+49) {
background: #f4cd8d;
}
label:nth-of-type(2n+57) {
background: #745853;
}
label:nth-of-type(2n+58) {
background: #f4cd8d;
}
form {
width: 240px;
height: 240px;
display: flex;
flex-direction: row;
flex-wrap: wrap;
margin: 0;
}
input:checked[id="something1"]~label[for="something11"] {
background: #0000ff !important;
}
input:checked[id="something1"]~label[for="something18"] {
background: #0000ff !important;
}
input:checked[id="something2"]~label[for="something12"] {
background: #0000ff !important;
}
input:checked[id="something2"]~label[for="something19"] {
background: #0000ff !important;
}
input:checked[id="something2"]~label[for="something17"] {
background: #0000ff !important;
}
input:checked[id="something3"]~label[for="something13"] {
background: #0000ff !important;
}
input:checked[id="something3"]~label[for="something20"] {
background: #0000ff !important;
}
input:checked[id="something3"]~label[for="something18"] {
background: #0000ff !important;
}
input:checked[id="something3"]~label[for="something9"] {
background: #0000ff !important;
}
input:checked[id="something4"]~label[for="something14"] {
background: #0000ff !important;
}
input:checked[id="something4"]~label[for="something21"] {
background: #0000ff !important;
}
input:checked[id="something4"]~label[for="something19"] {
background: #0000ff !important;
}
input:checked[id="something4"]~label[for="something10"] {
background: #0000ff !important;
}
input:checked[id="something5"]~label[for="something15"] {
background: #0000ff !important;
}
input:checked[id="something5"]~label[for="something22"] {
background: #0000ff !important;
}
input:checked[id="something5"]~label[for="something20"] {
background: #0000ff !important;
}
input:checked[id="something5"]~label[for="something11"] {
background: #0000ff !important;
}
input:checked[id="something6"]~label[for="something16"] {
background: #0000ff !important;
}
input:checked[id="something6"]~label[for="something23"] {
background: #0000ff !important;
}
input:checked[id="something6"]~label[for="something21"] {
background: #0000ff !important;
}
input:checked[id="something6"]~label[for="something12"] {
background: #0000ff !important;
}
input:checked[id="something7"]~label[for="something24"] {
background: #0000ff !important;
}
input:checked[id="something7"]~label[for="something22"] {
background: #0000ff !important;
}
input:checked[id="something7"]~label[for="something13"] {
background: #0000ff !important;
}
input:checked[id="something8"]~label[for="something23"] {
background: #0000ff !important;
}
input:checked[id="something8"]~label[for="something14"] {
background: #0000ff !important;
}
input:checked[id="something9"]~label[for="something3"] {
background: #0000ff !important;
}
input:checked[id="something9"]~label[for="something19"] {
background: #0000ff !important;
}
input:checked[id="something9"]~label[for="something26"] {
background: #0000ff !important;
}
input:checked[id="something10"]~label[for="something4"] {
background: #0000ff !important;
}
input:checked[id="something10"]~label[for="something20"] {
background: #0000ff !important;
}
input:checked[id="something10"]~label[for="something27"] {
background: #0000ff !important;
}
input:checked[id="something10"]~label[for="something25"] {
background: #0000ff !important;
}
input:checked[id="something11"]~label[for="something5"] {
background: #0000ff !important;
}
input:checked[id="something11"]~label[for="something1"] {
background: #0000ff !important;
}
input:checked[id="something11"]~label[for="something21"] {
background: #0000ff !important;
}
input:checked[id="something11"]~label[for="something28"] {
background: #0000ff !important;
}
input:checked[id="something11"]~label[for="something26"] {
background: #0000ff !important;
}
input:checked[id="something11"]~label[for="something17"] {
background: #0000ff !important;
}
input:checked[id="something12"]~label[for="something6"] {
background: #0000ff !important;
}
input:checked[id="something12"]~label[for="something2"] {
background: #0000ff !important;
}
input:checked[id="something12"]~label[for="something22"] {
background: #0000ff !important;
}
input:checked[id="something12"]~label[for="something29"] {
background: #0000ff !important;
}
input:checked[id="something12"]~label[for="something27"] {
background: #0000ff !important;
}
input:checked[id="something12"]~label[for="something18"] {
background: #0000ff !important;
}
input:checked[id="something13"]~label[for="something7"] {
background: #0000ff !important;
}
input:checked[id="something13"]~label[for="something3"] {
background: #0000ff !important;
}
input:checked[id="something13"]~label[for="something23"] {
background: #0000ff !important;
}
input:checked[id="something13"]~label[for="something30"] {
background: #0000ff !important;
}
input:checked[id="something13"]~label[for="something28"] {
background: #0000ff !important;
}
input:checked[id="something13"]~label[for="something19"] {
background: #0000ff !important;
}
input:checked[id="something14"]~label[for="something8"] {
background: #0000ff !important;
}
input:checked[id="something14"]~label[for="something4"] {
background: #0000ff !important;
}
input:checked[id="something14"]~label[for="something24"] {
background: #0000ff !important;
}
input:checked[id="something14"]~label[for="something31"] {
background: #0000ff !important;
}
input:checked[id="something14"]~label[for="something29"] {
background: #0000ff !important;
}
input:checked[id="something14"]~label[for="something20"] {
background: #0000ff !important;
}
input:checked[id="something15"]~label[for="something5"] {
background: #0000ff !important;
}
input:checked[id="something15"]~label[for="something32"] {
background: #0000ff !important;
}
input:checked[id="something15"]~label[for="something30"] {
background: #0000ff !important;
}
input:checked[id="something15"]~label[for="something21"] {
background: #0000ff !important;
}
input:checked[id="something16"]~label[for="something6"] {
background: #0000ff !important;
}
input:checked[id="something16"]~label[for="something31"] {
background: #0000ff !important;
}
input:checked[id="something16"]~label[for="something22"] {
background: #0000ff !important;
}
input:checked[id="something17"]~label[for="something11"] {
background: #0000ff !important;
}
input:checked[id="something17"]~label[for="something2"] {
background: #0000ff !important;
}
input:checked[id="something17"]~label[for="something27"] {
background: #0000ff !important;
}
input:checked[id="something17"]~label[for="something34"] {
background: #0000ff !important;
}
input:checked[id="something18"]~label[for="something12"] {
background: #0000ff !important;
}
input:checked[id="something18"]~label[for="something3"] {
background: #0000ff !important;
}
input:checked[id="something18"]~label[for="something1"] {
background: #0000ff !important;
}
input:checked[id="something18"]~label[for="something28"] {
background: #0000ff !important;
}
input:checked[id="something18"]~label[for="something35"] {
background: #0000ff !important;
}
input:checked[id="something18"]~label[for="something33"] {
background: #0000ff !important;
}
input:checked[id="something19"]~label[for="something13"] {
background: #0000ff !important;
}
input:checked[id="something19"]~label[for="something4"] {
background: #0000ff !important;
}
input:checked[id="something19"]~label[for="something2"] {
background: #0000ff !important;
}
input:checked[id="something19"]~label[for="something9"] {
background: #0000ff !important;
}
input:checked[id="something19"]~label[for="something29"] {
background: #0000ff !important;
}
input:checked[id="something19"]~label[for="something36"] {
background: #0000ff !important;
}
input:checked[id="something19"]~label[for="something34"] {
background: #0000ff !important;
}
input:checked[id="something19"]~label[for="something25"] {
background: #0000ff !important;
}
input:checked[id="something20"]~label[for="something14"] {
background: #0000ff !important;
}
input:checked[id="something20"]~label[for="something5"] {
background: #0000ff !important;
}
input:checked[id="something20"]~label[for="something3"] {
background: #0000ff !important;
}
input:checked[id="something20"]~label[for="something10"] {
background: #0000ff !important;
}
input:checked[id="something20"]~label[for="something30"] {
background: #0000ff !important;
}
input:checked[id="something20"]~label[for="something37"] {
background: #0000ff !important;
}
input:checked[id="something20"]~label[for="something35"] {
background: #0000ff !important;
}
input:checked[id="something20"]~label[for="something26"] {
background: #0000ff !important;
}
input:checked[id="something21"]~label[for="something15"] {
background: #0000ff !important;
}
input:checked[id="something21"]~label[for="something6"] {
background: #0000ff !important;
}
input:checked[id="something21"]~label[for="something4"] {
background: #0000ff !important;
}
input:checked[id="something21"]~label[for="something11"] {
background: #0000ff !important;
}
input:checked[id="something21"]~label[for="something31"] {
background: #0000ff !important;
}
input:checked[id="something21"]~label[for="something38"] {
background: #0000ff !important;
}
input:checked[id="something21"]~label[for="something36"] {
background: #0000ff !important;
}
input:checked[id="something21"]~label[for="something27"] {
background: #0000ff !important;
}
input:checked[id="something22"]~label[for="something16"] {
background: #0000ff !important;
}
input:checked[id="something22"]~label[for="something7"] {
background: #0000ff !important;
}
input:checked[id="something22"]~label[for="something5"] {
background: #0000ff !important;
}
input:checked[id="something22"]~label[for="something12"] {
background: #0000ff !important;
}
input:checked[id="something22"]~label[for="something32"] {
background: #0000ff !important;
}
input:checked[id="something22"]~label[for="something39"] {
background: #0000ff !important;
}
input:checked[id="something22"]~label[for="something37"] {
background: #0000ff !important;
}
input:checked[id="something22"]~label[for="something28"] {
background: #0000ff !important;
}
input:checked[id="something23"]~label[for="something8"] {
background: #0000ff !important;
}
input:checked[id="something23"]~label[for="something6"] {
background: #0000ff !important;
}
input:checked[id="something23"]~label[for="something13"] {
background: #0000ff !important;
}
input:checked[id="something23"]~label[for="something40"] {
background: #0000ff !important;
}
input:checked[id="something23"]~label[for="something38"] {
background: #0000ff !important;
}
input:checked[id="something23"]~label[for="something29"] {
background: #0000ff !important;
}
input:checked[id="something24"]~label[for="something7"] {
background: #0000ff !important;
}
input:checked[id="something24"]~label[for="something14"] {
background: #0000ff !important;
}
input:checked[id="something24"]~label[for="something39"] {
background: #0000ff !important;
}
input:checked[id="something24"]~label[for="something30"] {
background: #0000ff !important;
}
input:checked[id="something25"]~label[for="something19"] {
background: #0000ff !important;
}
input:checked[id="something25"]~label[for="something10"] {
background: #0000ff !important;
}
input:checked[id="something25"]~label[for="something35"] {
background: #0000ff !important;
}
input:checked[id="something25"]~label[for="something42"] {
background: #0000ff !important;
}
input:checked[id="something26"]~label[for="something20"] {
background: #0000ff !important;
}
input:checked[id="something26"]~label[for="something11"] {
background: #0000ff !important;
}
input:checked[id="something26"]~label[for="something9"] {
background: #0000ff !important;
}
input:checked[id="something26"]~label[for="something36"] {
background: #0000ff !important;
}
input:checked[id="something26"]~label[for="something43"] {
background: #0000ff !important;
}
input:checked[id="something26"]~label[for="something41"] {
background: #0000ff !important;
}
input:checked[id="something27"]~label[for="something21"] {
background: #0000ff !important;
}
input:checked[id="something27"]~label[for="something12"] {
background: #0000ff !important;
}
input:checked[id="something27"]~label[for="something10"] {
background: #0000ff !important;
}
input:checked[id="something27"]~label[for="something17"] {
background: #0000ff !important;
}
input:checked[id="something27"]~label[for="something37"] {
background: #0000ff !important;
}
input:checked[id="something27"]~label[for="something44"] {
background: #0000ff !important;
}
input:checked[id="something27"]~label[for="something42"] {
background: #0000ff !important;
}
input:checked[id="something27"]~label[for="something33"] {
background: #0000ff !important;
}
input:checked[id="something28"]~label[for="something22"] {
background: #0000ff !important;
}
input:checked[id="something28"]~label[for="something13"] {
background: #0000ff !important;
}
input:checked[id="something28"]~label[for="something11"] {
background: #0000ff !important;
}
input:checked[id="something28"]~label[for="something18"] {
background: #0000ff !important;
}
input:checked[id="something28"]~label[for="something38"] {
background: #0000ff !important;
}
input:checked[id="something28"]~label[for="something45"] {
background: #0000ff !important;
}
input:checked[id="something28"]~label[for="something43"] {
background: #0000ff !important;
}
input:checked[id="something28"]~label[for="something34"] {
background: #0000ff !important;
}
input:checked[id="something29"]~label[for="something23"] {
background: #0000ff !important;
}
input:checked[id="something29"]~label[for="something14"] {
background: #0000ff !important;
}
input:checked[id="something29"]~label[for="something12"] {
background: #0000ff !important;
}
input:checked[id="something29"]~label[for="something19"] {
background: #0000ff !important;
}
input:checked[id="something29"]~label[for="something39"] {
background: #0000ff !important;
}
input:checked[id="something29"]~label[for="something46"] {
background: #0000ff !important;
}
input:checked[id="something29"]~label[for="something44"] {
background: #0000ff !important;
}
input:checked[id="something29"]~label[for="something35"] {
background: #0000ff !important;
}
input:checked[id="something30"]~label[for="something24"] {
background: #0000ff !important;
}
input:checked[id="something30"]~label[for="something15"] {
background: #0000ff !important;
}
input:checked[id="something30"]~label[for="something13"] {
background: #0000ff !important;
}
input:checked[id="something30"]~label[for="something20"] {
background: #0000ff !important;
}
input:checked[id="something30"]~label[for="something40"] {
background: #0000ff !important;
}
input:checked[id="something30"]~label[for="something47"] {
background: #0000ff !important;
}
input:checked[id="something30"]~label[for="something45"] {
background: #0000ff !important;
}
input:checked[id="something30"]~label[for="something36"] {
background: #0000ff !important;
}
input:checked[id="something31"]~label[for="something16"] {
background: #0000ff !important;
}
input:checked[id="something31"]~label[for="something14"] {
background: #0000ff !important;
}
input:checked[id="something31"]~label[for="something21"] {
background: #0000ff !important;
}
input:checked[id="something31"]~label[for="something48"] {
background: #0000ff !important;
}
input:checked[id="something31"]~label[for="something46"] {
background: #0000ff !important;
}
input:checked[id="something31"]~label[for="something37"] {
background: #0000ff !important;
}
input:checked[id="something32"]~label[for="something15"] {
background: #0000ff !important;
}
input:checked[id="something32"]~label[for="something22"] {
background: #0000ff !important;
}
input:checked[id="something32"]~label[for="something47"] {
background: #0000ff !important;
}
input:checked[id="something32"]~label[for="something38"] {
background: #0000ff !important;
}
input:checked[id="something33"]~label[for="something27"] {
background: #0000ff !important;
}
input:checked[id="something33"]~label[for="something18"] {
background: #0000ff !important;
}
input:checked[id="something33"]~label[for="something43"] {
background: #0000ff !important;
}
input:checked[id="something33"]~label[for="something50"] {
background: #0000ff !important;
}
input:checked[id="something34"]~label[for="something28"] {
background: #0000ff !important;
}
input:checked[id="something34"]~label[for="something19"] {
background: #0000ff !important;
}
input:checked[id="something34"]~label[for="something17"] {
background: #0000ff !important;
}
input:checked[id="something34"]~label[for="something44"] {
background: #0000ff !important;
}
input:checked[id="something34"]~label[for="something51"] {
background: #0000ff !important;
}
input:checked[id="something34"]~label[for="something49"] {
background: #0000ff !important;
}
input:checked[id="something35"]~label[for="something29"] {
background: #0000ff !important;
}
input:checked[id="something35"]~label[for="something20"] {
background: #0000ff !important;
}
input:checked[id="something35"]~label[for="something18"] {
background: #0000ff !important;
}
input:checked[id="something35"]~label[for="something25"] {
background: #0000ff !important;
}
input:checked[id="something35"]~label[for="something45"] {
background: #0000ff !important;
}
input:checked[id="something35"]~label[for="something52"] {
background: #0000ff !important;
}
input:checked[id="something35"]~label[for="something50"] {
background: #0000ff !important;
}
input:checked[id="something35"]~label[for="something41"] {
background: #0000ff !important;
}
input:checked[id="something36"]~label[for="something30"] {
background: #0000ff !important;
}
input:checked[id="something36"]~label[for="something21"] {
background: #0000ff !important;
}
input:checked[id="something36"]~label[for="something19"] {
background: #0000ff !important;
}
input:checked[id="something36"]~label[for="something26"] {
background: #0000ff !important;
}
input:checked[id="something36"]~label[for="something46"] {
background: #0000ff !important;
}
input:checked[id="something36"]~label[for="something53"] {
background: #0000ff !important;
}
input:checked[id="something36"]~label[for="something51"] {
background: #0000ff !important;
}
input:checked[id="something36"]~label[for="something42"] {
background: #0000ff !important;
}
input:checked[id="something37"]~label[for="something31"] {
background: #0000ff !important;
}
input:checked[id="something37"]~label[for="something22"] {
background: #0000ff !important;
}
input:checked[id="something37"]~label[for="something20"] {
background: #0000ff !important;
}
input:checked[id="something37"]~label[for="something27"] {
background: #0000ff !important;
}
input:checked[id="something37"]~label[for="something47"] {
background: #0000ff !important;
}
input:checked[id="something37"]~label[for="something54"] {
background: #0000ff !important;
}
input:checked[id="something37"]~label[for="something52"] {
background: #0000ff !important;
}
input:checked[id="something37"]~label[for="something43"] {
background: #0000ff !important;
}
input:checked[id="something38"]~label[for="something32"] {
background: #0000ff !important;
}
input:checked[id="something38"]~label[for="something23"] {
background: #0000ff !important;
}
input:checked[id="something38"]~label[for="something21"] {
background: #0000ff !important;
}
input:checked[id="something38"]~label[for="something28"] {
background: #0000ff !important;
}
input:checked[id="something38"]~label[for="something48"] {
background: #0000ff !important;
}
input:checked[id="something38"]~label[for="something55"] {
background: #0000ff !important;
}
input:checked[id="something38"]~label[for="something53"] {
background: #0000ff !important;
}
input:checked[id="something38"]~label[for="something44"] {
background: #0000ff !important;
}
input:checked[id="something39"]~label[for="something24"] {
background: #0000ff !important;
}
input:checked[id="something39"]~label[for="something22"] {
background: #0000ff !important;
}
input:checked[id="something39"]~label[for="something29"] {
background: #0000ff !important;
}
input:checked[id="something39"]~label[for="something56"] {
background: #0000ff !important;
}
input:checked[id="something39"]~label[for="something54"] {
background: #0000ff !important;
}
input:checked[id="something39"]~label[for="something45"] {
background: #0000ff !important;
}
input:checked[id="something40"]~label[for="something23"] {
background: #0000ff !important;
}
input:checked[id="something40"]~label[for="something30"] {
background: #0000ff !important;
}
input:checked[id="something40"]~label[for="something55"] {
background: #0000ff !important;
}
input:checked[id="something40"]~label[for="something46"] {
background: #0000ff !important;
}
input:checked[id="something41"]~label[for="something35"] {
background: #0000ff !important;
}
input:checked[id="something41"]~label[for="something26"] {
background: #0000ff !important;
}
input:checked[id="something41"]~label[for="something51"] {
background: #0000ff !important;
}
input:checked[id="something41"]~label[for="something58"] {
background: #0000ff !important;
}
input:checked[id="something42"]~label[for="something36"] {
background: #0000ff !important;
}
input:checked[id="something42"]~label[for="something27"] {
background: #0000ff !important;
}
input:checked[id="something42"]~label[for="something25"] {
background: #0000ff !important;
}
input:checked[id="something42"]~label[for="something52"] {
background: #0000ff !important;
}
input:checked[id="something42"]~label[for="something59"] {
background: #0000ff !important;
}
input:checked[id="something42"]~label[for="something57"] {
background: #0000ff !important;
}
input:checked[id="something43"]~label[for="something37"] {
background: #0000ff !important;
}
input:checked[id="something43"]~label[for="something28"] {
background: #0000ff !important;
}
input:checked[id="something43"]~label[for="something26"] {
background: #0000ff !important;
}
input:checked[id="something43"]~label[for="something33"] {
background: #0000ff !important;
}
input:checked[id="something43"]~label[for="something53"] {
background: #0000ff !important;
}
input:checked[id="something43"]~label[for="something60"] {
background: #0000ff !important;
}
input:checked[id="something43"]~label[for="something58"] {
background: #0000ff !important;
}
input:checked[id="something43"]~label[for="something49"] {
background: #0000ff !important;
}
input:checked[id="something44"]~label[for="something38"] {
background: #0000ff !important;
}
input:checked[id="something44"]~label[for="something29"] {
background: #0000ff !important;
}
input:checked[id="something44"]~label[for="something27"] {
background: #0000ff !important;
}
input:checked[id="something44"]~label[for="something34"] {
background: #0000ff !important;
}
input:checked[id="something44"]~label[for="something54"] {
background: #0000ff !important;
}
input:checked[id="something44"]~label[for="something61"] {
background: #0000ff !important;
}
input:checked[id="something44"]~label[for="something59"] {
background: #0000ff !important;
}
input:checked[id="something44"]~label[for="something50"] {
background: #0000ff !important;
}
input:checked[id="something45"]~label[for="something39"] {
background: #0000ff !important;
}
input:checked[id="something45"]~label[for="something30"] {
background: #0000ff !important;
}
input:checked[id="something45"]~label[for="something28"] {
background: #0000ff !important;
}
input:checked[id="something45"]~label[for="something35"] {
background: #0000ff !important;
}
input:checked[id="something45"]~label[for="something55"] {
background: #0000ff !important;
}
input:checked[id="something45"]~label[for="something62"] {
background: #0000ff !important;
}
input:checked[id="something45"]~label[for="something60"] {
background: #0000ff !important;
}
input:checked[id="something45"]~label[for="something51"] {
background: #0000ff !important;
}
input:checked[id="something46"]~label[for="something40"] {
background: #0000ff !important;
}
input:checked[id="something46"]~label[for="something31"] {
background: #0000ff !important;
}
input:checked[id="something46"]~label[for="something29"] {
background: #0000ff !important;
}
input:checked[id="something46"]~label[for="something36"] {
background: #0000ff !important;
}
input:checked[id="something46"]~label[for="something56"] {
background: #0000ff !important;
}
input:checked[id="something46"]~label[for="something63"] {
background: #0000ff !important;
}
input:checked[id="something46"]~label[for="something61"] {
background: #0000ff !important;
}
input:checked[id="something46"]~label[for="something52"] {
background: #0000ff !important;
}
input:checked[id="something47"]~label[for="something32"] {
background: #0000ff !important;
}
input:checked[id="something47"]~label[for="something30"] {
background: #0000ff !important;
}
input:checked[id="something47"]~label[for="something37"] {
background: #0000ff !important;
}
input:checked[id="something47"]~label[for="something64"] {
background: #0000ff !important;
}
input:checked[id="something47"]~label[for="something62"] {
background: #0000ff !important;
}
input:checked[id="something47"]~label[for="something53"] {
background: #0000ff !important;
}
input:checked[id="something48"]~label[for="something31"] {
background: #0000ff !important;
}
input:checked[id="something48"]~label[for="something38"] {
background: #0000ff !important;
}
input:checked[id="something48"]~label[for="something63"] {
background: #0000ff !important;
}
input:checked[id="something48"]~label[for="something54"] {
background: #0000ff !important;
}
input:checked[id="something49"]~label[for="something43"] {
background: #0000ff !important;
}
input:checked[id="something49"]~label[for="something34"] {
background: #0000ff !important;
}
input:checked[id="something49"]~label[for="something59"] {
background: #0000ff !important;
}
input:checked[id="something50"]~label[for="something44"] {
background: #0000ff !important;
}
input:checked[id="something50"]~label[for="something35"] {
background: #0000ff !important;
}
input:checked[id="something50"]~label[for="something33"] {
background: #0000ff !important;
}
input:checked[id="something50"]~label[for="something60"] {
background: #0000ff !important;
}
input:checked[id="something51"]~label[for="something45"] {
background: #0000ff !important;
}
input:checked[id="something51"]~label[for="something36"] {
background: #0000ff !important;
}
input:checked[id="something51"]~label[for="something34"] {
background: #0000ff !important;
}
input:checked[id="something51"]~label[for="something41"] {
background: #0000ff !important;
}
input:checked[id="something51"]~label[for="something61"] {
background: #0000ff !important;
}
input:checked[id="something51"]~label[for="something57"] {
background: #0000ff !important;
}
input:checked[id="something52"]~label[for="something46"] {
background: #0000ff !important;
}
input:checked[id="something52"]~label[for="something37"] {
background: #0000ff !important;
}
input:checked[id="something52"]~label[for="something35"] {
background: #0000ff !important;
}
input:checked[id="something52"]~label[for="something42"] {
background: #0000ff !important;
}
input:checked[id="something52"]~label[for="something62"] {
background: #0000ff !important;
}
input:checked[id="something52"]~label[for="something58"] {
background: #0000ff !important;
}
input:checked[id="something53"]~label[for="something47"] {
background: #0000ff !important;
}
input:checked[id="something53"]~label[for="something38"] {
background: #0000ff !important;
}
input:checked[id="something53"]~label[for="something36"] {
background: #0000ff !important;
}
input:checked[id="something53"]~label[for="something43"] {
background: #0000ff !important;
}
input:checked[id="something53"]~label[for="something63"] {
background: #0000ff !important;
}
input:checked[id="something53"]~label[for="something59"] {
background: #0000ff !important;
}
input:checked[id="something54"]~label[for="something48"] {
background: #0000ff !important;
}
input:checked[id="something54"]~label[for="something39"] {
background: #0000ff !important;
}
input:checked[id="something54"]~label[for="something37"] {
background: #0000ff !important;
}
input:checked[id="something54"]~label[for="something44"] {
background: #0000ff !important;
}
input:checked[id="something54"]~label[for="something64"] {
background: #0000ff !important;
}
input:checked[id="something54"]~label[for="something60"] {
background: #0000ff !important;
}
input:checked[id="something55"]~label[for="something40"] {
background: #0000ff !important;
}
input:checked[id="something55"]~label[for="something38"] {
background: #0000ff !important;
}
input:checked[id="something55"]~label[for="something45"] {
background: #0000ff !important;
}
input:checked[id="something55"]~label[for="something61"] {
background: #0000ff !important;
}
input:checked[id="something56"]~label[for="something39"] {
background: #0000ff !important;
}
input:checked[id="something56"]~label[for="something46"] {
background: #0000ff !important;
}
input:checked[id="something56"]~label[for="something62"] {
background: #0000ff !important;
}
input:checked[id="something57"]~label[for="something51"] {
background: #0000ff !important;
}
input:checked[id="something57"]~label[for="something42"] {
background: #0000ff !important;
}
input:checked[id="something58"]~label[for="something52"] {
background: #0000ff !important;
}
input:checked[id="something58"]~label[for="something43"] {
background: #0000ff !important;
}
input:checked[id="something58"]~label[for="something41"] {
background: #0000ff !important;
}
input:checked[id="something59"]~label[for="something53"] {
background: #0000ff !important;
}
input:checked[id="something59"]~label[for="something44"] {
background: #0000ff !important;
}
input:checked[id="something59"]~label[for="something42"] {
background: #0000ff !important;
}
input:checked[id="something59"]~label[for="something49"] {
background: #0000ff !important;
}
input:checked[id="something60"]~label[for="something54"] {
background: #0000ff !important;
}
input:checked[id="something60"]~label[for="something45"] {
background: #0000ff !important;
}
input:checked[id="something60"]~label[for="something43"] {
background: #0000ff !important;
}
input:checked[id="something60"]~label[for="something50"] {
background: #0000ff !important;
}
input:checked[id="something61"]~label[for="something55"] {
background: #0000ff !important;
}
input:checked[id="something61"]~label[for="something46"] {
background: #0000ff !important;
}
input:checked[id="something61"]~label[for="something44"] {
background: #0000ff !important;
}
input:checked[id="something61"]~label[for="something51"] {
background: #0000ff !important;
}
input:checked[id="something62"]~label[for="something56"] {
background: #0000ff !important;
}
input:checked[id="something62"]~label[for="something47"] {
background: #0000ff !important;
}
input:checked[id="something62"]~label[for="something45"] {
background: #0000ff !important;
}
input:checked[id="something62"]~label[for="something52"] {
background: #0000ff !important;
}
input:checked[id="something63"]~label[for="something48"] {
background: #0000ff !important;
}
input:checked[id="something63"]~label[for="something46"] {
background: #0000ff !important;
}
input:checked[id="something63"]~label[for="something53"] {
background: #0000ff !important;
}
input:checked[id="something64"]~label[for="something47"] {
background: #0000ff !important;
}
input:checked[id="something64"]~label[for="something54"] {
background: #0000ff !important;
}
input:checked[id="something64"]~label[for="something64"] {
background: #ff0000 !important;
}
input:checked[id="something63"]~label[for="something63"] {
background: #ff0000 !important;
}
input:checked[id="something62"]~label[for="something62"] {
background: #ff0000 !important;
}
input:checked[id="something61"]~label[for="something61"] {
background: #ff0000 !important;
}
input:checked[id="something60"]~label[for="something60"] {
background: #ff0000 !important;
}
input:checked[id="something59"]~label[for="something59"] {
background: #ff0000 !important;
}
input:checked[id="something58"]~label[for="something58"] {
background: #ff0000 !important;
}
input:checked[id="something57"]~label[for="something57"] {
background: #ff0000 !important;
}
input:checked[id="something56"]~label[for="something56"] {
background: #ff0000 !important;
}
input:checked[id="something55"]~label[for="something55"] {
background: #ff0000 !important;
}
input:checked[id="something54"]~label[for="something54"] {
background: #ff0000 !important;
}
input:checked[id="something53"]~label[for="something53"] {
background: #ff0000 !important;
}
input:checked[id="something52"]~label[for="something52"] {
background: #ff0000 !important;
}
input:checked[id="something51"]~label[for="something51"] {
background: #ff0000 !important;
}
input:checked[id="something50"]~label[for="something50"] {
background: #ff0000 !important;
}
input:checked[id="something49"]~label[for="something49"] {
background: #ff0000 !important;
}
input:checked[id="something48"]~label[for="something48"] {
background: #ff0000 !important;
}
input:checked[id="something47"]~label[for="something47"] {
background: #ff0000 !important;
}
input:checked[id="something46"]~label[for="something46"] {
background: #ff0000 !important;
}
input:checked[id="something45"]~label[for="something45"] {
background: #ff0000 !important;
}
input:checked[id="something44"]~label[for="something44"] {
background: #ff0000 !important;
}
input:checked[id="something43"]~label[for="something43"] {
background: #ff0000 !important;
}
input:checked[id="something42"]~label[for="something42"] {
background: #ff0000 !important;
}
input:checked[id="something41"]~label[for="something41"] {
background: #ff0000 !important;
}
input:checked[id="something40"]~label[for="something40"] {
background: #ff0000 !important;
}
input:checked[id="something39"]~label[for="something39"] {
background: #ff0000 !important;
}
input:checked[id="something38"]~label[for="something38"] {
background: #ff0000 !important;
}
input:checked[id="something37"]~label[for="something37"] {
background: #ff0000 !important;
}
input:checked[id="something36"]~label[for="something36"] {
background: #ff0000 !important;
}
input:checked[id="something35"]~label[for="something35"] {
background: #ff0000 !important;
}
input:checked[id="something34"]~label[for="something34"] {
background: #ff0000 !important;
}
input:checked[id="something33"]~label[for="something33"] {
background: #ff0000 !important;
}
input:checked[id="something32"]~label[for="something32"] {
background: #ff0000 !important;
}
input:checked[id="something31"]~label[for="something31"] {
background: #ff0000 !important;
}
input:checked[id="something30"]~label[for="something30"] {
background: #ff0000 !important;
}
input:checked[id="something29"]~label[for="something29"] {
background: #ff0000 !important;
}
input:checked[id="something28"]~label[for="something28"] {
background: #ff0000 !important;
}
input:checked[id="something27"]~label[for="something27"] {
background: #ff0000 !important;
}
input:checked[id="something26"]~label[for="something26"] {
background: #ff0000 !important;
}
input:checked[id="something25"]~label[for="something25"] {
background: #ff0000 !important;
}
input:checked[id="something24"]~label[for="something24"] {
background: #ff0000 !important;
}
input:checked[id="something23"]~label[for="something23"] {
background: #ff0000 !important;
}
input:checked[id="something22"]~label[for="something22"] {
background: #ff0000 !important;
}
input:checked[id="something21"]~label[for="something21"] {
background: #ff0000 !important;
}
input:checked[id="something20"]~label[for="something20"] {
background: #ff0000 !important;
}
input:checked[id="something19"]~label[for="something19"] {
background: #ff0000 !important;
}
input:checked[id="something18"]~label[for="something18"] {
background: #ff0000 !important;
}
input:checked[id="something17"]~label[for="something17"] {
background: #ff0000 !important;
}
input:checked[id="something16"]~label[for="something16"] {
background: #ff0000 !important;
}
input:checked[id="something15"]~label[for="something15"] {
background: #ff0000 !important;
}
input:checked[id="something14"]~label[for="something14"] {
background: #ff0000 !important;
}
input:checked[id="something13"]~label[for="something13"] {
background: #ff0000 !important;
}
input:checked[id="something12"]~label[for="something12"] {
background: #ff0000 !important;
}
input:checked[id="something11"]~label[for="something11"] {
background: #ff0000 !important;
}
input:checked[id="something10"]~label[for="something10"] {
background: #ff0000 !important;
}
input:checked[id="something9"]~label[for="something9"] {
background: #ff0000 !important;
}
input:checked[id="something8"]~label[for="something8"] {
background: #ff0000 !important;
}
input:checked[id="something7"]~label[for="something7"] {
background: #ff0000 !important;
}
input:checked[id="something6"]~label[for="something6"] {
background: #ff0000 !important;
}
input:checked[id="something5"]~label[for="something5"] {
background: #ff0000 !important;
}
input:checked[id="something4"]~label[for="something4"] {
background: #ff0000 !important;
}
input:checked[id="something3"]~label[for="something3"] {
background: #ff0000 !important;
}
input:checked[id="something2"]~label[for="something2"] {
background: #ff0000 !important;
}
input:checked[id="something1"]~label[for="something1"] {
background: #ff0000 !important;
}
</style>
<body>
<form>
<input type="radio" name="cell" id="something1">
<input type="radio" name="cell" id="something2">
<input type="radio" name="cell" id="something3">
<input type="radio" name="cell" id="something4">
<input type="radio" name="cell" id="something5">
<input type="radio" name="cell" id="something6">
<input type="radio" name="cell" id="something7">
<input type="radio" name="cell" id="something8">
<input type="radio" name="cell" id="something9">
<input type="radio" name="cell" id="something10">
<input type="radio" name="cell" id="something11">
<input type="radio" name="cell" id="something12">
<input type="radio" name="cell" id="something13">
<input type="radio" name="cell" id="something14">
<input type="radio" name="cell" id="something15">
<input type="radio" name="cell" id="something16">
<input type="radio" name="cell" id="something17">
<input type="radio" name="cell" id="something18">
<input type="radio" name="cell" id="something19">
<input type="radio" name="cell" id="something20">
<input type="radio" name="cell" id="something21">
<input type="radio" name="cell" id="something22">
<input type="radio" name="cell" id="something23">
<input type="radio" name="cell" id="something24">
<input type="radio" name="cell" id="something25">
<input type="radio" name="cell" id="something26">
<input type="radio" name="cell" id="something27">
<input type="radio" name="cell" id="something28">
<input type="radio" name="cell" id="something29">
<input type="radio" name="cell" id="something30">
<input type="radio" name="cell" id="something31">
<input type="radio" name="cell" id="something32">
<input type="radio" name="cell" id="something33">
<input type="radio" name="cell" id="something34">
<input type="radio" name="cell" id="something35">
<input type="radio" name="cell" id="something36">
<input type="radio" name="cell" id="something37">
<input type="radio" name="cell" id="something38">
<input type="radio" name="cell" id="something39">
<input type="radio" name="cell" id="something40">
<input type="radio" name="cell" id="something41">
<input type="radio" name="cell" id="something42">
<input type="radio" name="cell" id="something43">
<input type="radio" name="cell" id="something44">
<input type="radio" name="cell" id="something45">
<input type="radio" name="cell" id="something46">
<input type="radio" name="cell" id="something47">
<input type="radio" name="cell" id="something48">
<input type="radio" name="cell" id="something49">
<input type="radio" name="cell" id="something50">
<input type="radio" name="cell" id="something51">
<input type="radio" name="cell" id="something52">
<input type="radio" name="cell" id="something53">
<input type="radio" name="cell" id="something54">
<input type="radio" name="cell" id="something55">
<input type="radio" name="cell" id="something56">
<input type="radio" name="cell" id="something57">
<input type="radio" name="cell" id="something58">
<input type="radio" name="cell" id="something59">
<input type="radio" name="cell" id="something60">
<input type="radio" name="cell" id="something63">
<input type="radio" name="cell" id="something61">
<input type="radio" name="cell" id="something62">
<input type="radio" name="cell" id="something64">
<label for="something1"></label>
<label for="something2"></label>
<label for="something3"></label>
<label for="something4"></label>
<label for="something5"></label>
<label for="something6"></label>
<label for="something7"></label>
<label for="something8"></label>
<label for="something9"></label>
<label for="something10"></label>
<label for="something11"></label>
<label for="something12"></label>
<label for="something13"></label>
<label for="something14"></label>
<label for="something15"></label>
<label for="something16"></label>
<label for="something17"></label>
<label for="something18"></label>
<label for="something19"></label>
<label for="something20"></label>
<label for="something21"></label>
<label for="something22"></label>
<label for="something23"></label>
<label for="something24"></label>
<label for="something25"></label>
<label for="something26"></label>
<label for="something27"></label>
<label for="something28"></label>
<label for="something29"></label>
<label for="something30"></label>
<label for="something31"></label>
<label for="something32"></label>
<label for="something33"></label>
<label for="something34"></label>
<label for="something35"></label>
<label for="something36"></label>
<label for="something37"></label>
<label for="something38"></label>
<label for="something39"></label>
<label for="something40"></label>
<label for="something41"></label>
<label for="something42"></label>
<label for="something43"></label>
<label for="something44"></label>
<label for="something45"></label>
<label for="something46"></label>
<label for="something47"></label>
<label for="something48"></label>
<label for="something49"></label>
<label for="something50"></label>
<label for="something51"></label>
<label for="something52"></label>
<label for="something53"></label>
<label for="something54"></label>
<label for="something55"></label>
<label for="something56"></label>
<label for="something57"></label>
<label for="something58"></label>
<label for="something59"></label>
<label for="something60"></label>
<label for="something61"></label>
<label for="something62"></label>
<label for="something63"></label>
<label for="something64"></label>
</form>
</body>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment