@font-face {
	font-family: 'Fedra Sans';
	src: url('/fonts/fedrasanspro-normal.woff2') format('woff2'), url('/fonts/fedrasanspro-normal.woff') format('woff');
	font-weight: 400;
	font-style: normal;
}

@font-face {
	font-family: 'Fedra Sans';
	src: url('/fonts/fedrasanspro-medium.woff2') format('woff2'), url('/fonts/fedrasanspro-medium.woff') format('woff');
	font-weight: 600;
	font-style: normal;
}

@font-face {
	font-family: 'Fedra Sans';
	src: url('/fonts/fedrasanspro-bold.woff2') format('woff2'), url('/fonts/fedrasanspro-bold.woff') format('woff');
	font-weight: 700;
	font-style: normal;
}

@font-face {
	font-family: 'Fedra Serif A';
	src: url('/fonts/fedraserifpro_a-normal.woff2') format('woff2'), url('/fonts/fedraserifpro_a-normal.woff') format('woff');
	font-weight: 400;
	font-style: normal;
}

@font-face {
	font-family: 'Fedra Serif A';
	src: url('/fonts/fedraserifpro_a-book.woff2') format('woff2'), url('/fonts/fedraserifpro_a-book.woff') format('woff');
	font-weight: 500;
	font-style: normal;
}

@font-face {
	font-family: 'Fedra Serif A';
	src: url('/fonts/fedraserifpro_a-medium.woff2') format('woff2'), url('/fonts/fedraserifpro_a-medium.woff') format('woff');
	font-weight: 600;
	font-style: normal;
}

@font-face {
	font-family: 'Fedra Serif A';
	src: url('/fonts/fedraserifpro_a-bold.woff2') format('woff2'), url('/fonts/fedraserifpro_a-bold.woff') format('woff');
	font-weight: 700;
	font-style: normal;
}

@font-face {
	font-family: 'Fedra Serif B';
	src: url('/fonts/fedraserifpro_b-normal.woff2') format('woff2'), url('/fonts/fedraserifpro_b-normal.woff') format('woff');
	font-weight: 400;
	font-style: normal;
}

@font-face {
	font-family: 'Fedra Serif B';
	src: url('/fonts/fedraserifpro_b-normal-ita.woff2') format('woff2'), url('/fonts/fedraserifpro_b-normal-ita.woff') format('woff');
	font-weight: 400;
	font-style: italic;
}

@font-face {
	font-family: 'Fedra Serif B';
	src: url('/fonts/fedraserifpro_b-bold.woff2') format('woff2'), url('/fonts/fedraserifpro_b-bold.woff') format('woff');
	font-weight: 700;
	font-style: normal;
}



::selection {
	background: #00758D;
	color:#FFFFFF;
}

*:focus {
	outline:none;
}

:root {
	--screen-height:100vh;
	--screen-width:100vw;
}

@supports(height: 100dvh) {
	:root {
		--screen-height:100dvh;
	}
}
/*
@supports(width: 100dvw) {
	:root {
		--screen-width:100dvw;
	}
}
*/
sup {
	line-height:0.6em;
}

html {
	width:100%;
	height:100%;
	padding:0px;
	margin:0px;
	-webkit-overflow-scrolling:touch;
}

body {
	width: 100%;
	max-width:none;
	height: auto;
	padding: 0px;
	margin: 0 auto;
	background-color:#FFFFFF;
	overflow-x: hidden;
	-webkit-overflow-scrolling: touch;
	-webkit-font-smoothing: antialiased;
	font-size: 1px;
	font-family: "Fedra Sans", sans-serif;
	font-weight: 400;
	overflow-x: hidden;
	-webkit-text-size-adjust: none;
	color: #000000;
	display:none;
}

body.scaled {
	display:block;
}

/* COMMON ITEMS */

div {
	position:relative;
	display:block;
}

.container {
	width:100%;
	max-width:none;
	margin:0px;
	padding:0px;
	display:flex;
}

header {
	position:relative;
	position: -webkit-sticky;
	position: sticky;
	left:0px;
	top: -111em;
	display:block;
	padding:0px;
	z-index:100;
	background-color:#FFFFFF;
	width:100%;
	height:auto;
	
	transition: top 0.3s ease;
}

header.fixed {
	top: 0;
}


header > .container {
	padding:23.5em 30em;
	align-items:center;
}

header a.logo {
	position:relative;
	display:block;
	width:147em;
}

header a.logo img {
	width:100%;
	height:auto;
}

header nav {
	position:relative;
	display:block;
	margin-left:auto;
	margin-right:0px;
}

#search {
	position:relative;
	display:none;
	margin-left:auto;
	margin-right:0px;
	width:549em;
}

#search input[type='text']{
	width:100%;
    font-size: 24em;
    line-height: 1.5em;
	letter-spacing: 0.005em;
}

#search input[type='text']::placeholder {
	color:#CCCCCC;
}

#search input[type='submit'] {
	position:absolute;
	top:5em;
	right:0em;
	width: 20em;
	height: 20em;
	padding: 0;
	border: none;
	background: url('/images/layout/search-icon.svg') no-repeat center center;
	background-size: contain;
	cursor: pointer;
	text-indent: -9999px;
	overflow: hidden;
	white-space: nowrap;
}

header.search-open #search {
	display:block;
}

header.search-open #menu {
	display:none;
}

#menu {
	position:relative;
	display:flex;
	margin-top:9em;
}

#menu li {
	position:relative;
	display:block;
	margin-left:30em;
	width:auto;
	height:auto;
}

#menu li li {
	margin-left:0em;
}

#menu li a {
	position:relative;
	display:block;
	font-family:"Fedra Sans";
	font-weight:700;
	color:#000000;
	font-size:15.65em;
	line-height:1.597em;
	letter-spacing:0.03em;
	
	transition-property: color;
	transition-duration: 0.2s;
	transition-timing-function: ease-out;
}

#menu li a:hover,
#menu li.active > a {
	color:#00758D;
}

#menu li ol {
	display:none;
	width:240em;
	position:absolute;
	top:19.5em;
	left:-20em;
	padding-left:20em;
	padding-top:29em;
	padding-right:20em;
	padding-bottom:11.5em;
	background-color:#FFFFFF;
	border-radius:6em;
}

#menu li:hover ol {
	display:block;
}



main {
	width:100%;
	height:auto;
	position:relative;
	display:block;
	padding:0px;
	margin:0px;
	min-height:550em;
	min-height:auto;
}


main .segment {
	width:100%;
	height:550em;
	background-size:cover;
	background-position:center center;
	display:flex;
	align-items:flex-end; 
	overflow:hidden;
}

main .segment.mega {
	height:890em;
	height:830em;
	flex-direction:column;
	justify-content:flex-end;
}

main .segment.narrow {
	height:326.5em;
}
/*
main .segment.mega.mega2 {
	height:830em;
}
*/
main .segment video {
	position: absolute;
	top: 50%;
	left: 50%;
	min-width: 100%;
	min-height: 100%;
	transform: translate(-50%, -50%);
	object-fit: cover;
	z-index: 1;
}

main .segment.short {
	height:400em;
}

main .segment.shorter {
	height:300em;
}

main .segment.black-50 {
	background-color:#000000;
}
main .segment.black-50:before {
	content:" ";
	display:block;
	background-color:rgba(0,0,0,0.5);
	position:absolute;
	z-index:2;
	width:100%;
	height:100%;
	top:0px;
	left:0px;
}

main .segment.black-0:before {
	content:" ";
	display:block;
	background-color:rgba(0,0,0,0);
	position:absolute;
	z-index:2;
	width:100%;
	height:100%;
	top:0px;
	left:0px;
}


main .segment .message {
	margin-left:174em;
	z-index:3;
	position:absolute;
	bottom:0em;
	left:0em;
	width:calc(100% - 348em);
}

main .segment h3 {
	font-size:30em;
	line-height:1.267em;
	margin-bottom:0.333em;
	color:#FFFFFF;
	font-family:"Fedra Serif B";
	
	opacity: 0;
	transform: translateX(-3em);
	animation: slideIn 0.6s ease forwards;
	
	animation-delay: 0.4s;
}

main .segment h1 {
	font-size:60em;
	line-height:1.267em;
	margin-bottom:1.333em;
	color:#FFFFFF;
	font-family:"Fedra Serif B";
	
	opacity: 0;
	transform: translateX(-3em);
	animation: slideIn 0.6s ease forwards;
	
	animation-delay: 1s;
}

@keyframes slideIn {
	to {
		opacity: 1;
		transform: translateX(0);
	}
}

main .segment img.parallax {
	position: absolute;
	width: 100%;
	height: auto;
	top: 0;
	left: 0;
	will-change: transform;
	pointer-events: none;
	user-select: none;
}

