/*
	CSS file for Haldengut
*/

@font-face {
    font-family: 'Rockwell';
    src: url('../fonts/Rockwell-Bold.woff2') format('woff2'),
        url('../fonts/Rockwell-Bold.woff') format('woff');
    font-weight: bold;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Rockwell';
    src: url('../fonts/Rockwell.woff2') format('woff2'),
        url('../fonts/Rockwell.woff') format('woff');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}

[data-aos="fade-left"] {
	-webkit-transform: translate3d(20px, 0px, 0px);
			transform: translate3d(20px, 0px, 0px);
}

	[data-aos="fade-left"].aos-animate {
		-webkit-transform: translate3d(0px, 0px, 0px);
				transform: translate3d(0px, 0px, 0px);
	}
	
[data-aos="fade-up"] {
	-webkit-transform: translate3d(0px, 15px, 0px);
			transform: translate3d(0px, 15px, 0px);
}

	[data-aos="fade-up"].aos-animate {
		-webkit-transform: translate3d(0px, 0px, 0px);
				transform: translate3d(0px, 0px, 0px);
	}



/*	General	
------------------------------*/
	
	* {
		padding: 0;
		margin: 0;
		outline: none;
		-webkit-font-smoothing: antialiased;
		-moz-osx-font-smoothing: grayscale;
	}
	
	body {
		color: #ffffff;
		font-family: 'Rockwell', sans-serif;
		background: #004c9c;
	}
	
	img {
		max-width: 100%;
		height: auto;
	}
	
	a img {
		border: 0;
	}			
	
	a,
	svg,
	path,
	button {
		transition: all ease 0.4s;
	}
	
	.container {
		width: 94%;
		max-width: 1440px;
		margin: 0 auto;
	}
	
	.wrapper {
		overflow: hidden;
	}
	
	.has-html5video .fancybox__content {
		height: calc(100vh - 100px);
	}
	
	

/*	Intro
-------------------------------------------*/

	.intro {
		top: 0px;
		left: 0px;
		width: 100%;
		height: 100vh;
		display: flex;
		align-items: center;
		justify-content: center;
		position: fixed;
		background: url('../img/intro-bg.jpg') no-repeat top center / cover;
	}
	
		.intro .logo {
			top: 48px;
			display: flex;
			align-items: center;
			justify-content: center;
			position: absolute;
		}
		
			.intro .logo img {
				display: block;
				width: auto;
				height: 50px;
				margin-right: 25px;
				background: #0868b1;
				border: 2px solid #fff;
				border-radius: 15px;
				padding: 12px 15px 20px 15px;
			}
			
			.intro .logo span {
				color: #ffffff;
				font-size: 40px;
				font-weight: bold;
				line-height: 40px;
			}
			
		.intro .confirmation {
			width: 100%;
			padding-top: 40px;
		}
		
			.intro .confirmation p {
				font-size: 140px;
				font-weight: bold;
				line-height: 140px;
				text-align: center;
			}
			
			.intro .confirmation .buttons {
				display: flex;				
				justify-content: center;
				margin-top: 90px;
			}
			
				.intro .confirmation .buttons a {
					display: block;
					width: 244px;
					height: 70px;
					display: flex;
					color: #004c9c;
					font-size: 24px;
					font-weight: bold;
					line-height: 24px;
					letter-spacing: -0.01em;
					text-decoration: none;
					align-items: center;
					justify-content: center;
					border-radius: 35px;
					background: #ffffff;
				}
					
					.intro .confirmation .buttons a + a {
						margin-left: 95px;
					}
					
					.intro .confirmation .buttons a:hover {
						color: #fff;
						background: #1598d7;
					}
			
		.intro .bottom {
			left: 0px;
			right: 0px;
			bottom: 25px;
			font-size: 14px;
			line-height: 18px;
			text-align: center;
			position: absolute;
		}

	
	
