/* =================================== */ /* 6. Footer /* =================================== */ #footer { background: #fff; color: #252b33; margin-left:260px; padding: 66px 0px; padding: 4.125rem 0; .nav { .nav-item { display: inline-block; line-height: 12px; margin: 0; .nav-link { color: #252b33; -webkit-transition: all 0.2s ease; transition: all 0.2s ease; &:focus { color: $primary-color; -webkit-transition: all 0.2s ease; transition: all 0.2s ease; } } &:first-child .nav-link { padding-left: 0px; } &:last-child .nav-link{ padding-right: 0px; } } .nav-link:hover { color: $primary-color; -webkit-transition: all 0.2s ease; transition: all 0.2s ease; } } .footer-copyright { border-top: 1px solid #e2e8ea; padding: 0px 0px; color: #67727c; .nav { .nav-item .nav-link { color: #67727c; } .nav-link:hover { color: $primary-color; -webkit-transition: all 0.2s ease; transition: all 0.2s ease; } } } .nav.flex-column .nav-item { padding: 0px; .nav-link { margin: 0.7rem 0px; } } &.footer-text-light { color: rgba(250, 250, 250, 0.8); .nav .nav-item .nav-link { color: rgba(250, 250, 250, 0.8); &:hover { color: rgba(250, 250, 250, 1); } } .footer-copyright { border-color: rgba(250, 250, 250, 0.15); color: rgba(250, 250, 250, 0.5); } &:not(.bg-primary) .social-icons-light.social-icons li a { color: rgba(250, 250, 250, 0.8); &:hover { color: rgba(250, 250, 250, 1); } } &.bg-primary { color: #fff; .nav .nav-item .nav-link { color: #fff; &:hover { color: rgba(250, 250, 250, 0.7); } } .footer-copyright { border-color: rgba(250, 250, 250, 0.15); color: rgba(250, 250, 250, 0.9); } :not(.social-icons) a { color: #fff; &:hover { color: rgba(250, 250, 250, 0.7); } } } } } @include media-breakpoint-down(sm) { #footer { margin-left:0px; } } /*=== 6.1 Social Icons ===*/ .social-icons { margin: 0; padding: 0; display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; list-style: none; li { margin: 0px 6px; padding: 0; overflow: visible; a { display: block; height: 26px; line-height: 26px; width: 26px; font-size: 18px; text-align: center; color: #4d555a; text-decoration: none; @include transition(all 0.2s ease); } i { line-height: inherit; } } &.social-icons-sm li{ margin: 0px 4px; } &.social-icons-sm li a { font-size: 15px; width:22px; } &.social-icons-lg li a { width: 34px; height: 34px; line-height:34px; font-size: 22px; } &.social-icons-light li a { color: #eee; } &.social-icons-muted li a { color: #aab1b8; } li:hover { a { color: #999; } } } /*=== 6.2 Back to Top ===*/ #back-to-top { display: none; position: fixed; z-index: 1030; bottom: 8px; right: 10px; background-color: rgba(0, 0, 0, 0.22); text-align: center; color: #fff; font-size: 14px; width: 36px; height: 36px; line-height: 34px; border-radius:3px; @include transition(all 0.3s ease-in-out); @include box-shadow(0px 5px 15px rgba(0, 0, 0, 0.15)); &:hover { background-color: $primary-color; @include box-shadow(0px 5px 15px rgba(0, 0, 0, 0.25)); @include transition(all 0.3s ease-in-out); } } @include media-breakpoint-down(xs) { #back-to-top {z-index: 1029;} }