body {
	margin: 0;
	padding: 0;
	font-family: Lucida Sans Unicode, Lucida Grande, Helvetica
}

@font-face {
	font-family: klmicons;
	src: url("../fonts/klmicons.woff")
}

@font-face {
	font-family: Noa;
	src: url("../fonts/NoaLTStd-Light.woff2.html") format("woff2"), url("../fonts/NoaLTStd-Light.woff") format("woff");
	font-weight: 200
}

@font-face {
	font-family: Noa;
	src: url("../fonts/NoaLTStd-Bold.woff2.html") format("woff2"), url("../fonts/NoaLTStd-Bold.woff") format("woff");
	font-weight: 700
}

a {
	color: inherit
}

h1, h2 {
	font-size: 2.1875rem;
	line-height: 1.2;
	color: #fff;
	font-weight: 200;
	margin: 0 0 1rem;
	font-family: 'Nunito Sans', Lucida Grande, Lucida Sans Unicode, Helvetica Neue, Helvetica, verdana, arial, sans-serif;
	-webkit-font-smoothing: antialiased;
	text-rendering: optimizeLegibility
}

@media screen and (max-width:767px) {
	h1, h2 {
		font-size: 3rem
	}
}

p {
	font-size: 1.5625rem;
	color: #fff;
	line-height: 1.4;
	margin: 0 0 1.1875rem;
	font-family: 'Nunito Sans', Lucida Grande, Lucida Sans Unicode, Helvetica Neue, Helvetica, verdana, arial, sans-serif;
	-webkit-font-smoothing: antialiased;
	text-rendering: optimizeLegibility
}

@media screen and (max-width:767px) {
	p {
		font-size: 2.25rem
	}
}

p:last-child {
	margin-bottom: 0
}

a {
	text-decoration: none!important
}

body {
	background-color: #11b5e9;
	width: 100%;
	overflow-x: hidden;
	box-sizing: border-box;
	max-width: 100%
}

body.preloading {
	overflow: hidden
}

.container {
	margin: auto;
	width: 100%;
	max-width: 90rem;
	padding: 0 5rem;
	box-sizing: border-box
}

@media screen and (max-width:64rem) {
	.container {
		padding: 0 1rem
	}
}

.container>footer, .container>header, .container>section {
	clear: both
}

.scene {
	width: 100%;
	position: relative
}

.scene.-intro {
	height: 59.75rem
}

@media screen and (max-width:767px) {
	.scene.-intro {
		height: 67.875rem
	}
}

.scene.-find-your-way {
	height: 137rem
}

.scene.-coffee {
	height: 143.75rem
}

.scene.-crown-lounge {
	height: 200rem
}

.scene.-escalator {
	height: 191.25rem
}

.scene.-bookstore {
	height: 209.375rem
}

.scene.-gate {
	height: 192.0625rem
}

.scene .textblock {
	display: inline-block;
	position: absolute;
	width: 100%
}

.scene.-intro {
	text-align: center
}

.scene.-intro .textblock {
	position: absolute;
	top: 28.125rem;
	left: 0;
	display: inline-block
}

@media screen and (max-width:767px) {
	.scene.-intro .textblock {
		bottom: 3.625rem;
		padding: 0 20px;
		box-sizing: border-box
	}
}

.scene.-intro .textblock .text, .scene.-intro .textblock .title {
	opacity: 0
}

.scene.-intro .textblock h1 {
	font-size: 2.5rem;
	margin: 0 0 .5625rem
}

.scene.-intro .textblock h1 br {
	display: none
}

@media screen and (max-width:767px) {
	.scene.-intro .textblock h1 br {
		display: block
	}
}

@media screen and (max-width:767px) {
	.scene.-intro .textblock h1 {
		font-size: 3.25rem
	}
}

.scene.-intro .textblock .direction-indicator {
	margin-top: 3.75rem;
	display: inline-block
}

.scene.-find-your-way {
	text-align: center
}

.scene.-find-your-way .textblock {
	position: absolute;
	top: 67.375rem;
	left: 0;
	width: 25rem;
	display: inline-block;
	padding-left: 11.25rem;
	width: 28.125rem
}

@media screen and (max-width:767px) {
	.scene.-find-your-way .textblock {
		top: 62.5rem;
		left: 0
	}
}

.scene.-coffee {
	text-align: center
}

.scene.-coffee .couple {
	position: absolute;
	top: -13.75rem;
	left: 1.625rem;
}

.scene.-coffee .couple>img {
	-webkit-transform: translateZ(0);
	transform: translateZ(0);
	-webkit-backface-visibility: hidden;
	backface-visibility: hidden
}

.scene.-coffee .textblock {
	position: absolute;
	top: 99.125rem;
	left: 0;
	width: 24.875rem;
	padding-left: 15rem;
	display: inline-block
}

@media screen and (max-width:767px) {
	.scene.-coffee .textblock {
		bottom: 438px
	}
}

.scene.-coffee .coffee {
	width: 12.875rem;
	display: block
}

.scene.-coffee .coffee>img {
	width: 100%;
	-webkit-transform: translateZ(0);
	transform: translateZ(0);
	-webkit-backface-visibility: hidden;
	backface-visibility: hidden
}

.scene.-coffee .coffee-cup {
	top: 85.25rem;
	left: 21.1875rem;
	position: absolute
}