main .segment.zoom img.zoom {
	position: absolute;
	width: 100%;
	height: auto;
	top: -26em;
	left: 0;
	will-change: transform;
	pointer-events: none;
	user-select: none;
	
	transform: scale(2);         /* Start at 200% */
	transform-origin: 50% 70%;
	transition: transform 30s ease;
}
main .segment.zoom.loaded img.zoom {
	transform: scale(1);
}

main #contact-picture.segment.zoom img.zoom {
	transform-origin: 50% 70%;
	top:-110em;
	transform: scale(1.2);
}
main #contact-picture.segment.zoom.loaded img.zoom {
	transform: scale(1);
}
main .segment.zoom.mega.loaded img.zoom {
	transform: scale(1.15);
}

main #lubricants-picture.segment.zoom img.zoom {
	top:-100em;
	transform-origin:50% 40%;
	transform:scale(1.5);
}

main #lubricants-picture.segment.zoom.loaded img.zoom {
	transform:scale(1);
}


main .segment.zoom.loaded img.zoom.scale-1-1 {
	transform: scale(1.4);
	/*transform-origin:center top;*/
}

main .segment.zoom.offset-100 img.zoom {
	top: -150em;
}

main .segment.zoom.offset-0 img.zoom {
	top: 0em;
}

main .segment.zoom.offset-165 img.zoom {
	top: -165em;
	transform-origin:50% 30%;
	transform:scale(1.5);
}

main .segment.zoom.offset-165.loaded img.zoom {
	transform:scale(1);
}

main .text {
	max-width:753em;
	margin:0 auto;
	padding: 32em 40em 28.5em 40em;
}

main .text.colored {
	background-color:#00758D;
	max-width:none;
	padding:0em;
	width:100%;
}

main .text.colored .container {
	max-width:753em;
	margin:0 auto;
	padding: 32em 40em 28.5em 40em;
}

main .text.colored p {
	color:#FFFFFF;
}

main .text p {
	font-size:17.75em;
	line-height:1.859em;
	letter-spacing:0.01em;
	font-weight:600;
	
	opacity: 0;
	transform: scale(0.90) translateY(20px);
	transition: opacity 1s ease, transform 1s ease;
	
	font-variant-numeric:lining-nums;
}

main .text p.visible {
	opacity: 1;

    transform: scale(1) translateY(0px);
}

main .text2 {
	display:flex;
	padding: 32em 0 28.5em 0;
}

main .text2.search-results p {
	margin:0 auto;
}

main .text2.search-results p.no-results {
	margin-bottom:calc(100dvh - 25.7em);
}

main .text2.search-results {
	padding-bottom:0em;
}

main .segment.narrow .text2 {
	padding-bottom:25em;
}

main .text2.green {
	background-color:rgba(0, 117, 141, 0.8);
	padding-bottom:0em;
	width:100%;
}

main .text2.green h3 {
	color:#FFFFFF;
}

main .text2.green p {
	color:#FFFFFF;
}

main .text2.green ul li {
	color:#FFFFFF;
}

main .text2.green .label p{
	color:#FFFFFF;
}

main .text2.green .label p:before, 
main .text2.green .label p:after {
	background-image:radial-gradient(circle, #FFFFFF 0.128em, transparent 0.128em);
}

main .segment.narrow .text2 .label p {
	color:#FFFFFF;
}
main .segment.narrow .text2 .label p:before, 
main .segment.narrow .text2 .label p:after {
	background-image:radial-gradient(circle, #FFFFFF 0.128em, transparent 0.128em);
}

main .text2.wrap {
	flex-wrap:wrap;
}

main .text2.low-padding {
	padding-top:11.5em;
}

main .text2.gray {
	background-color:#E5E5E5;
	flex-wrap:wrap;
}

main .text2 .label {
	width:174em;
	
}
main .text2 .label p {
	font-size:20em;
	font-size:15.65em;
	line-height:1.278em;
	width:auto;
	letter-spacing:0.03em;
	color:#00758D;
	font-family:"Fedra Sans";
	font-weight:700;
	font-variant-caps:small-caps;
	padding-left:0.32em;
	padding-right:0.32em;
	display:inline-block;
	position:relative;
	padding-top:0.448em;
	padding-bottom:0.256em;
}
main .text2 .label p:before,
main .text2 .label p:after {
	content:" ";
	width:100%;
	height:0.256em;
	border: none;
	padding: 0px;
	background-image: radial-gradient(circle, #00758D 0.128em, transparent 0.128em);
	background-size: 0.576em 0.256em;
	background-repeat: repeat-x;
	background-position: 0em;
	margin-bottom:0em;
	z-index:1;
	position:absolute;
	top:0em;
	left:0em;
}

main .text2 .label.team p:before,
main .text2 .label.team p:after {
	background-position: 1em;
}

main .text2 .label p:after {
	top:auto;
	bottom:0em;
}

main .text2 h3 {
	font-size:43em;
	line-height:1.209em;
	font-family:"Fedra Serif B";
	font-weight:400;
	width:7.674em;
	margin-right:0.465em;
}

main .segment.narrow .text2 h3 {
	margin-bottom:0em;
}
main .text2 h3.wide {
	width:11.628em;
}

main .text2 h3.wide.wider {
	width:15.628em;
}

main .text2 h3.wide span {
	font-size:0.698em;
	line-height:1.267em;
	/*margin-bottom:0.333em;*/
	display:block;
}

main .text2 h3.wide + .one-column-text {
	width:500em;
}

main .text2 h3.colored {
	color:#00758D;
}

main .text2 .serif p {
	font-size:17em;
	line-height:1.529em;
	font-family:"Fedra Serif B";
	font-weight:400;
}

main .text2 .two-column-text {
	width:673em;
	-webkit-columns: 2;
	-moz-columns: 2;
	columns: 2;
	column-gap: 30em;
	column-gap: 26em;
}

main .text2 .one-column-text.sans {
	width:250em;
}

main .text2 .one-column-text.sans p {
	font-size:17em;
	line-height:1.529em;
	font-family:"Fedra Sans";
	font-weight:400;
}

main .text2 p {
	font-size:16.5em;
	line-height:1.529em;
	margin-bottom:1.529em;
	letter-spacing:0.005em;
	font-family:"Fedra Sans";
	font-weight:400;
}

main .text2.gray.expanded p:last-child {
	margin-bottom:0em;
}

main .text2 p a {
	font-weight:700;
	color:#00758D;
}

main .text2 p a#expand-paragraphs,
main .text2 p a#shrink-paragraphs {
	color:#000000;
	font-weight:400;
	display:none;
}

main .text2 p a#expand-paragraphs:hover,
main .text2 p a#shrink-paragraphs:hover {
	text-decoration:none;
}

main .text2 p a:hover {
	text-decoration:underline;
}

main .text2.milestones {
	background-color:#000000;
	padding-bottom:0px;
}

main .text2.milestones .label p {
	color:#FFFFFF;
}
main .text2.milestones .label p:before,
main .text2.milestones .label p:after {
	background-image: radial-gradient(circle, #FFFFFF 0.128em, transparent 0.128em);
	background-position:2em;
}

main .text2.milestones h3 {
	color:#FFFFFF;
}
main .text2.milestones .one-column-text {
	width:673em;
}

main .text2 .one-column-text.wide {
	width:673em;
}

main .text2.milestones .one-column-text p {
	color:#FFFFFF;
}

main .text2 .one-column-text ul {
	margin-bottom:32.5em;
}

main .text2 .one-column-text ul li {
	font-size: 17em;
	line-height: 1.529em;
	margin-bottom: 0em;
	font-family: "Fedra Sans";
	font-weight: 400;
	list-style-type:none;
	position:relative;
	padding-left:1em;
	
	opacity: 0;
	transform: scale(0.90) translateY(20px);
	transition: opacity 1s ease, transform 1s ease;
}

main .text2 .one-column-text ul li.visible {
	opacity: 1;

    transform: scale(1) translateY(0px);
}

main .text2 .one-column-text ul li::before {
  content: '•';
  position: absolute;
  left: 0;
  top: 0;
  font-size: 1em; /* or match to text size */
  line-height: 1.529em;
  font-family: "Fedra Sans";
  font-weight: 400;
}

main .segment .note {
	background-color:rgba(0,0,0,0.7);
	width:100%;
	height:auto;
	padding:23.5em 174em;
	
	opacity: 0;
	transform: translateY(0px);
	transition: opacity 1s ease, transform 1s ease;
}

main .segment .note.visible {
	opacity: 1;

    transform: scale(1) translateY(0px);
}

main .segment .note p {
	font-size:17em;
	line-height:1.647em;
    font-family: "Fedra Sans";
    font-weight: 700;
	letter-spacing:0.02em;
	color:#FFFFFF;
	margin-bottom:0em;
}

main #map-container {
	width:470em;
	height:228em;
	margin-left:auto;
	margin-right:30em;
	position:absolute;
	top:32em;
	right:0em;

	transition: margin 0.5s ease, width 0.5s ease, height 0.5s ease;
}
main .expanded h3 {
	margin-top:436px;
	margin-top:10.139em;
}

main .expanded .one-column-text {
	margin-top:436px;
	margin-top:436em;
}
main .expanded #map-container {
	width:calc(100% - 60em);
	margin-left:30em;
	height:428em;
}

