@charset "UTF-8";

:root {
	--color-black: 0,0,0;
	--color-beige: 255,249,240;
	--color-brown: 199,159,120;
	--color-grey: 106,106,106;
	--color-red: 129,65,65;
	--color-sand: 240,230,211;
	--color-white: 255,255,255;
	--color-yellow: 236,170,0;
	--color-yellow-halftone: 245,209,119;
	
	--transition-timing-ease-in-out: cubic-bezier(0.6,0,0.4,1);
}

html {
	height: 100%;
	font-family: muli, sans-serif;
}

body {
	width: 100%;
	height: 100%;
    background: rgb(var(--color-beige));
	overflow-y: scroll;
}

body.noscroll {
	overflow: hidden;
}

/** {
	filter: none !important;
}*/
/*body.loading:after {
    content: "";
    display: block;
    position: fixed;
    width: 100vw;
    height: 100vh;
    left: 0;
    top: 0;
    background: rgb(var(--color-black)) url("../images/) center center no-repeat;
    background-size: clamp(200px, (400 / 1920) * 100vw, 400px) auto;
    pointer-events: none;
    z-index: 10000;
}

body.loading.loaded:after {
    opacity: 0;
    transform: scale(1.2);
    transition: opacity 0.4s 0.8s linear, transform 1s 0.4s cubic-bezier(0.25,0.25,0.25,1);
}*/

.notransition {
	transition: none !important;
}

* {
	-webkit-box-sizing: border-box;
	        box-sizing: border-box;
	-webkit-text-size-adjust: 100%;
}

img, iframe, video {
	display: block;
}

html, body, div, span, object, iframe, h1, h2, h3, h4, h5, h6, hr, p, blockquote, pre, a, abbr, address, cite, code, del, dfn, em, img, ins, kbd, q, samp, small, strong, sub, sup, var, b, i, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, figure, figcaption, hgroup, menu, footer, header, nav, button, section, summary, time, mark, audio, video {
	margin: 0;
	padding: 0;
	border: none;
}

ul, li {
	list-style: none;
}

a {
	color: inherit;
	text-decoration: none;
}

h1, h2, h3, h4, h5 {
	font-weight: normal;
}

button {
	background: none;
	border-radius: 0;
	cursor: pointer;
}

button::-moz-focus-inner {
    padding: 0;
    border: 0
}

*:focus {
    outline: 0;
}


/*************************************
	Header
 *************************************/


header {
    display: block;
    position: absolute;
	width: 100%;
	left: 0;
    top: 0;
	margin: 0;
    padding: 0;
    transition: background 0.4s linear;
    z-index: 200;
}

header:before {
	content: "";
	display: block;
	position: absolute;
	width: 100%;
	height: 100%;
	left: 0;
	top: 0;
	background-image: linear-gradient(rgba(var(--color-black),0.85), rgba(var(--color-black),0));
	opacity: 0;
	transition: opacity 0.4s linear;
}

body.nav-invert header:before {
	background-image: linear-gradient(rgba(var(--color-beige),0.85), rgba(var(--color-beige),0));
}

body.top header {
    position: fixed;    
}

header.fixed {
    position: fixed;
	transition: background 0.4s 0.6s linear, transform 0.6s;
}

header.fixed:before {
    opacity: 1;
	transition-duration: 0s;
}

header.hide {
	transform: translateY(-100%);
}

header .ticker {
	position: absolute;
	width: min(1400px, 100vw);
	left: 0;
	right: 0;
	background-image: linear-gradient(rgba(var(--color-black),0.5), rgba(var(--color-black),0.25) calc(100% - 1px), rgba(var(--color-black),0.35));
    margin: 0 auto;
	overflow: hidden;
	transform: translateY(-100%);
	transition: transform 0.4s 0.4s cubic-bezier(0.25,0.25,0.25,1);
}

header.fixed .ticker {
	transform: translateY(-100%);
}

header .ticker h2 {
	display: block;
	max-width: 1280px;
	color: rgb(var(--color-white));
	font-size: clamp(12px, (15 / 1400) * 100vw, 15px);
	line-height: 1.2em;
	text-transform: uppercase;
	margin: 0 auto;
	padding: 1em 0 1em calc(min(70px, (70 / 1400) * 100vw) + min(266px, 19vw));
	transform: translateY(-100%);
	transition: transform 0.4s 0.8s cubic-bezier(0.25,0.25,0.25,1);
}

body.top header .ticker,
body.top header .ticker h2 {
	transform: translateY(0);
}


header nav,
footer nav,
footer > div {
    max-width: 1280px;
    margin: 0 auto;
	padding: 0 min(70px, (70 / 1400) * 100vw);
}

header nav {
	position: relative;
	padding-bottom: 10px;
}

footer nav {
	padding-top: min(75px, (75 / 1400) * 100vw);
}

footer > div {
	display: flex;
	flex-direction: column;
	row-gap: min(46px, (46 / 1400) * 100vw);
	padding-top: min(46px, (46 / 1400) * 100vw);
	padding-bottom: min(46px, (46 / 1400) * 100vw);
}

header nav ul,
footer nav ul {
/*footer > div > div {*/
    display: flex;
    flex-flow: row nowrap;
	position: relative;
	min-height: 0vh;
	font-size: clamp(12px, (15 / 1400) * 100vw, 15px);
	padding-top: 0;
}

footer > div > div {
    display: grid;
	grid-template-columns: auto auto auto auto 1fr;
	/*column-gap: 5em;*/
	grid-row-gap: 2em;
	position: relative;
	min-height: 0vh;
	font-size: clamp(12px, (15 / 1400) * 100vw, 15px);
	padding-top: 0;
}

header nav ul li,
footer nav ul li,
footer > div > div > div {
	min-height: 0vh;
	display: flex;
	align-items: center;
	position: relative;
	color: rgb(var(--color-beige));
	font-weight: 400;
	font-size: inherit;
	letter-spacing: -0.01em;
	line-height: 1.2em;
	/*white-space: nowrap;*/
	transition: color 0.4s linear;
}

/*footer > div > div > div:not(.social-networks):not(.certifications) {
	grid-row-end: span 2;
}*/

header nav ul li:not(.home):not(.careers):not(.lang),
footer nav ul li:not(.home):not(.careers):not(.lang) {
	align-items: flex-start;
	min-height: 3.6em;
	padding-top: 1.2em;
}

header nav ul li a,
footer nav ul li a {
	position: relative;
}

header nav ul li:not(.home):not(.careers):not(.lang) a:after,
footer nav ul li:not(.home):not(.careers):not(.lang) a:after {
	content: "";
	display: block;
	position: absolute;
	width: 100%;
	height: 3px;
	left: 0;
	bottom: -0.6667em;
	background: rgb(var(--color-yellow));
	border-radius: 9999px;
	transform: scaleX(0);
	transition: transform 0.4s cubic-bezier(0.25,0.25,0.25,1);
}

header nav ul li:not(.home):not(.careers):not(.lang) a:hover:after,
footer nav ul li:not(.home):not(.careers):not(.lang) a:hover:after,
header nav ul li:not(.home):not(.careers):not(.lang).active a:after,
footer nav ul li:not(.home):not(.careers):not(.lang).active a:after {
	transform: scaleX(1);
}

header nav ul li:not(.home):not(.lang),
footer nav ul li:not(.home):not(.lang) {
	flex-grow: 1;
}

body.nav-invert header nav ul li,
footer nav ul li,
footer > div > div > div {
	color: rgb(var(--color-grey));
}

/*footer nav ul li,
footer > div > div > div {
	display: block;
}*/

footer > div > div > div {
	display: block;
	font-size: 0.8333em;
}

/*footer > div > div > div:nth-child(1) {
	grid-row: 1 / span 3;
}*/

/*footer > div > div > div:not(:first-of-type) + div {
	margin-left: 5em;
}*/

/*footer > div > div > div:nth-child(2) {
	margin-left: -5em;
}*/

footer > div > div > div > a:has(> img) {
	display: block;
	margin-bottom: clamp(12px, (15 / 1400) * 100vw, 15px);
}

footer > div > div > div > a > img {
	display: block;
	max-width: 150px;
	max-height: 30px;
	height: auto;
}

footer > div > div > div:nth-child(3),
footer > div > div > div:nth-child(4),
footer > div > div > div:nth-child(5),
footer > div > div > div:nth-child(7) {
	margin-left: 5em;
}

footer > div > div > div.social-networks {
	grid-column: 5 / span 1;
	grid-row: 2 / span 1;
	/*flex-grow: 1;*/
	font-size: 2.5em;
	text-align: right;
}

footer > div > div > div.social-networks a + a {
	margin-left: 0.5em;
}

footer > div > div > div.certifications {
	grid-column: 2 / span 4;
	display: flex;
	justify-content: flex-end;
	column-gap: 0.25em;
	row-gap: 0.25em;
	font-size: 2.5em;
}

footer > div > div > div.certifications img {
	display: block;
	max-width: 60px;
	max-height: 50px;
	width: auto;
	height: auto;
}

footer > div > div > div.certifications a:nth-child(1) img,
footer > div > div > div.certifications a:nth-child(2) img {
	max-width: 120px;
}

footer > div > div > div.legal {
	flex-grow: 1;
	text-transform: uppercase;
}

footer > div > div > div.legal a {
	text-decoration: underline;
}

header nav ul li.home,
footer nav ul li.home,
footer > div > div > div:first-of-type {
	position: relative;
	width: min(266px, 19vw);
}

footer > div > div > div:first-of-type {
	grid-row: 1 / span 3;
}

footer nav ul li.home {
	transform: translateY(100%);
}

header nav ul li.home a,
footer nav ul li.home a {
	display: block;
	position: relative;
	width: min(190px, (190 / 1400) * 100vw);
	height: min(203px, (203 / 1400) * 100vw);
	padding: min(30px, (30 / 1400) * 100vw) min(15px, (15 / 1400) * 100vw);
}