.scene.-coffee .coffee-cup:after, .scene.-coffee .coffee-cup:before {
	content: "";
	display: block;
	position: absolute;
	-webkit-transform-origin: center center;
	transform-origin: center center;
	top: -75px;
	left: -75px;
	background-position: 50%;
	background-repeat: no-repeat;
	-webkit-animation-direction: normal;
	animation-direction: normal;
	-webkit-animation-iteration-count: infinite;
	animation-iteration-count: infinite;
	-webkit-animation-duration: 15s;
	animation-duration: 15s;
	-webkit-animation-timing-function: linear;
	animation-timing-function: linear
}

.scene.-coffee .coffee-cup:before {
	width: 384px;
	height: 276px;
	-webkit-animation-duration: 50s;
	animation-duration: 50s;
	-webkit-animation-name: rotateOverlay;
	animation-name: rotateOverlay
}

.scene.-coffee .coffee-cup:after {
	width: 359px;
	height: 421px;
	-webkit-animation-name: rotate;
	animation-name: rotate
}

@-webkit-keyframes rotate {
	0% {
		opacity: 1;
		-webkit-transform: rotate(0deg) scale(.4);
		transform: rotate(0deg) scale(.4)
	}
	50% {
		opacity: 0;
		-webkit-transform: rotate(180deg) scale(1);
		transform: rotate(180deg) scale(1)
	}
	to {
		opacity: 1;
		-webkit-transform: rotate(1turn) scale(.4);
		transform: rotate(1turn) scale(.4)
	}
}

@keyframes rotate {
	0% {
		opacity: 1;
		-webkit-transform: rotate(0deg) scale(.4);
		transform: rotate(0deg) scale(.4)
	}
	50% {
		opacity: 0;
		-webkit-transform: rotate(180deg) scale(1);
		transform: rotate(180deg) scale(1)
	}
	to {
		opacity: 1;
		-webkit-transform: rotate(1turn) scale(.4);
		transform: rotate(1turn) scale(.4)
	}
}

@-webkit-keyframes rotateOverlay {
	0% {
		opacity: 0;
		-webkit-transform: rotate(180deg) scale(1);
		transform: rotate(180deg) scale(1)
	}
	50% {
		opacity: 1;
		-webkit-transform: rotate(0deg) scale(.4);
		transform: rotate(0deg) scale(.4)
	}
	to {
		opacity: 0;
		-webkit-transform: rotate(180deg) scale(1);
		transform: rotate(180deg) scale(1)
	}
}

@keyframes rotateOverlay {
	0% {
		opacity: 0;
		-webkit-transform: rotate(180deg) scale(1);
		transform: rotate(180deg) scale(1)
	}
	50% {
		opacity: 1;
		-webkit-transform: rotate(0deg) scale(.4);
		transform: rotate(0deg) scale(.4)
	}
	to {
		opacity: 0;
		-webkit-transform: rotate(180deg) scale(1);
		transform: rotate(180deg) scale(1)
	}
}

.scene.-crown-lounge .textblock {
	top: 139.125rem;
	width: 23.75rem;
	left: 0;
	padding-left: 16.375rem
}

@media screen and (max-width:767px) {
	.scene.-crown-lounge .textblock {
		bottom: 43.5rem
	}
}

.scene.-crown-lounge .crown-lounge-chair {
	position: absolute;
	top: 106.25rem;
	left: 11.875rem;
	width: 36.0625rem
}

.scene.-crown-lounge .crown-lounge-chair>img {
	width: 100%;
	-webkit-transform: translateZ(0);
	transform: translateZ(0);
	-webkit-backface-visibility: hidden;
	backface-visibility: hidden
}

.scene.-crown-lounge .crown-lounge-table {
	position: absolute;
	top: 132.6875rem;
	left: 38.75rem;
	width: 15.625rem
}

.scene.-crown-lounge .crown-lounge-table>img {
	width: 100%
}

.scene.-escalator {
	text-align: center
}

.scene.-escalator .escalator {
	position: relative;
	display: inline-block;
	width: 33.25rem;
	height: 158.1875rem;
	top: 14.625rem
}

.scene.-escalator .escalator .bottom, .scene.-escalator .escalator .middle, .scene.-escalator .escalator .top {
	width: 100%;
	position: relative;
	z-index: 5;
	background-size: 100% auto
}

.scene.-escalator .escalator .top {
	height: 18.75rem;
	background-image: url("../images/escalator-top.png");
	background-repeat: no-repeat
}

@media screen and (max-width:767px) {
	.scene.-escalator .escalator .top {
		background-image: url("../images/escalator-top-small.png")
	}
}

.scene.-escalator .escalator .middle {
	height: 117.5625rem;
	background-image: url("../images/escalator-middle.png");
	background-repeat: repeat-y
}

@media screen and (max-width:767px) {
	.scene.-escalator .escalator .middle {
		background-image: url("../images/escalator-middle-small.png")
	}
}

.scene.-escalator .escalator .bottom {
	height: 21.875rem;
	background-image: url("../images/escalator-bottom.png");
	background-repeat: no-repeat
}

@media screen and (max-width:767px) {
	.scene.-escalator .escalator .bottom {
		background-image: url("../images/escalator-bottom-small.png")
	}
}

.scene.-escalator .escalator .outer {
	width: 100%;
	height: 100%;
	position: absolute;
	top: 0;
	left: 0
}

.scene.-escalator .escalator .inner {
	position: absolute;
	top: 14rem;
	left: 4rem;
	width: 24.9375rem;
	height: 130rem;
	overflow: hidden
}

.scene.-escalator .escalator .inner .steps {
	bottom: 0;
	background: url("../images/step.jpg") repeat-y;
	position: absolute;
	width: 100%;
	height: 300%
}

