.widget_checkbox { position: relative; margin: -1px auto; width: 16px; height: 16px; } :not(.formula_field)>.field_clip.has_cursor>.widget_checkbox { cursor: pointer; box-shadow: inset 0 0 0 1px #606060; border-radius: 3px; background: linear-gradient(to bottom, rgba(255,255,255,1) 0%, rgba(252,252,252,1) 29%, rgba(239,239,239,1) 50%, rgba(232,232,232,1) 50%, rgba(242,242,242,1) 100%); } :not(.formula_field)>.field_clip>.widget_checkbox:hover:not(.disabled) { cursor: pointer; box-shadow: inset 0 0 0 1px #606060; border-radius: 3px; background: linear-gradient(to bottom, rgba(255,255,255,1) 0%, rgba(252,252,252,1) 29%, rgba(239,239,239,1) 50%, rgba(232,232,232,1) 50%, rgba(242,242,242,1) 100%); } :not(.formula_field)>.field_clip>.widget_checkbox:active:not(.disabled) { background: linear-gradient(to bottom, rgba(147,180,242,1) 0%, rgba(135,168,233,1) 10%, rgba(115,149,218,1) 25%, rgba(115,150,224,1) 37%, rgba(115,153,230,1) 50%, rgba(86,134,219,1) 51%, rgba(130,174,235,1) 83%, rgba(151,194,243,1) 100%); } .widget_checkbox:focus { outline: none !important; } .widget_checkmark { position: relative; width: 6px; height: 12px; -ms-transform: rotate(40deg); /* IE 9 */ -webkit-transform: rotate(40deg); /* Chrome, Safari, Opera */ transform: rotate(40deg); left: 4px; top: 2px; } .checkmark_stem { position: relative; width: 3px; height: 12px; background-color: var(--grist-actual-cell-color, var(--grist-theme-toggle-checkbox-fg, #606060)); border: 1px solid var(--grist-actual-cell-color, var(--grist-theme-toggle-checkbox-fg, #606060)); left: 3px; top: -5px; } .checkmark_kick { position: relative; width: 3px; height: 3px; background-color: var(--grist-actual-cell-color, var(--grist-theme-toggle-checkbox-fg, #606060)); border: 1px solid var(--grist-actual-cell-color, var(--grist-theme-toggle-checkbox-fg, #606060)); top: 7px; }