header nav ul li.home a {
	background: url("../images/bckg-header-logo.svg") left bottom no-repeat;
	background-size: 100% auto;
	filter: drop-shadow(2px 2px 3px rgba(var(--color-black),0.15));
}

footer nav ul li.home a {
	height: min(96px, (96 / 1400) * 100vw);
	padding-top: 0;
	padding-bottom: 0;
}

header nav ul li.home a img,
footer nav ul li.home a img {
	width: 100%;
	height: auto;
}

header nav ul li.careers a,
footer nav ul li.careers a {
	background: rgba(var(--color-yellow),0.8);
	border: solid 2px rgb(var(--color-white));
	border-radius: 0 0 0 0.75em;
	color: rgb(var(--color-white));
	padding: 0.5em 1em;
	transition: background-color 0.4s linear, border-color 0.4s linear, color 0.4s linear;
}

header nav ul li.careers a:hover,
header nav ul li.careers.active a,
footer nav ul li.careers a:hover,
footer nav ul li.careers.active a {
	background: rgba(var(--color-white),1);
	border-color: rgb(var(--color-yellow));
	color: rgb(var(--color-yellow));
}

header nav ul li.lang,
footer nav ul li.lang {
	font-weight: 600;
	text-transform: uppercase;
}

header nav ul,
footer nav ul {
	align-items: center;
}

header nav ul li,
footer nav ul li {
	clip-path: inset(0 -2em 0 -2em);
}

header nav ul li:not(.home) a,
footer nav ul li:not(.home) a {
	transform: translateY(100%);
}

header nav ul li.home a {
	opacity: 0;
	transform: translateY(-25%);
}

header nav ul li.show,
footer nav ul li.show {
	clip-path: inset(0 -2em -1em -2em);
	transition: clip-path 0.4s var(--transition-delay) linear;
}

header nav ul li.show a,
footer nav ul li.show a {
	opacity: 1;
	transform: translateY(0);
	transition: transform 0.4s var(--transition-delay) cubic-bezier(0.25,0.25,0.25,1);
}


/*************************************
	Sections
 *************************************/


.container {
	display: flex;
	flex-direction: column;
	position: relative;
	width: 100%;
	height: 100%;
	min-height: 100%;
}

main {
	flex: 1 0 auto;
	display: flex;
	flex-direction: column;
	row-gap: min(130px, (130 / 1400) * 100vw);
	position: relative;
}

section {
    display: block;
    position: relative;
}

section.half-row-gap,
.item-half-row-gap {
	margin-top: max(-65px, (-65 / 1400) * 100vw);
}

section:not(.widget) > div {
	max-width: 1400px;
	position: relative;
    margin: 0 auto;
	padding: 0 min(130px, (130 / 1400) * 100vw);
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	grid-column-gap: min(140px, (140 / 1400) * 100vw);
	grid-row-gap: min(70px, (70 / 1400) * 100vw);
}

section > div > div:only-of-type {
	grid-column: 1 / -1;
}

.cols-merged {
	grid-column: 1 / -1;
}

.grid-column-end-span2 {
	grid-column-end: span 2;
}

.grid-row-end-span2 {
	grid-row-end: span 2;
}

section > div > div {
	position: relative;
}

section.header h1,
section h1,
section h2,
#lightbox h2 {
	min-height: 0vh;
	font-family: alverata, serif;
	font-weight: 700;
	/*font-size: clamp(40px, (45 / 1400) * 100vw, 45px);*/
	font-size: clamp(32px, (45 / 1400) * 100vw, 45px);
	line-height: 1.1111em;
}

section.header h1,
section h1,
section h2 {
	opacity: 0;
}

section.header h1.show,
section h1.show,
section h2.show,
#lightbox h2.show {
	opacity: 1;
}

section.header h1:before,
section h1:before,
section h2:before,
#lightbox h2:before {
	content: "";
	display: block;
	width: 4.5em;
	height: 0;
	border-top-style: solid;
	border-top-width: 5px;
	border-radius: 9999px;
	margin-bottom: 0.8889em;
}

section.header h1:before,
section h1:before,
section h2:before {
	opacity: 0;
	transform-origin: left center;
	transform: scaleX(0);
}

section.header h1.show:before,
section h1.show:before,
section h2.show:before {
	opacity: 1;
	transform: scaleX(1);
	transition: opacity 0.4s linear, transform 0.4s cubic-bezier(0.25,0.25,0.25,1);
}


section.header h1.align-center,
section h1.align-center,
section h2.align-center,
#lightbox h2.align-center {
	text-align: center;
}

section.header h1.align-center:before,
section h1.align-center:before,
section h2.align-center:before,
#lightbox h2:before {	
	margin-right: auto;
	margin-left: auto;
}

section.header h1 > span,
section h1 > span,
section h2 > span {
    display: inline-block;
    overflow: hidden;
    white-space: nowrap;
}

section.header h1 > span > span,
section h1 > span > span,
section h2 > span > span {
    display: inline-block;
    transform: translateY(100%);
}

section.header h1.show > span > span,
section h1.show > span > span,
section h2.show > span > span {
	padding-bottom: 0.05em;
	transform: translateY(0);
    transition: transform 0.4s cubic-bezier(0.25,0.25,0.25,1);
	transition-delay: var(--transition-delay);
}

section h3,
#lightbox h3 {
	min-height: 0vh;
	font-weight: 700;
	font-size: clamp(20px, (22 / 1400) * 100vw, 22px);
	line-height: 1.2727em;
}

section.header h1 + h3,
section h1 + h3,
section h2 + h3 {
	margin-top: 0.6363em;
}

section h4 {
	min-height: 0vh;
	font-weight: 600;
	font-size: clamp(16px, (24 / 1400) * 100vw, 24px);
	text-transform: uppercase;
}

section p + h4 {
	margin-top: 2em;
}

section p,
section p + ul,
section ul + p,
#lightbox p {
	min-height: 0vh;
	font-weight: 400;
	font-size: clamp(16px, (18 / 1400) * 100vw, 18px);
	line-height: 1.5556em;
}

section.header h1 + p,
section h1 + p,
section h2 + p,
section h3 + p,
section ul + p,
#lightbox h3 + p {
	margin-top: 1.2222em;
}

section p + p,
section h4 + p,
section h4 + h3,
#lightbox p + p {
	margin-top: 1em;
}

section p:has(+ picture) {
	margin-bottom: 3em;
}

section picture + h4 {
	margin-top: 1em;
}

section p a:not([class]) {
	text-decoration: underline;
}

section q {
	display: block;
    min-height: 0vh;
	font-family: alverata, serif;
    font-weight: 700;
	font-size: clamp(21px, (36 / 1400) * 100vw, 36px);
	line-height: 1.18em;
	text-align: center;
	text-transform: uppercase;
	padding: 0 1em;
}

section q + picture img {
	margin: 0 auto;
	margin-top: 1.2778em;
}

a.link {
	font-weight: 700;
	font-size: 1.2222em;
	text-decoration: underline;
}

.font-size-inherit {
	font-size: inherit !important;
}

section h2 + ul,
section h3 + ul,
section p + ul {
	margin-top: 1em;
}

ol.ordered-list {
    counter-reset: count-ordered-list;
}

ol.ordered-list li,
ul.unordered-list li {
	position: relative;
	margin-top: 0.75em;
	padding-left: 1rem;
}

ol.ordered-list li:before {
    content: counter(count-ordered-list)".";
	counter-increment: count-ordered-list;
    display: inline-block;
    position: absolute;
    left: 0;
}

ul.unordered-list li:before {
    content: "•";
    display: inline-block;
    position: absolute;
    left: 0;
}

ul.grid {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
	grid-gap: min(65px, (65 / 1400) * 100vw);
	margin-top: 5.875em;
}

ul.grid li {
	position: relative;
	background: rgb(var(--color-white));
	padding-top: 100%;
	box-shadow: 0 2px 3px rgba(var(--color-black),0.16);
}

ul.grid li img {
	display: block;
	position: absolute;
	max-width: 90%;
	max-height: 90%;
	width: auto;
	height: auto;
	left: 0;
	right: 0;
	top: 0;
	bottom: 0;
	margin: auto;
}

ul.list {
	min-height: 0vh;
	font-size: clamp(25px, (65 / 1400) * 100vw, 65px);
}

ul.list li {
	position: relative;
}

ul.list li.expandable-list {
	min-height: 0vh;
	font-size: clamp(25px, (30 / 1400) * 100vw, 30px);
	line-height: 1.2em;
	border-top: solid 1px rgb(var(--color-grey));
	padding: 1em;
    transition: padding 0.6s cubic-bezier(0.25,0.25,0.25,1);
}

ul.list li.expandable-list > ul {
	padding: 0 4em 0 0;
}

ul.list li.expandable-list > ul > li:first-of-type {
	padding: 1em 0 0 0;
}

.expandable-list > button {
	display: inline-block;
	cursor: pointer;
	font-family: alverata, serif;
	font-weight: 700;
	font-size: inherit;
	text-align: left;
	margin: 0;
	padding-right: 2em;
    transition: color 0.2s linear;
}

.expandable-list > button:hover,
.expandable-list.active > button {
	color: rgb(var(--color-black));
}

.expandable-list > button:after {
	content: "\25B6";
	display: block;
	position: absolute;
	right: 1em;
	top: 1.6em;
	font-size: 0.8em;
	transition: transform 0.4s cubic-bezier(0.25,0.25,0.25,1);
}

.expandable-list.active > button:after {
	transform: rotate(90deg);
}

.expandable-list > ol,
.expandable-list > ul {
    height: 0;
    overflow: hidden;
    transition: height 0.6s cubic-bezier(0.25,0.25,0.25,1);
}

strong {
    font-weight: 700;
}