main #map {
	width:100%;
	height:200em;
	border-radius:6em;
	margin-bottom:10em;
	
	opacity: 0;
	transform: scale(0.90) translateY(20px);
	transition: opacity 1s ease, transform 1s ease, height 0.6s ease;
	transition-delay:0s;
}

main .expanded #map {
	height:400em;
}

main #map-container.visible #map {
	opacity: 1;
	transform: scale(1) translateY(0px);
}

main #map .gm-bundled-control {
	top: -6em !important;
	right: 4em !important;
	bottom: auto !important;
	left: auto !important;
}

main #map-interactions {
	display:flex;
	justify-content:space-between;
	opacity: 0;
	transform: translateY(20px);
	transition: opacity 1s ease, transform 1s ease;
	transition-delay:1.5s;
}

main #map-interactions p {
	font-size:12em;
	margin-bottom:0em;
	line-height:1.5em;
}

main #map-container.visible #map-interactions {
	opacity: 1;
	transform: scale(1) translateY(0px);
}

.text2 .label {
	opacity: 0;
	  transform: translateX(-100%);
	  transition: opacity 0.6s ease, transform 0.6s ease;
}
.text2 h3,
.text2 .two-column-text p,
.text2 .one-column-text p {
  opacity: 0;
  transform: translateY(20px);
  transition: opacity 0.6s ease, transform 0.6s ease, margin 0.6s ease;
}

.text2 .one-column-text {
	transition: margin 0.6s ease;
}

.text2 .visible,
.text2 .two-column-text .visible,
.text2 .one-column-text .visible {
  opacity: 1;
  transform: translateX(0) translateY(0);
}

#values {
	margin-left:164em;
	width:1040em;
	display:flex;
	flex-wrap:wrap;
}

#values .value {
	margin-left:10em;
	margin-right:10em;
	width:calc(25% - 20em);
	background-color:#00758D;
	padding:15em;
	border-radius:8em;
	
	opacity:0;
	transform: translateY(20em);
	transition: opacity 0.6s ease, transform 0.6s ease;
}

#values .value.visible {
	opacity: 1;
	transform: translateX(0) translateY(0);
}

#values .value h4 {
	font-size:20em;
	line-height:1.4em;
	letter-spacing:0.02em;
	font-weight:700;
	font-family:"Fedra Sans";
	margin-bottom:1.3em;
	color:#FFFFFF;
}

#values .value p {
	font-size:17em;
	line-height:1.529em;
	letter-spacing:0em;
	font-weight:600;
	font-family:"Fedra Sans";
	color:#FFFFFF;
}

#values .line-container {
	width:100%;
	padding:0em 10em;
	margin-top:40em;
	
	opacity:0;
	transform: translateY(20em);
	transition: opacity 0.6s ease, transform 0.6s ease;
}

#values .line-container.visible {
	opacity: 1;
	transform: translateX(0) translateY(0);
}

#values .line-container .dotted-line {
	background-position:-3em;
}

#principles {
	margin-left:174em;
	width:1020em;
	-webkit-columns: 2;
	-moz-columns: 2;
	columns: 2;
	column-gap: 20em;
}

#principles li {
	width:auto;
	margin-bottom:10em;
	
	opacity:0;
	transform: translateY(20em);
	transition: opacity 0.6s ease, transform 0.6s ease;
}

#principles li.visible {
	opacity: 1;
	transform: translateX(0) translateY(0);
}

#principles li span {
	font-size:17.75em;
	line-height:1.5em;
	letter-spacing:0.02em;
	font-weight:700;
	font-family:"Fedra Sans";
	color:#00758D;
	font-variant-numeric:lining-nums;
}

#principles li span.no {
	width:1.85em;
	display:inline-block;
}

#principles li .line {
	display:inline-block;
}

#principles li .dotted-line {
	background-position:-3em;
	background-image:radial-gradient(circle, #000000 1.5em, transparent 1.5em);
}
#principles li:nth-child(1) .dotted-line {
	width:calc(100% + 1.5em);
}
#principles li:nth-child(2) .dotted-line {
	width:100%;
}
#principles li:nth-child(3) .dotted-line {
	width:calc(100% - 1em);
}
#principles li:nth-child(4) .dotted-line {
	width:100%;
}
#principles li:nth-child(5) .dotted-line {
	width:100%;
}
#principles li:nth-child(6) .dotted-line {
	width:calc(100% + 0.5em);
}
#principles li:nth-child(7) .dotted-line {
	width:calc(100% + 1em);
}
#principles li:nth-child(8) .dotted-line {
	width:100%;
}
#principles li:nth-child(9) .dotted-line {
	width:100%;
}
#principles li:nth-child(10) .dotted-line {
	width:calc(100% + 1em);
}


#people {
	margin-left:164em;
	width:1040em;
	display:flex;
	flex-wrap:wrap;
	margin-top:21.5em;
}

#people .person {
	margin:10em;
	width:calc(33.33% - 20em);
	background-color:#E5F1F3;
	border-radius:8em;
	overflow:hidden;
	
	opacity:0;
	transform: translateY(40em);
	transition: opacity 0.6s ease, transform 0.6s ease;
}

#people .person.visible {
	opacity: 1;
	transform: translateX(0) translateY(0);
}

#people .person .info {
	padding:19em 20em 17em 20em;
}

#people .person .info {
	height:326em;
}
#people .person h4 {
	font-size:17em;
	line-height:1.176em;
	font-weight:700;
	font-family:"Fedra Serif B";
	color:#00758D;
	margin-bottom:0.353em;
}

#people .person h5 {
	font-size:12em;
	line-height:1.4em;
	font-weight:700;
	font-family:"Fedra Sans";
	color:#000000;
}

#people .person p {
	margin-top:1.5em;
	font-size:14em;
	line-height:1.45em;
	letter-spacing:0.01em;
	font-weight:400;
	font-family:"Fedra Sans";
	color:#000000;
	margin-bottom:0em;
}

#people .person picture {
	width:100%;
	height:auto;
	display:block;
	display:none;
}

#people .person picture img {
	width:100%;
	height:auto;
	display:block;
}




#products {
	margin-left:164em;
	width:1040em;
	display:flex;
	flex-wrap:wrap;
	margin-top:-2em;
	margin-bottom:-2em;
}

#products .product {
	margin:10em;
	width:calc(33.33% - 20em);
	background-color:#E5F1F3;
	border-radius:8em;
	padding:13em 20em 10em 20em;
	height:334em;
	height:326.6em;
	background-size:cover;
	
	opacity:0;
	transform: translateY(40em);
	transition: opacity 0.6s ease, transform 0.6s ease;
}

#products .product.visible {
	opacity: 1;
	transform: translateX(0) translateY(0);
}


#products .product h4 {
	font-size:17.75em;
	line-height:1.39em;
	font-weight:700;
	font-family:"Fedra Sans";
	color:#CAFFBD;
	margin-bottom:0em;
	margin-bottom:0.30em;
}

#products .product h4:last-child {
	margin-bottom:0em;
}

#products .product ul {
}
#products .product ul li {
	
	font-size:17em;
	line-height:1.465em;
	letter-spacing:0em;
	font-weight:600;
	font-family:"Fedra Sans";
	color:#FFFFFF;
	margin-bottom:0.3em;
	
	list-style-type:none;
	position:relative;
	padding-left:1em;
}

.product.specialty-chemicals {
	background-image:url('/images/layout/specialty-chemicals-product-bg.jpg');
}

.product.lubricants {
	background-image:url('/images/layout/specialty-lubricants-bg.jpg');
}

#products .product ul li::before {
  content: '•';
  position: absolute;
  left: 0;
  top: 0;
  font-size: 1em; /* or match to text size */
  line-height: 1.765em;
  font-family: "Fedra Sans";
  font-weight: 600;
}






#posts {
	margin-left:164em;
	width:1040em;
	display:flex;
	flex-wrap:wrap;
	margin-top:-12em;
	margin-bottom:-8.5em;
}

#posts .post {
	margin:20em 10em;
	width:calc(33.33% - 20em);
	background-color:#E5F1F3;
	border-radius:8em;
	
	height:auto;
	overflow:hidden;
	opacity:0;
	transform: translateY(40em);
	transition: opacity 0.6s ease, transform 0.6s ease;
}

