.toolbar { height: 40px; border-bottom: 1px solid @toolbar-border-color; a:not(.btn) { display: inline-block; color: @gray-light; padding: 5px 12px 6px; margin: 0; border-radius: @border-radius-small; &:hover { text-shadow: 0 1px 0 rgba(0, 0, 0, 0.25); color: @gray-dark; text-decoration: none; } } .btn-full-height { border: none; border-radius: 0; border-right: 1px solid @toolbar-border-color; color: @link-color; padding: 3px 10px 5px; font-size: 20px; &:hover { text-shadow: 0 1px 0 rgba(0, 0, 0, 0.15); background-color: darken(white, 10%); color: @link-hover-color; } &.active, &:active { color: white; background-color: @link-color; .box-shadow(inset 0 3px 5px rgba(0, 0, 0, 0.225)); } } .toolbar-right { float: right; .btn-full-height { border-right: 0; border-left: 1px solid @toolbar-border-color; } } .toolbar-center { width: 300px; position: absolute; top: 0; left: 50%; margin-left: -150px; text-align: center; text-overflow: ellipsis; overflow: hidden; } &.toolbar-header { box-shadow: 0 0 2px #ccc; position: absolute; top: 0; left: 0; right: 0; z-index: 1; } &.toolbar-small { height: 32px; a { padding: 4px 2px 2px; margin-left: 6px; } .toolbar-right { a { margin-left: 0; margin-right: 6px; } } } &.toolbar-tall { height: 58px; padding-top: 10px; a { margin-left: (@line-height-computed / 2); padding: 4px 10px 5px; } } &.toolbar-alt { background-color: #fafafa; } }