HEX
Server: Microsoft-IIS/8.5
System: Windows NT YDAWBH120 6.3 build 9600 (Windows Server 2012 R2 Standard Edition) AMD64
User: tentjecom_web (0)
PHP: 7.4.14
Disabled: NONE
Upload Files
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;
	//}
}