/*	Header
-------------------------------------------*/
	
	header {
		top: 0px;
		left: 0px;
		right: 0px;
		z-index: 1000;
		position: fixed;
		background: #ffffff;
	}
	
		header .container {
			width: auto;
			max-width: 100%;
			display: flex;
			align-items: center;
			justify-content: space-between;
			padding: 38px 50px 41px 50px;
			transition: all ease 0.4s;
		}
		
		header .logo {
			display: flex;
			align-items: center;
			text-decoration: none;
		}
		
			header .logo img {
				display: block;
				top: -2px;
				width: 219px;
				height: 30px;
				margin-right: 20px;
				position: relative;
			}		
		
		header nav {
			margin-top: 2px;
		}
		
			header nav ul {
				display: flex;
				list-style: none;
			}
			
				header nav ul li + li {
					margin-left: 45px;
				}
			
				header nav ul li a {
					color: #004d9c;
					font-size: 20px;
					font-weight: bold;
					line-height: 24px;
					letter-spacing: -0.015em;
					text-decoration: none;
				}
				
					header nav ul li a:hover {
						color: #1598d7;
					}
				
					header nav ul li a svg {
						display: block;
						fill: #004d9c;
					}
					
						header nav ul li a:hover svg {
							fill: #1598d7;
						}
						
		header .menu-trigger {
			cursor: pointer;
			position: absolute;
			z-index: 9000;	
			display: none;
			align-items: center;
			justify-content: center;		
			width: 50px;
			height: 50px;
			right: 8px;
			transition: all ease 0.3s;
		}
		
			header .menu-trigger .bars {
				width: 30px;
				height: 3px;
				position: relative;
			}
			
				header .menu-trigger .bars span {
					top: 50%;
					left: 50%;
					width: 30px;
					height: 3px;
					margin-left: -15px;
					margin-top: -1px;
					background: #004d9c;
					position: absolute;
					transition: all ease 0.4s;
				}
			
				header .menu-trigger .bars:before,
				header .menu-trigger .bars:after {
					content: "";
					width: 30px;
					height: 3px;
					background: #004d9c;
					position: absolute;
					transition: all ease 0.4s;
				}
				
				header .menu-trigger .bars:before {
					top: -9px;
					left: 0px;
				}
				
				header .menu-trigger .bars:after {
					top: 10px;
					left: 0px;
				}
			
			header .menu-trigger:hover .bars span,	
			header .menu-trigger:hover .bars:before,
			header .menu-trigger:hover .bars:after {
				background: #004d9c;
			}
				
			.opened-nav header .menu-trigger .bars:before {
				top: 0px;
				transform-origin: center center;
				transform: rotate(-45deg);	
			}
			
			.opened-nav header .menu-trigger .bars:after {
				top: 0px;
				transform-origin: center center;
				transform: rotate(45deg);	
			}	
			
			.opened-nav header .menu-trigger .bars span {
				background: transparent;
			}
	
	header.tiny .container {
		padding: 21px 50px 23px 50px;
		box-shadow: 0px 0px 6px rgba(0, 0, 0, 0.1);
	}
	


/*	Hero
-------------------------------------------*/
	
	.hero {
		width: 100%;
		height: calc(100vh - 109px);
		max-height: 1080px;
		margin-top: 109px;
		overflow: hidden;
		position: relative;
		background: #19a3dd;
	}
	
		.hero video {
			top: 0px;
			right: 0px;
			width: auto;
			height: 100%;			
			position: absolute;
		}
		
			.hero .mobile {
				display: none;
			}
		
		.hero .text {
			top: 0px;
			left: 0px;
			bottom: 0px;
			width: 200vw;
			display: flex;
			font-size: 130px;
			font-weight: bold;
			line-height: 130px;
			position: absolute;
			transform: translate3d(-50%, 0px, 0px);
			transition: all ease 800ms;
		}
		
			.hero .text > div {
				display: flex;
				width: 100%;
				height: 100%;
				align-items: center;				
			}
			
			.hero .text .t1 {				
				font-weight: bold;
				flex-direction: column;
				justify-content: center;
				align-items: center;
				position: relative;
			}
			
				.hero .text .t1 p {
					font-size: 60px;
					line-height: 70px;
					text-align: center;
				}
				
					.hero .text .t1 .p1 span {
						display: block;
						opacity: 0;
						transform: translate3d(0px, 15px, 0px);
					}
					
				.hero .text .t1 .p2 {
					font-size: 120px;
					line-height: 120px;
					padding: 90px 0;
					opacity: 0;
					transform: translate3d(0px, 15px, 0px);
				}
				
				.hero .text .t1 .p3 {
					padding-bottom: 40px;
					opacity: 0;
					transform: translate3d(0px, 15px, 0px);
				}
				
				.hero .text .t1 svg {
					display: block;
					width: 80px;
					height: 48px;
					margin: 50px auto 0 auto;
					cursor: pointer;
				}
			
			.hero .text.animate {
				transform: translate3d(0px, 0px, 0px);
			}
			
				.hero .text.animate .p1 .l1 {
					opacity: 1;
					transition: all ease 0.5s 2000ms;
					transform: translate3d(0px, 0px, 0px);
				}
				
				.hero .text.animate .p1 .l2 {
					opacity: 1;
					transition: all ease 0.5s 2150ms;
					transform: translate3d(0px, 0px, 0px);
				}
				
				.hero .text.animate .p2 {
					opacity: 1;
					transition: all ease 0.5s 2350ms;
					transform: translate3d(0px, 0px, 0px);
				}
				
				.hero .text.animate .p3 {
					opacity: 1;
					transition: all ease 0.5s 2500ms;
					transform: translate3d(0px, 0px, 0px);
				}


