.network-footer { margin-bottom: 0; padding: 60px 42.5px 40px; font-family: $font-family-sans-serif; font-size: rem(16); color: var(--accent-fg, $white); background-color: var(--accent, $brand-accent); ul { margin: 0; padding: 0; list-style: none; text-align: center; font-weight: 600; line-height: (36/16); } a { color: var(--accent-fg, $white); text-decoration: none; border-bottom: solid 1px transparent; &:hover, &:focus { border-bottom: solid 1px var(--accent-fg, $white); } } &__block { border-top: solid 1px var(--accent-fg, $white); &:first-of-type { border-top: 0; } } &__block--1 { margin: 0 -5px; padding: 0 0 40px; } &__block--2 { padding: 30px 7.5px; .widget { margin-bottom: 1em; } } &__menu { padding: 30px 7.5px 0; } &__block .social-media { margin-top: 0; width: 100%; a { margin: 0 0.5em 0 0; border-bottom: none; &:hover, &:focus { border-bottom: none; } } } } .social-media { margin-top: 1em; a { font-size: rem(32); margin: 0 0.25em; transition: all 0.4s; } } @media (min-width: $medium) { .network-footer { display: flex; flex-direction: row; align-items: center; justify-content: center; ul { text-align: left; } &__block { display: flex; align-items: center; height: 142.5px; margin: 0; padding: 0 69.5px; border-top: 0; border-right: solid 1px var(--accent-fg, $white); } &__block--2 { flex-direction: column; justify-content: center; } &__block:last-of-type { border-right: 0; } } .social-media { a { font-size: rem(24); margin: 0 0.5em 0 0; } } } @media (min-width: $extra-large) { .network-footer { ul { li { display: inline-block; margin-right: 3em; } } } }