sup {
	display: inline-block;
	position: relative;
	font-size: 0.6em;
	vertical-align: top;
	margin-top: -0.3em;
}

.align-items-center {
    align-items: center;
}

.justify-content-center {
	justify-content: center;
}

.align-self-center {
    align-self: center;
}

.align-self-end {
	align-self: end;	
}

.text-align-left {
    text-align: left;
}

.text-align-center {
    text-align: center;
}

.text-align-right {
    text-align: right;
}

.text-decoration-underline {
	text-decoration: underline !important;
}

.text-transform-none {
	text-transform: none !important;
}

.text-transform-uppercase {
	text-transform: uppercase !important;
}

.white-space-nowrap {
	white-space: nowrap;
}

.img-half-w {
	display: block;
	position: relative;
	width: 50%;
}

.img-fit-auto,
.img-fit-contain,
.img-fit-cover {
	position: absolute;
	width: 100%;
	height: 100%;
	left: 0;
	top: 0;
}

.img-fit-auto {
	position: relative;
	height: auto;
}

.img-fit-contain {
	object-fit: contain;
}

.img-fit-cover {
	object-fit: cover;
}

.img-fit-height {
	position: relative;
	width: auto;
	height: min(var(--img-fit-height) * 1px, (var(--img-fit-height) / 1400) * 100vw);
}

.img-padding {
	padding: min(65px, (65 / 1400) * 100vw);
}

.img-grp-2 {
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	align-items: center;
	column-gap: min(65px, (65 / 1400) * 100vw);
	padding: min(65px, (65 / 1400) * 100vw);
	padding-right: 0;
}

.img-grp-3 {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	align-items: center;
	column-gap: min(65px, (65 / 1400) * 100vw);
	padding: min(65px, (65 / 1400) * 100vw);
	padding-right: 0;
}

.img-grp-4 {
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	align-items: center;
	grid-column-gap: min(65px, (65 / 1400) * 100vw);
	grid-row-gap: min(30px, (30 / 1400) * 100vw);
	padding: min(65px, (65 / 1400) * 100vw);
	padding-right: 0;
}

.img-grp-2 img,
.img-grp-3 img,
.img-grp-4 img {
	position: relative;
	width: 100%;
	height: auto;
}

.img-grp-4 > div > * {
	display: block;
	position: relative;
	width: 50%;
}

.img-grp-4 > div:nth-child(odd) {
	display: flex;
	justify-content: flex-end;
}

.img-out-of-frame {
	opacity: 0;
}

.img-out-of-frame.show {
	opacity: 1;
}

.img-valign-middle {
	top: 50%;
	transform: translateY(-50%);
}

.img-mask-radius {
	border-radius: 0 0 0 min(150px, (150 / 1400) * 100vw);	
}

.img-drop-shadow,
.img-reveal.show.img-drop-shadow {
	box-shadow: 0 min(30px, (30 / 1400) * 100vw) min(60px, (60 / 1400) * 100vw) rgba(var(--color-black),0.16);
}

.img-reveal.img-drop-shadow {
	box-shadow: 0 0 0 rgba(var(--color-black),0.16);
}

.img-drop-shadow-filter {
	filter: drop-shadow(0 min(30px, (30 / 1400) * 100vw) min(60px, (60 / 1400) * 100vw) rgba(var(--color-black),0.16));
}

.img-reveal {
	opacity: 0;
}

.img-reveal.show {
	opacity: 1;
	transition: opacity 0.8s linear;
	transition-delay: var(--transition-delay);
    animation: kf-img-reveal 0.8s cubic-bezier(0.25,0.25,0.25,1) both;
	animation-delay: var(--transition-delay); 
}

.img-reveal.show.img-drop-shadow {
	transition: opacity 0.8s linear, box-shadow 0.8s linear;
}

@keyframes kf-img-reveal {
    0% {
		clip-path: inset(0 0 100% 0);
	}
    99% {
		clip-path: inset(0 0 0 0);
	}
    100% {
		clip-path: none;
	}
}


.widget {
	align-self: flex-end;
	display: block;
	position: sticky;
	width: 100px;
	width: min(1400px, 100vw);
	top: 0;
	margin: 0 auto;
	margin-top: max(-130px, (-130 / 1400) * 100vw);
	padding: 0;
	filter: drop-shadow(0 10px 50px rgba(var(--color-black),0.16));
	z-index: 100;
}

.widget button {
	display: flex;
	flex-direction: column;
	justify-content: flex-end;
	position: absolute;
	width: 100px;
	height: 143px;
	right: min(130px, (130 / 1400) * 100vw);
	top: -55px;
	background: url("../images/bckg-widget.svg") center center no-repeat;
	background-size: 100% auto;
	color: rgb(var(--color-beige));
	font-family: alverata, serif;
	font-weight: 700;
	font-size: clamp(16px, (18 / 1400) * 100vw, 18px);
	line-height: 1.0556em;
	text-align: center;
	text-transform: uppercase;
	padding-bottom: 40px;
}

.widget button:before {
	content: "";
	display: block;
	position: absolute;
	width: 100px;
	height: 30px;
	left: 0;
	top: 128px;
	background-image: radial-gradient(closest-side, rgba(var(--color-black),0.1), rgba(var(--color-black),0));
	z-index: -1;
}

.bt {
	display: inline-block;
	min-height: 0vh;
	border: solid 2px rgb(var(--color-beige));
	border-radius: 9999px;
	font-weight: 600;
	font-size: clamp(18px, (20 / 1400) * 100vw, 20px);
	line-height: 1.25em;
	text-align: center;
	-webkit-backdrop-filter: blur(3px);
  	backdrop-filter: blur(3px);
	padding: 0.5em 1.4em;
	transition: background-color 0.4s linear, color 0.4s linear;
}

.bt:hover {
	background: rgb(var(--color-beige));
	color: rgb(var(--color-yellow));
}

p .bt {
	margin-top: 1em;
}

.grecaptcha-badge { 
    visibility: hidden;
}


/*************************************
	Section header
 *************************************/

section.header,
section.header > div {
	color: rgb(var(--color-beige));
	height: clamp(650px, (768 / 1400) * 100vw, 768px);
}

section.header.empty {
	height: clamp(280px, (340 / 1400) * 100vw, 340px);
}

section.header > div {
	align-items: end;
	padding-bottom: min(168px, (168 / 1400) * 100vw);
}

section.header div.text {
	display: block;
	position: relative;
	z-index: 10;
}

section.header h1:before,
section.header h2:before {
	border-top-color: rgb(var(--color-beige));
}

section.header h3 {
	color: rgb(var(--color-white));
}

section.header div.bckg-video {
	display: block;
	position: absolute;
	width: 100%;
	height: 100%;
	left: 0;
	top: 0;
	border-radius: 0 0 0 min(150px, (150 / 1400) * 100vw);
	overflow: hidden;
}

section.header div.bckg-video:after {
	content: "";
	display: block;
	position: absolute;
	width: 100%;
	height: 100%;
	left: 0;
	top: 0;
	background: rgba(var(--color-black),0.25);
	mix-blend-mode: multiply;
}

section.header div.bckg-video div.iframe-container {
    display: block;
    position: absolute;
    width: 100%;
    height: 100%;
    left: 0;
    top: 0;
}

section.header div.bckg-video iframe {
    display: block;
    position: absolute;
    width: calc((16 / 9) * 100vh);
    height: 100vh;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
}

@media (min-aspect-ratio: 16/9) {
	section.header div.bckg-video iframe {
        width: 100vw;
        height: calc((9 / 16) * 100vw);
    }
}





section h1 + h3,
section h2 + h3 {
	opacity: 0;
	transform: translateY(1.2727em);
}

section h1.show + h3,
section h2.show + h3 {
	opacity: 1;
	transform: translateY(0);
	transition: opacity 0.4s calc(var(--transition-delay) + 0.1s) linear, transform 0.4s var(--transition-delay) cubic-bezier(0.25,0.25,0.25,1);
}

section.header h1 ~ p,
section h1 ~ p,
section.header h2 ~ p,
section h2 ~ p,
section.header h1 ~ ul,
section h1 ~ ul,
section.header h2 ~ ul,
section h2 ~ ul {
	opacity: 0;
}

section.header h1.show ~ p,
section h1.show ~ p,
section.header h2.show ~ p,
section h2.show ~ p,
section.header h1.show ~ ul,
section h1.show ~ ul,
section.header h2.show ~ ul,
section h2.show ~ ul {
	opacity: 1;
	transition: opacity 0.4s calc(var(--transition-delay) + 0.4s) linear;
}

section.header h1 ~ p .bt,
section h1 ~ p .bt,
section.header h2 ~ p .bt,
section h2 ~ p .bt {
	opacity: 0;
	transform: scale(1.2);
}

section.header h1.show ~ p .bt,
section h1.show ~ p .bt,
section.header h2.show ~ p .bt,
section h2.show ~ p .bt {
	opacity: 1;
	transform: scale(1);
	transition: opacity 0.4s calc(var(--transition-delay) + 0.9s) linear, transform 0.6s calc(var(--transition-delay) + 0.8s) cubic-bezier(0.25,0.25,0.25,1);
}





section:not(.header):first-of-type {
	padding-top: min(270px, (270 / 1400) * 100vw);
}

.cols-merged p,
.cols-merged h3 {
	width: 50%;
}


/** Background transparent **/

section.bckg-transparent {
	color: rgb(var(--color-grey));
}

section.bckg-transparent:last-of-type > div {
	padding-bottom: min(130px, (130 / 1400) * 100vw);
}

section.bckg-transparent h1,
section.bckg-transparent h2,
section.bckg-transparent .expandable-list > button {
	color: rgb(var(--color-red));
}

section.bckg-transparent .expandable-list > button:after {
	color: rgb(var(--color-yellow));
}

section.bckg-transparent a.link {
	color: rgb(var(--color-yellow));
}