/*	Promoters
-------------------------------------------*/
	
	.promoter {		
		overflow: hidden;
		position: relative;
		background: #3c8896 url('../img/promoter-bg-1.png') 80px 0px / cover;
	}
	
		.promoter video {
			width: 100%;
			height: auto;
			min-width: 100%;
			min-height: 100%;
			position: relative;
		}
	
		.promoter .container {
			display: flex;
			align-items: center;
			min-height: calc(100vh - 74px);
		}
		
		.promoter .image {
			width: 50%;
			top: 0px;
			right: 0px;
			bottom: 0px;
			z-index: 2;
			position: absolute;
			background-size: cover;
			background-repeat: no-repeat;
			background-position: top center;
		}
	
		.promoter .content {
			width: 50%;
			max-width: 610px;
			padding: 60px 0;
			box-sizing: border-box;
		}
		
			.promoter .content h2 {
				font-size: 80px;
				font-weight: bold;
				line-height: 80px;
				margin-bottom: 50px;
			}
			
			.promoter .content p {
				font-size: 30px;
				line-height: 48px;
				letter-spacing: -0.01em;
			}
			
		.promoter .button {
			width: 395px;
			margin-top: 30px;
		}
		
			.promoter .button a {
				display: flex;
				width: 100%;
				height: 70px;
				color: #004c9c;
				font-size: 24px;
				font-weight: bold;
				line-height: 24px;
				padding: 0 17px;
				align-items: center;
				text-decoration: none;
				background: #ffffff;
				border-radius: 35px;
				box-sizing: border-box;
			}
			
				.promoter .button a img {
					display: block;
					width: 37px;
					height: 37px;
					margin-right: 12px;
				}
				
				.promoter .button a span {
					display: block;
				}
				
				.promoter .button a:hover {
					color: #ffffff;
					background: #1598d7;
				}
	
	.promoter-2 {
		background: #1598d7 url('../img/promoter-bg-2.png') calc(50vw + 80px) 0px / cover;
	}
	
		.promoter-2 .image {
			left: 0px;
			right: auto;
		}		
		
			.promoter-2 .container {
				justify-content: flex-end;
			}
			
			.promoter-2 .content {
				padding-left: 50px;
			}
			
	.promoter-3 {
		background-color: #004c9c;
		background-image: url('../img/promoter-bg-3.png');
	}
		


/*	Products
-------------------------------------------*/

	.products {
		padding: 90px 0 0 0;
		background: #1598d7 url('../img/products-bg.jpg') no-repeat center center / cover;
	}
	
		.products h2 {
			font-size: 80px;
			font-weight: bold;
			line-height: 80px;
			text-align: center;
			padding-bottom: 60px;
		}
		
		.products .items {
			display: flex;
			justify-content: space-between;
		}
			
			.products .item {
				width: calc(50% - 50px);
				max-width: 615px;
				display: flex;
				align-items: flex-end;
				justify-content: space-between;
			}
			
				.products .item .product {					
					position: relative;
				}
				
					.products .item .product .img {
						position: relative;
					}
				
					.products .item .product .img:after {
						content: "";
						width: 444px;
						height: 102px;
						left: 50%;
						bottom: -35px;
						position: absolute;
						background: url('../img/products-img-shadow.png') no-repeat bottom center / contain;
						transform: translateX(-50%);
					}
				
					.products .item .product img {
						display: block;
						z-index: 2;
						position: relative;
					}
				
					.products .item .product .tooltip {
						width: 400px;						
						left: 50%;
						bottom: 150px;
						z-index: 9000;
						margin-left: -200px;
						color: #000000;
						font-size: 18px;
						line-height: 24px;
						letter-spacing: -0.025em;
						border-radius: 20px;
						padding: 30px 35px;
						position: absolute;
						background: rgba(255, 255, 255, 0.9);
						box-shadow: 7px 7px 20px 0px rgba(0, 0, 0, 0.2);
						box-sizing: border-box;
						transform: translate3d(0px, 20px, 0px);
						transition: all ease 0.3s;
						opacity: 0;
					}
					
						.products .item .product:hover .tooltip {
							opacity: 1;
							transform: translate3d(0px, 0px, 0px);	
						}
					
						.products .item .product .tooltip svg {
							top: 100%;
							right: 50%;
							position: absolute;
							display: none;
						}
							
							/*
							.products .item .product .tooltip svg polygon {
								fill: rgba(255, 255, 255, 0.9);
								filter: drop-shadow(3px 5px 2px rgb(0 0 0 / 0.4));
							}
							*/							
				
				.products .item .product.p1 {
					padding-bottom: 3px;
				}
				
				.products .item .product.p2 {
					padding-bottom: 8px;
				}
					
				.products .item .product.p3 {
					padding-bottom: 10px;
				}
	
	.products p {
		max-width: 1200px;
		color: #ffffff;
		font-size: 30px;
		line-height: 48px;
		text-align: center;
		letter-spacing: -0.01em;
		padding: 45px 0 70px 0;
		margin: 0 auto;
	}



