.contentinfo { @include padding-leader; @include padding-trailer; color: $color-text-weak; .container { @include padding-leader; @include padding-trailer; } ul { @include font-size-small; @include adjust-leading-to(1); } p { @include padding-trailer(.25); margin: { right: 0; left: 0; } &:last-child { padding-bottom: 0; } } a { color: $color-text; &:hover, &:focus { color: $color-text-strong; } } } .contentinfo-tools, .contentinfo-social { @include padding-leader($font-size: $font-size-small); } .contentinfo-tools ul { @extend %horizontal-list; font-size: 1em; } @include breakpoint($tablet-large) { .contentinfo { padding: { top: 0; bottom: 0; } height: $sticky-contentinfo-height; .container { @extend %table-layout-tablet-large; text-align: left; } ul { display: table-row; height: 100%; } } .contentinfo-legal, .contentinfo-tools, .contentinfo-social { @extend %table-layout-cell-tablet-large; } .contentinfo-tools, .contentinfo-social { padding: 0 0 0 ($gutter-width * 2); width: 1px; white-space: nowrap; } .contentinfo-social { @include adjust-leading-to(1, $font-size-small); } }