#posts .post .info {
	padding:15em 20em 10em 20em;
	height:326.5em;
	height:214em;
	display:flex;
	flex-direction:column;
}
#posts picture {
	position:relative;
	display:block;
	width:100%;
	height:214em;
	overflow:hidden;
}

#posts picture img {
	position:relative;
	display:block;
	width:100%;
	height:auto;
	
	transform: scale(1);
	transition: transform 1s ease;
}

#posts .post:hover picture img {
	transform:scale(1.1);
}

#posts .post.visible {
	opacity: 1;
	transform: translateX(0) translateY(0);
}


#posts .post h4 {
	font-size:27em;
	line-height:1.209em;
	font-weight:400;
	font-family:"Fedra Serif B";
	color:#00758D;
	margin-bottom:0.233em;
}

#posts .post:hover h4 {
	text-decoration:underline;
	text-decoration-thickness:0.07em;
	text-underline-offset:0.08em;
}

#posts .post p {	
	font-size:17em;
	line-height:1.529em;
	letter-spacing:0.01em;
	font-weight:600;
	font-family:"Fedra Sans";
	color:#000000;
	margin-bottom:0em;
	text-decoration:underline;
	text-decoration-thickness:0.05em;
	text-underline-offset:0.1em;
}

#posts .post p.date {
	margin-top:auto;
	font-weight:400;
	font-family:"Fedra Serif A";
	text-decoration:none;
}






#search-results {
	margin-left:164em;
	width:1040em;
	display:flex;
	flex-wrap:wrap;
	margin-top:-12em;
	margin-bottom:-8.5em;
}

#search-results .search-result {
	margin:20em 10em;
	width:calc(33.33% - 20em);
	background-color:#E5F1F3;
	border-radius:8em;
	
	height:auto;
	overflow:hidden;
	opacity:0;
	transform: translateY(40em);
	transition: opacity 0.6s ease, transform 0.6s ease;
}

#search-results .search-result .info {
	padding:15em 20em 10em 20em;
	height:326.5em;
	height:214em;
	display:flex;
	flex-direction:column;
}
#search-results picture {
	position:relative;
	display:block;
	width:100%;
	height:214em;
	overflow:hidden;
}

#search-results picture img {
	position:relative;
	display:block;
	width:100%;
	height:100%;
	object-fit:cover;
	transform: scale(1);
	transition: transform 1s ease;
}

#search-results .search-result:hover picture img {
	transform:scale(1.1);
}

#search-results .search-result.visible {
	opacity: 1;
	transform: translateX(0) translateY(0);
}


#search-results .search-result h4 {
	font-size:27em;
	line-height:1.209em;
	font-weight:400;
	font-family:"Fedra Serif B";
	color:#00758D;
	margin-bottom:0.233em;
}

#search-results .search-result:hover h4 {
	text-decoration:underline;
	text-decoration-thickness:0.07em;
	text-underline-offset:0.08em;
}

#search-results .search-result p {	
	font-size:17em;
	line-height:1.529em;
	letter-spacing:0.01em;
	font-weight:600;
	font-family:"Fedra Sans";
	color:#000000;
	margin-bottom:0em;
	text-decoration:underline;
	text-decoration-thickness:0.05em;
	text-underline-offset:0.1em;
}

#search-results .search-result p.date {
	margin-top:auto;
	font-weight:400;
	font-family:"Fedra Serif A";
	text-decoration:none;
}




#contact-form {
	width:673em;
	margin-left:100em;
}

#contact-form .form-row {
	display:flex;
	border-top:0.75em solid #91C3CE;
	align-items:baseline;
	padding:19em 0;
	
	opacity: 0;
	transform: translateY(20px);
	transition: opacity 0.6s ease, transform 0.6s ease;
}

#contact-form .form-row:nth-child(1){
	transition-delay:1s;
}
#contact-form .form-row:nth-child(2){
	transition-delay:1.1s;
}
#contact-form .form-row:nth-child(3){
	transition-delay:1.2s;
}
#contact-form .form-row:nth-child(4){
	transition-delay:1.3s;
}
#contact-form .form-row:nth-child(5){
	transition-delay:1.4s;
}
#contact-form .form-row:nth-child(6){
	transition-delay:1.5s;
}
#contact-form .form-row:nth-child(7){
	transition-delay:1.6s;
}
#contact-form .form-row:nth-child(8){
	transition-delay:1.7s;
}
#contact-form .form-row:nth-child(9){
	transition-delay:1.8s;
}
#contact-form .form-row:nth-child(10){
	transition-delay:1.9s;
}


.revealed #contact-form .form-row {
	opacity: 1;
	transform: translateY(0);
}

#contact-form .form-row.response {
	display:none;
}

#contact-form .form-row.response.show {
	display:block;
}
#contact-form .form-row.response p {
	margin-bottom:0em;
}
#contact-form .form-row.response .error {
	color:#CE003A;
}

#contact-form .form-row.response .success {
	color:#00758D;
}

#contact-form .form-row label {
	font-size:15em;
	line-height:1.733em;
	font-family:"Fedra Sans";
	color:#00758D;
	font-weight:600;
	flex-shrink:0;
}

#contact-form .form-row.error .select input:checked + label {
	color:#CE003A;
}


#contact-form .form-row input {
	font-size:17em;
	line-height:1.529em;
	margin-left:0.5em;
	width:100%;
	flex-shrink:1;
	border:0px;
	font-family:"Fedra Sans";
	font-weight:600;
}

#contact-form .form-row input::placeholder,
#contact-form .form-row textarea::placeholder {
	color:#CCCCCC;
}

#contact-form .form-row.error input::placeholder,
#contact-form .form-row.error textarea::placeholder,
#contact-form .form-row.error input,
#contact-form .form-row.error textarea {
	color:#CE003A;
}

#contact-form .form-row.error #countries-container input,
#contact-form .form-row.error #countries-container input::placeholder {
	color:#CCCCCC;
}

#contact-form .form-row select {
	font-size:17em;
	line-height:1.529em;
	margin-left:0.5em;
	width:100%;
	flex-shrink:1;
	font-weight:600;
	border:0px;
	display:none;
}

#contact-form .form-row textarea {
	font-size:17em;
	line-height:1.529em;
	margin-left:0.5em;
	width:100%;
	height:8.824em;
	flex-shrink:1;
	font-weight:600;
	border:0px;
}

#contact-form .form-row input[type='submit'] {
	background-color:#00758D;
	width:auto;
	margin-left:auto;
	margin-right:0px;
	flex-shrink:0;
	color:#CAFFBD;
	cursor:pointer;
	padding:0.853em 1em;
	border-radius:0.235em;
	width:9.015em;
	text-align:center;
	letter-spacing:0.025em;
	margin-top:1.206em;
}

#contact-form .form-row input[type='submit'].locked {
	pointer-events:none;
}

#contact-form .form-row input[type='submit']:hover {
	color:#00758D;
	background-color:#CAFFBD;
}


#contact-form .form-row.last {
	align-items:flex-start;
}

#contact-form .form-row #captcha .g-recaptcha {
	transform-origin:top left;
}

#contact-form .form-row #captcha label {
	font-family:"Fedra Sans";
	font-weight:600;
	font-size:12em;
	line-height:1.7em;
	color:#00758D;
}

#contact-form .form-row #captcha.error label {
	color:#CE003A;
}