/*	Years
-------------------------------------------*/

	.years {
		display: flex;
	}
	
		.years .content {
			width: 50%;			
			display: flex;
			align-items: center;
			justify-content: center;
			padding: 80px 3vw;			
			box-sizing: border-box;
			background: #ffffff url('../img/years-bg.jpg') no-repeat left center / cover;
		}
		
			.years .content div {
				max-width: 690px;
			}
		
			.years .content h2 {
				color: #004898;
				font-size: 80px;
				font-weight: bold;
				line-height: 80px;
				letter-spacing: -0.01em;
			}
			
			.years .content p {
				color: #000000;
				font-size: 30px;
				line-height: 48px;
				letter-spacing: -0.01em;
			}
		
		.years .items {
			width: 50%;			
		}
		
			.years .swiper {
				height: 100%;
				position: relative;
			}
		
			.years .swiper-slide {
				width: 460px;
				height: auto;
				background: #004898;
			}
			
				.years .swiper-slide h3 {
					display: flex;
					height: 240px;
					font-size: 72px;
					line-height: 72px;
					align-items: center;
					justify-content: center;
					text-align: center;
					position: relative;
				}
				
					.years .color-3 + .color-1 h3:before {
						content: "";
						width: 0;
						height: 0;
						top: 50%;
						left: 0px;
						margin-top: -45px;
						border-style: solid;
						border-width: 45px 0 45px 45px;
						border-color: transparent transparent transparent #008b98;
						position: absolute;
					}
				
				.years .swiper-slide .img {
					padding-bottom: 78%;
					background: #ccc;
					background-size: cover;
					background-repeat: no-repeat;
					background-position: top center;
				}
				
				.years .swiper-slide .text {
					font-size: 20px;
					line-height: 36px;
					letter-spacing: -0.01em;
					padding: 48px 35px 95px 35px;
				}								
												
			.years .swiper-slide.color-2 {
				background: #0868b1;
			}
			
				.years .swiper-slide.color-2 h3:before {
					content: "";
					width: 0;
					height: 0;
					top: 50%;
					left: 0px;
					margin-top: -45px;
					border-style: solid;
					border-width: 45px 0 45px 45px;
					border-color: transparent transparent transparent #004798;
					position: absolute;
				}
			
			.years .swiper-slide.color-3 {
				background: #008b98;
			}
			
				.years .swiper-slide.color-3 h3:before {
					content: "";
					width: 0;
					height: 0;
					top: 50%;
					left: 0px;
					margin-top: -45px;
					border-style: solid;
					border-width: 45px 0 45px 45px;
					border-color: transparent transparent transparent #0868b1;
					position: absolute;
				}
				
			.years .swiper-arrow {
				top: 386px;
				right: 20px;
				z-index: 2;
				position: absolute;
				cursor: pointer;
				transition: all ease 0.4s;
			}
			
				.years .swiper-arrow:after {
					content: "";
					top: 50%;
					left: 50%;
					z-index: -1;
					position: absolute;
					box-shadow: 0px 0px 60px 50px rgba(0, 0, 0, 0.6);
				}
			
				.years .swiper-prev {
					left: 20px;
					right: auto;
				}
				
					.years .swiper-prev svg {
						transform: scale(-1, 1);
					}
					
				.years .swiper-button-disabled {
					opacity: 0;
				}
	


/*	Map
-------------------------------------------*/
	
	.map {
		display: flex;
		background: #1598d7;
		min-height: calc(100vh - 75px);
	}
	
		.map .search {
			width: 50%;
			display: flex;
			align-items: center;
			flex-direction: column;
			justify-content: space-between;
			padding: 150px 30px 0 30px;
			box-sizing: border-box;
		}
		
			.map .search h2 {
				font-size: 80px;
				line-height: 80px;
				margin-bottom: 50px;
			}
			
			.map .search form {
				max-width: 490px;
				display: flex;				
				border-bottom: 1px solid #fff;
			}
			
				.map .search form input {
					width: 100%;
					height: auto;
					color: #ffffff;
					font-family: 'Rockwell', sans-serif;
					font-size: 24px;
					line-height: 30px;
					text-overflow: ellipsis;
					border: 0px;										
					overflow: hidden;
					padding-bottom: 12px;
					background: transparent url('../img/icon-pin.svg') no-repeat top left;
					box-sizing: border-box;
					padding-left: 35px;
				}
				
					.map .search form input::placeholder {
						opacity: 0.5;
						color: #ffffff;
					}				
				
				.map .search form button {
					background: none;
					border: none;
				}
				
			.map .search img {
				margin-top: 65px;
			}
	
		.map .gmap {
			width: 50%;			
			z-index: 5;
			background: #bbb;
			position: relative;
		}
		
	
	/*		
	 *	Map bubble	
	 */				
	.popup-bubble {		
		/* Position the bubble centred-above its parent. */
		position: absolute;
		top: 3px;
		left: 0;
		transform: translate(35px, -100%);		
		/* Style the bubble. */		
		width: 220px;
		height: 170px;
		padding: 20px;		
		display: flex;
		align-items: center;		
		z-index: 2;
		color: #000000;
		font-family: 'Rockwell';
		font-size: 14px;
		font-weight: 400;
		line-height: 21px;
		letter-spacing: -0.025em;
		background: #ffffff;
		border-radius: 16px;
		overflow-y: auto;
		box-shadow: 0px 3px 11px 0px rgba(0, 0, 0, 0.22);	
		box-sizing: border-box;
	}
	
		.popup-bubble h3 {
			color: #004c9c;
			font-size: 18px;
			line-height: 24px;
			margin-bottom: 6px;
		}
		
		.popup-bubble a {
			color: inherit;
			text-decoration: none;
		}
		
		.popup-bubble .phone {
			display: inline-block;
			padding-left: 20px;
			background: url('../img/icon-phone.svg') no-repeat 0px center / 13px auto;
		}
		
		.popup-bubble .mail {
			display: inline-block;
			padding-left: 20px;
			background: url('../img/icon-envelope.svg') no-repeat 0px center / 13px auto;
		}
		
		.popup-bubble .web {
			display: inline-block;
			padding-left: 20px;
			background: url('../img/icon-link.svg') no-repeat 0px center / auto 13px;
		}
	
	/* The parent of the bubble. A zero-height div at the top of the tip. */
	.popup-bubble-anchor {
		position: absolute;
		width: 100%;
		bottom: 8px;
		left: 0;
	}
				
	.popup-container {
		cursor: auto;
		height: 0;
		position: absolute;
		width: 220px;
	}

		
		
		
