:root {
  --grey: #edeee6;
  --black: #111111;
  --blue: #4099da;
  --blue-light: #d9ebf8;
  --white: #ffffff;
}
body {
	font-size: calc(10px + 0.390625vw);
	line-height: 1.5em;
  font-family: FF-OrstedSans-Regular, "Orsted Sans", sans-serif;
  color: var(--black);
}
	a {
	  color: var(--black);
	  cursor: pointer;
	  text-decoration: none;
	}
	  a:hover {
	  	text-decoration: underline;
	  }
	  a:active, 
	  a:focus { 
 			outline: none;
 		}
 		a.blue {
			color: var(--blue);
		}
	b {
		color: var(--black);
		font-weight: bold;
		font-family: FF-OrstedSans-Bold, "Orsted Sans", sans-serif;		
	}
	h1 {
		font-weight: bold;
    font-family: FF-OrstedSans-Bold, "Orsted Sans", sans-serif;
    font-size: 2.4em;
		line-height: 1.2em;
		padding: 0 0 0.5em 0;
	}
		h1 b {
			color: var(--blue);
		}
	h2 {
		font-weight: normal;
		font-family: FF-OrstedSans-Regular, "Orsted Sans", sans-serif;
    font-size: 1.2em;
		line-height: 1.2em;
		padding: 0 0 0.5em 0;
	}
		h2 b {
			font-family: FF-OrstedSans-Regular, "Orsted Sans", sans-serif;
    	font-weight: normal;
			color: var(--blue);
		}
		h2.blue,
		h2.blue a {
			color: var(--blue);
		}
	h3 {
		font-weight: nprmal;
    font-family: FF-OrstedSans-Regular, "Orsted Sans", sans-serif;
    font-size: 1em;
		line-height: 1.1em;
		padding: 0 0 0.5em 0;
	}
		h3 b {
			font-family: FF-OrstedSans-Bold, "Orsted Sans", sans-serif;
    	font-weight: bold;
		}
	ol {
		padding: 1em 0 1em 2em;
  	list-style: number;
	}
	ul {
		padding: 1em 0 1em 2em;
  	list-style: disc;
	}
		li {
			margin-bottom: 0.2em;
		}

	a.button {
		font-weight: bold;
    font-family: FF-OrstedSans-Bold, "Orsted Sans", sans-serif;
    display: inline-block;
		border: 0;
    border-radius: 35px;
    height: 35px;
    line-height: 35px;
    padding: 0 9px;
    vertical-align: middle;
    background: var(--blue-light);
    color: var(--blue);
    overflow: hidden;
    white-space: nowrap;
	}
		a.button:has(svg) {
			width: 35px;
		}
		a.button:not(:has(svg)) {
			padding: 0em 1.2em;
		}
		a.button:hover {
			cursor: pointer;
			text-decoration: none;
			background: var(--blue);
			color: var(--white);
		}
		a.button svg {
			fill: var(--blue);
		}
		a.button:hover svg {
			fill: var(--white);
		}
	a.reverse {
		background: transparent;
	}
			a.reverse:hover,
			a.reverse.selected {
				background: var(--blue-light);
			}
			a.reverse:hover svg {
				fill: var(--blue);
			}
	.content {
		max-width: 1920px;
		width: 90vw;
		padding: 0 5vw;
		margin: auto;
	}
	.faded {
		color: grey;
	}
	header {
		position: fixed;
		width: 100vw;
		z-index: 100;
		top: 0;
	}
		header .main .content {
			display: flex;
			align-items: center;
			justify-content: space-between;
		}
			
		header .main {
			background: #fff;
			border-bottom: 1px solid var(--grey);
		}
			header .main .logo {
				display: flex;
				height: 66px;
				align-items: center;
				padding-top: 3px;
			}
				header .main .logo span {
					color: var(--blue);
					margin-left: 2em;
					white-space: nowrap;
				}
				header .main .logo span b {
					font-family: FF-OrstedSans-Regular, "Orsted Sans", sans-serif;
    			font-weight: normal;
				}
			header .main nav {
				display: flex;
				align-items: center;
			}
				header .main nav>div {
					width: 120px;
					
				}
				header .main nav a:not(.button) {
					font-size: 2em;
					margin-top: 7px;
					display: inline-block;
					white-space: nowrap;
				}
				header .main nav a:hover,
				header .main nav a.selected {
					text-decoration: none;
					font-weight: bold;
					font-family: FF-OrstedSans-Bold, "Orsted Sans", sans-serif;
				}
				header .main nav a span {
					display: inline-block;
					font-size: 0.4em;
					line-height: 1em;
					position: relative;
					top:-1px;
				}
			header .main .cta {
				display: flex;
			}
				a.download {
					margin-left: 1em;
				}
				a.contact {
					margin-left: 2em;
				}
				a.home {
					margin-right: 2em;
				}
				
		header .sub {
			background: var(--blue-light);
			padding: 1.5em 0 2em;
			border-bottom: 1px solid var(--grey);
			display: none;
		}
		header .sub .page {
			display: flex;
		}
			header .sub .page .description {
				font-size: 2.5em;
				display: flex;
				align-items: center;
				min-height: 100px;
			}
				header .sub .page .description span {
					font-size: 0.4em;
					line-height: 1.2em;
					margin-left: 1em;
					text-wrap: nowrap;
				}
			header .sub .navigation {
				
			}
				header .sub .navigation.column
				{
					display: flex;
				}
				header .sub .navigation.column>div {
					width: 45%;
					max-width: 400px;
				}
				header .sub .navigation.column>div:nth-child(1) {
					max-width: 348px;
				}
				header .sub .navigation .area {
					
				}

					header .sub .navigation .area>a {
						display: inline-block;
						padding: 0 1em 0 0;
						font-size: 0.8em;
						line-height: 1em;
						font-family: FF-OrstedSans-Light, "Orsted Sans", sans-serif;
					}
						header .sub .navigation a:hover {
							text-decoration: none;
							font-weight: bold;
	    				font-family: FF-OrstedSans-Bold, "Orsted Sans", sans-serif;
						}
					header .sub .navigation .area>div {
						padding: 1em 0 0.5em 0;
						font-weight: bold;
	    			font-family: FF-OrstedSans-Bold, "Orsted Sans", sans-serif;
					}
						header .sub .navigation .area>div>a:hover {
							color: var(--blue);
						}
	main {
		
	}
		main section {
			display: none;
		}
		main.home section {
			display: block;
		}
			main.home section.explore .content h1 {
				padding-top: 5vw;
			}
			main.home section.explore .page.home {
				height: 120vh !important;
				display: block !important;
			}
			main.home .videos {
				position: absolute;
				top: -60px;
				width: 100%;
				height: 100vh;
			}
				main.home .videos .landing-video {
					position: absolute;
					width: 50%;
					align-items: center;
					justify-content: center;
					display: flex;
					padding-top: 22%;
				}
					main.home .videos .landing-video video,
					main.home .videos .landing-video img {
						top: 0px;
						left: 0px;
						position: absolute;
						z-index: -1;
						width: 100%;
					}
					main.home .videos .landing-video a.button {
						position: relative;
						height: 47px;
						border-radius: 47px;
						color: var(--black);
						z-index: 10;
						display: flex;
						line-height: 47px;
						padding: 8px 8px;
					}
					main.home .videos .landing-video a.button:hover {
						color: white;
					}
						main.home .videos .landing-video a.button b {
							width: 31px;
							height: 31px;
							border-radius: 31px;
							background: var(--blue);
							position: relative;
						}
						main.home .videos .landing-video a.button span {
							height: 31px;
							padding: 0 12px;
							line-height: 31px;
						}
						@keyframes fade-in {
						  from { opacity: 0; }
						  to { opacity: 1; }
						}
						main.home .page.home.show a.button b {
							animation: fade-in 1s linear 1s infinite alternate;
						}
						main.home .page.home a.button:hover b {
							background: white;
						}

		main.home section:not(.explore) {
			display: flex;
			position: relative;
			overflow: hidden;
		}
			main section:not(.explore) .content {
				padding: 6em 5vw;
			}
			main section:not(.explore) .flex {
				display: flex;
			}
			main section:not(.explore) .background {
				background-position: bottom right;
				background-repeat: no-repeat;
			}
			main section:not(.explore) .flex>div {
				width: 50%;
			}
				main section:not(.explore) .flex>div:nth-child(1) {
					padding-right: 4vw;
				}
				main section:not(.explore) .flex>div:nth-child(2) {
					padding-left: 4vw;
				}
				main section:not(.explore) .flex .full-size {
					position: absolute;
					width: 50vw;
					top: 0px;
					right: 0px;
					min-height: 100%;
					background-size: cover;
				}
				main section:not(.explore) .flex video {
					width: 100%;
				}
				main section:not(.explore) .flex .facts {
					
				}
					main section:not(.explore) .flex .facts span>b {
						color: var(--blue);
						font-size: 2.5em;
					}
					main section:not(.explore) .flex .facts p.icon {
						display: flex;
						align-items: center;
					}
					main section:not(.explore) .flex .facts img {
						padding-right: 20px;
					}

			main section.blue-light {
				background: var(--blue-light);
			}
			main section.blue {
				background: var(--blue);
				color: var(--white);
			}
				main section.blue h1 {
					color: var(--white);
				}
			main section .signature {
				display: flex;
				align-items: flex-end;
				gap: 20px;
				padding: 20px 0 30px 0;
			}
				main section .signature>img {
					border-radius: 75px;
				}
		main section .page.show .arrow {
			width: 30px;
			position: absolute;
			left:47%;
			top: 80vh;
			animation: upanddown 1s ease-in-out 5;
		}
			main section .page.show .arrow svg {
				fill: var(--blue);
			}
		@keyframes upanddown {
		  from { top: 75vh; }
		  to { top: 80vh; }
		}