357 lines
6.0 KiB
SCSS
357 lines
6.0 KiB
SCSS
|
|
/*-----------------------------------------------------------------------------------*/
|
|
/* Footer
|
|
/*-----------------------------------------------------------------------------------*/
|
|
|
|
#colophon {
|
|
clear: both;
|
|
overflow: hidden;
|
|
margin: 0 auto;
|
|
background: $color-footer-background;
|
|
border-top: 1px solid $color-footer-background;
|
|
// seems useless, but in case someone changes the background via user style
|
|
// this will make a line between main content and footer
|
|
color: #fff;
|
|
padding-top: 40px;
|
|
padding-bottom: 40px;
|
|
|
|
.no-sidebar & {
|
|
margin-top: 60px;
|
|
}
|
|
|
|
.footer-menu ul a {
|
|
color: $color-footer-text-links;
|
|
}
|
|
p,
|
|
#site-info {
|
|
color: $color-footer-text;
|
|
a {
|
|
color: $color-footer-text-links;
|
|
}
|
|
}
|
|
|
|
.footer-menu ul a:focus,
|
|
#site-info a:focus,
|
|
.footer-menu ul a:hover,
|
|
#site-info a:hover {
|
|
color: $color-footer-text-links-hover;
|
|
}
|
|
a {
|
|
color: $color-footer-text-links;
|
|
}
|
|
|
|
.custom-logo-wrap {
|
|
text-align: left;
|
|
display: block;
|
|
padding-bottom: 45px;
|
|
}
|
|
|
|
}
|
|
|
|
.page-template-shop-front #colophon {
|
|
margin-top: 0;
|
|
}
|
|
|
|
#site-info {
|
|
padding-top: 10px;
|
|
ul {
|
|
margin: 0;
|
|
padding: 0;
|
|
li {
|
|
display: block;
|
|
|
|
&.copyright:after,
|
|
&.wp-credit:after,
|
|
&.theme-author:after {
|
|
content: '\002E';
|
|
}
|
|
}
|
|
}
|
|
}
|
|
|
|
.title-footer {
|
|
display: block;
|
|
margin: 0;
|
|
padding-bottom: 45px;
|
|
font-size: 24px;
|
|
font-size: 1.5rem;
|
|
font-weight: bold;
|
|
}
|
|
|
|
/* --- Big Footer Featured Area --- */
|
|
|
|
.big-footer-feature {
|
|
display: block;
|
|
margin-bottom: 40px;
|
|
padding-bottom: 40px;
|
|
border-bottom: 1px solid rgba(255, 255, 255, 0.2);
|
|
}
|
|
#big-footer-feature h2.footer-feature-title,
|
|
#big-footer-feature h3.footer-feature-title {
|
|
position: relative;
|
|
display: block;
|
|
padding: 8px 0 20px;
|
|
}
|
|
|
|
.big-footer-feature p {
|
|
margin-bottom: 0;
|
|
&.text-small {
|
|
padding: 10px 0 0 0;
|
|
}
|
|
}
|
|
|
|
.footer-feature-textwrap {
|
|
padding: 15px 0 0 50px;
|
|
}
|
|
|
|
.footer-feature-image a {
|
|
display: block;
|
|
line-height: 0;
|
|
}
|
|
|
|
/* --- Big Instagram Footer Widget Area --- */
|
|
|
|
.big-instagram-wrap {
|
|
.widget h2.widget-title {
|
|
display: none;
|
|
}
|
|
.widget-area .widget {
|
|
position: relative;
|
|
padding: 35px 0 0 0;
|
|
}
|
|
}
|
|
|
|
.widget ul.instagram-pics li {
|
|
a {
|
|
width: 16.66666666666667%;
|
|
}
|
|
&:after {
|
|
display: none;
|
|
}
|
|
a {
|
|
display: block;
|
|
float: left;
|
|
line-height: 0;
|
|
}
|
|
}
|
|
|
|
.null-instagram-feed {
|
|
position: relative;
|
|
overflow: hidden;
|
|
}
|
|
|
|
.big-instagram-wrap .null-instagram-feed .clear {
|
|
position: absolute;
|
|
top: 0;
|
|
width: 100%;
|
|
text-align: center;
|
|
}
|
|
|
|
/* --- Footer Menus --- */
|
|
|
|
.footer-wrap {
|
|
margin: 0 auto;
|
|
}
|
|
|
|
.footer-menus-wrap {
|
|
border-bottom: 1px solid rgba(255, 255, 255, 0.2);
|
|
}
|
|
|
|
.footer-menu {
|
|
h3.footer-menu-title {
|
|
padding: 0 0 20px;
|
|
}
|
|
width: 50%;
|
|
float: left;
|
|
}
|
|
|
|
#footer-menu-one,
|
|
#footer-menu-three {
|
|
clear: left;
|
|
}
|
|
|
|
#footer-menu-two,
|
|
#footer-menu-four {
|
|
clear: right;
|
|
}
|
|
|
|
.footer-menu ul {
|
|
margin: 0;
|
|
padding: 0 0 60px;
|
|
ul {
|
|
margin: 0;
|
|
padding: 0;
|
|
}
|
|
li {
|
|
padding: 0 0 10px;
|
|
}
|
|
ul li:last-child {
|
|
padding: 0;
|
|
}
|
|
}
|
|
|
|
/* --- Footer Search --- */
|
|
|
|
#footer-search {
|
|
width: 100%;
|
|
margin: 0 auto;
|
|
text-align: left;
|
|
}
|
|
|
|
/* --- Footer Social --- */
|
|
|
|
#footer-social {
|
|
padding-top: 30px;
|
|
|
|
ul {
|
|
margin: 0;
|
|
padding: 0;
|
|
display: inline-block;
|
|
}
|
|
h3.socialmedia,
|
|
span {
|
|
@extend .screen-reader-text;
|
|
color: rgba(255, 255, 255, 0.5);
|
|
}
|
|
ul li {
|
|
display: inline-block;
|
|
}
|
|
}
|
|
|
|
|
|
|
|
@media screen and (min-width: $breakpoint-600) {
|
|
.footer-feature-image {
|
|
width: 47.8134110787172%;
|
|
float: left;
|
|
margin-right: 2.1865889212828%;
|
|
}
|
|
.footer-feature-textwrap {
|
|
width: 47.8134110787172%;
|
|
float: right;
|
|
padding-top: 0;
|
|
margin-left: 2.1865889212828%;
|
|
}
|
|
}
|
|
|
|
@media screen and (min-width: $breakpoint-sm) {
|
|
#colophon {
|
|
padding-top: 70px;
|
|
}
|
|
#site-info {
|
|
font-size: 14px;
|
|
font-size: 0.875rem;
|
|
ul li {
|
|
display: inline-block;
|
|
}
|
|
}
|
|
#footer-social {
|
|
padding-top: 10px;
|
|
}
|
|
.big-footer-feature {
|
|
margin-bottom: 70px;
|
|
padding-bottom: 70px;
|
|
|
|
h3.footer-feature-title {
|
|
padding: 8px 0 35px;
|
|
}
|
|
}
|
|
.big-instagram-wrap .widget-area .widget {
|
|
padding: 45px 0 0 0;
|
|
}
|
|
}
|
|
|
|
@media screen and (min-width: $breakpoint-1024) {
|
|
.footer-feature-btn {
|
|
margin: 40px 0 0 0;
|
|
padding: 18px 40px;
|
|
}
|
|
.big-footer-feature p.text-small {
|
|
padding: 20px 0 0 0;
|
|
}
|
|
}
|
|
|
|
@media screen and (min-width: $breakpoint-1060) {
|
|
.footer-feature-textwrap {
|
|
p.text-big {
|
|
font-size: 1.4rem;
|
|
}
|
|
p.text-small {
|
|
font-size: .8rem;
|
|
line-height: 1rem;
|
|
}
|
|
}
|
|
.title-footer {
|
|
width: 31.74603174603175%;
|
|
/* -- 400px at 1440px ---*/
|
|
margin-right: 2.38095238095238%;
|
|
/* -- 30px at 1440px ---*/
|
|
float: left;
|
|
}
|
|
#colophon {
|
|
padding-left: 0;
|
|
padding-right: 0;
|
|
|
|
.custom-logo-wrap {
|
|
width: 31.74603174603175%;
|
|
/* -- 400px at 1440px ---*/
|
|
margin-right: 2.38095238095238%;
|
|
/* -- 30px at 1440px ---*/
|
|
float: left;
|
|
.custom-logo-link img {
|
|
max-width: 130px;
|
|
max-height: 59px;
|
|
}
|
|
}
|
|
}
|
|
|
|
|
|
#footer-menu-one,
|
|
#footer-menu-two,
|
|
#footer-menu-three,
|
|
#footer-menu-four {
|
|
clear: none;
|
|
}
|
|
.footer-menu {
|
|
width: 14.68253968253968%;
|
|
/* -- 185px at 1440px ---*/
|
|
float: left;
|
|
}
|
|
#footer-menu-one,
|
|
#footer-menu-two,
|
|
#footer-menu-three {
|
|
margin-right: 2.38095238095238%;
|
|
/* -- 30px at 1440px ---*/
|
|
}
|
|
.title-footer {
|
|
font-size: 36px;
|
|
font-size: 2.25rem;
|
|
}
|
|
#site-info {
|
|
width: 50%;
|
|
float: left;
|
|
}
|
|
#footer-social {
|
|
padding-top: 23px;
|
|
float: right;
|
|
text-align: right;
|
|
ul {
|
|
float: left;
|
|
}
|
|
|
|
span {
|
|
display: inline-block;
|
|
float: left;
|
|
padding: 8px 15px 0px 0px;
|
|
}
|
|
}
|
|
.footer-feature-image {
|
|
width: 31.74603174603175%;
|
|
margin-right: 0;
|
|
}
|
|
.footer-feature-textwrap {
|
|
width: 65.87301587301587%;
|
|
margin-left: 0;
|
|
}
|
|
}
|