/*	Contact
-------------------------------------------*/
	
	.contact {
		padding-top: 220px;
		padding-bottom: 230px;
		background: #004c9c url('../img/contact-bg.jpg') no-repeat top center / cover;
	}
	
		.contact .top {
			display: flex;
			justify-content: space-between;
		}
		
			.contact .top .content {
				width: calc(50% - 55px);
				max-width: 615px;
			}
			
				.contact .top .content h3 {
					font-size: 80px;
					line-height: 80px;
					letter-spacing: -0.01em;
					margin-top: -15px;
					margin-bottom: 40px;
				}
				
				.contact .top .content p {
					font-size: 24px;
					line-height: 30px;
					letter-spacing: -0.01em;
				}
				
				.contact .top .content a {
					display: inline-block;
					color: #ffffff;
					font-size: 30px;
					line-height: 48px;
					letter-spacing: -0.01em;
					text-decoration: none;
					padding-left: 45px;	
					margin-top: 65px;			
					background: url('../img/icon-letter.png') no-repeat left 15px / 31px auto;
				}
								
			.contact .top .form {
				width: calc(50% - 55px);
			}
			
				.contact .gform_fields {
					display: flex;
					flex-wrap: wrap;
					justify-content: space-between;
					list-style: none;
				}
				
					.contact .gfield {
						width: 100%;
						margin-bottom: 36px;
					}
					
						.contact .gfield-left,
						.contact .gfield-right {
							width: calc(50% - 18px);
						}
						
						.contact .gfield_label {
							display: none;
						}
						
						.contact .gfield input,
						.contact .gfield textarea {
							display: block;
							width: 100%;
							color: #ffffff;
							font-family: 'Rockwell';
							font-size: 24px;
							line-height: 28px;
							letter-spacing: -0.01em;
							background: #1598d7;
							border-radius: 10px;
							border: 0px;
							padding: 16px 20px;
							box-sizing: border-box;
						}
						
						.contact .gfield textarea {
							height: 144px;
							resize: none;
						}
						
						.contact .gfield input::placeholder,
						.contact .gfield textarea::placeholder {
							opacity: 0.5;
							color: #ffffff;
						}
						
				.contact .gform_validation_container,
				.contact .validation_error,
				.contact .gform_ajax_spinner {
					display: none;
				}
				
				.contact .validation_message {
					font-size: 14px;
					font-weight: bold;
					line-height: 18px;
					padding: 10px 20px;
					background: #dc1451;
					border-radius: 10px;
					margin-top: 3px;
				}
				
				.contact .gform_confirmation_wrapper {
					display: flex;
					flex-direction: column;
					justify-content: center;
					align-items: center;
					font-size: 20px;
					line-height: 30px;
					text-align: center;					
					height: 100%;
					padding: 20px 15px;
					border-radius: 10px;
					border: 2px solid #fff;
					box-sizing: border-box;
				}
				
					.contact .gform_confirmation_wrapper h3 {
						font-size: 28px;
						font-weight: bold;
						line-height: 36px;
						margin-bottom: 5px;
					}
					
				.contact .gform_button {
					display: inline-block;
					width: auto;
					height: 70px;
					color: #004c9c;
					font-family: 'Rockwell';
					font-size: 24px;
					font-weight: bold;
					line-height: 24px;
					border: 0px;
					border-radius: 35px;
					background: #ffffff;
					padding: 0 45px;
					cursor: pointer;
				}
				
		.contact .instagram {
			margin-top: 110px;
		}
		
			.contact .instagram h3 {
				font-size: 48px;
				font-weight: 400;
				line-height: 48px;
				margin-bottom: 40px;
			}
			
				.contact .instagram h3 a {
					height: 58px;
					display: flex;
					color: #ffffff;
					text-decoration: none;
					align-items: center;
					padding-left: 75px;
					padding-bottom: 2px;
					background: url('../img/icon-instagram-w.png') no-repeat left 0px / contain;
					box-sizing: border-box;
				}
				
			.contact .instagram .swiper-slide a {
				display: block;
				width: 100%;
				padding-bottom: 100%;
				background-color: #eee;
				background-size: cover;
				background-repeat: no-repeat;
				background-position: center center;
			}
	


/*	Footer
-------------------------------------------*/

	footer {
		position: relative;
	}
	
		footer .top {
			height: 110px;
			display: flex;
			align-items: center;
			justify-content: space-between;
			background: #ffffff;
			padding: 0 50px;
		}
		
			footer .top .logo {
			}
			
				footer .top .logo img {
					display: block;
					top: -5px;
					width: 292px;
					height: 40px;	
					position: relative;
				}
				
				footer .top .logo img.mobile {
					display: none;
				}
			
			footer .top h4 {
				color: #004d9c;
				font-size: 30px;
				line-height: 30px;
				letter-spacing: -0.025em;
				padding-bottom: 2px;			
			}
			
			footer .top .socials {
				display: flex;
				align-items: center;
			}
			
				footer .top .socials span {
					color: #000000;
					font-size: 18px;
					font-weight: bold;
					line-height: 22px;
					letter-spacing: -0.025em;
					margin-right: 25px;
				}
				
				footer .top .socials ul {
					display: flex;
					align-items: center;
					list-style: none;
				}
				
					footer .top .socials ul li + li {
						margin-left: 28px;
					}
					
					footer .top .socials ul li svg,
					footer .top .socials ul li img {
						display: block;
						transition: all ease 0.3s;
					}
					
						footer .top .socials ul li a:hover svg {
							fill: #004d9c;
						}
			
		footer .bottom {
			height: 50px;
			display: flex;
			align-items: center;
			justify-content: space-between;
			color: #000000;
			font-size: 13px;
			line-height: 15px;
			background: #e6e6e6;
			padding: 0 50px;
		}
		
			footer .bottom ul {
				display: flex;
				list-style: none;
			}
			
				footer .bottom ul li {
					margin-left: 38px;
				}
				
					footer .bottom ul li a:hover {
						color: #004d9c;
					}
		
			footer .bottom a {
				color: #000000;
				text-decoration: none;
			}