@media screen and (max-width:767px) {
	.scene.-escalator .escalator .inner .steps {
		background-image: url("../images/step-small.png");
		background-size: 100% auto
	}
}

.scene.-bookstore .textblock {
	top: 65.4375rem;
	width: 35rem;
	padding-left: 11.25rem
}

@media screen and (max-width:767px) {
	.scene.-bookstore .textblock {
		top: 68.75rem
	}
}

.scene.-bookstore .family {
	position: absolute;
	left: 3.25rem;
	top: 138rem;
	width: 33.75rem
}

.scene.-bookstore .family>img {
	width: 100%;
	-webkit-transform: translateZ(0);
	transform: translateZ(0);
	-webkit-backface-visibility: hidden;
	backface-visibility: hidden
}

.scene.-bookstore .magazine-holder {
	position: absolute;
	width: 17.9375rem;
	height: 21.5625rem;
	top: 42.9375rem;
	left: 20rem;
	-webkit-transform: scale(.8);
	transform: scale(.8)
}

.scene.-bookstore .magazine-holder .magazine {
	position: absolute;
	-webkit-backface-visibility: hidden;
	backface-visibility: hidden
}

.scene.-bookstore .magazine-holder .magazine>img {
	width: 100%;
	-webkit-transform: translateZ(0);
	transform: translateZ(0);
	-webkit-backface-visibility: hidden;
	backface-visibility: hidden
}

.scene.-bookstore .magazine-holder .magazine.-home {
	top: 1.5rem;
	right: 2.25rem;
	width: 15.6875rem
}

.scene.-bookstore .magazine-holder .magazine.-flying-dutchman {
	-webkit-transform: rotate(-13deg);
	transform: rotate(-13deg);
	top: 2.125rem;
	right: 4.0625rem;
	width: 14.6875rem
}

.scene.-bookstore .magazine-holder .magazine.-travel-magazine {
	-webkit-transform: rotate(-6deg);
	transform: rotate(-6deg);
	top: 1.9375rem;
	right: 2.0625rem;
	width: 16.125rem
}

.scene.-bookstore .magazine-holder .magazine.-suited {
	top: 0;
	right: 0;
	z-index: 10;
	width: 15.875rem
}

.scene.-gate .textblock {
	top: 40.9375rem;
	width: 33.75rem;
	left: 0;
	padding-left: 15rem
}

.scene.-gate .couple {
	position: absolute;
	top: 72.5rem;
	left: 28.75rem;
	z-index: 10
}

.scene.-gate .couple>img {
	-webkit-transform: translateZ(0);
	transform: translateZ(0);
	-webkit-backface-visibility: hidden;
	backface-visibility: hidden
}

.scene.-gate .passport-visual {
	position: absolute;
	top: 13.875rem;
	left: 26.25rem;
	width: 21.125rem
}

.scene.-gate .passport-visual>img {
	width: 100%;
	-webkit-transform: translateZ(0);
	transform: translateZ(0);
	-webkit-backface-visibility: hidden;
	backface-visibility: hidden
}

.scene.-gate .endpoint {
	background-color: #006d8c;
	width: 100%;
	position: absolute;
	bottom: 0;
	height: 12.5rem;
	padding: 0 2.6rem;
	left: -2.6rem;
	display: -ms-flexbox;
	display: -webkit-box;
	display: flex;
	-ms-grid-column-align: center;
	justify-items: center
}

.scene.-gate .endpoint .pulse {
	-webkit-transform-origin: 50% 50%;
	transform-origin: 50% 50%;
	position: absolute;
	top: 0;
	left: 50%;
	margin-top: -54px;
	margin-left: -54px;
	width: 6.75rem;
	height: 6.75rem
}

.scene.-apps {
	text-align: center;
	background-color: #006d8c
}

.scene.-apps .textblock {
	margin-top: 5.25rem;
	width: 100%;
	position: relative
}

@media screen and (max-width:767px) {
	.scene.-apps .textblock {
		margin-top: 1rem
	}
}

.scene.-apps .textblock h2 {
	margin-bottom: .75rem
}

@media screen and (max-width:767px) {
	.scene.-apps .textblock h2 {
		font-size: 1.6875rem
	}
}

@media screen and (max-width:767px) {
	.scene.-apps .textblock p {
		font-size: 1.125rem
	}
}

.scene.-apps .iphone {
	margin-top: -5.125rem;
	display: inline-block
}

@media screen and (max-width:767px) {
	.scene.-apps .iphone {
		width: 5rem
	}
}

.scene.-apps .iphone .appstore-link {
	padding: 0 .3125rem;
	box-sizing: border-box;
	overflow: hidden;
	display: block
}

.scene.-apps .iphone .appstore-link img {
	max-width: 100%
}

.scene.-apps .iphone-image {
	margin: 0 0 1rem;
}

@media screen and (max-width:767px) {
	.scene.-apps .iphone-image {}
	.scene.-apps .iphone-image>img {
		-webkit-transform: translateZ(0);
		transform: translateZ(0);
		-webkit-backface-visibility: hidden;
		backface-visibility: hidden
	}
}

@media screen and (max-width:767px) {
	.scene.-apps .iphone {
		margin-top: -2.51125rem
	}
}

.scene.-apps .iphone-image {
	display: block
}

.scene.-apps .app-list {
	width: 100%;
	max-width: 40rem;
	text-align: center;
	padding: 0;
	margin: 5.875rem 0 0;
	list-style-type: none;
	overflow: hidden;
	display: inline-block
}

@media screen and (max-width:767px) {
	.scene.-apps .app-list {
		margin: 3rem 0 0;
		max-width: 23.4375rem
	}
}

