File: D:/HostingSpaces/SBogers10/reiskick.komma.nl/resources/sass/6-Organisms/_organisms.header.scss
.o-header {
@include z(z-header);
position: relative;
padding: space(2) 0;
&.is-sticky {
opacity: 0;
position: fixed;
z-index: 50;
top: 0;
left: 0;
width: 100%;
padding-top: space(4);
padding-bottom: space(4);
box-shadow: 0 -5px 30px black;
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: none;
//outline-offset: 2px;
//outline-color: palette(feedback, focus);
}
opacity: 1;
transition: opacity 150ms;
&:hover {
opacity: 0.8;
}
}
.o-header__img {
width: 178px;
max-height: 97px;
@include mq($max: $bp-header-large) {
width: 138px;
max-height: 76px;
}
}
.o-header__nav {
width: 100%;
padding-left: space(4);
@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 {
@include mq($bp-header-large) {
display: none;
}
}
.o-header--pull-up {
margin-bottom: -100%;
}