File: D:/HostingSpaces/Neopoints/momsecurity.be/resources/sass/6-Organisms/_organisms.header.scss
.o-header {
@include z(z-header);
position: relative;
padding: space(4) 0;
margin-bottom: -100%;
background: linear-gradient(180deg, rgba(palette(primary, 800), 0.8) 0%, rgba(palette(primary, 800), 0.4) 60%, rgba(palette(primary, 800), 0) 100%);
&.is-sticky {
opacity: 0;
position: fixed;
z-index: 50;
top: 0;
left: 0;
width: 100%;
padding-top: space(2);
padding-bottom: space(2);
box-shadow: 0 -5px 30px black;
background-color: palette(primary, 800);
transform: translateY(-100%);
transition-property: transform, opacity;
transition-duration: 300ms;
transition-delay: 0ms, 300ms;
transition-timing-function: cubic-bezier(0.4, 0, 0.6, 1);
@include mq($bp-header-large) {
display: none;
}
.is-sticky-header-visible & {
opacity: 1;
transform: none;
transition-delay: 0ms;
}
}
}
.o-header__main {
@include contain;
display: flex;
justify-content: space-between;
align-items: center;
position: relative;
}
.o-header__logo {
flex: none;
&:focus {
outline-offset: 2px;
outline-color: palette(feedback, focus);
}
}
.o-header__img {
width: 160px;
max-height: 60px;
@include mq(700) {
width: 220px;
max-height: 80px;
}
.is-sticky & {
width: 140px !important;
max-height: 50px !important;
}
}
.o-header__nav {
width: 100%;
margin-left: space(6);
@include mq($max: $bp-header-large) {
display: none;
}
}
.o-header__language {
margin-left: space(2);
@include mq($max: $bp-header-large) {
margin-left: auto;
}
}
.o-header__toggle {
margin-left: 40px;
//@include mq($bp-header-large) {
// display: none;
//}
}