.scene.-apps .app-list .app-anchor {
	display: inline-block
}

.scene.-apps .app-list .app-anchor:active .icon, .scene.-apps .app-list .app-anchor:hover .icon {
	background-color: #006d8c
}

.scene.-apps .app-list .icon {
	margin-bottom: .5rem;
	background-color: #006d8c;
	border-radius: 1rem;
	transition: background-color .5s ease
}

@media screen and (max-width:767px) {
	.scene.-apps .app-list .icon {
		width: 3.375rem
	}
}

.scene.-apps .app-list .app-item {
	display: inline-block;
	width: 50%;
	float: left;
	margin-bottom: 5.625rem
}

@media screen and (max-width:767px) {
	.scene.-apps .app-list .app-item {
		margin-bottom: 1.5625rem
	}
}

.scene.-apps .app-list .app-item p {
	text-align: center;
	font-size: 1.25rem;
	margin-bottom: .5rem;
	margin-top: .9375rem
}

@media screen and (max-width:767px) {
	.scene.-apps .app-list .app-item p {
		font-size: 1rem;
		margin-top: .5rem
	}
}

.scene.-plane {
	background-color: #006d8c;
	text-align: center;
	width: 100%;
	overflow: hidden;
	position: relative
}

.scene.-plane .airplane {
	width: 100%;
	height: 66.25rem;
	background: url("../images/airplane.png");
	background-size: 820px auto;
	background-repeat: no-repeat;
	background-position: bottom;
	z-index: 10
}

@media screen and (max-width:767px) {
	.scene.-plane .airplane {
		height: 32.4375rem;
		background-size: 402px auto;
		background-image: url("../images/airplane-small.png")
	}
}

.scene-container.-alt {
	background-color: #006d8c
}

.header-section {
	width: 100%;
	height: 3.75rem;
	display: block;
	background-color: #fff;
	border-bottom: 1px solid transparent;
	box-sizing: border-box;
	position: relative;
	z-index: 99
}

@media screen and (min-width:48rem) {
	.header-section {
		height: 3.75rem
	}
}

@media screen and (min-width:64rem) {
	.header-section {
		height: 5rem
	}
}

.header-section .wrapper {
	margin: 0 auto;
	max-width: 80rem
}

.header-section .logo {
	float: left;
	padding: 1rem
}

.header-section .klm {
	display: block;
	width: 4.5rem;
	height: 2.6875rem;
	float: left
}

@media screen and (max-width:64rem) {
	.header-section .klm {
		width: 3rem;
		height: 1.75rem
	}
}

.header-section .rda, .header-section .skyteam {
	display: none;
	float: left
}

@media screen and (min-width:64rem) {
	.contrast-normal .header-section .rda, .contrast-normal .header-section .skyteam {
		display: block
	}
}

@media screen and (min-width:64rem) {
	.header-section .rda {
		margin: 1.8rem 0 0 .75rem
	}
}

.header-section .skyteam {
	width: 1.9375rem;
	height: 1.9375rem
}

@media screen and (min-width:64rem) {
	.header-section .skyteam {
		margin: 1.1rem 0 0 .75rem
	}
}

.header-section .toolbox {
	max-width: 80%;
	padding: 1rem;
	float: right;
	position: relative
}

.footer-section {
	background-color: #fff;
	overflow: hidden
}

.footer-section>.container {
	display: -ms-flexbox;
	display: -webkit-box;
	display: flex;
	-ms-flex-pack: justify;
	justify-content: space-between;
	-ms-flex-align: center;
	align-items: center;
	-ms-flex-wrap: wrap;
	flex-wrap: wrap
}

.footer-section .copyright, .footer-section .logo-holder, .footer-section .social-links {
	width: 33%
}

@media screen and (max-width:1024px) {
	.footer-section .copyright, .footer-section .logo-holder, .footer-section .social-links {
		display: none
	}
}

.footer-section .social-links {
	-ms-flex-wrap: nowrap;
	flex-wrap: nowrap;
	-ms-flex-pack: end;
	justify-content: flex-end;
	display: -ms-flexbox;
	display: -webkit-box;
	display: flex;
	height: 7.5rem;
	-ms-flex-align: center;
	align-items: center
}

@media screen and (max-width:1024px) {
	.footer-section .social-links {
		width: 100%;
		-ms-flex-pack: center;
		justify-content: center;
		height: 8.75rem;
		-ms-flex-order: -1;
		order: -1;
		display: none
	}
}

.footer-section .logo {
	margin-right: .5rem
}

.footer-section .logo.-klm {
	width: 4.4375rem;
	height: 2.625rem;
	margin-bottom: .5rem
}

.footer-section .logo.-royal-dutch-airlines {
	width: 8rem;
	height: .875rem;
	margin-bottom: .4375rem
}

@media screen and (max-width:667px) {
	.footer-section .logo.-royal-dutch-airlines {
		display: none
	}
}

.footer-section .logo.-skyteam {
	width: 1.875rem;
	height: 1.875rem
}

@media screen and (max-width:667px) {
	.footer-section .logo.-skyteam {
		display: none
	}
}

.footer-section .copyright {
	margin-top: 1rem;
	line-height: 6.5rem;
	color: #006d8c;
	font-size: .75rem;
	text-align: center
}

@media screen and (max-width:1024px) {
	.footer-section .copyright {
		display: block;
		width: 100%;
		text-align: center
	}
}

