example.styl

// CSS Lockes / Not Mobile First

fieldset
    input
        graduated(font-size, 14px, 16px)
	    graduated(line-height, 18px, 22px)

    input[type=text], input[type=password]
        margin-top: $line-height-base !important
        margin-bottom: 0px !important
        border: 1px solid $palette.grayscale.light

    input[disabled]
            background: $palette.disabled.very-light
    
    input + label
        graduated(font-size, 12px, 14px)
        height: 0
        padding-left: 0
        padding-bottom: 0
        color: darkgrey
        top: -4em

// Mobile First Version

fieldset
    input
        font-size: 14px
        line-height: 18px

    input[type=text], input[type=password]
        margin-top: $line-height-base !important
        margin-bottom: 0px !important
        border: 1px solid $palette.grayscale.light

    input[disabled]
            background: $palette.disabled.very-light
    
    input + label
        font-size: 12px
        height: 0
        padding-left: 0
        padding-bottom: 0
        color: darkgrey
        top: -4em

@media (min-width: 960px)
    fieldset
        input
            font-size: 16px
            line-height: 22px

    input + label
        font-size: 14px