.last-modified-bar { background: @color-footer-background-60; &-content { margin: 0 auto; padding: 12px @margin-side; max-width: @footer-width; display: flex; align-items: center; } &-icon { margin-right: @icon-padding; width: 20px; height: 20px; background-repeat: no-repeat; background-position: center; opacity: @opacity-icon; } &-text { a { margin-right: 5px; } } } .mw-footer { z-index: 8; // High enough so it covers the floating UI clear: both; position: relative; direction: ltr; margin-top: @margin-side * 2; color: @color-footer-text; background: @color-footer-background-50; font-size: @ui-menu-text; line-height: @footer-line-height; a, a.external { color: @color-footer-link; &:hover, &:active, &:focus { color: @color-footer-link-active; text-decoration: none; } } ul { margin: 0; display: flex; flex-wrap: wrap; } li { list-style: none; } } #footer { &-content { margin: 0 auto; padding: 0 @margin-side; max-width: @footer-width; display: flex; flex-direction: column; } &-bottom { margin-top: @margin-side * 1.5; background-color: @color-footer-background-40; &-content { margin: 0 auto; padding: @margin-side / 2 @margin-side; max-width: @footer-width; display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; } } &-sitetitle { margin: @margin-side * 2.5 0 @margin-side / 2 0; color: @base-90; font-size: 20px; } &-desc { margin: @margin-side / 2 0; } &-places { margin: 0 -@margin-side !important; display: flex; flex-wrap: wrap; li a { padding: @margin-side / 2 @margin-side; display: block; } } &-info { margin-top: @margin-side / 2; opacity: 0.5; font-size: 12px; li { margin: @margin-side / 2 0; } } &-tagline { padding: @margin-side / 2 0; } &-icons { margin: 0 -@margin-side / 2; display: flex; li { display: flex; // Horizontally aligned with there are two icons in the same li } a { padding: 15px 10px; display: flex; align-items: center; } } }