.footer-section .social-link {
	background-color: #006d8c;
	border: 1px solid transparent;
	width: 2.5rem;
	height: 2.5rem;
	display: block;
	margin-left: 1.25rem;
	display: -ms-flexbox;
	display: -webkit-box;
	display: flex;
	-ms-flex-pack: center;
	justify-content: center;
	-ms-flex-align: center;
	align-items: center;
	text-align: center;
	border-radius: 1.25rem;
	transition: background-color .5s ease
}

.footer-section .social-link:active, .footer-section .social-link:hover {
	background-color: #006d8c
}

.error-section {
	padding: 2.625rem 1.25rem 2.8125rem;
	border-bottom: 1px solid transparent;
	box-sizing: border-box;
	background-color: #fff;
	text-align: center
}

.error-section .title {
	font-size: 1.5rem;
	color: #006d8c
}

.error-section .g-klmicon {
	font-family: klmicons, Lucida Grande, Lucida Sans Unicode, Helvetica Neue, Helvetica, verdana, arial, sans-serif;
	font-weight: 400;
	font-style: normal;
	speak: none
}

@media screen and (min-width:48rem) {
	.error-section {
		text-align: left;
		padding: 4.4375rem 2.375rem 4.625rem;
		background-image: url("../images/404.jpg");
		background-repeat: no-repeat;
		background-size: cover;
		background-position: 100% 0;
		min-height: 36.0625rem
	}
}

.error-section .error-block {
	background-color: #fff;
	padding: 1rem;
	display: inline-block;
	text-align: center
}

.error-section .error-icon {
	font-size: 3rem;
	line-height: 1;
	padding: 0 0 1rem
}

.language-select {
	float: left;
	z-index: 999;
	outline: 0;
	height: 1.875rem;
	box-sizing: border-box;
	border-left: 1px solid #c2dfe7;
	background-color: transparent
}

@media screen and (min-width:64rem) {
	.language-select {
		margin: .625rem 0
	}
}

.language-select .toggle {
	overflow: hidden;
	display: block;
	height: 1.875rem;
	cursor: pointer;
	padding: 0 .5rem;
	color: #006d8c;
	transition: background .2s ease-in-out
}

.contrast-normal .language-select .toggle:hover {
	background-color: #f2f2f2
}

.language-select .flag {
	height: .6875rem;
	float: left;
	margin-top: .59375rem;
	margin-right: .5rem
}

.language-select .country {
	font-size: .6875rem;
	-webkit-text-size-adjust: 100%;
	-ms-text-size-adjust: 100%;
	text-size-adjust: 100%
}

.language-select .arrow-down, .language-select .country {
	float: left;
	line-height: 1.875rem;
	-webkit-font-smoothing: antialiased;
	text-rendering: optimizeLegibility
}

.language-select .arrow-down {
	font-family: klmicons, Lucida Grande, Lucida Sans Unicode, Helvetica Neue, Helvetica, verdana, arial, sans-serif;
	font-size: 1rem;
	margin-left: .5rem
}

.language-select.open .arrow-down {
	-webkit-transform: rotate(180deg);
	transform: rotate(180deg)
}

.style-switcher {
	float: left;
	padding-right: .5rem;
	padding: .3125rem .5rem;
	background-color: #fff;
	display: none
}

@media screen and (min-width:390px) {
	.style-switcher {
		display: block
	}
}

@media screen and (min-width:64rem) {
	.style-switcher {
		padding: .4375rem .5rem;
		margin: .5rem
	}
}

.style-switcher .style {
	padding: 0;
	border: none;
	width: 1.25rem;
	height: 1.25rem;
	border-radius: 50%;
	line-height: 1.25rem;
	font-size: .75rem;
	cursor: pointer;
	margin-right: .5rem;
	border: 1px solid transparent;
	box-sizing: border-box;
	text-align: center;
	display: block;
	float: left
}

.style-switcher .style.active {
	text-decoration: underline
}

.style-switcher .style:last-child {
	margin-right: 0
}

.style-switcher .style:hover {
	text-decoration: none
}

.style-switcher .style.-normal {
	color: #006d8c;
	border-color: #006d8c;
	background: #fff
}

.style-switcher .style.-bow {
	color: #000;
	border-color: #000;
	background: #fff
}

.style-switcher .style.-yob {
	color: #ff0;
	border-color: #ff0;
	background: #000
}

.style-switcher .style.-boy {
	color: #000;
	border-color: #000;
	background: #ff0
}

.skip-message {
	width: 100%;
	height: 3.75rem;
	line-height: 3.75rem;
	position: absolute;
	top: -12.5rem;
	left: 0;
	font-size: 1.25rem;
	text-decoration: underline;
	background: none;
	outline: 0;
	transition: top .3s ease-in, background .3s linear;
	text-align: center;
	color: #fff;
	box-sizing: border-box;
	border: 1px solid transparent
}

@media screen and (min-width:48rem) {
	.skip-message {
		height: 5.625rem;
		line-height: 5.625rem
	}
}

.skip-message:focus {
	top: 0;
	background: rgba(231, 123, 47, .9)
}

.dropdown {
	position: absolute;
	right: 0;
	padding: 0 15px;
	background-color: #fff;
	border: 1px solid #006d8c;
	border-radius: 0;
	box-shadow: 0 0 10px 0 rgba(0, 25, 38, .2);
	display: none;
	z-index: 999
}

.open .dropdown {
	display: block
}

.dropdown .label {
	border: none;
	border-bottom: 1px solid #006d8c
}

.dropdown .item, .dropdown .label {
	font-weight: 700;
	font-size: .75rem;
	margin: 0;
	padding: .625rem .9375rem .625rem 0;
	position: relative;
	line-height: 1.25rem;
	display: block;
	color: #006d8c;
	-webkit-font-smoothing: antialiased;
	text-rendering: optimizeLegibility
}