section.bckg-transparent .bt,
form button[type="submit"].bt {
	background: rgb(var(--color-yellow));
	border: solid 2px rgb(var(--color-yellow));
	color: rgb(var(--color-beige));
}

section.bckg-transparent .bt:hover,
form button[type="submit"].bt:hover {
	background: transparent;
	color: rgb(var(--color-yellow));
}


/** Background black **/

section.bckg-black {
	background: rgb(var(--color-black));
	color: rgb(var(--color-beige));
}

section.bckg-black:not(:first-of-type) > div,
section.bckg-red:not(:first-of-type) > div,
section.bckg-yellow:not(:first-of-type) > div {
	padding-top: min(130px, (130 / 1400) * 100vw);
	padding-bottom: min(130px, (130 / 1400) * 100vw);
}

section.bckg-black h1,
section.bckg-black h2,
section.bckg-black q {
	color: rgb(var(--color-yellow));
}

section.bckg-black a.link {
	color: rgb(var(--color-yellow));
}


/** Background red **/

section.bckg-red {
	background: rgb(var(--color-red));
	color: rgb(var(--color-beige));
}


/** Background yellow **/

section.bckg-yellow {
	background: rgb(var(--color-yellow-halftone));
	color: rgb(var(--color-grey));
}

section.bckg-yellow h1,
section.bckg-yellow h2,
section.bckg-yellow .expandable-list > button,
section.bckg-yellow .expandable-list > button:after {
	color: rgb(var(--color-beige));
}

section.bckg-yellow a.link {
	color: rgb(var(--color-beige));
}

section.bckg-yellow .expandable-list .bt {
	color: rgb(var(--color-beige));
}

section.bckg-yellow .expandable-list .bt:hover {
	background: rgb(var(--color-beige));
	color: rgb(var(--color-grey));
}

section.header + section.bckg-yellow,
section.widget + section.bckg-yellow,
section.bckg-black + section.bckg-yellow {
	margin-top: max(-130px, (-130 / 1400) * 100vw);
}




.no-padding-left {
	margin-left: max(-130px, (-130 / 1400) * 100vw);
}

.no-padding-right {
	margin-right: max(-130px, (-130 / 1400) * 100vw);
}

.pattern-yellow,
.pattern-sand {
    animation: kf-pattern 3s linear infinite both;
}

.pattern-yellow {
	background: url("../images/bckg-pattern-yellow.svg") center center repeat;
	background-size: 130px;
}

.pattern-sand {
	background: url("../images/bckg-pattern-sand.svg") center center repeat;
	background-size: 130px;
}

.pattern-sand.fixed-height {
	height: min(305px, (305 / 1400) * 100vw);
}

@keyframes kf-pattern {
    0% {
		background-position: 0 0;
	}
    100% {
		background-position: -130px 0;
	}
}

.overflow-top {
	margin-top: max(-70px, (-70 / 1400) * 100vw);
}

.overflow-right {
	margin-right: max(-70px, (-70 / 1400) * 100vw);
}

.overflow-bottom {
	margin-bottom: max(-70px, (-70 / 1400) * 100vw);
}

.overflow-left {
	margin-left: max(-70px, (-70 / 1400) * 100vw);
}

section.packaging > div {
	padding-bottom: min(250px, (250 / 1400) * 100vw);
}

section.packaging > div:before {
	content: "";
	display: block;
	position: absolute;
	width: 100%;
	height: 100%;
	left: 0;
	bottom: max(-145px, (-145 / 1400) * 100vw);
	background: url("../images/img-packaging.png") right bottom no-repeat;
	background-size: min(965px, (965 / 1400) * 100vw) auto;
	mix-blend-mode: multiply;
}

section.packaging p {
	width: 50%;
}

section.emballages-distribution {
	background-image:
		url(../images/img-header-packaging.png),
		url(../images/bckg-header-packaging.svg),
		linear-gradient(rgba(var(--color-sand),1) 50%, rgba(var(--color-beige),1) 50%);
	background-position: 
		center top,
		center -13vw,
		center center;
	background-repeat: no-repeat;
	background-size: 
		min(1400px, 100vw) auto,
		min(1400px, 100vw) auto,
		min(1400px, 100vw) auto;
}

section.certifications {
	background-color: rgb(var(--color-red));
	background-image: url(../images/bckg-header-certifications.svg);
	background-position: center bottom;
	background-repeat: no-repeat;
	background-size: 100% auto;
}

.bckg-parallax, 
.bckg-parallax picture,
.bckg-parallax picture img {
	display: block;
	position: absolute;
	width: 100%;
	height: 100%;
	left: 0;
	top: 0;
}

.bckg-parallax {
	z-index: 0;
}

.bckg-parallax picture img {
	object-fit: cover;
	object-position: left center;
}

.bckg-parallax picture:nth-child(2) img {
	clip-path: ellipse(1.5% 3% at 16.1% 49.25%);
	clip-path: ellipse(20px 24px at 225px 438px);
	clip-path: ellipse(min(20px, (20 / 1400) * 100vw) min(24px, (24 / 1400) * 100vw) at min(225px, (225 / 1400) * 100vw) min(438px, (438 / 1400) * 100vw));
	clip-path: ellipse(min(20px, (20 / 1400) * 100vw) min(24px, (24 / 1400) * 100vw) at max(20%, (225 / 1400) * 100vw) max(50%, (438 / 1400) * 100vw));
	clip-path: ellipse(30px 36px at min(20%, 225px) min(438px, (438 / 1400) * 100vw));
	clip-path: ellipse(20px 24px at min(225px, (225 / 1400) * 100vw) 49%);
}

.bckg-parallax.show picture:nth-child(2) img {
	clip-path: ellipse(33% 40% at min(20%, 225px) min(438px, (438 / 1400) * 100vw));
	clip-path: ellipse(50% 40% at min(20%, 225px) min(438px, (438 / 1400) * 100vw));
	transition: clip-path 1.2s cubic-bezier(0.6,0,0.4,1);
	transition-delay: var(--transition-delay);
}

@media screen and (max-width: 767px) {
	.bckg-parallax picture:nth-child(2) img {
		clip-path: ellipse(20px 24px at calc((156 / 375) * 100vw) min(50%, (438 / 1400) * 100vw));
		clip-path: ellipse(20px 24px at 41.6% 49%);
	}
	
	.bckg-parallax.show picture:nth-child(2) img {
		clip-path: ellipse(100% 80% at min(20%, 225px) min(438px, (438 / 1400) * 100vw));
	}
}



section.scrolling-banner > div {
	width: 100vw;
	height: min(400px, (400 / 1400) * 100vw);
	overflow: hidden;
	padding: 0;
}

section.scrolling-banner > div > div > ul {
	display: flex;
	width: calc(var(--count) * min(433px, (433 / 1400) * 100vw));
	column-gap: min(33px, (33 / 1400) * 100vw);;
    animation: kf-scrolling-banner 20s linear infinite both;
}

@keyframes kf-scrolling-banner {
    0% {
		transform: translateX(0);
	}
    100% {
		transform: translateX(-100%);
	}
}

section.scrolling-banner > div > div > ul > li {
	display: block;
	width: min(400px, (400 / 1400) * 100vw);
	height: min(400px, (400 / 1400) * 100vw);
}

section.scrolling-banner > div > div > ul > li > img {
	width: min(400px, (400 / 1400) * 100vw);
	height: auto;
	border-radius: 0 0 0 min(50px, (50 / 1400) * 100vw);
}


/*************************************
	Map
 *************************************/


.map > div {
	height: min(860px, (860 / 1400) * 100vw);
    /*box-shadow: 0 3px 30px rgba(var(--color-black),0.16);
    padding: 0 !important;*/
}

.map-container {
	height: min(860px, (860 / 1400) * 100vw);
}

.map-container img {
   max-width: inherit !important;
}

div.gm-style-iw-t:after,
div.gm-style-iw {
	background: rgb(var(--color-white)) !important;
}

div.gm-style-iw-t {
	filter: drop-shadow(0 3px 10px rgba(0,0,0,0.5)) !important;
}

div.gm-style-iw-t:after {
	box-shadow: none !important;
}

div.gm-style-iw {
	border: none !important;
	border-radius: 0 0 0 1em !important;
	box-shadow: none !important;
	color: rgb(var(--color-grey)) !important;
	font-family: muli, sans-serif !important;
	font-size: 14px !important;
	line-height: 1.2em !important;
	padding: 1.2em !important;
}

div.gm-style-iw-d {
	overflow: auto !important;
}

/**[style*="z-index: 987654;"],
*[style*="z-index: 999991;"] {
    filter: drop-shadow(0 3px 10px rgba(0,0,0,0.5));
}*/


/*************************************
	Privacy
 *************************************/


section.privacy h2 {
    font-size: 1.5em;
    line-height: 1em;
    text-transform: uppercase;
	opacity: 1;
}

section.privacy h2:before {
	content: none;
}

section.privacy h2 > span > span {
	transform: translate(0, 0);
}

section.privacy p,
section.privacy ul {
	font-size: 1em;
    line-height: 1.4em;
	opacity: 1;
	transform: translateY(0);
}


section.privacy * + h1,
section.privacy * + h2,
section.privacy * + p {
	margin-top: 1em;
}

section.privacy p + p {
	margin-top: 1.4em;
}

section.privacy ul {
	display: block;
	list-style-type: disc;
	margin-top: 1em;
	margin-bottom: 1 em;
	margin-left: 0;
	margin-right: 0;
	padding-left: 40px;
}

section.privacy li {
	display: list-item;
	list-style: disc;
}

section.privacy li + li {
	margin-top: 0.7em;
}

section.privacy a {
	text-decoration: underline;
	word-break: break-all;
}



/*************************************
	Form
 *************************************/


form {
	display: flex;
	flex-direction: column;
	row-gap: 20px;
	position: relative;
	font-size: 0px;
}

