@icon_size: 1.3em; @rounding: 0.25em; @padding: 0.75em; @margin: 0.1em; @align: left; @mobile_align: left; @responsive_breakpoint: 780px; .social-media-button-container { .clearfix(); text-align: @align; @media (max-width: @responsive_breakpoint) { text-align: @mobile_align; } // This little gem allows justified buttons when there's only one row of buttons or if it's the last row of buttons /* &:after { content:""; display:inline-block; width:100%; } */ } .social-media-button-base() { display: inline-block; font-size: @icon_size; line-height: 1em; margin: @margin; padding: @padding 0; width: (1em + @padding * 2); text-align: center; vertical-align: middle; .sow-icon-fontawesome { display: inline-block; height: 1em; } .rounded(@rounding); }