.dropdown .item {
	border: none;
	background: 0 0;
	text-decoration: none
}

.dropdown .item.current, .dropdown .item:hover {
	color: #ccc
}

.dropdown .arrow-right {
	font-family: klmicons, Lucida Grande, Lucida Sans Unicode, Helvetica Neue, Helvetica, verdana, arial, sans-serif
}

.dropdown:after, .dropdown:before {
	content: "";
	position: absolute;
	bottom: 100%;
	right: 27px;
	top: auto;
	left: auto;
	border: solid transparent;
	height: 0;
	width: 0;
	pointer-events: none
}

.dropdown:before {
	border-bottom-color: #006d8c;
	margin-right: -2px;
	border-width: 8px
}

.dropdown:after {
	border-bottom-color: #fff;
	border-width: 6px
}

.textblock {
	text-align: center;
	color: #fff
}

.textblock p {
	margin: 0
}

.block {
	background-color: #fff;
	padding: 2.625rem 1.25rem 2.8125rem;
	border-bottom: 1px solid transparent
}

@media screen and (min-width:48rem) {
	.block {
		text-align: center;
		padding: 4.4375rem 2.375rem 4.625rem
	}
}

.block .text-wrapper {
	margin: auto;
	max-width: 38.125rem
}

.block .button {
	margin: .4375rem 0 .25rem
}

@media screen and (min-width:48rem) {
	.block .button {
		margin: .625rem 0 .375rem
	}
}

.button {
	background: #e37222;
	display: inline-block;
	line-height: 2.4rem;
	height: 2.5rem;
	white-space: nowrap;
	padding: 0 .9375rem;
	color: #fff;
	-webkit-font-smoothing: antialiased;
	text-rendering: optimizeLegibility;
	border-radius: 2px;
	font-family: 'Nunito Sans', Lucida Grande, Lucida Sans Unicode, Helvetica Neue, Helvetica, verdana, arial, sans-serif;
	font-weight: 700;
	font-size: .8125rem;
	transition: background .2s ease-in-out
}

.button .g-klmicon {
	display: inline-block;
	transition: -webkit-transform .2s ease-in-out;
	transition: transform .2s ease-in-out;
	transition: transform .2s ease-in-out, -webkit-transform .2s ease-in-out
}

.button:focus, .button:hover {
	background: #f19858;
	text-decoration: none
}

.button:focus .g-klmicon, .button:hover .g-klmicon {
	-webkit-transform: translate3d(.25rem, 0, 0);
	transform: translate3d(.25rem, 0, 0)
}

.button.-back:hover .g-klmicon {
	-webkit-transform: translate3d(-.25rem, 0, 0);
	transform: translate3d(-.25rem, 0, 0)
}

.direction-indicator {
	width: 3.75rem;
	height: 3.75rem;
	border-radius: 50%;
	background-color: #fff;
	border: 1px solid transparent
}

@media screen and (max-width:767px) {
	.direction-indicator {
		width: 6.25rem;
		height: 6.25rem
	}
}

.direction-indicator .arrow {
	width: .8125rem;
	height: .8125rem;
	margin: 1.35rem 1.46875rem 1.46875rem;
	border-bottom: 2px solid #003145;
	border-left: 2px solid #003145;
	display: block;
	box-sizing: border-box;
	-webkit-transform: rotate(-45deg);
	transform: rotate(-45deg);
	-webkit-animation-name: bounce;
	animation-name: bounce;
	-webkit-animation-direction: normal;
	animation-direction: normal;
	-webkit-animation-iteration-count: infinite;
	animation-iteration-count: infinite;
	-webkit-animation-duration: 3s;
	animation-duration: 3s;
	-webkit-animation-timing-function: cubic-bezier(.075, .82, .165, 1);
	animation-timing-function: cubic-bezier(.075, .82, .165, 1)
}

@media screen and (max-width:767px) {
	.direction-indicator .arrow {
		width: 1.35416667rem;
		height: 1.35416667rem;
		margin: 2.25rem 2.44791667rem 2.44791667rem;
		border-bottom: 4px solid #003145;
		border-left: 4px solid #003145
	}
}

@-webkit-keyframes bounce {
	0%, 60%, to {
		-webkit-transform: translate(0) rotate(-45deg);
		transform: translate(0) rotate(-45deg)
	}
	30% {
		-webkit-transform: translateY(4px) rotate(-45deg);
		transform: translateY(4px) rotate(-45deg)
	}
}

@keyframes bounce {
	0%, 60%, to {
		-webkit-transform: translate(0) rotate(-45deg);
		transform: translate(0) rotate(-45deg)
	}
	30% {
		-webkit-transform: translateY(4px) rotate(-45deg);
		transform: translateY(4px) rotate(-45deg)
	}
}

.preloader {
	width: 100%;
	height: 100%;
	background-color: #11b5e9;
	position: fixed;
	top: 0;
	left: 0;
	z-index: 70;
	display: -ms-flexbox;
	display: -webkit-box;
	display: flex;
	-ms-flex-align: center;
	align-items: center;
	-ms-flex-pack: center;
	justify-content: center
}

.preloader .spinner {
	width: 153px;
	height: 153px;
	position: relative
}

.preloader .stroke {
	width: 153px;
	height: 153px;
	position: absolute;
	top: 0;
	left: 0;
	border-radius: 50%;
	overflow: hidden;
	-webkit-animation: infinite-spinning 1s infinite;
	animation: infinite-spinning 1s infinite;
	-webkit-animation-timing-function: linear;
	animation-timing-function: linear
}