form.hide {
	height: 0 !important;
	overflow: hidden;
	transition: height 0.8s var(--transition-timing-ease-in-out);
}

form.form-contact {
	margin-top: 18px;
}

form.form-contact,
form fieldset {
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	grid-gap: 10px;
	align-items: end;
}

form fieldset {
	position: relative;
	border: solid 2px rgb(var(--color-black));
	border-top-width: 1.8em;
	border-radius: 0 0 0 1em;
	font-size: 16px;
	padding: 10px;
}

form legend, 
form input, 
form textarea,
form select,
form label,
form label span,
form fieldset > span,
form button[type="submit"] {
    display: block;
    position: relative;
    /*min-height: 0vh;*/
    color: rgb(var(--color-black));
    font-family: muli, sans-serif;
    font-weight: 400;
    /*font-size: clamp(16px, (18 / 1400) * 100vw, 18px);*/
	font-size: 16px;
    line-height: 1.2em;
    margin: 0;
    padding: 0.5em 0.75em;
}

form legend {
	display: flex;
	align-items: center;
	position: absolute;
	left: 10px;
	top: 0;
	color: rgb(var(--color-white));
	line-height: 1em;
	margin-top: -1.8em;
	padding: 0.4em 0.75em;
}

form legend span,
form div.row-header > span {
	display: inline-block;
	font-size: 12px;
	line-height: 1em;
	text-transform: uppercase;
}

form input, 
form textarea,
form select {
    width: 100%;
	height: 2.2em;
    background: rgb(var(--color-beige));
	border: solid 1px rgb(var(--color-black));
    /*border-radius: 0;*/
	border-radius: 0 0 0 0.75em;
    -webkit-appearance: none;
	appearance: none;
}

/*form.form-contact input, 
form.form-contact textarea,
form.form-contact select {
	border-radius: 0 0 0 0.75em;
}*/

form select {
	background-image: url("../images/ico-arrow-select.svg");
	background-position: right 17px center;
	background-repeat: no-repeat;
    background-size: 14px 7px;
	padding-right: 50px;
}

form input[type="date"] {
	-webkit-text-fill-color: rgba(var(--color-black),0);
}

form input:read-only {
	color: rgb(var(--color-grey));
}

form label.focus-in input[type="date"] {
	-webkit-text-fill-color: rgba(var(--color-black),1);
	color: rgba(var(--color-black),1);
}

form input:-webkit-autofill, 
form input:-webkit-autofill:hover, 
form input:-webkit-autofill:focus, 
form input:-webkit-autofill:active {
	-webkit-box-shadow: 0 0 0 30px rgb(var(--color-beige)) inset !important;
	box-shadow: 0 0 0 30px rgb(var(--color-beige)) inset !important;
    -webkit-text-fill-color: rgb(var(--color-black));
    color: rgb(var(--color-black));
}

form div.row-header,
form div.row {
	grid-column: 1 / -1;
	display: grid;
	/*grid-template-columns: repeat(8, 1fr);*/
	grid-template-columns: repeat(12, 1fr);
	grid-gap: 10px;
	align-items: end;
	position: relative;
}

form div.row-header {
	background: rgba(var(--color-black),0.25);
	font-size: 16px;
	margin: -10px -10px 0 -10px;
	padding: 0.4em calc(10px + 0.75em);
}

/*form div.row-header > span,
form div.row > label {
	grid-column-end: span 2;
}*/

form div.row + div.row {
	border-top: solid 1px rgba(var(--color-black),0.25);
	padding-top: 10px;
}

form button.add-row,
form button.remove-row {
	display: flex;
	justify-content: center;
	align-items: center;
	position: absolute;
	width: 30px;
	height: 30px;
	left: calc(50% - 15px);
	bottom: -15px;
	background: rgb(var(--color-yellow));
	border: solid 2px rgb(var(--color-white));
	border-radius: 9999px;
	box-shadow: 0 0 5px rgba(var(--color-black),0.25);
	color: rgb(var(--color-white));
	font-size: 18px;
	line-height: 1em;
	text-align: center;
}

form button.remove-row {
	width: 20px;
	height: 20px;
	top: 0;
	right: -10px;
	bottom: auto;
	left: auto;
	font-size: 14px;
}

form.form-become-client label[for="contact[first_name]"],
form.form-become-client label[for="contact[last_name]"],
form.form-become-client label[for="info[first_name]"],
form.form-become-client label[for="info[last_name]"],
form.form-become-client label[for="info[registered_name]"],
form.form-become-client label[for="info[trade_name]"],
form.form-become-client label[for="info[business_email]"],
form.form-become-client label[for="info[duns]"],
form.form-become-client label[for="info[public_storages]"],
form.form-become-client label[for="info[export_product]"],
form.form-become-client label[for="info[orders_picked_up_delivered][]"],
form.form-become-client label[for="info[cfia_inspeection_plant]"],
form.form-become-client label[for="info[haccp_accredited]"],
form.form-become-client label[for="info[equipment]"],
form.form-become-client label[for="info[premises]"],
form.form-become-client label[for^="principals"][for*="city"],
form.form-become-client label[for^="principals"][for*="province"],
form.form-become-client label[for^="principals"][for*="country"],
form.form-become-client label[for^="principals"][for*="postal_code"],
form.form-become-client label[for="accounts_payable_contact[first_name]"],
form.form-become-client label[for="accounts_payable_contact[last_name]"],
form.form-become-client label[for="accounts_payable_contact[email]"],
form.form-become-client label[for^="references"][for*="city"],
form.form-become-client label[for="credit[receivable_insured]"],
form.form-become-client label[for="credit[financial_statements_available]"],
form.form-become-client label[for="credit[bank_name]"],
form.form-become-client label[for="credit[email]"],
form.form-become-client label[for="signature[print_name]"],
form.form-contact label[for="first_name"],
form.form-contact label[for="last_name"],
form.form-job-application label[for="last_name"],
form.form-job-application label[for="first_name"],
form.form-job-application label[for="phone"],
form.form-job-application label[for="email"],
form.form-job-application label[for="emergency_contact_address"],
form.form-job-application label[for="ability"] {
	grid-column-end: span 2;
}

form.form-job-application label[for^="exp"][for*="date_from"],
form.form-job-application label[for^="exp"][for*="date_to"] {
	grid-column-end: span 1;
}

form.form-job-application label[for^="exp"][for*="date_from"] input,
form.form-job-application label[for^="exp"][for*="date_to"] input {
	width: 100%;
}

form.form-become-client label[for^="references"][for*="phone"],
form.form-become-client label[for^="references"][for*="fax"],
form.form-job-application label[for^="exp"][for*="full_name"],
form.form-job-application label[for^="exp"][for*="phone"],
form.form-job-application label[for^="academic"][for*="level"],
form.form-job-application label[for^="academic"][for*="completion"],
form.form-job-application label[for="position_desired"] {
	grid-column-end: span 3;
}

form.form-become-client label[for^="principals"][for*="address"],
form.form-become-client label[for^="principals"][for*="phone"],
form.form-become-client label[for^="references"][for*="address"],
form.form-job-application label[for^="exp"][for*="employer"] {
	grid-column-end: span 4;
}

form.form-become-client label[for^="principals"][for*="first_name"],
form.form-become-client label[for^="principals"][for*="last_name"],
form.form-become-client label[for^="principals"][for*="email"],
form.form-become-client label[for^="references"][for*="name"],
form.form-become-client label[for^="references"][for*="contact"],
form.form-job-application label[for^="academic"][for*="program"] {
	grid-column-end: span 6;
}

form.form-become-client ol.ordered-list,
form.form-become-client label[for="info[business_address]"],
form.form-become-client label[for="info[shipping_address]"],
form.form-become-client label[for="info[type_of_business_specify]"],
form.form-become-client label[for="info[locations]"],
form.form-become-client label[for="info[annual_sales]"],
form.form-become-client label[for="info[num_employees]"],
form.form-become-client label[for="info[legal_form_of_business]"],
form.form-become-client label[for="info[establiched_since]"],
form.form-become-client label[for="info[parent_company]"],
form.form-become-client label[for^="principals"][for*="company_name"],
form.form-become-client label[for="credit[insurance_company]"],
form.form-become-client label[for="credit[estimated_weekly_purchases]"],
form.form-become-client label[for="credit[manager_contact]"],
form.form-contact label[for="email"],
form.form-contact label[for="phone"],
form.form-contact label[for="message"],
form.form-job-application label[for="how_long_address"],
form.form-job-application label[for="date_availability"],
form.form-job-application label[for="attachment"] {
	grid-column: 1 / -1;
}

form.form-become-client label[for="info[business_postal_code]"] input,
form.form-become-client label[for="info[shipping_postal_code]"] input,
form.form-become-client label[for^="principals"][for*="postal_code"] input,
form.form-job-application label[for="postal_code"] input {
	text-transform: uppercase;
}

form.form-job-application label[for="date_availability"] input {
	text-align: right;
}

form.form-job-application label[for="date_availability"].focus-in input {
	text-align: left;
}

form label {
	padding: 0;
	transition: padding 0.4s var(--transition-timing-ease-in-out);
}

form label:has(span):not(.select):not(.radio).focus-in {
    padding-top: 1.8em;
}

form label:not(.checkbox):not(.radio) span {
	display: block;
	position: absolute;
	color: rgb(var(--color-grey));
	transform-origin: left bottom;
	transition: color 0.4s linear, transform 0.4s var(--transition-timing-ease-in-out);
	pointer-events: none;
	z-index: 1;
}

form label:not(.select):not(.radio).focus-in span {
	color: rgb(var(--color-black));
    transform: scale(0.8) translateY(-120%);
    transition: color 0.4s 0.2s linear, transform 0.4s 0.2s var(--transition-timing-ease-in-out);
}