footer {
	position:relative;
	display:block;
	background-color:#FFFFFF;
	
}
.dotted-line {
	width:100%;
	height:3em;
	border: none;
	padding: 0px;
	background-image: radial-gradient(circle, #00758D 1.5em, transparent 1.5em);
	background-size: 9em 3em;
	background-repeat: repeat-x;
	background-position: 0em;
	margin-bottom:0em;
	z-index:1;
}

footer .logos {
	width:100%;
	height:150em;
	display:flex;
	align-items:center;
	justify-content:center;
}

footer .logos a {
	margin-left:66em;
	margin-right:66em;
	height:auto;
	cursor:default;
	
	opacity: 0;
	transform: scale(0.8);
	transition: opacity 0.5s ease, transform 0.5s ease;
}

footer .logos a.visible {
	opacity: 1;
	transform: scale(1);
}

footer .logos a img {
	width:100%;
	height:auto;
}

footer .logos a:nth-child(1) {
	width:152em;
}

footer .logos a:nth-child(2) {
	width:97em;
}

footer .logos a:nth-child(3) {
	width:214em;
}

footer .logos a:nth-child(4) {
	width:160em;
}

footer > .container {
	padding:22.5em 30em 24.5em 30em;
	align-items:flex-end;
	background-color:#EBEBEB;
}

footer a.logo {
	position:relative;
	display:block;
	width:96em;
	margin-right:auto;
	margin-bottom:5.5em;
}

footer a.logo img {
	width:100%;
	height:auto;
}

footer p {
	font-size:12.5em;
	line-height:1.4em;
	font-weight:400;
	font-family:"Fedra Serif B";
}

footer p.copyright {
	font-family:"Fedra Sans";
	font-size:12em;
	line-height:1.5em;
	margin-right:6.833em;
}

footer p:last-child {
	margin-left:2em;
}

footer p em {
	font-style:italic;
}

footer p a {
	color:#00758D;
	font-weight:700;
}

footer p a:hover {
	text-decoration:underline;
}


footer .links {
	display:flex;
	width:145em;
	flex-wrap:wrap;
	flex-direction:column;
}

footer .links + .links {
	margin-left:10em;
	margin-right:50em;
	
}

footer .links a {
	font-family:"Fedra Sans";
	font-size:14em;
	line-height:1.571em;
	color:#00758D;
	letter-spacing:0.025em;
	text-decoration:underline;
}

footer .links .inactive a {
	opacity:0.5;
	pointer-events:none;
	text-decoration:none;
}

footer .links a:hover,
footer .links a.active {
	text-decoration:none;
}

a.text {
	color:#000000;
	background-color:rgba(0,0,0,0.1);
	padding:20px;

	transition-property: background-color;
	transition-duration: 0.2s;
	transition-timing-function: ease-out;
}

a.text:hover {
	background-color:rgba(0,0,0,0.15);
}

/* v1 */
/*a.text {
	background-color:rgba(0,0,0,0);
	padding:0px;
}
a.text:hover {
	background-color:rgba(0,0,0,0);
}
/* v1 */

/* v2 */
/*header {
	margin-bottom:2px;
}
a.text {
	transition-property: background-color box-shadow;
	background-color:rgba(0,0,0,0);
	box-shadow: 0 1px 5px 0 rgb(0 0 0 / 20%);
}

a.text:hover {
	background-color:rgba(0,0,0,0.05);
	box-shadow: 0 1px 5px 0 rgb(0 0 0 / 40%);
}
/* v2 */

/* v3 */
a.text {
	background-color:rgba(0,0,0,0.05);
	/*transition-property:none;*/
}

a.text:hover {
	background-color:rgba(0,0,0,0);
	/*color:#FFFFFF;*/
}

/* v1 */
a.text h3 {
	font-size:24px;
	line-height:30px;
	display:block;
	margin-bottom:10px;
	font-weight:600;
}

a.text h5 {
	font-size:18px;
	line-height:24px;
	display:block;
	margin-bottom:10px;
	font-style:italic;
}

a.text p {
	position:relative;
	display:block;
	font-size:18px;
	line-height:24px;
}



.timeline {
	position:relative;
	display:block;
	background-color:#000000;
	min-height:455em;
	overflow:hidden;
}

.timeline .dates {
	position:absolute;
	left:0em;
	bottom:40em;
	display:flex;
	z-index:10;
}

.timeline .dates.swiper {
	position:relative;
	top:auto;
	left:auto;
	display:block;
	bottom:auto;
	margin-top:-8em;
}

.timeline .dates li:first-child {
	margin-left:516em;
	

	transition-property: margin-left;
	transition-duration: 0.5s;
	transition-timing-function: ease-out;
}

.timeline.offset-1 .dates li:first-child {
	margin-left:372em;
}

.timeline.offset-2 .dates li:first-child {
	margin-left:228em;
}

.timeline.offset-3 .dates li:first-child {
	margin-left:84em;
}

.timeline.offset-4 .dates li:first-child {
	margin-left:-60em;
}

.timeline.offset-5 .dates li:first-child {
	margin-left:-204em;
}

.timeline.offset-6 .dates li:first-child {
	margin-left:-348em;
}

.timeline.offset-7 .dates li:first-child {
	margin-left:-492em;
}

.timeline.offset-8 .dates li:first-child {
	margin-left:-636em;
}

.timeline.offset-9 .dates li:first-child {
	margin-left:-780em;
}

.timeline.offset-10 .dates li:first-child {
	margin-left:-924em;
}

.timeline.offset-11 .dates li:first-child {
	margin-left:-1068em;
}

.timeline.offset-12 .dates li:first-child {
	margin-left:-1212em;
}

.timeline.offset-13 .dates li:first-child {
	margin-left:-1356em;
}

.timeline.offset-14 .dates li:first-child {
	margin-left:-1500em;
}

.timeline.offset-15 .dates li:first-child {
	margin-left:-1644em;
}

.timeline.offset-16 .dates li:first-child {
	margin-left:-1788em;
}

.timeline.offset-17 .dates li:first-child {
	margin-left:-1932em;
}

.timeline.offset-18 .dates li:first-child {
	margin-left:-2076em;
}

.timeline.offset-19 .dates li:first-child {
	margin-left:-2220em;
}


.timeline .dates li {
	list-style-type:none;
	display:block;
	width:144em;
	padding-bottom:40em;
	position:relative;
	display:block;
	cursor:pointer;
}

.timeline .dates .swiper-slide {
	display:block;
	width:144em;
	height:60em;
	padding-bottom:40em;
	position:relative;
	display:block;
	cursor:pointer;
}

.timeline .dates .swiper-slide.swiper-slide-placeholder {
  min-width: calc(100% - 660em); /* 516 + 144 slidesOffsetBefore */
  pointer-events: none;
  opacity: 0;
}

.timeline .dates li.active {
	padding-left:6em;
}
.timeline .dates .swiper-slide.swiper-slide-active {
	padding-left:6em;
}

.timeline .dates li:before,
.timeline .dates .swiper-slide:before {
	content:" ";
	display:block;
	position:absolute;
	left:0px;
	top:26em;
	background-image:radial-gradient(circle, #00758D 1.5em, #000000 1.5em);
	width:3em;
	height:34em;
	background-repeat:repeat-y;
	background-size: 3em 9em;
}

.timeline .dates li.active:before,
.timeline .dates .swiper-slide.swiper-slide-active:before {
	background-image:radial-gradient(circle, #CAFFBD 1.5em, #000000 1.5em);
}

.timeline .dates li a,
.timeline .dates .swiper-slide a {
	color:#FFFFFF;
	font-size:16em;
	font-family:"Fedra Serif A";
	font-weight:500;
	letter-spacing:0.05em;
	font-variant-numeric:lining-nums;
	font-variant-caps: small-caps;
}

.timeline .dates li.active a,
.timeline .dates .swiper-slide.swiper-slide-active a {
	color:#CAFFBD;
	font-size:18em;
	font-weight:700;
}

.timeline .dotted-line {
	position:absolute;
	bottom:39em;
	left:0em;
}

.timeline .dates li:hover a,
.timeline .dates .swiper-slide:hover a {
	color:#CAFFBD;
}

.timeline .dates li:hover:before,
.timeline .dates .swiper-slide:hover:before {
	background-image:radial-gradient(circle, #CAFFBD 1.5em, transparent 1.5em);
}

.timeline .dotted-line.green {
	margin-bottom:0em;
	position:absolute;
	bottom:39em;
	left:0px;
	width:524em;
	background-image:radial-gradient(circle, #CAFFBD 1.5em, transparent 1.5em);
}

.timeline .dotted-line.vertical {
	margin-bottom:0em;
	background-image:radial-gradient(circle, #CAFFBD 1.5em, transparent 1.5em);
	width:3em;
	height:364em;
	background-repeat:repeat-y;
	background-size: 3em 9em;
	bottom:39em;
	left:516em;
	position:absolute;
}

.timeline .events {
	position:absolute;
	top:0px;
	left:0px;
	display:flex;
}

.timeline .events.swiper {
	position:relative;
	top:auto;
	left:auto;
	display:block;
}

.timeline .events li{
	list-style-type:none;
	display:block;
	width:100vw;
	padding-bottom:40em;
	padding-top:40em;
	position:relative;
	display:block;
	cursor:pointer;
	padding-left:523em;
	opacity:0;
	
	transition-property: opacity;
	transition-duration: 0.5s;
	transition-timing-function: ease-out;
}

.timeline .events .swiper-slide { 
	display:block;
	width:100vw;
	padding-bottom:20em;
	padding-top:36em;
	position:relative;
	display:block;
	cursor:pointer;
	padding-left:523em;
	min-height:348em;
	
	transition-property: opacity;
	transition-duration: 0.5s;
	transition-timing-function: ease-out;
}

.timeline .events li.active {
	opacity:1;
}

.timeline .events .swiper-slide.swiper-slide-active {
	opacity:1;
}

.timeline .events li h3,
.timeline .events .swiper-slide h3 {
	position:relative;
	display:block;
	color:#00758D;
	font-size:60em;
	line-height:1em;

	font-family:"Fedra Serif A";
	font-variant-numeric:lining-nums;
	font-variant-caps: small-caps;
	font-weight:400;
	letter-spacing:0.05em;
}

.timeline .events li img,
.timeline .events .swiper-slide img {
	position:relative;
	display:block;
	height:42em;
	width:auto;
	margin-top:10em;
	margin-bottom:8em;
}

.timeline .events li .texts,
.timeline .events .swiper-slide .texts {
	position:relative;
	display:block;
	width:324em;
	width:383em;
	margin-top:25em;
}


.timeline .events li .texts p,
.timeline .events .swiper-slide .texts p {	
	font-family:"Fedra Sans";
	font-weight:600;
	letter-spacing:0.020em;
	

	font-size:11.5em;
	font-size:14.5em;
	line-height:1.565em;
	margin-bottom:0.869em;
	color:#FFFFFF;
}

.timeline.offset-1 .events li:first-child {
	margin-left:-100vw;
}

.timeline.offset-2 .events li:first-child {
	margin-left:-200vw;
}

.timeline.offset-3 .events li:first-child {
	margin-left:-300vw;
}

.timeline.offset-4 .events li:first-child {
	margin-left:-400vw;
}

.timeline.offset-5 .events li:first-child {
	margin-left:-500vw;
}

.timeline.offset-6 .events li:first-child {
	margin-left:-600vw;
}

.timeline.offset-7 .events li:first-child {
	margin-left:-700vw;
}

.timeline.offset-8 .events li:first-child {
	margin-left:-800vw;
}

.timeline.offset-9 .events li:first-child {
	margin-left:-900vw;
}

.timeline.offset-10 .events li:first-child {
	margin-left:-1000vw;
}

.timeline.offset-11 .events li:first-child {
	margin-left:-1100vw;
}

.timeline.offset-12 .events li:first-child {
	margin-left:-1200vw;
}

.timeline.offset-13 .events li:first-child {
	margin-left:-1300vw;
}

.timeline.offset-14 .events li:first-child {
	margin-left:-1400vw;
}

.timeline.offset-15 .events li:first-child {
	margin-left:-1500vw;
}

.timeline.offset-16 .events li:first-child {
	margin-left:-1600vw;
}

.timeline.offset-17 .events li:first-child {
	margin-left:-1700vw;
}

.timeline.offset-18 .events li:first-child {
	margin-left:-1800vw;
}

.timeline.offset-19 .events li:first-child {
	margin-left:-1900vw;
}

.timeline .events li:first-child {
	transition-property: margin-left, opacity;
	transition-duration: 0.5s;
	transition-timing-function: ease-out;
}



#countries-container {
	width:100%;
	font-size:17em;
	align-self:flex-start;
}

.select2-container {
	width:100% !important;
}

.form-row .select2-container.select2-container--open {
	margin-bottom:10em;
}

.form-row .select2-container--default .select2-selection--single {
	border:0px;
}
.form-row .select2-container--default .select2-selection--single .select2-selection__arrow b {
	content: '';
	width: 0;
	height: 0;
	border: solid black;
	border-width: 0 0.2em 0.2em 0;
	position: absolute;
	right: 0.13em;
	top: calc(50% - 0.45em);
	pointer-events: none;
	z-index: 3;
	display: inline-block;
	padding: 0.2em;
	transform: rotate(45deg);
	-webkit-transform: rotate(45deg);
}

.form-row .select2-container .select2-selection--single {
	height:auto;
}

.form-row .select2-container--default.select2-container--open .select2-selection--single .select2-selection__arrow b {
	border: solid black;
	border-width: 0 0.2em 0.2em 0;
}

.form-row .select2-container .select2-selection--single .select2-selection__rendered {
	padding-left:0.5em;
	padding-right:1em;
	line-height:1.529em;
	font-weight:600;
	color:#000000;
}

.form-row.error .select2-container .select2-selection--single .select2-selection__rendered {
	color:#CE003A;
}

.form-row .select2-container--default .select2-selection--single .select2-selection__arrow {
	width:0.824em;
	height:0.824em;
	top:0.471em;
	right:0.059em;
}

.form-row .select2-dropdown {
	border:0;
	background:transparent;
}
.form-row .select2-container--default .select2-results__option--highlighted.select2-results__option--selectable {
	background:transparent;
	color:#00758D;
}
.form-row .select2-container--default .select2-results__option--selected {
	background:transparent;
	color:#00758D;
}
.form-row .select2-search--dropdown .select2-search__field {
	padding:0em;
}
#contact-form .form-row .select2-container--default .select2-search--dropdown .select2-search__field {
	margin-left:0.5em;
	border:0em;
	font-weight:600;
	line-height:1.529em;
	font-size:1em;
}

#contact-form .form-row label.country {
	align-self:flex-start;
}

#contact-form .select2-container--open .select2-dropdown {
  top: 100% !important;       /* Force dropdown to appear below */
  bottom: auto !important;    /* Prevent it from flipping up */
}

#contact-form .select2-container--open {
	top:1.5em !important;
}

#contact-form .select2.select2-container--open {
	top:auto !important;
}