.preloader .stroke:after, .preloader .stroke:before {
	content: "";
	width: 100%;
	height: 50%;
	position: absolute
}

.preloader .stroke:before {
	top: 0;
	background: linear-gradient(90deg, hsla(0, 0%, 100%, .5) 0, hsla(0, 0%, 100%, .5) 4%, #fff 96%, #fff)
}

.preloader .stroke:after {
	bottom: 0;
	background: linear-gradient(90deg, hsla(0, 0%, 100%, .5) 0, hsla(0, 0%, 100%, .5) 4%, hsla(0, 0%, 100%, 0) 96%, hsla(0, 0%, 100%, 0))
}

.preloader .inner {
	background-color: #11b5e9;
	width: 141px;
	height: 141px;
	position: absolute;
	top: 6px;
	left: 6px;
	border-radius: 50%;
	display: -ms-flexbox;
	display: -webkit-box;
	display: flex;
	-ms-flex-align: center;
	align-items: center;
	-ms-flex-pack: center;
	justify-content: center
}

@-webkit-keyframes infinite-spinning {
	0% {
		-webkit-transform: rotate(0deg);
		transform: rotate(0deg)
	}
	to {
		-webkit-transform: rotate(1turn);
		transform: rotate(1turn)
	}
}

@keyframes infinite-spinning {
	0% {
		-webkit-transform: rotate(0deg);
		transform: rotate(0deg)
	}
	to {
		-webkit-transform: rotate(1turn);
		transform: rotate(1turn)
	}
}

.walking-route {
	padding: 0;
	margin: 0 auto;
	box-sizing: border-box;
	min-height: 100%;
	width: 100%;
	display: -ms-flexbox;
	display: -webkit-box;
	display: flex;
	-ms-flex-pack: center;
	justify-content: center;
	overflow: hidden;
	background-image: linear-gradient(180deg, #11b5e9 0, #1aa6dc);
	position: relative
}

@media screen and (max-width:767px) {
	.walking-route {
		width: 376px
	}
	.walking-route:before {
		background-position: center 632.1px;
		background-size: 970.2px auto
	}
}

.walking-route-inner {
	width: 768px;
	min-width: 768px;
	position: relative
}

#path {
	z-index: 50;
	width: 100%
}

#path, .point {
	top: 0;
	left: 0;
	position: absolute
}

.point {
	width: 30px;
	height: 30px;
	background-color: #fff;
	border-radius: 50%;
	z-index: 10;
	margin-left: -15px;
	margin-top: -15px
}

.person {
	background-size: 1200px 1000px;
	z-index: 60;
	position: absolute;
	-webkit-transform-origin: 50% 0;
	transform-origin: 50% 0
}

.person, .person.sprite-sequence-0 {
	width: 300px;
	height: 500px;
	background-position: 0 0
}

.person.sprite-sequence-1 {
	background-position: -300px 0;
	width: 300px;
	height: 500px
}

.person.sprite-sequence-2 {
	background-position: -600px 0;
	width: 300px;
	height: 500px
}

.person.sprite-sequence-3 {
	background-position: -900px 0;
	width: 300px;
	height: 500px
}

.person.sprite-sequence-4 {
	background-position: 0 -500px;
	width: 300px;
	height: 500px
}

.person.sprite-sequence-5 {
	background-position: -300px -500px;
	width: 300px;
	height: 500px
}

.person.sprite-sequence-6 {
	background-position: -600px -500px;
	width: 300px;
	height: 500px
}

.sprite-sequence-0, .sprite-sequence-1, .sprite-sequence-2, .sprite-sequence-3, .sprite-sequence-4, .sprite-sequence-5, .sprite-sequence-6 {
	background-image: url("../images/sprites/sequence.png");
	background-size: 1200px 1000px
}

@media screen and (max-width:767px) {
	.sprite-sequence-0, .sprite-sequence-1, .sprite-sequence-2, .sprite-sequence-3, .sprite-sequence-4, .sprite-sequence-5, .sprite-sequence-6 {
		background-image: url("../images/sprites/sequence-small.png")
	}
}

.shapes {
	width: 123.75rem;
	height: 100%;
	margin-left: -61.875rem;
	left: 50%
}

.shapes, .shapes>div {
	position: absolute;
	z-index: 0
}

.shapes>div {
	background-repeat: no-repeat
}

.shapes .shape1 {
	width: 45.125rem;
	height: 114.1875rem;
	background-image: url("../images/shapes/shape1.svg");
	left: 0;
	top: 72.75rem
}

.shapes .shape2 {
	width: 51.6875rem;
	height: 80.9375rem;
	background-image: url("../images/shapes/shape2.svg");
	right: 0;
	top: 72.75rem
}

.shapes .shape3 {
	background-image: url("../images/shapes/shape3.svg");
	width: 35.25rem;
	height: 48.3125rem;
	right: 0;
	top: 191.9375rem
}

.shapes .shape4 {
	background-image: url("../images/shapes/shape4.svg");
	width: 123.75rem;
	height: 114.375rem;
	right: 0;
	top: 255.5rem
}

.shapes .shape5 {
	background-image: url("../images/shapes/shape5.svg");
	width: 26.5625rem;
	height: 48.3125rem;
	right: 0;
	top: 359.3125rem
}

.shapes .shape6 {
	background-image: url("../images/shapes/shape6.svg");
	width: 123.75rem;
	height: 86rem;
	right: 0;
	top: 432.1875rem
}

