.btn { display: inline-block; margin-bottom: 0; font-weight: normal; text-align: center; vertical-align: middle; cursor: pointer; background-image: none; border: 1px solid transparent; white-space: nowrap; padding: 6px 12px; font-size: 13px; line-height: 18px; border-radius: 4px; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; -o-user-select: none; user-select: none; color: #444444; background-color: #fff; border-color: #ccc; text-shadow: none; &.hover, &:hover { color: #444444; text-decoration: none; background-color: #ebebeb; border-color: #adadad; } &.focus, &:focus { color: #444444; text-decoration: none; outline: thin dotted #333; outline: 5px auto -webkit-focus-ring-color; outline-offset: -2px; } &.active, &:active { outline: 0; background-image: none; -webkit-box-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125); box-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125); } &.disabled, &[disabled] { cursor: not-allowed; pointer-events: none; opacity: 0.65; filter: alpha(opacity=65); -webkit-box-shadow: none; box-shadow: none; } &.btn-primary { color: #ffffff; background-color: #429bca; border-color: #358ebd; &.hover, &:hover, &.disabled, &[disabled] { color: #ffffff; background-color: #3286b1; border-color: #286e8e; } } &.btn-success { color: #ffffff; background-color: #5cb85c; border-color: #4cae4c; &.hover, &:hover, &.disabled, &[disabled] { color: #ffffff; background-color: #47a447; border-color: #398439; } } &.btn-danger { color: #ffffff; background-color: #d9534f; border-color: #d43f3a; &.hover, &:hover, &.disabled, &[disabled] { color: #ffffff; background-color: #d2322d; border-color: #ac2925; } } &.btn-new { @extend .btn-success; } &.btn-create { @extend .wide; @extend .btn-success; } &.btn-save { @extend .wide; @extend .btn-primary; } &.btn-close, &.btn-remove { @extend .btn-danger; } &.btn-cancel { float: right; } &.wide { padding-left: 20px; padding-right: 20px; } &.btn-small { padding: 2px 10px; font-size: 12px; } &.btn-tiny { font-size: 11px; padding: 2px 6px; line-height: 16px; margin: 2px; } &.grouped { margin-right: 7px; float: left; } &.btn-block { width: 100%; margin: 0; padding: 6px 0; margin-bottom: 15px; } }