{: versionI"3.2.19 (Media Mark):EF:sha"-a57a6a98c87295a5f2f78e9ee1d76e016d493f12: contents"Ro:Sass::Tree::RootNode :@children[o:Sass::Tree::CommentNode : @value[I"P/* * Input groups * -------------------------------------------------- */:ET: @type: silent;[: @linei: @options{o; ;[I"3/* Base styles * ------------------------- */; T; ; ;[; i ; @ o:Sass::Tree::RuleNode : @rule[I".input-group; T: @tabsi:@parsed_ruleso:"Sass::Selector::CommaSequence: @members[o:Sass::Selector::Sequence;[o:#Sass::Selector::SimpleSequence ;[o:Sass::Selector::Class: @name[I"input-group; T; i :@filenameI"; F: @subject0: @sourceso:Set: @hash{; i ;@; i ;@;[ o:Sass::Tree::PropNode ;[I" position; T;o:Sass::Script::String;I" relative; T; :identifier; @ ;i:@prop_syntax:new;[; i ; @ o; ;[I"/* For dropdowns */; T; ; ;[; i ; @ o; ;[I" display; T;o;;I" table; T; ;; @ ;i; ;!;[; i; @ o; ;[I"border-collapse; T;o;;I" separate; T; ;; @ ;i; ;!;[; i; @ o; ;[I"i/* prevent input groups from inheriting border styles from table cells when placed within a table */; T; ; ;[; i; @ o; ;[I"1/* Undo padding and float of grid classes */; T; ; ;[; i; @ o; ;[I"&[class*="col-"]; F;i;o;;[o;;[o; ;[o:Sass::Selector::Parent; i;I"; Fo:Sass::Selector::Attribute ;[I" class; F:@namespace0:@operatorI"*=; F;[I" "col-"; F: @flags0; i;@H;0;o;;{; i;@H; i;@H;[o; ;[I" float; T;o;;I" none; T; ;; @ ;i; ;!;[; i; @ o; ;[I"padding-left; T;o;;I"0; T; ;; @ ;i; ;!;[; i; @ o; ;[I"padding-right; T;o;;I"0; T; ;; @ ;i; ;!;[; i; @ ; i:@has_childrenT; @ o; ;[I".form-control; T;i;o;;[o;;[o; ;[o;;[I"form-control; T; i;I"; F;0;o;;{; i;@p; i;@p;[ o; ;[I"i/* Ensure that the input is always above the *appended* addon button for * proper border colors. */; T; ; ;[; i; @ o; ;[I" position; T;o;;I" relative; T; ;; @ ;i; ;!;[; i; @ o; ;[I" z-index; T;o;;I"2; T; ;; @ ;i; ;!;[; i; @ o; ;[I"/* IE9 fubars the placeholder attribute in text inputs and the arrows on * select elements in input groups. To fix it, we float the input. Details: * https://github.com/twbs/bootstrap/issues/11561#issuecomment-28936855 */; T; ; ;[; i; @ o; ;[I" float; T;o;;I" left; T; ;; @ ;i; ;!;[; i!; @ o; ;[I" width; T;o;;I" 100%; T; ;; @ ;i; ;!;[; i#; @ o; ;[I"margin-bottom; T;o;;I"0; T; ;; @ ;i; ;!;[; i$; @ ; i;'T; @ ; i ;'T; @ o; ;[I"w/* Sizing options * * Remix the default form control sizing classes into new ones for easier * manipulation. */; T; ; ;[; i(; @ o; ;[I"u.input-group-lg > .form-control, .input-group-lg > .input-group-addon, .input-group-lg > .input-group-btn > .btn; F;i;o;;[o;;[o; ;[o;;[I"input-group-lg; F; i/;I"; F;0;o;;{; i/;@I">; Fo; ;[o;;[I"form-control; F; i/;@;0;o;;{; i/;@o;;[ I" ; Fo; ;[o;;[I"input-group-lg; F; i/;@;0;o;;{; i/;@I">; Fo; ;[o;;[I"input-group-addon; F; i/;@;0;o;;{; i/;@o;;[ I" ; Fo; ;[o;;[I"input-group-lg; F; i/;@;0;o;;{; i/;@I">; Fo; ;[o;;[I"input-group-btn; F; i/;@;0;o;;{; i/;@I">; Fo; ;[o;;[I"btn; F; i/;@;0;o;;{; i/;@; i/;@;[o:Sass::Tree::ExtendNode :@selector[I".; FI" input-lg; T:@optionalF;[; i0; @ ; i/;'T; @ o; ;[I"u.input-group-sm > .form-control, .input-group-sm > .input-group-addon, .input-group-sm > .input-group-btn > .btn; F;i;o;;[o;;[o; ;[o;;[I"input-group-sm; F; i4;I"; F;0;o;;{; i4;@I">; Fo; ;[o;;[I"form-control; F; i4;@;0;o;;{; i4;@o;;[ I" ; Fo; ;[o;;[I"input-group-sm; F; i4;@;0;o;;{; i4;@I">; Fo; ;[o;;[I"input-group-addon; F; i4;@;0;o;;{; i4;@o;;[ I" ; Fo; ;[o;;[I"input-group-sm; F; i4;@;0;o;;{; i4;@I">; Fo; ;[o;;[I"input-group-btn; F; i4;@;0;o;;{; i4;@I">; Fo; ;[o;;[I"btn; F; i4;@;0;o;;{; i4;@; i4;@;[o;( ;)[I".; FI" input-sm; T;*F;[; i5; @ ; i4;'T; @ o; ;[I"=/* Display as table-cell * ------------------------- */; T; ; ;[; i9; @ o; ;[I"E.input-group-addon, .input-group-btn, .input-group .form-control; F;i;o;;[o;;[o; ;[o;;[I"input-group-addon; F; i=;I"; F;0;o;;{; i=;@;o;;[I" ; Fo; ;[o;;[I"input-group-btn; F; i=;@;;0;o;;{; i=;@;o;;[I" ; Fo; ;[o;;[I"input-group; F; i=;@;;0;o;;{; i=;@;o; ;[o;;[I"form-control; F; i=;@;;0;o;;{; i=;@;; i=;@;;[o; ;[I" display; T;o;;I"table-cell; T; ;; @ ;i; ;!;[; i>; @ o; ;[I")&:not(:first-child):not(:last-child); F;i;o;;[o;;[o; ;[o;"; i@;I"; Fo:Sass::Selector::Pseudo :@syntactic_type: class;[I"not; F: @arg[I":first-child; F; i@;@jo;+ ;,;-;[I"not; F;.[I":last-child; F; i@;@j;0;o;;{; i@;@j; i@;@j;[o; ;[I"border-radius; T;o;;I"0; T; ;; @ ;i; ;!;[; iA; @ ; i@;'T; @ ; i=;'T; @ o; ;[I"./* Addon and addon wrapper for buttons */; T; ; ;[; iD; @ o; ;[I").input-group-addon, .input-group-btn; F;i;o;;[o;;[o; ;[o;;[I"input-group-addon; F; iF;I"; F;0;o;;{; iF;@o;;[I" ; Fo; ;[o;;[I"input-group-btn; F; iF;@;0;o;;{; iF;@; iF;@;[ o; ;[I" width; T;o;;I"1%; T; ;; @ ;i; ;!;[; iG; @ o; ;[I"white-space; T;o;;I" nowrap; T; ;; @ ;i; ;!;[; iH; @ o; ;[I"vertical-align; T;o;;I" middle; T; ;; @ ;i; ;!;[; iI; @ o; ;[I"/* Match the inputs */; T; ; ;[; iI; @ ; iF;'T; @ o; ;[I"9/* Text input groups * ------------------------- */; T; ; ;[; iL; @ o; ;[I".input-group-addon; T;i;o;;[o;;[o; ;[o;;[I"input-group-addon; T; iN;I"; F;0;o;;{; iN;@; iN;@;[o; ;[I" padding; T;o:Sass::Script::List ;[o:Sass::Script::Variable ;I"padding-base-vertical; T:@underscored_nameI"padding_base_vertical; T; @ ; iOo;0 ;I"padding-base-horizontal; T;1I"padding_base_horizontal; T; @ ; iO:@separator: space; iO; @ ;i; ;!;[; iO; @ o; ;[I"font-size; T;o;0 ;I"font-size-base; T;1I"font_size_base; T; @ ; iP;i; ;!;[; iP; @ o; ;[I"font-weight; T;o;;I" normal; T; ;; @ ;i; ;!;[; iQ; @ o; ;[I"line-height; T;o;;I"1; T; ;; @ ;i; ;!;[; iR; @ o; ;[I" color; T;o;0 ;I"input-color; T;1I"input_color; T; @ ; iS;i; ;!;[; iS; @ o; ;[I"text-align; T;o;;I" center; T; ;; @ ;i; ;!;[; iT; @ o; ;[I"background-color; T;o;0 ;I"input-group-addon-bg; T;1I"input_group_addon_bg; T; @ ; iU;i; ;!;[; iU; @ o; ;[I" border; T;o;/ ;[o:Sass::Script::Number ;i:@numerator_units[I"px; T:@denominator_units[; iV:@originalI"1px; F; @ o; ;I" solid; T; ;; iV; @ o;0 ;I"#input-group-addon-border-color; T;1I"#input_group_addon_border_color; T; @ ; iV;2;3; iV; @ ;i; ;!;[; iV; @ o; ;[I"border-radius; T;o;0 ;I"border-radius-base; T;1I"border_radius_base; T; @ ; iW;i; ;!;[; iW; @ o; ;[I"/* Sizing */; T; ; ;[; iY; @ o; ;[I"&.input-sm; F;i;o;;[o;;[o; ;[o;"; iZ;I"; Fo;;[I" input-sm; F; iZ;@;0;o;;{; iZ;@; iZ;@;[o; ;[I" padding; T;o;/ ;[o;0 ;I"padding-small-vertical; T;1I"padding_small_vertical; T; @ ; i[o;0 ;I"padding-small-horizontal; T;1I"padding_small_horizontal; T; @ ; i[;2;3; i[; @ ;i; ;!;[; i[; @ o; ;[I"font-size; T;o;0 ;I"font-size-small; T;1I"font_size_small; T; @ ; i\;i; ;!;[; i\; @ o; ;[I"border-radius; T;o;0 ;I"border-radius-small; T;1I"border_radius_small; T; @ ; i];i; ;!;[; i]; @ ; iZ;'T; @ o; ;[I"&.input-lg; F;i;o;;[o;;[o; ;[o;"; i_;I"; Fo;;[I" input-lg; F; i_;@I;0;o;;{; i_;@I; i_;@I;[o; ;[I" padding; T;o;/ ;[o;0 ;I"padding-large-vertical; T;1I"padding_large_vertical; T; @ ; i`o;0 ;I"padding-large-horizontal; T;1I"padding_large_horizontal; T; @ ; i`;2;3; i`; @ ;i; ;!;[; i`; @ o; ;[I"font-size; T;o;0 ;I"font-size-large; T;1I"font_size_large; T; @ ; ia;i; ;!;[; ia; @ o; ;[I"border-radius; T;o;0 ;I"border-radius-large; T;1I"border_radius_large; T; @ ; ib;i; ;!;[; ib; @ ; i_;'T; @ o; ;[I"W/* Nuke default margins from checkboxes and radios to vertically center within. */; T; ; ;[; ie; @ o; ;[I"2input[type="radio"], input[type="checkbox"]; T;i;o;;[o;;[o; ;[o:Sass::Selector::Element ;[I" input; T;$0; ig;I"; Fo;# ;[I" type; T;$0;%I"=; T;[I" "radio"; T;&0; ig;@z;0;o;;{; ig;@zo;;[I" ; Fo; ;[o;8 ;[I" input; T;$0; ig;@zo;# ;[I" type; T;$0;%I"=; T;[I""checkbox"; T;&0; ig;@z;0;o;;{; ig;@z; ig;@z;[o; ;[I"margin-top; T;o;;I"0; T; ;; @ ;i; ;!;[; ih; @ ; ig;'T; @ ; iN;'T; @ o; ;[I" /* Reset rounded corners */; T; ; ;[; il; @ o; ;[I"[.input-group .form-control:first-child, .input-group-addon:first-child, .input-group-btn:first-child > .btn, .input-group-btn:first-child > .btn-group > .btn, .input-group-btn:first-child > .dropdown-toggle, .input-group-btn:last-child > .btn:not(:last-child):not(.dropdown-toggle), .input-group-btn:last-child > .btn-group:not(:last-child) > .btn; F;i;o;;[ o;;[o; ;[o;;[I"input-group; F; is;I"; F;0;o;;{; is;@o; ;[o;;[I"form-control; F; is;@o;+ ;,;-;[I"first-child; F;.0; is;@;0;o;;{; is;@o;;[I" ; Fo; ;[o;;[I"input-group-addon; F; is;@o;+ ;,;-;[I"first-child; F;.0; is;@;0;o;;{; is;@o;;[ I" ; Fo; ;[o;;[I"input-group-btn; F; is;@o;+ ;,;-;[I"first-child; F;.0; is;@;0;o;;{; is;@I">; Fo; ;[o;;[I"btn; F; is;@;0;o;;{; is;@o;;[ I" ; Fo; ;[o;;[I"input-group-btn; F; is;@o;+ ;,;-;[I"first-child; F;.0; is;@;0;o;;{; is;@I">; Fo; ;[o;;[I"btn-group; F; is;@;0;o;;{; is;@I">; Fo; ;[o;;[I"btn; F; is;@;0;o;;{; is;@o;;[ I" ; Fo; ;[o;;[I"input-group-btn; F; is;@o;+ ;,;-;[I"first-child; F;.0; is;@;0;o;;{; is;@I">; Fo; ;[o;;[I"dropdown-toggle; F; is;@;0;o;;{; is;@o;;[ I" ; Fo; ;[o;;[I"input-group-btn; F; is;@o;+ ;,;-;[I"last-child; F;.0; is;@;0;o;;{; is;@I">; Fo; ;[o;;[I"btn; F; is;@o;+ ;,;-;[I"not; F;.[I":last-child; F; is;@o;+ ;,;-;[I"not; F;.[I".dropdown-toggle; F; is;@;0;o;;{; is;@o;;[ I" ; Fo; ;[o;;[I"input-group-btn; F; is;@o;+ ;,;-;[I"last-child; F;.0; is;@;0;o;;{; is;@I">; Fo; ;[o;;[I"btn-group; F; is;@o;+ ;,;-;[I"not; F;.[I":last-child; F; is;@;0;o;;{; is;@I">; Fo; ;[o;;[I"btn; F; is;@;0;o;;{; is;@; is;@;[o:Sass::Tree::MixinNode ;I"border-right-radius; T: @args[o;4 ;i;5[;6[; it;7I"0; F; @ :@keywords{: @splat0;[; it; @ ; is;'T; @ o; ;[I"#.input-group-addon:first-child; T;i;o;;[o;;[o; ;[o;;[I"input-group-addon; T; iv;I"; Fo;+ ;,;-;[I"first-child; T;.0; iv;@b;0;o;;{; iv;@b; iv;@b;[o; ;[I"border-right; T;o;;I"0; T; ;; @ ;i; ;!;[; iw; @ ; iv;'T; @ o; ;[I"D.input-group .form-control:last-child, .input-group-addon:last-child, .input-group-btn:last-child > .btn, .input-group-btn:last-child > .btn-group > .btn, .input-group-btn:last-child > .dropdown-toggle, .input-group-btn:first-child > .btn:not(:first-child), .input-group-btn:first-child > .btn-group:not(:first-child) > .btn; F;i;o;;[ o;;[o; ;[o;;[I"input-group; F; i;I"; F;0;o;;{; i;@{o; ;[o;;[I"form-control; F; i;@{o;+ ;,;-;[I"last-child; F;.0; i;@{;0;o;;{; i;@{o;;[I" ; Fo; ;[o;;[I"input-group-addon; F; i;@{o;+ ;,;-;[I"last-child; F;.0; i;@{;0;o;;{; i;@{o;;[ I" ; Fo; ;[o;;[I"input-group-btn; F; i;@{o;+ ;,;-;[I"last-child; F;.0; i;@{;0;o;;{; i;@{I">; Fo; ;[o;;[I"btn; F; i;@{;0;o;;{; i;@{o;;[ I" ; Fo; ;[o;;[I"input-group-btn; F; i;@{o;+ ;,;-;[I"last-child; F;.0; i;@{;0;o;;{; i;@{I">; Fo; ;[o;;[I"btn-group; F; i;@{;0;o;;{; i;@{I">; Fo; ;[o;;[I"btn; F; i;@{;0;o;;{; i;@{o;;[ I" ; Fo; ;[o;;[I"input-group-btn; F; i;@{o;+ ;,;-;[I"last-child; F;.0; i;@{;0;o;;{; i;@{I">; Fo; ;[o;;[I"dropdown-toggle; F; i;@{;0;o;;{; i;@{o;;[ I" ; Fo; ;[o;;[I"input-group-btn; F; i;@{o;+ ;,;-;[I"first-child; F;.0; i;@{;0;o;;{; i;@{I">; Fo; ;[o;;[I"btn; F; i;@{o;+ ;,;-;[I"not; F;.[I":first-child; F; i;@{;0;o;;{; i;@{o;;[ I" ; Fo; ;[o;;[I"input-group-btn; F; i;@{o;+ ;,;-;[I"first-child; F;.0; i;@{;0;o;;{; i;@{I">; Fo; ;[o;;[I"btn-group; F; i;@{o;+ ;,;-;[I"not; F;.[I":first-child; F; i;@{;0;o;;{; i;@{I">; Fo; ;[o;;[I"btn; F; i;@{;0;o;;{; i;@{; i;@{;[o;9 ;I"border-left-radius; T;:[o;4 ;i;5[;6@R; i{;7I"0; F; @ ;;{;<0;[; i{; @ ; i;'T; @ o; ;[I"".input-group-addon:last-child; T;i;o;;[o;;[o; ;[o;;[I"input-group-addon; T; i};I"; Fo;+ ;,;-;[I"last-child; T;.0; i};@-;0;o;;{; i};@-; i};@-;[o; ;[I"border-left; T;o;;I"0; T; ;; @ ;i; ;!;[; i~; @ ; i};'T; @ o; ;[I";/* Button input groups * ------------------------- */; T; ; ;[; i; @ o; ;[I".input-group-btn; T;i;o;;[o;;[o; ;[o;;[I"input-group-btn; T; i;I"; F;0;o;;{; i;@J; i;@J;[o; ;[I" position; T;o;;I" relative; T; ;; @ ;i; ;!;[; i; @ o; ;[I"/* Jankily prevent input button groups from wrapping with `white-space` and * `font-size` in combination with `inline-block` on buttons. */; T; ; ;[; i; @ o; ;[I"font-size; T;o;;I"0; T; ;; @ ;i; ;!;[; i; @ o; ;[I"white-space; T;o;;I" nowrap; T; ;; @ ;i; ;!;[; i; @ o; ;[I"t/* Negative margin for spacing, position for bringing hovered/focused/actived * element above the siblings. */; T; ; ;[; i; @ o; ;[I" > .btn; T;i;o;;[o;;[I">; To; ;[o;;[I"btn; T; i;I"; F;0;o;;{; i;@u; i;@u;[ o; ;[I" position; T;o;;I" relative; T; ;; @ ;i; ;!;[; i; @ o; ;[I" + .btn; T;i;o;;[o;;[I"+; To; ;[o;;[I"btn; T; i;I"; F;0;o;;{; i;@; i;@;[o; ;[I"margin-left; T;o;;I" -1px; T; ;; @ ;i; ;!;[; i; @ ; i;'T; @ o; ;[I"1/* Bring the "active" button to the front */; T; ; ;[; i; @ o; ;[I"'&:hover, &:focus, &:active; F;i;o;;[o;;[o; ;[o;"; i;I"; Fo;+ ;,;-;[I" hover; F;.0; i;@;0;o;;{; i;@o;;[I" ; Fo; ;[o;"; i;@o;+ ;,;-;[I" focus; F;.0; i;@;0;o;;{; i;@o;;[I" ; Fo; ;[o;"; i;@o;+ ;,;-;[I" active; F;.0; i;@;0;o;;{; i;@; i;@;[o; ;[I" z-index; T;o;;I"2; T; ;; @ ;i; ;!;[; i; @ ; i;'T; @ ; i;'T; @ o; ;[I"D/* Negative margin to only have a 1px border between the two */; T; ; ;[; i; @ o; ;[I"&:first-child; F;i;o;;[o;;[o; ;[o;"; i;I"; Fo;+ ;,;-;[I"first-child; F;.0; i;@;0;o;;{; i;@; i;@;[o; ;[I"> .btn, > .btn-group; T;i;o;;[o;;[I">; To; ;[o;;[I"btn; T; i;I"; F;0;o;;{; i;@o;;[I" ; FI">; To; ;[o;;[I"btn-group; T; i;@;0;o;;{; i;@; i;@;[o; ;[I"margin-right; T;o;;I" -1px; T; ;; @ ;i; ;!;[; i; @ ; i;'T; @ ; i;'T; @ o; ;[I"&:last-child; F;i;o;;[o;;[o; ;[o;"; i;I"; Fo;+ ;,;-;[I"last-child; F;.0; i;@;0;o;;{; i;@; i;@;[o; ;[I"> .btn, > .btn-group; T;i;o;;[o;;[I">; To; ;[o;;[I"btn; T; i;I"; F;0;o;;{; i;@o;;[I" ; FI">; To; ;[o;;[I"btn-group; T; i;@;0;o;;{; i;@; i;@;[o; ;[I"margin-left; T;o;;I" -1px; T; ;; @ ;i; ;!;[; i; @ ; i;'T; @ ; i;'T; @ ; i;'T; @ :@templateI"// // Input groups // -------------------------------------------------- // Base styles // ------------------------- .input-group { position: relative; // For dropdowns display: table; border-collapse: separate; // prevent input groups from inheriting border styles from table cells when placed within a table // Undo padding and float of grid classes &[class*="col-"] { float: none; padding-left: 0; padding-right: 0; } .form-control { // Ensure that the input is always above the *appended* addon button for // proper border colors. position: relative; z-index: 2; // IE9 fubars the placeholder attribute in text inputs and the arrows on // select elements in input groups. To fix it, we float the input. Details: // https://github.com/twbs/bootstrap/issues/11561#issuecomment-28936855 float: left; width: 100%; margin-bottom: 0; } } // Sizing options // // Remix the default form control sizing classes into new ones for easier // manipulation. .input-group-lg > .form-control, .input-group-lg > .input-group-addon, .input-group-lg > .input-group-btn > .btn { @extend .input-lg; } .input-group-sm > .form-control, .input-group-sm > .input-group-addon, .input-group-sm > .input-group-btn > .btn { @extend .input-sm; } // Display as table-cell // ------------------------- .input-group-addon, .input-group-btn, .input-group .form-control { display: table-cell; &:not(:first-child):not(:last-child) { border-radius: 0; } } // Addon and addon wrapper for buttons .input-group-addon, .input-group-btn { width: 1%; white-space: nowrap; vertical-align: middle; // Match the inputs } // Text input groups // ------------------------- .input-group-addon { padding: $padding-base-vertical $padding-base-horizontal; font-size: $font-size-base; font-weight: normal; line-height: 1; color: $input-color; text-align: center; background-color: $input-group-addon-bg; border: 1px solid $input-group-addon-border-color; border-radius: $border-radius-base; // Sizing &.input-sm { padding: $padding-small-vertical $padding-small-horizontal; font-size: $font-size-small; border-radius: $border-radius-small; } &.input-lg { padding: $padding-large-vertical $padding-large-horizontal; font-size: $font-size-large; border-radius: $border-radius-large; } // Nuke default margins from checkboxes and radios to vertically center within. input[type="radio"], input[type="checkbox"] { margin-top: 0; } } // Reset rounded corners .input-group .form-control:first-child, .input-group-addon:first-child, .input-group-btn:first-child > .btn, .input-group-btn:first-child > .btn-group > .btn, .input-group-btn:first-child > .dropdown-toggle, .input-group-btn:last-child > .btn:not(:last-child):not(.dropdown-toggle), .input-group-btn:last-child > .btn-group:not(:last-child) > .btn { @include border-right-radius(0); } .input-group-addon:first-child { border-right: 0; } .input-group .form-control:last-child, .input-group-addon:last-child, .input-group-btn:last-child > .btn, .input-group-btn:last-child > .btn-group > .btn, .input-group-btn:last-child > .dropdown-toggle, .input-group-btn:first-child > .btn:not(:first-child), .input-group-btn:first-child > .btn-group:not(:first-child) > .btn { @include border-left-radius(0); } .input-group-addon:last-child { border-left: 0; } // Button input groups // ------------------------- .input-group-btn { position: relative; // Jankily prevent input button groups from wrapping with `white-space` and // `font-size` in combination with `inline-block` on buttons. font-size: 0; white-space: nowrap; // Negative margin for spacing, position for bringing hovered/focused/actived // element above the siblings. > .btn { position: relative; + .btn { margin-left: -1px; } // Bring the "active" button to the front &:hover, &:focus, &:active { z-index: 2; } } // Negative margin to only have a 1px border between the two &:first-child { > .btn, > .btn-group { margin-right: -1px; } } &:last-child { > .btn, > .btn-group { margin-left: -1px; } } } ; T; i;'T; @