.poised &.control margin 16px .info position relative display table table-layout fixed width 100% label display table-cell white-space nowrap .textfield, .value, .selectbox display table-cell &.linked-control width 100% margin 0 .info display block label margin 16px 0 display inline-block .info .control padding 0 16px .control .link display table-cell .link width 2% text-align center line-height 50px cursor pointer .control width 49% .textfield width 100% input width 100% .slider width 100% &.control &.linked-control &.invalid .info label color $foreground-invalid .hint float right width 24px &:before position absolute content "\f06a" font-family FontAwesome font-size 1em color $foreground-invalid margin-top 10px .textfield input holo-input-border($textfield-border-invalid) &.button-group margin 16px li padding 0 0.5em display table-cell width 1% border 0 &:first-of-type padding-left 0 &:last-of-type padding-right 0 button input width 100% &.slider relative() $drag-handle-size = 20px $drag-bar-height = 2px $slider-margin = 25px height $drag-handle-size + 2*$slider-margin margin -10px 0 cursor pointer .handle absolute $slider-margin none none 0 margin-left -($drag-handle-size/2) width $drag-handle-size height $drag-handle-size border 5px solid lighten($header-background, 30%) border-radius 10px background-color $header-background cursor pointer .bar absolute ($slider-margin + $drag-handle-size / 2 - $drag-bar-height / 2) background-color lighten($header-background, 40%) height $drag-bar-height width 100% &.textfield relative() input z-layer 'textfield', 'input' abbr absolute none 8px 8px z-layer 'textfield', 'abbrev'