.shapes .shape7 {
	background-image: url("../images/shapes/shape7.svg");
	width: 21.875rem;
	height: 74.75rem;
	right: .125rem;
	top: 443.5rem
}

.shapes .shape8 {
	background-image: url("../images/shapes/shape8.svg");
	width: 123.75rem;
	height: 49.0625rem;
	right: 0;
	top: 609.75rem
}

.shapes .shape9 {
	background-image: url("../images/shapes/shape9.svg");
	width: 123.75rem;
	height: 73.3125rem;
	right: 0;
	top: 752rem
}

.shapes .shape10 {
	background-image: url("../images/shapes/shape10.svg");
	width: 25.75rem;
	height: 66.0625rem;
	left: 0;
	top: 759.25rem
}

.shapes .shape11 {
	background-image: url("../images/shapes/shape11.svg");
	top: 860.1875rem
}

.shapes .shape11, .shapes .shape12 {
	width: 123.75rem;
	height: 100.1875rem;
	left: 0
}

.shapes .shape12 {
	background-image: url("../images/shapes/shape12.svg");
	top: 988.0625rem
}

.pulse .innercircle, .pulse .ripple {
	width: 30px;
	height: 30px;
	border-radius: 50%;
	box-sizing: border-box;
	position: absolute;
	left: 50%;
	top: 50%;
	margin-left: -15px;
	margin-top: -15px
}

.pulse .innercircle {
	background-color: #fff
}

.pulse .ripple {
	border: 1px solid #fff
}

.pieter-textblock1 {
	display: inline-block;
	position: relative;
	width: 100%;
	margin-bottom: 150px;
	margin-left: -550px;
}

.pieter-textblock2 {
	display: inline-block;
	position: relative;
	width: 100%;
	margin-bottom: 150px;
	margin-left: 200px;
}

.pieter-textblock3 {
	display: inline-block;
	position: relative;
	width: 100%;
	margin-bottom: 150px;
	margin-left: -400px;
}

.pieter-textblock4 {
	display: inline-block;
	position: relative;
	width: 100%;
	margin-bottom: 000px;
	margin-left: 300px;
}

.pieter-textblock5 {
	display: inline-block;
	position: relative;
	width: 100%;
	margin-bottom: 300px;
	margin-left: -400px;
}

.pieter-textblock6 {
	display: inline-block;
	position: relative;
	width: 100%;
	margin-bottom: 000px;
	margin-top: 300px;
	margin-left: 390px;
}

.pieter-textblock7 {
	display: inline-block;
	position: relative;
	width: 100%;
	margin-bottom: 200px;
	margin-left: -500px;
}

.pieter-textblock8 {
	display: inline-block;
	position: relative;
	width: 100%;
	margin-top:300px;
	margin-bottom: 350px;
	margin-left: -150px;
}

.pieter-textblock9 {
	display: inline-block;
	position: relative;
	width: 100%;
	margin-bottom: 350px;
	margin-left: -200px;
}

.pieter-textblock10 {
	display: inline-block;
	position: relative;
	width: 100%;
	margin-bottom: 350px;
	margin-left: 100px;
}

.pieter-textblock11 {
	display: inline-block;
	position: relative;
	width: 100%;
	margin-bottom: 600px;
	margin-left: 200px;
}

.pieter-textblock11a {
	display: inline-block;
	position: relative;
	width: 100%;
	margin-bottom: 400px;
	margin-left: 100px;
}

.pieter-textblock11b {
	display: inline-block;
	position: relative;
	width: 100%;
	margin-bottom: 300px;
	margin-left: -700px;
}

.pieter-textblock12 {
	display: inline-block;
	position: relative;
	width: 100%;
	margin-bottom: 100px;
	margin-top: 1500px;
	margin-left: -200px;
}

.pieter-textblock12 img {
	max-height: 800px;
}

.pieter-textblock13 {
	display: inline-block;
	position: relative;
	width: 100%;
	margin-bottom: 300px;
	margin-top: 1400px;
	margin-left: 300px;
}

.pieter-textblock14 {
	display: inline-block;
	position: relative;
	width: 100%;
	margin-bottom: 900px;
	margin-top: 600px;
	margin-left: 00px;
}

.pieter-textblock15 {
	display: inline-block;
	position: relative;
	width: 100%;
	margin-bottom: 100px;
	margin-left: 300px;
}

.pieter-textblock16 {
	display: inline-block;
	position: relative;
	width: 100%;
	margin-bottom: 100px;
	margin-left: 100px;
}

.pieter-textblock17 {
	display: inline-block;
	position: relative;
	width: 100%;
	margin-bottom: 100px;
	margin-left: -200px;
}

.pieter-textblock18 {
	display: inline-block;
	position: relative;
	width: 100%;
	margin-bottom: 100px;
	margin-top: 800px;
	margin-left: -400px;
}

.pieter-textblock19 {
	display: inline-block;
	position: relative;
	width: 100%;
	margin-bottom: 100px;
	margin-top: 300px;
	margin-left: -350px;
}

.pieter2 {
	text-align: center;
}

.footerblock {
	margin-bottom: 50px;
}

.drawing {
	width: 800px;
}

@media only screen and (max-width:767px) {
	.pieter {
		margin-left: 0;
	}
	.pieter2 {
		margin-left: 0px;
	}
	.drawing {
		margin-top: -57px;
		margin-left: -110px;
		width: 300px;
	}
}

img.pieter {
	max-width: 500px;
}

::-webkit-scrollbar {
	width: 0px;
	/* remove scrollbar space */
	background: transparent;
	/* optional: just make scrollbar invisible */
}