.form-row .select2-container--default .select2-search--dropdown .select2-search__field::placeholder {
	color:#CCCCCC;
}

.form-row .select2-search--dropdown {
	padding:0em;
	margin-top:0em;
	margin-bottom:0.5em;
}

.form-row .select2-results__option {
	padding:0em;
	padding-left:0.5em;
	font-weight:600;
	line-height:1.529em;
}

.form-row .select2-container .select2-results__options {
	scrollbar-width: thin;
	scrollbar-color: #00758D #FFFFFF;
}


.form-row .select2-container--default .select2-results>.select2-results__options {
	max-height:7.765em;
}



.select {
	display:flex;
	flex-direction: column;
	width:100%;
	flex-shrink:1;
	height:auto;
	max-height:300em;
	overflow:hidden;
}

.option {
	padding:0px;
	min-height:1.529em;
	display:flex;
	align-items:center;
	background:#FFFFFF;
	border-top:#222 solid 1px;
	position:absolute;
	top:0;
	width: 100%;
	pointer-events:none;
	order:2;
	z-index:1;
	transition:background .4s ease-in-out;
	box-sizing:border-box;
	overflow:hidden;
	white-space:nowrap;
}

#contact-form .form-row .select label {
	font-size: 17em;
	line-height: 1.529em;
	padding-left:0.5em;
	width: 100%;
	flex-shrink: 1;
	font-weight: 600;
	border: 0px;
	color:#000000;
	cursor:pointer;
}

#contact-form .form-row .select label:hover{
	color:#00758D;
}

.select.long:focus {
	overflow-y:scroll;
}

.select:focus .option {
	position:relative;
	pointer-events:all;
}

.select input {
	opacity:0;
	position:absolute;
	left:-99999px;
}

.select input:checked + label {
	order: 1;
	z-index:2;
	background:#FFFFFF;
	border-top:none;
	position:relative;
}

.select input:checked + label:after {
	content:'';
	width: 0; 
	height: 0; 
	border: solid black;
	border-width: 0 0.2em 0.2em 0;
	position:absolute;
	right:0.13em;
	top:calc(50% - 0.45em);
	pointer-events:none;
	z-index:3;
	
	display: inline-block;
	padding: 0.2em;
	
	transform: rotate(45deg);
	-webkit-transform: rotate(45deg);
}

.select input:checked + label:before {
	position:absolute;
	right:0;
	height: 1.529em;
	width: 1.529em;
	content: '';
	background:#FFFFFF;
}





.menu-toggle {
	position:absolute;
	right:26em;
	top:42.25em;
	border:0px;
	pointer-events:auto;
	background-color:transparent;
	width: 40em;
	height: 30em;
	margin:0px;
	padding:0px;
	
	-webkit-transform: rotate(0deg);
	-moz-transform: rotate(0deg);
	-o-transform: rotate(0deg);
	transform: rotate(0deg);
	-webkit-transition: top .3s ease-out;
	-moz-transition: top .3s ease-out;
	-o-transition: top .3s ease-out;
	transition: top .3s ease-out;
	cursor: pointer;
	display:none;
}

.menu-toggle span {
	display: block;
	position: absolute;
	height: 3.5em;
	width: 32em;
	background: #000000;
	border-radius: 0px;
	opacity: 1;
	left: 4em;
	-webkit-transform: rotate(0deg);
	-moz-transform: rotate(0deg);
	-o-transform: rotate(0deg);
	transform: rotate(0deg);
	-webkit-transition: .25s ease-in-out;
	-moz-transition: .25s ease-in-out;
	-o-transition: .25s ease-in-out;
	transition: .25s ease-in-out;
}

.menu-toggle:hover span {
	background:#00758D;
}

.menu-toggle span:nth-child(1) {
	top: 3em;
}

.menu-toggle span:nth-child(2), .menu-toggle span:nth-child(3) {
	top: 13em;
}

.menu-toggle span:nth-child(4) {
	top: 23em;
}

