File: D:/HostingSpaces/SBogers10/otium.komma.nl/resources/sass/6-Organisms/_organisms.subfooter.scss
$o-footer-bp-1: 1170;
.o-subfooter {
@include z(z-subfooter);
background-color: palette(primary, 100);
color: palette(primary, 300);
}
.o-subfooter__main {
@include contain;
@include font(s);
display: flex;
flex-wrap: wrap;
justify-content: flex-start;
align-items: center;
padding-top: space(1);
padding-bottom: space(1);
@include mq($max: $o-footer-bp-1) {
padding-top: space(3);
text-align: center;
flex-direction: column;
}
}
.o-subfooter__copyright {
margin: 0 auto;
@include mq($o-footer-bp-1) {
margin-left: 0;
margin-right: space(4);
}
}
.o-subfooter__nav {
margin: space(1) auto space(2);
@include mq($o-footer-bp-1) {
margin: 0 0 0 auto;
}
}
.o-subfooter__list {
display: flex;
flex-wrap: wrap;
list-style-type: none;
margin: 0;
@include mq($max: $o-footer-bp-1) {
justify-content: center;
}
}
.o-subfooter__item {
margin-right: space(4);
white-space: nowrap;
@include mq($max: $o-footer-bp-1) {
margin-right: space(2);
margin-bottom: space(1);
&:first-child {
width: 100%;
}
&:last-child {
display: flex;
align-items: center;
&::before {
content: '';
display: block;
width: 1px;
height: 100%;
margin-right: space(2);
background-color: palette(primary, 300);
}
}
}
}
.o-subfooter__link {
color: palette(primary, 300);
text-decoration: none;
transition: color 200ms;
&:hover {
color: palette(primary, 500);
}
}
.o-subfooter__trademark {
margin-top: space(1);
margin-bottom: space(1);
@include mq($max: $o-footer-bp-1) {
margin: 0 auto;
padding-top: space(2);
border-top: 1px solid palette(primary, 300);
}
}