/*	Page
-------------------------------------------*/	
	
	.page-header {
		margin-top: 109px;
		background: #1598d7;
	}
	
		.page-header .container,
		.page-content .container {
			width: auto;
			max-width: 950px;
			padding: 0 30px;
		}
		
		.page-header h1 {
			color: #ffffff;
			font-size: 80px;
			line-height: 80px;
			padding: 30px 0 30px 0;
		}

	.page-content {
		padding-top: 55px;
		padding-bottom: 120px;
		background: #ffffff;
		box-shadow: inset 0px 0px 20px rgba(0, 0, 0, 0.05);
	}
	
		.general-content {
			color: #000;
			font-size: 18px;
			line-height: 30px;
			letter-spacing: -0.01em;
		}
		
			.general-content > *:first-child {
				padding-top: 0px !important;
				margin-top: 0px !important;
			}
			
			.general-content h3 {
				font-size: 24px;
				line-height: 30px;
				letter-spacing: -0.01em;
				padding-top: 40px;
			}
			
			.general-content p {
				padding-top: 30px;
			}
			
				.general-content h3 + p {
					padding-top: 10px;	
				}
		
		


/*	Responsive
-------------------------------------------*/

@media (max-width: 1600px)
{
	.products .item .product .tooltip { width: 300px; margin-left: -150px; }
}

@media (max-width: 1340px)
{
	.promoter .content { max-width: 500px; }
}

@media (max-width: 1280px)
{	
	.container { width: 100%; padding: 0 35px; box-sizing: border-box; }
	
	.intro .confirmation p { font-size: 110px; line-height: 110px; }
	
	header .container { padding-left: 30px; padding-right: 30px; }
	header nav ul li + li { margin-left: 28px; }		
	header nav ul li:last-child { margin-left: 20px; }
	header nav ul li a { font-size: 18px; }
	
	header.tiny .container { padding: 21px 30px 23px 30px; }
	
	/*.promoter video { transform: none; width: auto; height: 900px; min-width: 0px; min-height: 0px; left: -160px; top: 0px; }	*/
	.promoter .content h2 { font-size: 70px; line-height: 70px; margin-bottom: 30px; }
	.promoter .content p { font-size: 26px; line-height: 32px; max-width: 400px; }
	.promoter .button { margin-top: 40px; }
	.promoter .button a { font-size: 20px; height: 60px; width: auto; display: inline-flex; padding-right: 25px; }
	/*.promoter-2 video { left: -100px; }*/
	
	.products .item { width: calc(50% - 25px); }
	.products .item .product img { width: 80%; margin: 0 auto; }
	.products .item .product .tooltip { width: 280px; margin-left: -140px; padding: 25px 20px; }
	.products .item .product .tooltip svg { width: 50px; height: 50px; }
	.products p { font-size: 25px; line-height: 40px; }
	
	.years .content h2 { font-size: 54px; line-height: 60px; }
	.years .content p { font-size: 25px; line-height: 40px; }
	.years .swiper-slide { width: 420px; }
	.years .swiper-slide h3 { height: 160px; font-size: 60px; }
	.years .swiper-arrow { top: 290px; }
		
	.map .search { padding-top: 60px; }
	.map .search h2 { font-size: 65px; }	
	
	.contact { padding-top: 100px; padding-bottom: 150px; }
	.contact .top .content h3 { font-size: 70px; }
}

