/* Table of Contents ================================================== # Footer # Styles # Colors # Media Queries */ /* # Footer ================================================== */ .footer { background: $color-white; border-top: 1px solid $color-haze; box-sizing: border-box; color: $color-black; display: block; height: 30px; padding-top: 3px; width: 100%; } .footer-nav { list-style: none; margin: 0; padding: 0; } .footer-nav > li { float: left; font-size: 9px; font-weight: 500; margin: 0 5px; text-transform: uppercase; } .footer-nav > li:first-child { margin-left: 0; } .footer-nav > li:last-child { margin-right: 0; } .footer-nav > li > a:hover, .footer-nav > li > a.active, .footer-nav > li > a:active, .footer-nav > li > a:focus { color: $color-primary; } /* # Styles ================================================== */ .footer-fixed { bottom: 0; left: 0; position: fixed; right: 0; z-index: 1030; } /* # Colors ================================================== */ .footer-dark { background: $color-black; border-color: $color-dark-black; color: $color-white; } .footer-light { background: $color-light-haze; border-color: $color-dark-haze; } /* # Media Queries ================================================== */ @media only screen and (-webkit-min-device-pixel-ratio: 2), only screen and ( min--moz-device-pixel-ratio: 2), only screen and ( -o-min-device-pixel-ratio: 2/1), only screen and ( min-device-pixel-ratio: 2), only screen and ( min-resolution: 192dpi), only screen and ( min-resolution: 2dppx) { .footer { border-width: 0.5px; } }