form textarea {
	min-height: 2.2em;
    line-height: 1.5556em;
    transition: min-height 0.4s var(--transition-timing-ease-in-out);
}

form textarea.focus-in {
    min-height: 6.2em;
}

form label.checkbox {
	grid-column: 1 / -1;
    display: grid;
    grid-template-columns: auto 1fr;
    /*grid-gap: 1em;*/
    color: rgb(var(--color-white));
    margin: 0;
    padding: 0;
    transform: none;
}

.checkbox-grp {
	grid-column: 1 / -1;
	display: flex;
	flex-flow: row wrap;
	column-gap: 2em;
	row-gap: 10px;
}

form.form-become-client label[for="info[orders_picked_up_delivered][]"] + .checkbox-grp {
	grid-column-start: auto;
	grid-column-end: span 2;
}


.checkbox-grp label.checkbox {
	/*display: inline-grid;*/
}

form input[type="checkbox"],
form input[type="radio"] {
    align-self: start;
	width: auto;
	height: auto;
	-webkit-appearance: none;
	appearance: none;
	background: transparent;
	border: none;
	font-size: 0;
	margin: 0;
	padding: 0;	
}

form input[type="checkbox"]:before,
form input[type="radio"]:before {
    display: block;
    width: 30px;
    height: 30px;
    background: rgb(var(--color-beige));
	border: solid 2px rgb(var(--color-black));
    color: rgba(var(--color-black), 0);
    transition: color 0.4s linear;
}

form input[type="checkbox"]:before {
    content: "\f00c";
    min-height: 0vh;
    font-family: "Font Awesome 5 Free";
    font-weight: 900;
    font-size: 16px;
    line-height: 30px;
    text-align: center;
}

form input[type="checkbox"]:checked:before {
    color: rgba(var(--color-black), 1);
}

form label.radio {
	display: grid;
    grid-template-columns: auto 1fr;
    /*grid-gap: 1em;*/
	margin: 0;
    padding: 0;
    transform: none;
}

form input[type="radio"]:before {
    content: "";
	border-radius: 9999px;
}

form input[type="radio"]:checked:before {
	background-image: radial-gradient(rgba(var(--color-black),1) 6px, rgb(var(--color-beige)) 6px);
}

form input[type="file"] {
	width: 100%;
	padding-right: 8em;
}

form input[type="file"]:before {
	content: attr(data-file-path);
	display: flex;
	align-items: center;
	position: absolute;
	width: calc(100% - 1.5em);
	height: 100%;
	left: 0;
	top: 0;
	background: rgb(var(--color-beige));
	padding: 0 0.75em;
}

form input[type="file"]:after {
	content: attr(data-button-label);
	display: flex;
	align-items: center;
	position: absolute;
	height: 100%;
	right: 0;
	top: 0;
	background: rgb(var(--color-yellow));
	color: rgb(var(--color-white));
	padding: 0 1.5em;
}

form button[type="submit"] {
	margin: 0 auto;
	/*transition: opacity 0.4s linear;*/
}

form fieldset:disabled,
form label.disabled,
form button[type="submit"]:disabled {
	opacity: 0.25;
	pointer-events: none;
}

.span1 {
	grid-column-end: span 1 !important;
}

.span2 {
	grid-column-end: span 2 !important;
}

.span3 {
	grid-column-end: span 3 !important;
}

.span4 {
	grid-column-end: span 4 !important;
}

.span6 {
	grid-column-end: span 6 !important;
}

form input.error,
form p.error {
	color: #FF0000;
}

form p.error {
	grid-column: 1 / -1;
}

input.error,
select.error {
    background: #f2bebe;
}

.takk {
	display: block;
	position: relative;
	animation: kf-fade-in 0.4s linear both;
}


/*************************************
	Footer
 *************************************/


footer {
	background: rgb(var(--color-sand));
}

footer > div > div > div span {
	text-transform: uppercase;
}


/*************************************
	Lightbox
 *************************************/


#lightbox, #lightbox .lightbox_bckg {
	position: fixed;
	display: none;
	left: 0px;
	top: 0px;
	width: 100%;
	height: 100%;
}

#lightbox {
	z-index: 2000;
}

#lightbox.show {
	display: block;
	animation: kf-fade-in 0.2s linear 0s forwards;
}

#lightbox .lightbox_bckg {
	display: block;
	background: rgba(var(--color-black),0.75);
}

#lightbox button.bt-close {
	width: 1em;
	height: 1em;
	font-size: 32px;
}

#lightbox button.bt-close:after {
	content: "\2715";
}

#lightbox div.lightbox-container {
	display: flex;
	justify-content: center;
	align-items: center;
	width: 100%;
	height: 100%;
    pointer-events: none;
}

#lightbox div.lightbox-content {
	display: block;
	position: relative;
	box-shadow: 0 0 30px rgba(var(--color-black), 0.5);
    pointer-events: auto;
}

#lightbox div.lightbox-content.form {
	display: block;
	gap: 20px;
	width: min(1200px - 80px, 100vw - 80px);
	height: calc(100vh - 80px);
	background: rgb(var(--color-white));
	padding: 20px;
	overflow-y: auto;
}

#lightbox div.lightbox-content.form button.bt-close {
	display: flex;
	justify-content: center;
	align-items: center;
	position: fixed;
	width: 40px;
	height: 40px;
	left: max(20px, calc(50% - 580px));
	top: 20px;
	background: rgb(var(--color-white));
	border: solid 2px rgb(var(--color-black));
	border-radius: 9999px;
	box-shadow: 0 0 15px rgba(var(--color-black),0.5);
	font-size: 24px;
	line-height: 1em;
	z-index: 2100;
}

#lightbox button.bt-close:after {
	content: "\f00d";
    font-family: "Font Awesome 6 Free";
}

#lightbox div.lightbox-content.form h1 {
	display: block;
	width: min(190px, (190 / 1400) * 100vw);
	height: min(203px, (203 / 1400) * 100vw);
	background: url("../images/bckg-header-logo.svg") left bottom no-repeat;
	background-size: 100% auto;
	filter: drop-shadow(2px 2px 3px rgba(var(--color-black),0.15));
	margin: 0 auto;
	margin-top: -20px;
	padding: min(30px, (30 / 1400) * 100vw) min(15px, (15 / 1400) * 100vw);
}

#lightbox div.lightbox-content.form h1 img {
	width: 100%;
	height: auto;
}

#lightbox h2 {
	margin-top: 1em;
	margin-bottom: 1em;
}

#lightbox h2,
#lightbox h3,
#lightbox p {
	text-align: center;
	padding-right: min(200px, (200 / 1400) * 100vw);
	padding-left: min(200px, (200 / 1400) * 100vw);
}

@media screen and (max-width: 640px) {
	#lightbox div.lightbox-content.form {
		gap: 15px;
		width: calc(100vw - 30px);
		height: calc(100vh - 30px);
		padding: 15px;
	}
	
	#lightbox div.lightbox-content.form button.bt-close {
		left: 2px;
		top: 2px;
	}
		
	#lightbox div.lightbox-content.form h1 {
		width: min(190px, (190 / 414) * 100vw);
		height: min(203px, (203 / 414) * 100vw);
		margin-top: -15px;
		padding: min(30px, (30 / 414) * 100vw) min(15px, (15 / 414) * 100vw);
	}
	
	#lightbox h2,
	#lightbox h3,
	#lightbox p {
		text-align: center;
		padding-right: 0;
		padding-left: 0;
	}

}

#lightbox div.lightbox-content.lb-video {
	display: block;
	width: min(1200px - 80px, 100vw - 80px);
	/*height: calc(100vh - 80px);*/
	height: calc(min(1200px - 80px, 100vw - 80px) * (9 / 16));
	background: rgb(var(--color-white));
	padding: 20px;
	z-index: 0;
}

#lightbox div.lightbox-content.lb-video iframe {
	display: block;
	position: absolute;
    width: 100%;
    height: 100%;
	left: 0;
	top: 0;
}

#lightbox div.lightbox-content.lb-video button.bt-close {
	position: absolute;
	left: 20px;
	top: 20px;
	z-index: 10;
}
/*#lightbox div.lightbox-content.lb-video iframe {
    display: block;
    position: absolute;
    width: calc((16 / 9) * 100vh);
    height: 100vh;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
	width: calc((16 / 9) * 100vh);
    height: 100vh;
}

@media (min-aspect-ratio: 16/9) {
	#lightbox div.lightbox-content.lb-video iframe {
        width: 100vw;
        height: calc((9 / 16) * 100vw);
    }
}*/

@keyframes kf-fade-in {
    0%   {opacity: 0;}
    100%  {opacity: 1;}
}

@keyframes kf-show-nav {
	0% {
		transform: translateX(100%);
	}
	100% {
		transform: translateX(0);
	}
}

@keyframes kf-show-nav-mobile {
	0% {
		clip-path: inset(0 0 calc(100vh - min(151px, (151 / 414) * 100vw) - 10px) 0);
	}
	100% {
		clip-path: inset(0);
	}
}