@media (max-width: 1023px)
{
	.intro { background-image: url('../img/intro-bg-mobile.jpg'); }
	
	header nav { opacity: 0; transition: all ease 0.4s; transform: translate3d(0, 25px, 0); visibility: hidden; position: fixed; top: 72px; left: 0px; right: 0px; bottom: 0px; background: url('../img/contact-bg.jpg') no-repeat top center / cover; display: flex; align-items: center; justify-content: center; }
	header nav ul { flex-direction: column; }
	header nav ul li + li { margin-left: 0px !important; padding-top: 25px; }
	header nav ul li { text-align: center; }
	header nav ul li a { font-size: 40px; color: #ffffff !important; }
	header nav ul li a svg { display: block; margin: 0 auto; fill: #ffffff !important; width: auto; height: 36px; }
	header .menu-trigger { display: flex; }
	
	.opened-nav header nav { opacity: 1; visibility: visible; transform: translate3d(0, 0px, 0); }
	
	.hero .text .t1 p { font-size: 35px; line-height: 45px; padding-left: 20px; padding-right: 20px; }
	.hero .text .t1 .p2 { font-size: 70px; line-height: 70px; padding: 80px 0; }
	
	/*.promoter video { height: 700px; left: -90px; } */
	.promoter .content { padding-right: 35px; }	
	.promoter .content p { font-size: 24px; }
	.promoter .button { margin-top: 40px; }
	.promoter .button a { font-size: 18px; height: 60px; width: auto; display: inline-flex; padding-right: 25px; }
	.promoter-2 .content { padding-right: 0px; }
	/*.promoter-2 video { left: -40px; }
	.promoter-3 video { left: -70px; }*/
	
	.products { padding-top: 75px; }
	.products h2 { font-size: 75px; }
	.products .items { display: block; }
	.products .item { width: 100%; max-width: 100%; flex-direction: column; }
	.products .item .product { width: 100%; }
	.products .item .product .img { max-width: 170px; margin: 0 auto; }
	.products .item .product .img:after { opacity: 0.7; bottom: -40px; }
	.products .item .product .tooltip { opacity: 1; transform: none; background: none; padding-bottom: 35px; position: relative; left: auto; top: auto; bottom: auto; margin: 0 auto; box-shadow: none; width: 100%; max-width: 400px; text-align: center; color: #ffffff; font-size: 18px; line-height: 24px; }
	.products .item .product .tooltip svg { display: none; }
	.products .item:first-child .product:nth-child(1) { padding-bottom: 40px; }
	.products .item:first-child .product:nth-child(1) .tooltip { display: none; }
	.products .item:nth-child(2) .product:first-child .tooltip { display: none; }
	.products .item:nth-child(2) .product:first-child .img { max-width: 140px; }
	.products .item:nth-child(2) .product:first-child { padding-bottom: 40px; }
	
	.years .content h2 { font-size: 52px; }
	.years .content p { font-size: 24px; line-height: 36px; }
	.years .swiper-slide { width: 310px; }
	.years .swiper-slide h3 { font-size: 50px; height: 140px; }
	.years .swiper-slide .text { padding: 30px 25px 45px 25px; font-size: 18px; line-height: 30px; } 
	.years .swiper-arrow { top: 232px; }
	
	.map { min-height: 630px; }
	.map .search h2 { font-size: 55px; line-height: 65px; }
	
	.contact { padding-top: 65px; padding-bottom: 110px; }
	.contact .top { display: block; }
	.contact .top .content { width: 100%; max-width: 100%; margin-bottom: 50px; }
	.contact .top .content h3 { font-size: 60px; line-height: 65px; }
	.contact .top .content p { font-size: 23px; }
	.contact .top .content a { margin-top: 35px; font-size: 25px; }
	.contact .top .form { width: 100%; }
	.contact .gfield input, .contact .gfield textarea { font-size: 22px; }
	.contact .gform_button { font-size: 22px; }
	
	.contact .instagram { margin-right: -35px; margin-top: 90px; }
	.contact .instagram h3 { font-size: 42px; }
	.contact .instagram h3 a { height: 50px; padding-bottom: 5px; }
	.contact .instagram .swiper-slide { width: 230px; }
	
	footer .top { height: auto; display: block; }
	footer .top h4 { display: none; }
	footer .top .logo { padding-top: 0px; margin-top: -50px; width: 100%; position: absolute; left: 0px; right: 0px; }
	footer .top .logo img.desktop { display: none; }
	footer .top .logo img.mobile { display: block; margin: 0 auto; width: 100px; height: 100px; }
	footer .top .socials { flex-direction: column; justify-content: center; margin-right: 0px; padding: 70px 0 25px 0; }
	footer .top .socials span { margin-right: 0px; margin-bottom: 12px; }
	footer .bottom { height: auto; padding-right: 0px; flex-direction: column; justify-content: center; padding: 18px 0; }
	footer .bottom p { margin-bottom: 10px; }
	footer .bottom ul li { margin-left: 0px; }
	footer .bottom ul li + li { margin-left: 20px; }		
}

@media (max-width: 767px)
{
	.container { padding-left: 20px; padding-right: 20px; }
	
	header .container { padding: 21px 20px 23px 20px !important; }
	header .logo img { margin-right: 15px; }
	header .logo span { font-size: 25px; }		
	
	.hero { height: calc(100vh - 74px - env(safe-area-inset-bottom)); margin-top: 70px; box-sizing: border-box; }
	.hero video { width: 100%; }
	.hero .text { padding-bottom: env(safe-area-inset-bottom); }
	.hero .text .t1 .p2 { padding: 40px 0; }
	.hero .text .t1 .p3 { padding-bottom: 20px; }
	.hero .text .t1 svg { width: 60px; margin-top: 10px; margin-bottom: 100px; }
	
	.intro { height: calc(100vh - env(safe-area-inset-bottom)); }
	.intro .logo img { margin-right: 0px; width: auto; height: 36px; padding-bottom: 15px; }
	.intro .logo span { display: none; }
	.intro .confirmation { padding-top: 30px; }
	.intro .confirmation p { font-size: 68px; line-height: 68px; }
	.intro .confirmation .buttons { flex-direction: column; justify-content: center; align-items: center; margin-top: 45px; }
	.intro .confirmation .buttons a { height: 60px; font-size: 20px; line-height: 20px; }
	.intro .confirmation .buttons a + a { margin-left: 0px; margin-top: 20px; }
	.intro .bottom { font-size: 12px; line-height: 16px; padding-bottom: 30px; }		
	
	/*.promoter video { height: 450px; left: -100px; }	*/
	.promoter { }
	.promoter .image { width: 100%; height: 100%; position: absolute; z-index: 2; }
	.promoter-1 .image { background-image: url('../img/img-boris-mobile.jpg') !important; }
	.promoter-2 .image { background-image: url('../img/img-moira-mobile.jpg') !important; }
	.promoter-3 .image { background-image: url('../img/img-eric-mobile.jpg') !important; }
	.promoter .container { width: 100%; height: calc(100vh - 74px); z-index: 3; position: relative; align-items: flex-end; }
	.promoter .content { max-width: 100%; padding-right: 0px; width: 100%; text-align: center; padding-left: 0px !important; }
	.promoter .content h2 { font-size: 50px; line-height: 50px; margin-bottom: 20px; }
	.promoter .content p { font-size: 18px; line-height: 25px; }
	.promoter .button { margin-top: 25px; width: auto; }
	.promoter .button a { font-size: 17px; height: 44px; padding-left: 8px; padding-right: 15px; }
	.promoter .button a img { width: 28px; height: 28px; margin-right: 8px; }	
	/*.promoter-2 video { left: -80px; }*/
	
	.products { padding-top: 50px; }
	.products h2 { font-size: 50px; line-height: 50px; }
	.products p { font-size: 22px; line-height: 32px; padding-top: 35px; padding-bottom: 0px; }
	
	.years { display: block; }
	.years .content { width: 100%; padding: 45px 20px; }
	.years .content h2 { font-size: 40px; line-height: 45px; margin-bottom: 35px; }
	.years .content p { font-size: 21px; line-height: 32px; }
	.years .items { width: 100%; }
	.years .swiper-slide h3 { font-size: 40px; height: 125px; }
	.years .swiper-slide .text { padding: 30px 20px 45px 20px; }
	.years .swiper-arrow { top: 210px; }
	
	.map { display: block; min-height: 0px; }
	.map .search { width: 100%; padding: 25px 20px 35px 20px; display: block; position: relative; }
	.map .search h2 { font-size: 45px; line-height: 50px; margin-bottom: 35px; }
	.map .search form { max-width: 220px; }
	.map .search form input { font-size: 19px; line-height: 22px; background-size: auto 22px; padding-left: 26px; padding-bottom: 6px; }
	.map .search form button svg { width: 24px; height: 24px; }
	.map img { width: 190px; height: auto; position: absolute; bottom: 0px; right: -20px; }
	.map .gmap { height: 480px; width: 100%; }
	
	.contact { padding-bottom: 110px; }
	.contact .top .content { margin-bottom: 40px; }
	.contact .top .content h3 { font-size: 45px; line-height: 45px; margin-bottom: 30px; }
	.contact .top .content p { font-size: 21px; }
	.contact .top .content a { font-size: 23px; }
	.contact .gfield { margin-bottom: 15px; }
	.contact .gfield-left, .contact .gfield-right { width: 100%; }
	.contact .gform_button { font-size: 20px; height: 54px; padding: 0 30px; }	
	.contact .instagram { margin-top: 60px; }
	.contact .instagram h3 { font-size: 30px; }
	.contact .instagram h3 a { padding-left: 60px; height: 44px; }
	.contact .instagram .swiper-slide { width: 130px; }
	
	.page-header { margin-top: 74px; }
	.page-header h1 { font-size: 45px; line-height: 45px; }
	.page-header .container, .page-content .container { padding-left: 20px; padding-right: 20px; }
	.page-content { padding-top: 35px; padding-bottom: 100px; }
	.general-content { font-size: 17px; line-height: 28px; }
	
	.contact .gform_confirmation_wrapper { font-size: 20px; }
}


/*
 *	Intro
 */

@media (max-width: 1440px) {
	.hero .desktop { right: -200px; }
}

@media (max-width: 1440px) and (min-height: 900px) {
	.hero .desktop { right: -280px; }	
}

@media (max-width: 1440px) and (min-height: 1000px) {
	.hero .desktop { right: -320px; }	
}

@media (max-width: 1440px) and (min-height: 1100px) {
	.hero .desktop { right: -380px; }	
}

@media (max-width: 1280px) {
	.hero .text { font-size: 100px; line-height: 100px; }
}

@media (max-width: 1023px) and (min-width: 768px)
{
	.hero { height: auto; max-height: none; }
	.hero .desktop { display: none; }
	.hero .mobile { display: block; width: 100%; height: auto; position: relative; }
	.hero .t2 { justify-content: center; align-items: flex-start !important; text-align: center; padding-top: 140px; }
}

@media (max-width: 767px)
{
	.hero .text { font-size: 50px; line-height: 50px; }
	.hero .t2 { padding-top: 140px; }
	.hero .desktop { display: none; }
	.hero .mobile { display: block; }
	.hero .t2 { justify-content: center; align-items: flex-start !important; text-align: center; padding-top: 100px; }
}