.expanded .menu-toggle span:nth-child(1) {
	top: 13em;
	width: 0%;
	left: 50%;
}

.expanded .menu-toggle span:nth-child(2) {
	-webkit-transform: rotate(45deg);
	-moz-transform: rotate(45deg);
	-o-transform: rotate(45deg);
	transform: rotate(45deg);
}

.expanded .menu-toggle span:nth-child(3) {
	-webkit-transform: rotate(-45deg);
	-moz-transform: rotate(-45deg);
	-o-transform: rotate(-45deg);
	transform: rotate(-45deg);
}

.expanded .menu-toggle span:nth-child(4) {
	top: 13em;
	width: 0%;
	left: 50%;
}

.menu-toggle, .menu-toggle:hover, .menu-toggle:focus {
	background-color:transparent;
	outline: none;
}



@media (min-width:1921px){
	
}

@media (max-width:1019px){
	main .segment.zoom img.zoom {
		top:0em;
	}
	main .text2 {
		flex-wrap:wrap;
	}
	main .text2 .two-column-text {
		margin-left:174em;
	}
	main .text2 h3 {
		margin-bottom:0.465em;
	}
	main .text2.milestones .one-column-text {
		margin-left:174em;
	}
	
	.timeline .events .swiper-slide {
		padding-left:181em;
	}
	.timeline .dotted-line.vertical {
		left:174em;
	}
	.timeline .dotted-line.green {
		width:174em;
	}
	.timeline .dates .swiper-slide.swiper-slide-placeholder {
		min-width:calc(100% - 318em);  /* 174 + 144 slidesOffsetBefore */
	}
	footer > .container {
		flex-wrap:wrap;
	}
	footer .links {
		width:auto;
	}
	footer a.logo {
		margin-right:48em;
	}
	footer p.copyright {
		margin-right:1.5em;
		width:19em;
	}
	footer .links + .links {
		margin-right:30em;
	}
	
	footer p:last-child {
		margin-left:1.5em;
	}
	
	main .text2 h3.wide + .one-column-text {
		margin-left:174em;
	}
	#values .value {
		width:calc(50% - 20em);
	}
	
	#values .value:nth-child(1),
	#values .value:nth-child(2) {
		margin-bottom:20em;
	}
	
	#people .person {
		width:calc(50% - 20em);
	}
	main .text2 .one-column-text.wide {
		margin-left:174em;
	}
	#search-results {
		margin-left:20em;
		margin-right:20em;
	}
	#products {
		margin-right:20em;
	}
	
	#posts {
		margin-right:20em;
	}
	
	#posts .post {
		width:calc(50% - 20em);
	}
	main .text2 .one-column-text.sans {
		width:772em;
	}
	#contact-form {
		margin-left:174em;
	}
	#people {
		margin-right:20em;
	}
	#principles {
		margin-right:20em;
	}
	#values {
		margin-right:20em;
	}
	#principles li .line {
		display:block;
	}
	#principles li .dotted-line {
		margin-top:7em;
	}
	
	#principles li:nth-child(1) .dotted-line,
	#principles li:nth-child(2) .dotted-line,
	#principles li:nth-child(3) .dotted-line,
	#principles li:nth-child(4) .dotted-line,
	#principles li:nth-child(5) .dotted-line,
	#principles li:nth-child(6) .dotted-line,
	#principles li:nth-child(7) .dotted-line,
	#principles li:nth-child(8) .dotted-line,
	#principles li:nth-child(9) .dotted-line,
	#principles li:nth-child(10) .dotted-line {
		width:100%;
	}
	
	.text2.gray .one-column-text {
		margin-left:174em;
		width:100%;
	}
	
	main #map-container {
		height:310em;
	}
	
	main #map {
		height:272em;
	}
	main .expanded .one-column-text {
		margin-top:0em;
	}
	

	
	main #contact-picture.segment.zoom img.zoom {
		top:-50em;
		transform-origin:50% 30%;
	}
	
	main #specialty-chemicals-picture.segment.zoom img.zoom {
		top:100em;
		transform-origin:50% 50%;
		transform:scale(2.5);
	}
	
	main #specialty-chemicals-picture.segment.zoom.loaded img.zoom {
		transform:scale(2);
	}
	
	main #lubricants-picture.segment.zoom img.zoom {
		top:0em;
		transform-origin:50% 40%;
		transform:scale(2);
	}

	main #lubricants-picture.segment.zoom.loaded img.zoom {
		transform:scale(1.5);
	}
	
}