@media screen and (max-width: 960px) {
	header {
		pointer-events: none;
	}
	
    header.fixed {
		position: absolute;
		transition: none;
	}

	header.hide {
		transform: none;
	}
	
	header:before,
	body.nav-invert header:before {
		background: rgb(var(--color-red));
		opacity: ;
		clip-path: inset(0 0 100% 0);
		transition: clip-path 0.6s 0.4s cubic-bezier(0.25,0.25,0.25,1), opacity 0.3s 1s linear;
	}
	
	
	/*header .ticker {
		position: absolute;
		width: min(1400px, 100vw);
		left: 0;
		right: 0;
		background-image: linear-gradient(rgba(var(--color-black),0.5), rgba(var(--color-black),0.25) calc(100% - 1px), rgba(var(--color-black),0.35));
		margin: 0 auto;
		overflow: hidden;
		transform: translateY(-100%);
		transition: transform 0.4s 0.4s cubic-bezier(0.25,0.25,0.25,1);
	}

	header.fixed .ticker {
		transform: translateY(-100%);
	}

	header .ticker h2 {
		display: block;
		max-width: 1280px;
		color: rgb(var(--color-white));
		font-size: clamp(12px, (15 / 1400) * 100vw, 15px);
		line-height: 1.2em;
		text-transform: uppercase;
		margin: 0 auto;
		padding: 1em 0 1em calc(min(70px, (70 / 1400) * 100vw) + min(266px, 19vw));
		transform: translateY(-100%);
		transition: transform 0.4s 0.8s cubic-bezier(0.25,0.25,0.25,1);
	}

	body.top header .ticker,
	body.top header .ticker h2 {
		transform: translateY(0);
	}*/
	
	/*header .ticker h2 {
		padding-right: 30px;
		padding-left: calc(min(190px, (190 / 414) * 100vw) + 60px);
	}*/
	
	header .ticker {
		position: relative;
		left: auto;
		right: auto;
	}

	header .ticker,
	header.fixed .ticker {
		transform: none;
	}
	
	body.nav-open header .ticker {
		display: none;
	}
	
	header .ticker h2 {
		font-size: calc((18 / 414) * 100vw);
		padding: 1em 90px 1em 30px;
		transform: none;
	}

	
	header nav,
	footer nav,
	footer > div {
		max-width: none;
		margin: 0;
		padding: 0;
	}
	
	body.nav-invert header nav ul li {
		color: rgb(var(--color-beige));
	}
	
	header nav ul,
	footer nav ul,
	footer > div > div {
		flex-direction: column;
		row-gap: 1.2em;
		justify-content: flex-start;
		align-items: flex-start;
		font-size: 16px;
		padding: 0 30px;
	}
	
	header nav ul {
		height: 100vh;
		/*height: calc(min(203px, (203 / 414) * 100vw) + 10px);*/
		clip-path: inset(0 0 calc(100vh - min(203px, (203 / 414) * 100vw) - 10px) 0);
		/*clip-path: inset(0 0 calc(100vh - min(151px, (151 / 414) * 100vw) - 10px) 0);*/
		transition: clip-path 0.6s cubic-bezier(0.25,0.25,0.25,1);
	}
	
	footer nav ul {
		align-items: flex-end;
		row-gap: 2em;
		padding-top: 2.5em;
	}
	
	header nav ul li {
		color: rgb(var(--color-white));
		transition: none;
		pointer-events: auto;
	}
	
	header nav ul li:not(.home),
	header.fixed nav ul li:not(.home) {
		margin: 0;
		padding-left: 30px;
	}
	
	/*header nav ul li:not(.home):not(.lang),
	footer nav ul li:not(.home):not(.lang),*/
	header nav ul li:not(.home):not(.careers):not(.lang),
	footer nav ul li:not(.home):not(.careers):not(.lang) {
		min-height: 0;
		padding-top: 0;
	}
	
	header nav ul li:not(.home):not(.lang),
	footer nav ul li:not(.home):not(.lang) {
		flex-grow: 0;
	}

	header nav ul li.home {
		width: auto;
	}

	footer nav ul li.home {
		align-self: flex-start;
		order: 2;
		transform: none;
		padding: 0;
	}

	header nav ul li.home a,
	footer nav ul li.home a {
		width: min(190px, (190 / 414) * 100vw);
		height: min(203px, (203 / 414) * 100vw);
		padding: min(30px, (30 / 414) * 100vw) min(15px, (15 / 414) * 100vw);
	}

	header nav ul li.home a {
		background: url("../images/bckg-header-logo.svg") left max(-70px, (-70 / 414) * 100vw) no-repeat;
		background-size: 100% auto;
	}
	
	body.nav-open header nav ul li.home a {
		height: auto;
		background: none;
	}
	
	body.nav-open header nav ul li a br {
		display: none;
	}
	
	footer nav ul li.home {
		width: auto;
	}
	
	footer nav ul li.home a {
		height: min(96px, (96 / 414) * 100vw);
		padding-top: 0;
		padding-bottom: 0;
	}
	
	header nav ul li.careers,
	footer nav ul li.careers {
		padding: 0.5em 0;
	}
	
	header nav ul li.careers {
		padding-left: 30px;
	}
	
	header nav ul li.careers a,
	footer nav ul li.careers a {
		margin: 0 calc(-1em - 2px);
	}
	
	header nav ul li,
	header nav ul li.show {
		clip-path: none;
	}

	header nav ul li:not(.home) a {
		transform: none;
	}

	header nav ul li.home a {
		opacity: 1;
		transform: none;
	}
	
	footer > div {
		row-gap: 2em;
		padding: 3.75em 0;
	}
	
	/*footer > div > div {
		grid-template-columns: auto;
		row-gap: 1.2em;
		font-size: 16px;
		padding: 0 30px;
	}*/
	
	footer > div > div {
		display: grid;
		/*grid-template-columns: repeat(2, auto);*/
		grid-template-columns: auto;
		grid-row-gap: 2em;
		justify-content: space-between;
		align-items: end;
	}
	
	footer > div > div > div {
		font-size: 1em;
	}
	
	footer > div > div > div:first-of-type {
		display: none;
	}
	
	footer > div > div > div:not(.social-networks):not(.certifications) {
		grid-row-end: auto;
	}
	
	/*footer > div > div > div:not(.social-networks) {*/
	footer > div > div > div {
		grid-column-start: 1;
	}
	
	footer > div > div > div.social-networks {
		grid-column: auto;
		grid-row: auto;
		font-size: 2em;
		text-align: left;
	}
	
	footer > div > div > div.certifications {
		grid-column: 1 / -1;
		flex-wrap: wrap; 
		justify-content: center;
	}
	
	footer > div > div > div:not(:first-of-type) + div {
		margin-left: 0;
	}
	
	footer > div > div > div.legal {
		font-size: 0.875em;
	}
	
	
	/*--  nav-open  --*/

	body.nav-open {
		overflow: hidden;
	}

	body.nav-open header {
		position: fixed;
		/*height: auto;
		min-height: 100vh;*/
		z-index: 1300;
	}
	
	body.nav-open header:before {
		clip-path: inset(0 0 0 0);
		opacity: 1;
		transition-delay: 0s;
	}
	
	body.nav-open header nav {
		height: 100vh;
		overflow: auto;
	}
	
	body.nav-open header nav ul {
		/*clip-path: inset(0 0 0 0);
		transition-delay: 0.6s;*/
		animation: kf-show-nav-mobile 0.6s 0.6s cubic-bezier(0.25,0.25,0.25,1) both;
	}
    
	body.nav-open header nav ul li:not(.home) {
		display: block;
	}

	
	/*--  nav ico  --*/

    header div.ico {
        display: block;
        position: fixed;
        right: 20px;
		top: 25px;
		padding: 15px 10px;
        cursor: pointer;
		pointer-events: auto;
		transition: background-color 0.2s linear;
        z-index: 20;
    }
	
	header:not(.top) div.ico {
		background: rgba(var(--color-black),0.5);
	}

    header div.ico > div {
        display: block;
        position: relative;
        width: 30px;
        height: 19px;
    }

	header div.ico span {
		display: block;
		position: absolute;
		width: 100%;
		height: 3px;
		background: rgb(var(--color-white));
		border-radius: 9999px;
		transition: width 0s 0.3s, background 0.3s 0.3s, opacity 0.3s 0.3s, top 0.3s 0.3s, transform 0.3s;
	}
	
	body.nav-open header div.ico {
        background: rgba(var(--color-white),0);
    }

	body.nav-open header div.ico span {
		transition: width 0s 0.3s, background 0.3s, opacity 0.3s, top 0.3s, transform 0.3s 0.3s;
	}

    header div.ico span:nth-child(1) {
        top: 0px;
    }

    header div.ico span:nth-child(2) {
        top: calc(50% - 1.5px);
    }

    header div.ico span:nth-child(3) {
        top: calc(100% - 3px);
        right: 0;
    }
	
	body.nav-open header div.ico span:nth-child(1) {
        top: calc(50% - 1.5px);
        transform: rotate(45deg);
    }

    body.nav-open header div.ico span:nth-child(2) {
        opacity: 0;
    }

    body.nav-open header div.ico span:nth-child(3) {
        top: calc(50% - 1.5px);
        width: 100%;
        transform: rotate(-45deg);
    }
	
	
	/*************************************
		Sections
	 *************************************/


	main {
		row-gap: min(90px, (90 / 414) * 100vw);
	}
	
	section.half-row-gap,
	.item-half-row-gap-mobile {
		margin-top: max(-45px, (-45 / 414) * 100vw);
	}
	
	section:not(.widget) > div {
		padding: 0 30px;
		grid-template-columns: auto;
		grid-column-gap: min(90px, (90 / 414) * 100vw);
		grid-row-gap: min(90px, (90 / 414) * 100vw);
	}
	
	.img-fit-auto,
	.img-fit-contain,
	.img-fit-cover {
		position: relative;
		width: 100%;
		height: auto;
		left: auto;
		top: auto;
	}
	
	.img-padding {
		padding: 0 min(90px, (90 / 414) * 100vw);
	}
	
	.img-grp-2 {
		column-gap: min(45px, (45 / 414) * 100vw);
		padding: 0 min(45px, (45 / 414) * 100vw);
	}
	
	.img-valign-middle {
		top: auto;
		transform: none;
	}
	
	.img-fit-height {
		height: min(var(--img-fit-height) * 1px, (var(--img-fit-height) / 414) * 100vw);
	}

	.img-mask-radius {
		border-radius: 0 0 0 min(150px, (150 / 414) * 100vw);	
	}
	
	.img-drop-shadow {
		box-shadow: 0 min(30px, (30 / 414) * 100vw) min(60px, (60 / 414) * 100vw) rgba(var(--color-black),0.16);
	}
	
	.img-drop-shadow-filter {
		filter: drop-shadow(0 min(30px, (30 / 414) * 100vw) min(60px, (60 / 414) * 100vw) rgba(var(--color-black),0.16));
	}
	
	.img-half-vw {
		width: 50vw;
	}
	
	.img-absolute-right {
		position: absolute;
		right: 0;
	}
	
	.widget {
		margin-top: max(-90px, (-90 / 414) * 100vw);
	}
	
	.widget > div {
		right: 90px;
	}
		
	section.header,
	section.header > div {
		height: auto;
		min-height: min(768px, (768 / 414) * 100vw);
	}

	section.header.empty {
		height: min(340px, (340 / 414) * 100vw);
	}
	
	section.header > div {
		padding-bottom: min(100px, (100 / 414) * 100vw);
	}
	
	section:not(.header):first-of-type,
	section.header > div:has(.slider):empty {
		padding-top: min(270px, (270 / 414) * 100vw);
	}
	
	.cols-merged p,
	.cols-merged h3 {
		width: auto;
	}
	
	
	section.bckg-transparent:last-of-type > div {
		padding-bottom: min(90px, (90 / 414) * 100vw);
	}

	section.bckg-black:not(:first-of-type) > div,
	section.bckg-red:not(:first-of-type) > div,
	section.bckg-yellow:not(:first-of-type) > div {
		padding-top: min(90px, (90 / 414) * 100vw);
		padding-bottom: min(90px, (90 / 414) * 100vw);
	}

	section.header + section.bckg-yellow,
	section.widget + section.bckg-yellow,
	section.bckg-black + section.bckg-yellow {
		margin-top: max(-90px, (-90 / 414) * 100vw);
	}

	.no-padding-left,
	.no-padding-right,
	.overflow-top,
	.overflow-right,
	.overflow-bottom,
	.overflow-left {
		margin: 0;
	}
	
	.no-padding-left-mobile {
		margin-left: -30px;
	}

	.no-padding-right-mobile {
		margin-right: -30px;
	}
	
	.pattern-yellow,
	.pattern-sand,
	.pattern-sand.fixed-height {
		height: 200px;
	}
	
	section.packaging > div {
		padding-bottom: min(250px, (250 / 414) * 100vw);
	}

	section.packaging > div:before {
		bottom: max(-45px, (-45 / 414) * 100vw);
		background-size: min(435px, 105vw) auto;
	}

	section.packaging p {
		width: 100%;
	}
	
	section.emballages-distribution {
		background-image:
			url(../images/img-header-packaging.png),
			url(../images/bckg-header-packaging.svg),
			linear-gradient(rgba(var(--color-sand),1) 50%, rgba(var(--color-beige),1) 50%);
		background-position: 
			center top,
			center calc(100vh - 100vw),
			left top;
		background-repeat: no-repeat;
		background-size: 
			100% auto,
			100% auto,
			100vw 100vh;
	}
	
	section.certifications > div > div:nth-child(1) {
		display: none;
	}
	
	section.certifications {
		background-image:
			url(../images/bckg-header-certifications.svg),
			linear-gradient(rgba(var(--color-red),1) 50%, rgba(var(--color-beige),1) 50%);
		background-position: 
			center bottom 37vw,
			left top;
	}
	
	section.scrolling-banner > div {
		height: min(230px, (230 / 414) * 100vw);
	}

	section.scrolling-banner > div > div > ul {
		width: calc(var(--count) * min(250px, (250 / 414) * 100vw));
		column-gap: min(20px, (20 / 414) * 100vw);
	}
	
	section.scrolling-banner > div > div > ul > li {
		width: min(230px, (230 / 414) * 100vw);
		height: min(230px, (230 / 414) * 100vw);
	}

	section.scrolling-banner > div > div > ul > li > img {
		width: min(230px, (230 / 414) * 100vw);
		border-radius: 0 0 0 min(50px, (50 / 414) * 100vw);
	}

	section > div > div:not(.pattern-yellow):not(.pattern-sand):empty {
		display: none;
	}
	
	section.mobile-swap-rows > div > div:nth-child(1) {
		order: 2;
	}

	section.network a.bt {
		margin-top: 350px;
	}

	section.network .bckg-parallax {
		height: 50%;
		top: auto;
		bottom: 0;
	}
	
	section q + picture img {
		width: 50vw;
		height: auto;
	}
	
	ul.list li.expandable-list > ul {
		padding: 0;
	}
		
	form.form-become-client label[for="info[registered_name]"],
	form.form-become-client label[for="info[trade_name]"],
	form.form-become-client label[for="info[business_email]"],
	/*form.form-become-client label.checkbox.shipping_address,*/
	form.form-become-client label[for="info[duns]"],
	form.form-become-client label[for="info[public_storages]"],
	form.form-become-client label[for="info[export_product]"],
	form.form-become-client label[for="info[orders_picked_up_delivered][]"],
	form.form-become-client label[for="info[orders_picked_up_delivered][]"] + .checkbox-grp,
	form.form-become-client label[for="info[cfia_inspeection_plant]"],
	form.form-become-client label[for="info[haccp_accredited]"],
	form.form-become-client label[for="info[equipment]"],
	form.form-become-client label[for="info[premises]"],
	form.form-become-client label[for="info[business_address]"],
	form.form-become-client label[for="info[shipping_address]"],
	form.form-become-client label[for="info[locations]"],
	form.form-become-client label[for="info[annual_sales]"],
	form.form-become-client label[for="info[num_employees]"],
	form.form-become-client label[for="info[legal_form_of_business]"],
	form.form-become-client label[for="info[establiched_since]"],
	form.form-become-client label[for="info[parent_company]"],
	form.form-become-client label[for="accounts_payable_contact[email]"],
	form.form-become-client label[for="credit[receivable_insured]"],
	form.form-become-client label[for="credit[financial_statements_available]"],
	form.form-become-client label[for="credit[bank_name]"],
	form.form-become-client label[for="credit[email]"],
	form.form-become-client label[for="credit[insurance_company]"],
	form.form-become-client label[for="credit[estimated_weekly_purchases]"],
	form.form-become-client label[for="credit[manager_contact]"],
	form.form-become-client label[for="signature[print_name]"],
	form.form-become-client label[for^="principals"][for*="company_name"],
	form.form-become-client label[for^="principals"][for*="address"],
	form.form-become-client label[for^="principals"][for*="phone"],
	form.form-become-client label[for^="principals"][for*="email"],
	form.form-become-client label[for^="references"][for*="name"],
	form.form-become-client label[for^="references"][for*="contact"],
	form.form-become-client label[for^="principals"][for*="name"],
	form.form-job-application label[for="last_name"],
	form.form-job-application label[for="first_name"],
	form.form-job-application label[for="phone"],
	form.form-job-application label[for="email"],
	form.form-job-application label[for="emergency_contact_address"],
	form.form-job-application label[for="ability"],
	form.form-job-application label[for^="exp"][for*="full_name"],
	form.form-job-application label[for^="exp"][for*="phone"],
	form.form-job-application label[for^="academic"][for*="level"],
	form.form-job-application label[for^="academic"][for*="completion"],
	form.form-job-application label[for="position_desired"],
	form.form-job-application label[for^="exp"][for*="employer"],
	form.form-job-application label[for^="academic"][for*="program"],
	form label,
	.span2,
	.span3,
	.span4,
	.span6 {
		grid-column: 1 / -1;
	}
	
	form.form-become-client label[for^="principals"][for*="first_name"],
	form.form-become-client label[for^="principals"][for*="last_name"],
	form.form-become-client label[for^="principals"][for*="city"],
	form.form-become-client label[for^="principals"][for*="province"],
	form.form-become-client label[for^="principals"][for*="country"],
	form.form-become-client label[for^="principals"][for*="postal_code"],
	form.form-become-client label[for^="references"][for*="address"],
	form.form-become-client label[for^="references"][for*="city"],
	form.form-become-client label[for^="references"][for*="phone"],
	form.form-become-client label[for^="references"][for*="fax"],	
	form.form-job-application label[for^="exp"][for*="date_from"],
	form.form-job-application label[for^="exp"][for*="date_to"] {
		grid-column-start: auto;
		grid-column-end: span 6;
	}
	
	form.form-become-client label[for="contact[first_name]"],
	form.form-become-client label[for="contact[last_name]"],
	form.form-become-client label[for="info[first_name]"],
	form.form-become-client label[for="info[last_name]"],
	form.form-become-client label[for="info[business_city]"],
	form.form-become-client label[for="info[business_province]"],
	form.form-become-client label[for="info[business_country]"],
	form.form-become-client label[for="info[business_postal_code]"],
	form.form-become-client label[for="info[business_phone]"],
	form.form-become-client label[for="info[business_fax]"],
	form.form-become-client label[for="info[shipping_city]"],
	form.form-become-client label[for="info[shipping_province]"],
	form.form-become-client label[for="info[shipping_country]"],
	form.form-become-client label[for="info[shipping_postal_code]"],
	form.form-become-client label[for="accounts_payable_contact[first_name]"],
	form.form-become-client label[for="accounts_payable_contact[last_name]"],
	form.form-become-client label[for="accounts_payable_contact[phone]"],
	form.form-become-client label[for="accounts_payable_contact[fax]"],
	form.form-become-client label[for="credit[phone]"],
	form.form-become-client label[for="credit[fax]"],
	form.form-become-client label[for="signature[position]"],
	form.form-become-client label[for="signature[date]"],
	form.form-contact label[for="first_name"],
	form.form-contact label[for="last_name"],
	form label.radio {
		grid-column-start: auto;
		grid-column-end: span 2;
	}


	
	/*.span1 {
		grid-column-start: auto !important;
		grid-column-end: span 4 !important;
	}*/
}

.body-preload,
.preload {
	display: none !important;
}