// Checkboxes .input.boolean, .checkbox-wrapper { display: block; input[type=checkbox] { position: absolute; left: -9999px; } .active { &:after { @extend .icon-check:before; @include icon-stuff; position: absolute; top: 6px; left: 6px; font-size: 12px; color: $c-darkest-grey; cursor: pointer; } } } .checkbox { position: relative; padding: 0 20px 0 35px; margin: 0; cursor: pointer; display: inline-block; h6 { display: inline-block; padding-top: 0; padding-left: 6px; } } label.checkbox, .checkbox label { padding-top: 6px; // Vertical align hack &:before { content: ''; position: absolute; top: 0; left: 0; height: 25px; width: 25px; border: 1px solid $c-border; background: $c-white; cursor: pointer; border-radius: 2px; } } .checkbox-wrapper { &.-stacked { label:not(.control-label) { display: block; margin-bottom: 25px; } .checkbox { display: block; } } &.-inline { label:not(.control-label) { padding-top: 0; vertical-align: top; width: 190px; margin-bottom: 25px; margin-right: 10px; } .checkbox { vertical-align: top; } } }