@media (max-width:599px){
	main .text2 .two-column-text {
		margin-left:0em;
	}
	main .text2.milestones .one-column-text {
		margin-left:0em;
	}
	.timeline .dotted-line.green {
		width:30em;
	}
	main .text2 h3.wide + .one-column-text {
		margin-left:0em;
	}
	main .text2 .one-column-text.wide {
		margin-left:0em;
	}
	.text2.gray .one-column-text {
		margin-left:0em;
	}
	
	header > .container {
		align-items:flex-start;
		flex-wrap:wrap;
	}
	header nav {
		width:100%;
	}
	#menu {
		display:none;
		flex-direction:column;
		margin-top:30em;
	}
	#menu li {
		margin-left:0em;
		margin-bottom:5em;
		text-align:right;
	}
	
	#menu li:last-child {
		margin-bottom:0em;
	}
	
	#menu li a {
		font-size:24em;
		display:inline-block;
	}
	#menu li li {
		margin-bottom:0em;
	}
	#menu li li a {
		font-size:19em;
	}
	
	#menu li.active ol {
		display:block;
	}
	
	#menu:has(li:hover) li.active ol {
		display:none;
	}
	
	#menu:has(li:hover) li.active a {
		color:#000000;
	}
	
	#menu:has(li:hover) li.active:hover ol {
		display:block;
	}
	
	#menu:has(li:hover) li.active:hover > a {
		color:#00758D;
	}
	
	#menu li ol {
		position:relative;
		top:auto;
		left:auto;
		padding:0em;
		width:100%;
	}
	#menu li li:first-child {
		margin-top:3em;
	}
	
	#menu li li:last-child {
		margin-bottom:5em;
	}
	.expanded #menu {
		display:flex;
	}
	.menu-toggle {
		display:block;
	}
	main .segment .message {
		margin-left:0em;
		width:100%;
		padding:23.5em 30em;
	}
	
	main .segment.zoom img.zoom {
		width:auto;
		height:100%;
	}
	
	main .segment img.parallax {
		width:220%;
	}
	
	main .text {
		padding:23.5em 30em;
	}
	
	main .text2 {
		flex-wrap:wrap;
		padding:23.5em 30em;
	}
	
	main .text2 .label {
		margin-left:-30em;
	}
	
	main .text2 h3 {
		margin-bottom:0.465em;
	}
	main .text2 .two-column-text {
		-webkit-columns: 1;
		-moz-columns: 1;
		columns: 1;
		column-gap: 0em;
		width:100%;
	}
	
	footer > .container {
		flex-wrap:wrap;
	}
	
	footer .logos {
		padding:23.5em 30em;
		flex-wrap:wrap;
		height:auto;
	}
	
	footer .logos a {
		margin-left:auto;
		margin-right:auto;
	}
	
	footer .logos a:nth-child(1) {
		margin-left:auto;
	}
	footer .logos a:nth-child(1),
	footer .logos a:nth-child(2) {
		margin-bottom:30em;
	}
	/*
	footer .logos a:nth-child(3) {
		margin-bottom:20em;
	}
	
	footer .logos a:nth-child(4) {
		margin-left:calc(50% - 80em);
	}*/
	
	footer a.logo {
		margin-bottom:22.5em;
	}
	footer .links {
		margin-top:15em;
		margin-bottom:15em;
		width:50%;
	}
	
	footer .links + .links {
		margin-left:0em;
		margin-right:0em;
	}
	
	footer .container > p {
		width:50%;
	}
	
	footer .container > p.copyright {
		width:100%;
		margin-right:0em;
	}
	
	footer p:last-child {
		margin-left:0em;
	}
	
	.timeline .dotted-line.vertical {
		left:30em;
	}
	.timeline .events li {
		padding-left:37em;
	}
	.timeline .events .swiper-slide {
		padding-left:37em;
	}
	.timeline .dates li:first-child {
		margin-left:30em;
	}
	
	.timeline.offset-1 .dates li:first-child {
		margin-left:-114em;
	}

	.timeline.offset-2 .dates li:first-child {
		margin-left:-258em;
	}

	.timeline.offset-3 .dates li:first-child {
		margin-left:-402em;
	}

	.timeline.offset-4 .dates li:first-child {
		margin-left:-546em;
	}

	.timeline.offset-5 .dates li:first-child {
		margin-left:-690em;
	}

	.timeline.offset-6 .dates li:first-child {
		margin-left:-834em;
	}

	.timeline.offset-7 .dates li:first-child {
		margin-left:-978em;
	}

	.timeline.offset-8 .dates li:first-child {
		margin-left:-1122em;
	}

	.timeline.offset-9 .dates li:first-child {
		margin-left:-1266em;
	}

	.timeline.offset-10 .dates li:first-child {
		margin-left:-1410em;
	}

	.timeline.offset-11 .dates li:first-child {
		margin-left:-1554em;
	}

	.timeline.offset-12 .dates li:first-child {
		margin-left:-1698em;
	}

	.timeline.offset-13 .dates li:first-child {
		margin-left:-1842em;
	}

	.timeline.offset-14 .dates li:first-child {
		margin-left:-1986em;
	}

	.timeline.offset-15 .dates li:first-child {
		margin-left:-2130em;
	}

	.timeline.offset-16 .dates li:first-child {
		margin-left:-2274em;
	}

	.timeline.offset-17 .dates li:first-child {
		margin-left:-2418em;
	}

	.timeline.offset-18 .dates li:first-child {
		margin-left:-2562em;
	}

	.timeline.offset-19 .dates li:first-child {
		margin-left:-2706em;
	}
	
	main .expanded h3 {
		margin-top:0em;
	}
	main .expanded .one-column-text {
		margin-top:0em;
	}
	main .text2.gray p:last-child {
		margin-bottom:0em;
	}
	main #map-container {
		margin-right:0em;
		width:100%;
		margin-top:20em;
		position:relative;
		top:auto;
		right:auto;
	}
	
	main .expanded #map-container {
		margin-top:20em;
		margin-left:0em;
		width:100%;
	}
	
	main .text2 .one-column-text.sans {
		width:100%;
	}
	
	#contact-form {
		margin-left:0em;
		width:100%;
	}
	#contact-form .form-row.last {
		flex-wrap:wrap;
	}
	
	#contact-form .form-row input[type='submit'] {
		margin-left:0em;
		margin-top:1.25em;
	}
	
	#values {
		width:100%;
		margin-left:0em;
		margin-right:0em;
	}
	
	#values .value {
		width:100%;
		margin-left:0em;
		margin-right:0em;
		margin-bottom:20em;
	}
	#values .value:last-child {
		margin-bottom:0em;
	}
	
	#values .value p {
		margin-bottom:0em;
	}
	
	#values .value h4 {
		margin-bottom:0.3em;
	}
	
	#principles {
		margin-left:0em;
		margin-right:0em;
		width:100%;
	    -webkit-columns: 1;
	    -moz-columns: 1;
	    columns: 1;
	}
	/*
	#principles .dotted-line {
		display:none;
	}
	*/
	#people {
		margin-left:0em;
		margin-right:0em;
		width:100%;
	}
	
	#people .person {
		width:100%;
		margin-left:0em;
		margin-right:0em;
	}
	
	main .segment h3 {
		transform: translateX(3em);
		line-height:1.367em;
		font-size:25em;
		margin-bottom:0.85em;
	}
	
	main .segment .text2 h3 {
		font-size: 43em;
		line-height: 1.209em;
		margin-bottom:0.465em;
	}

	main .segment h1 {
		transform: translateX(3em);
		font-size:55em;
		line-height:1.167em;
		margin-bottom:0.4em;
	}
	
	main .segment.zoom.loaded img.zoom {
		top:0em;
		/*transition:transform 2s ease;*/
	}
	header {
		height:110em;
		overflow:hidden;
	}
	
	header:has(.expanded){
		position:fixed;
		height:100dvh;
		top:0em;
		transition:height 0.5s ease;
	}
	
	body:has(header .expanded){
		overflow:hidden;
	}
	
	body:has(header .expanded) main {
		margin-top:110em;
	}
	
	#menu {
		margin-top:calc(50dvh - 200em);
	}
	
	#menu li a {
		font-size:30em;
	}
	main .text2 .shrinked p a#expand-paragraphs {
		display:inline-block;
	}
	
	main .text2 p a#shrink-paragraphs {
		display:inline-block;
	}
	.two-column-text.shrinked p:nth-child(2),
	.two-column-text.shrinked p:nth-child(3) {
		display:none;
	}
	
	#principles li .line {
		display:block;
	}
	
	main .segment.mega {
		height:auto;
	}
	
	main .segment .note {
		padding-left:30em;
		padding-right:30em;
	}
	
	#products {
		width:100%;
		height:auto;
		margin-left:0em;
		margin-right:0em;
		margin-top:6.5em;
	}
	
	#products .product {
		width:100%;
		height:auto;
		margin:0em;
		margin-bottom:20em;
	}
	
	main .text2.green {
		margin-top:300em;
	}
	
	#posts {
		width:100%;
		height:auto;
		margin-left:0em;
		margin-right:0em;
		margin-top:6.5em;
	}
	
	#posts .post {
		width:100%;
		height:auto;
		margin:0em;
		margin-bottom:30em;
	}
	
	#posts picture {
		height:246em;
	}
	
	#posts .post .info {
		height:auto;
	}
	
	#posts .post p.date {
		margin-top:1em;
	}
	
	#search-results {
		width:100%;
		height:auto;
		margin-left:0em;
		margin-right:0em;
		margin-top:6.5em;
	}
	
	#search-results .search-result {
		width:100%;
		height:auto;
		margin:0em;
		margin-bottom:30em;
	}
	
	#search-results picture {
		height:246em;
	}
	
	#search-results .search-result .info {
		height:auto;
	}
	
	#search-results .search-result p.date {
		margin-top:1em;
	}
	
	main .segment .text2 h3.wide {
		width:100%;
		margin-right:0em;
	}
	
	.timeline .dates .swiper-slide.swiper-slide-placeholder {
	  min-width: calc(100% - 174em); /* 30 + 144 slidesOffsetBefore */
	}
	
	#search {
		margin-top:calc(50dvh - 100em);
	}
	
	#search input[type='text'] {
		font-size:30em;
	}
	
	#search input[type='submit'] {
		width:30em;
		height:30em;
	}
	
	#contact-form .form-row #captcha {
		width:100%;
	}
	
	#principles li .dotted-line {
		margin-top:7em;
	}
	
	#principles li:nth-child(1) .dotted-line,
	#principles li:nth-child(2) .dotted-line,
	#principles li:nth-child(3) .dotted-line,
	#principles li:nth-child(4) .dotted-line,
	#principles li:nth-child(5) .dotted-line,
	#principles li:nth-child(6) .dotted-line,
	#principles li:nth-child(7) .dotted-line,
	#principles li:nth-child(8) .dotted-line,
	#principles li:nth-child(9) .dotted-line,
	#principles li:nth-child(10) .dotted-line {
		width:100%;
	}
	
	#principles li span.principle {
		display:inline-block;
		width:calc(100% - 1.85em);
		vertical-align:top;
	}
	
	#principles li span.no {
		vertical-align:top;
	}
	
	#principles li span {
		font-size:20em;
	}
	/*
	#principles li:last-child .dotted-line {
		display:none;
	}
	*/
	footer .logos a:nth-child(1) {
		order:3;
	}
	footer .logos a:nth-child(2) {
		order:2;
	}
	footer .logos a:nth-child(3) {
		order:1;
	}
	footer .logos a:nth-child(4) {
		order:4;
	}
	
	footer .logos a:nth-child(1) {
		margin-bottom:0em;
	}
	footer .logos a:nth-child(2),
	footer .logos a:nth-child(3) {
		margin-bottom:20em;
	}
	#values .line-container {
		padding-left:0em;
		padding-right:0em;
	}
	
	main #contact-picture.segment.zoom img.zoom {
		top:0em;
		left:-40%;
		transform-origin:60% 0%;
		
		left:-97%;
		top:0em;
		transform:scale(1.5);
	}
	
	main #contact-picture.segment.zoom.loaded img.zoom {
		transform:scale(1.2);
	}
	
	main #specialty-chemicals-picture.segment.zoom img.zoom {
		top:0em;
		left:-180%;
		transform-origin:50% 50%;
		transform:scale(1.5);
	}
	
	main #specialty-chemicals-picture.segment.zoom.loaded img.zoom {
		transform:scale(1.20);
	}
	
	main #lubricants-picture.segment.zoom img.zoom {
		top:0em;
		left:-320%;
		transform-origin:50% 40%;
		transform:scale(1.5);
	}

	main #lubricants-picture.segment.zoom.loaded img.zoom {
		transform:scale(1.2);
	}
}



@media (hover:none) {
	/*
	.works a.work .card .inner {
		opacity:1;
	}
	*/
}

@media screen and (orientation:portrait) {
	/*
	body.home .swiper.horizontal {
		display:none !important;
	}
	body.home .swiper.vertical {
		display:block !important;
	}
	*/
}