@font-face {
    font-family: ml-light;
    src: url("../fonts/MolnlyckeDin-Light.otf") format("opentype");
}
@font-face {
    font-family: ml-regular;
    src: url("../fonts/MolnlyckeDin-Regular.otf") format("opentype");
}
@font-face {
    font-family: ml-bold;
    src: url("../fonts/MolnlyckeDin-Bold.otf") format("opentype");
}

* {
    -webkit-touch-callout: none;
    /* prevent callout to copy image, etc when tap to hold */
    -webkit-text-size-adjust: none;
    /* prevent webkit from resizing text to fit */
    -webkit-tap-highlight-color: rgba(113, 19, 113, 0.05);
    /* make transparent link selection, adjust opacity 0 to 1.0 */
    -webkit-user-select: none;
    /* prevent copy paste, to allow, change 'none' to 'text' */
    -webkit-overflow-scrolling: touch;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    -webkit-font-smoothing: antialiased;
    margin: 0;
    padding: 0;
}

html,
body {
	font-family: ml-regular, sans-sans-serif;
  position: fixed;
  overflow: hidden;
	height: 100%;
	width: 100%;
	 background: #53565A;
	color: #53565A;
}

h1, h2{
	padding: 0;
	margin: 0;
}

h1, .large{
	color: #14AF28;
	font-family: ml-bold, sans-serif;
	font-weight: normal;
	font-size: 128px;
	line-height: 114px;
	letter-spacing: -0.02em;
}

h2{
	 font-family: ml-bold, sans-serif;
	font-weight: normal;
	font-size: 33px;
	line-height: 36px;
}

.s1{
	font-family: ml-light, sans-serif;
	font-size: 65px;
	line-height: 80px;
	letter-spacing: -0.02em;
	padding-bottom: 28px;
}
.s2{
	font-family: ml-light, sans-serif;
	font-size: 34px;
	line-height: 50px;
	letter-spacing: -0.02em;
	padding-bottom: 28px;
}
.s3{
	font-family: ml-light, sans-serif;
	font-size: 36px;
	line-height: 46px;
	padding-bottom: 30px;
}
.title{
	position: absolute;
	font-family: ml-bold, sans-serif;
	color: #14AF28;
	font-size: 26px;
	line-height: 25px;
	letter-spacing: -0.01em;
	text-transform: uppercase;
	left: 30px;
	top: 33px;
	z-index: 5;
}
.footnote{
	position: absolute;
	bottom: 160px;
	left: 60px;
}
.footnote p{
	font-size: 12.5px;
	line-height: 16px;
	letter-spacing: -0.02em;
}

strong{
	font-family: ml-bold, sans-serif;
	font-weight: normal;
}

.blockquote{
	position: absolute;
}
.blockquote .quote{
	font-family: ml-light, sans-serif;
	font-size: 35px;
	line-height: 42px;
	padding: 10px 60px;
}
.blockquote .quote:before{
	position: absolute;
	content: '‘‘';
	font-family: helvetica neue, helvetica, sans-serif;
	font-weight: normal;
	top: 0;
	left: 0;
	color: #14AF28;
	font-size: 125px;
	line-height: 100px;
}
.blockquote .quote:after{
	position: absolute;
	content: '‘‘';
	font-family: helvetica neue, helvetica, sans-serif;
	font-weight: normal;
	bottom: 0;
	right: 0;
	color: #14AF28;
	font-size: 125px;
	line-height: 270px;
	transform: rotate(180deg);
}
.blockquote .quotee{
	font-size: 24px;
	line-height: 28px;
	padding: 30px 60px 0 60px;
}

.hear{
	color: #3A474A;
	background: url("../img/icon-hear.svg") left center no-repeat;
	background-size: 32px auto;
	padding: 0 0 0 50px;
	font-size: 24px;
	line-height: 28px;
	letter-spacing: -0.02em;
	font-family: ml-bold, sans-serif;
	text-decoration: none;
	display: inline-block;
	margin: 20px 0 0 0;
}

.other-concerns{
	color: #3A474A;
	background: url("../img/icon-other-concerns.svg") left center no-repeat;
	background-size: 44px auto;
	padding: 0 0 0 55px;
	font-size: 24px;
	line-height: 43px;
	letter-spacing: -0.02em;
	font-family: ml-bold, sans-serif;
	text-decoration: none;
	display: inline-block;
	margin: 20px 0 0 0;
}

.read-more{
	color: #3A474A;
	background: url("../img/icon-read-more.svg") left center no-repeat;
	background-size: 40px auto;
	padding: 0 0 0 49px;
	font-size: 24px;
	line-height: 43px;
	letter-spacing: -0.02em;
	font-family: ml-bold, sans-serif;
	text-decoration: none;
	display: inline-block;
	margin: 20px 0 0 0;
}

.skip{
	color: #3A474A;
	background: url("../img/icon-skip.svg") left center no-repeat;
	background-size: 19px auto;
	padding: 0 0 0 30px;
	font-size: 24px;
	line-height: 28px;
	letter-spacing: -0.02em;
	font-family: ml-bold, sans-serif;
	text-decoration: none;
	display: inline-block;
	margin: 20px 0 0 0;
}

.click{
	color: #3A474A;
	background: url("../img/icon-click.svg") center center no-repeat;
	background-size: 100% auto;
	width: 97px;
	height: 97px;
}
.overlay-close{
	display: block;
	position: absolute;
	top: 32px;
	right: 100px;
	background: url("../img/icon-overlay-close.svg") center center no-repeat;
	background-size: 100% auto;
	width: 25px;
	height: 25px;
}
.overlay-close.white{
	background: url("../img/icon-overlay-close-white.svg") center center no-repeat;
	background-size: 100% auto;
}

.img-scale{
	width: 100%;
	height: auto;
}

.tp-container {
	height: 1024px;
	width: 1366px;
    /*width: 1024px;
    height: 768px;
	width: 100%;
    height: 100%;
	min-height: 768px;
	max-height: 1024px;
	min-width: 1024px;
	max-width: 1366px;*/
    position: relative;
    overflow: hidden;
	background: #fff;
}


.abs{
	position: absolute;
}

.temp-bg{
	position: absolute;
	width: 100%;
	height: 100%;
}
.copy-wrap{
	width: 100%;
	height: 100%;
}

sub, sup{
	font-size: 60%;
}


#loading-screen{
	position: absolute;
	width: 100%;
	height: 100%;
	z-index: 1000;
	background: #14AF28;
}
#loading-screen .loading{
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	display: flex;
	align-items: center;
	flex-direction: column;
}
#loading-screen .loading svg{
	margin-bottom: 30px;
}
#loading-screen .logo {
    width: 129px;
	bottom: 38px;
    left: 30px;
}



/* MAIN MENU */

#menu-trigger{
	position: absolute;
	top: 30px;
	right: 30px;
	width: 43px;
	z-index: 100;
}
#menu-trigger path{
    stroke:#14AF28;
}
#menu-trigger.white path{
    stroke:#FFFFFF;
}

#menu{
	display: none;
	position: absolute;
	z-index: 110;
	top: 0;
	left: 0;
	width: 100%;
	height: calc(100% - 142px);
	background: rgba(20,175,40,0.95);
}
#menu .buttons{
	position: absolute;
	top: 30px;
	right: 30px;
	display: flex;
	justify-content: space-between;
	width: 135px;
	height: 26px;
}
#menu-home{
	width: 25px;
	height: 26px;
	background: url("../img/icon-home.svg") 0 0 no-repeat;
	background-size: 100%;
}
#menu-final{
	width: 25px;
	height: 26px;
	background: url("../img/icon-final.svg") 0 0 no-repeat;
	background-size: 100%;
}
#menu-close{
	width: 25px;
	height: 26px;
	background: url("../img/icon-close.svg") 0 0 no-repeat;
	background-size: 100%;
}
.menu-items{
	position: absolute;
	top: 117px;
	left: 86px;
	width: calc(100% - 172px);
}
.menu-items h2{
	position: absolute;
	color: #fff;
	top: 0;
	left: 172px;
}
.chapter-group{
	position: relative;
	margin: 0 0 70px 0;
}
.chapter-group ul{
	list-style: none;
	margin: 0;
	padding: 0;
	display: flex;
	align-items: flex-end;
}
.chapter-group ul li{
	position: relative;
	width: 34px;
	height: 34px;
	border:4px solid #fff;
	border-radius: 34px;
	margin:0 0 22px 50px;
}
.chapter-group ul li.active{
	background-color: #fff;
}
.chapter-group ul li:before{
	content: '';
	display: block;
	width: 50px;
	height: 4px;
	background: #fff;
	position: absolute;
	left: -54px;
	bottom: 12px;
}
.chapter-group ul li:first-child{
	width: 116px;
	height: 116px;
	border:5px solid #fff;
	border-radius: 116px;
	margin: 0;
}
.chapter-group ul li:first-child:before{
	display: none;
}
.chapter-group ul li:nth-child(2):before{
	width: 60px;
	left: -60px;
}
.chapter-group ul li a{
	width:100%;
	height: 100%;
	position: absolute;
}
.chapter-group ul li a.chapter1{
	background: url("../img/icon-menu-chapter1-white.svg") center center no-repeat;
	background-size: 57px auto;
}
.chapter-group ul li.active a.chapter1{
	background: url("../img/icon-menu-chapter1-green.svg") center center no-repeat;
	background-size: 57px auto;
}
.chapter-group ul li a.chapter2{
	background: url("../img/icon-menu-chapter2-white.svg") center center no-repeat;
	background-size: 57px auto;
}
.chapter-group ul li.active a.chapter2{
	background: url("../img/icon-menu-chapter2-green.svg") center center no-repeat;
	background-size: 57px auto;
}
.chapter-group ul li a.chapter3{
	background: url("../img/icon-menu-chapter3-white.svg") center center no-repeat;
	background-size: 57px auto;
}
.chapter-group ul li.active a.chapter3{
	background: url("../img/icon-menu-chapter3-green.svg") center center no-repeat;
	background-size: 57px auto;
}
.chapter-group ul li a.chapter4{
	background: url("../img/icon-menu-chapter4-white.svg") center center no-repeat;
	background-size: 57px auto;
}
.chapter-group ul li.active a.chapter4{
	background: url("../img/icon-menu-chapter4-green.svg") center center no-repeat;
	background-size: 57px auto;
}



/* FOOTER */
#footer-bar{
	position: absolute;
	width: 100%;
	height: 142px;
	background: #14AF28;
	bottom: 0;
	left: 0;
	z-index: 100;
}
#footer-bar.no-bg{
	background: transparent;
}
#footer-bar .inner{
	position: relative;
	height: 100%;
	display: flex;
	padding: 20px 30px;
	align-items: center;
}
#footer-bar .logo{
	width: 129px;
}

#footer-bar a.pip.active .circle, #footer-bar .pip.active{
	fill: #FFF;
}
#footer-bar a.pip.active .inner{
	stroke: #14AF28;
}

#footer-bar a.pip.active .inner.st3{
	stroke:none;
	fill:#14AF28;
}




.arrow-nav{
	width: 70px;
	display: flex;
	 justify-content: space-between;
}
.arrow-nav a{
	width: 17px;
	display: block;
}
#chapters{
	flex: 1;
	margin: 0 30px;
}





main {
    position: relative;
	margin: auto;
}

.screen, .sub-screen{
	position: absolute;
	width: 100%;
	height: 100%;
	background-size: cover;
}
.screen .image img{
	width: 100%;
	height: auto;
}

#screens .screen, #screens .sub-screen{
	display: none;
}
#screens .screen.active, #screens .sub-screen.active{
	display: block;
}

.content-wrap{
	position: relative;
}


/* SCREENS */
.screen1{
	background-image: url("../img/screen1-bg.jpg");
}
.screen1 .copy{
	left: 64px;
	top: 455px;
}
.screen1 .blockquote{
	left: 64px;
	top: 80px;
	color: #fff;
}

.screen2{
	background-image: url("../img/screen2-bg.jpg");
}
.screen2 .copy{
	left: 80px;
	top: 87px;
}
.screen2 .copy h1{
	font-size: 150px;
	line-height: 130px;
	letter-spacing: -0.08em;
	padding: 10px 0 30px 0;
}
.screen2 .copy .s2{
    padding: 95px 0 0 10px;
}

.screen3{
	background-image: url("../img/screen3-bg.jpg");
}
.screen3 .copy{
	left: 50px;
	top: 67px;
}
.screen3 .copy h1{
	font-size: 87px;
	line-height: 90px;
}
.screen3 .blockquote{
	left: 544px;
    top: 62px;
	color: #fff;
}
.screen3 .blockquote .quote{
	font-size: 45px;
	line-height: 60px;
	padding: 10px 94px;
}
.screen3 .blockquote .quote:before, .screen3 .blockquote .quote:after {
    font-size: 200px;
    line-height: 180px;
	letter-spacing: -0.02em;
}
.screen3 .blockquote .quote:before{
	top: -5px;
}
.screen3 .blockquote .quote:after {
	bottom: 60px;
    right: 100px;
}
.screen3 .blockquote .quotee{
	font-size: 24px;
	line-height: 35px;
	padding: 10px 90px 0 96px;
	letter-spacing: -0.025em;
}
.screen3 .blockquote .quotee strong{
	color: #14AF28;
	font-size: 29px;
}
.screen3 .screen3-icon{
	left: 45px;
    top: 660px;
}

.screen4, .screen5, .screen6{
	background-image: url("../img/screen4-bg.png");
}
.screen4 .drop{
	top: 160px;
	left: 760px;
}
.screen4 .copy1, .screen5 .copy1, .screen6 .copy1{
	width: 515px;
	top:260px;
	left: 60px;
}
.screen4 .copy1 h1, .screen5 .copy1 h1, .screen6 .copy1 h1{
	font-size: 141px;
	line-height: 100px;
	letter-spacing: -0.04em;
}
.screen4 .copy1 h2, .screen5 .copy1 h2, .screen6 .copy1 h2{
	font-size: 49px;
	line-height: 60px;
	padding-bottom: 10px;
	color: #14AF28;
}
.screen5 .copy2{
	top: 285px;
	left: 848px;
}
.screen5 .copy2 .s3{
	letter-spacing: -0.01em;
}

.screen6 .copy2{
	top: 195px;
	left: 848px;
}
.screen6 .copy2 .s3, .screen6 .copy3 .s3, .screen7 .copy2 .s3{
	letter-spacing: -0.015em;
}
.screen6 .copy3{
	top: 340px;
	left: 848px;
}

.screen7 .copy1{
	top: 380px;
	left: 60px;
}
.screen7 .copy2{
	top: 520px;
    left: 675px;
}

.screen7, .screen8{
	background-image: url("../img/screen7-bg.png");
}

.screen8 .copy1{
	top: 315px;
	left: 60px;
}
.screen8 .copy2{
	top: 235px;
    left: 675px;
	letter-spacing: -0.04em;
}
.screen8 .copy3{
	top: 580px;
    left: 675px;
	letter-spacing: -0.04em;
}

.screen9{
	background-image: url("../img/screen9-bg.jpg");
}
.screen9 .copy1{
	top: 150px;
	left: 60px;
	letter-spacing: -0.04em;
}
.screen9 .copy1 .s3{
	padding-bottom: 10px;
}
.screen9 .copy1 h1{
	font-size: 73px;
	line-height: 1;
}
.screen9 .copy2 {
    top: 635px;
    left: 60px;
    letter-spacing: -0.03em;
}

.screen10{
	background-image: url("../img/screen10-bg.jpg");
}
.screen10 .copy1{
	left: 60px;
    top: 310px;
    letter-spacing: 0.012em;
}
.screen10 .copy1 span{
	color: #14AF28;
	font-family: ml-bold, sans-serif;
	font-size: 49px;
	line-height: 68px;
}


/* Chapter 2 */

.screen11{
	background-image: url("../img/screen2-bg.jpg");
}
.screen11 .copy1{
	left: 50px;
    top: 70px;
    letter-spacing: 0.012em;
}
.screen11 .copy1 h1{
	font-size: 87px;
	line-height: 90px;
	letter-spacing: -0.02em;
	padding-bottom: 45px;
}
.screen11 .copy1 h2{
	font-size: 40px;
	line-height: 42px;
	letter-spacing: -0.025em;
}
.screen11 .icon{
	left: 45px;
    top: 660px;
}

.screen12, .screen13, .screen14{
	background-image: url("../img/screen4-bg.png");
}

.screen12 .copy1{
	left: 60px;
    top: 260px;
    letter-spacing: 0.012em;
}
.screen12 .copy1 h1{
	font-size: 49px;
	line-height: 56px;
	letter-spacing: -0.02em;
	padding-bottom: 30px;
}
.screen12 .copy2{
	top: 255px;
    left: 765px;
	letter-spacing: -0.03em;
}
.screen12 .copy3{
	top: 90px;
    right: 50px;
	font-size: 20px;
}

.screen13 .copy1{
	left: 60px;
    top: 303px;
    letter-spacing: -0.048em;
}
.screen13 .copy1 h1{
	font-size: 49px;
	line-height: 60px;
	padding-bottom: 5px;
}
.screen13 .copy2{
	top: 170px;
    left: 765px;
	letter-spacing: -0.03em;
}
.screen13 .copy3{
	top: 700px;
    left: 765px;
	letter-spacing: -0.03em;
}

.screen14 .copy1{
	left: 60px;
    top: 303px;
    letter-spacing: -0.048em;
}
.screen14 .copy1 h1{
	font-size: 49px;
	line-height: 60px;
	padding-bottom: 5px;
}
.screen14 .copy2{
	top: 173px;
    left: 765px;
	letter-spacing: -0.03em;
}
.screen14 .copy3{
	top: 90px;
    right: 35px;
	font-size: 20px;
}

.screen15{
	background-image: url("../img/screen15-bg.jpg");
}
.screen15 .copy1, .screen16 .copy1{
	left: 60px;
    top: 180px;
    letter-spacing: 0;
	width: 567px;
}
.screen15 .copy1 .blockquote .quote, .screen16 .copy1 .blockquote .quote {
    font-family: ml-light, sans-serif;
    font-size: 58px;
    line-height: 70px;
    padding: 5px 0 0 82px;
}
.screen15 .copy1 .blockquote .quote:before, .screen16 .copy1 .blockquote .quote:before {
	left: -15px;
    font-size: 200px;
    line-height: 150px;
}
.screen15 .copy1 .blockquote .quote:after, .screen16 .copy1 .blockquote .quote:after {
	right: 120px;
    font-size: 200px;
    line-height: 140px;
}

.screen16{
	background-image: url("../img/screen16-bg.jpg");
}
.screen16 .copy1{
	top: 165px;
}
.screen16 .copy1 .blockquote .quote{
	width: 570px;
}
.screen16 .copy1 .blockquote .quote:after {
	bottom: 100px;
	right: 40px;
}
.screen16 .copy1 .blockquote .quotee {
    font-size: 24px;
    line-height: 35px;
    padding: 35px 0 0 84px;
    letter-spacing: -0.02em;
}
.screen16 .copy1 .blockquote .quotee strong {
	color: #14AF28;
	 font-size: 29px;
}

.screen17{
	background-image: url("../img/screen17-bg.jpg");
}
.screen17 h1{
	font-size: 49px;
	line-height: 60px;
	top: 177px;
	left: 70px;
}
.screen17 .buttons{
	width: calc(100% - 140px);
	left: 70px;
	top: 291px;
	display: flex;
	justify-content: space-between;
}
.screen17 .buttons .button{
	position: relative;
	width: 386px;
	height: 386px;
	background: #fff;
	border-radius: 100%;
}
.screen17 .buttons .button p{
	position: absolute;
	width: 80%;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
    font-family: ml-light, sans-serif;
    font-size: 47px;
    line-height: 56px;
    padding: 10px 30px 0 60px;
}
.screen17 .buttons .button p strong{
	font-family: ml-regular, sans-serif;
}
.screen17 .buttons .button p:before {
    position: absolute;
    content: "‘‘";
    font-family: "helvetica neue", helvetica, sans-serif;
    font-weight: normal;
    top: 0px;
    left: 0px;
    color: rgb(64, 184, 78);
    font-size: 125px;
    line-height: 100px;
}
.screen17 .buttons .button p:after {
    position: absolute;
    content: "‘‘";
    font-family: "helvetica neue", helvetica, sans-serif;
    font-weight: normal;
    bottom: 0px;
    right: 0px;
    color: rgb(64, 184, 78);
    font-size: 125px;
    line-height: 100px;
    transform: rotate(180deg);
}
.screen17 .buttons .button:nth-child(1) p{
	padding: 10px 40px 0 55px;
	width: 85%;
}
.screen17 .buttons .button:nth-child(2) p, .screen17 .buttons .button:nth-child(3) p{
	width: 270px;
	padding: 10px 14px 0 60px;
}
.screen17 .buttons .button .click{
	position: absolute;
	bottom: 0;
	left: 50%;
	transform: translate(-50%, 50%);
}
.screen17 .buttons .button a{
	position: absolute;
	width: 100%;
	height: calc(100% + 50px);
}
.screen17 .skip{
	top: 775px;
    left: 1088px;
}


.screen18, .sub-screen18-1, .sub-screen18-2, .screen19, .sub-screen19-1, .sub-screen20-1, .sub-screen20-2{
	background-image: url("../img/screen18-bg.jpg");
}

.screen18 .copy1, .sub-screen18-1 .copy1, .screen19 .copy1, .sub-screen19-1 .copy1, .screen20 .copy1, .sub-screen20-1 .copy1, .sub-screen20-2 .copy1{
	top:300px;
	left: 60px;
}
.screen18 .copy1 .blockquote .quote, .sub-screen18-1 .copy1 .blockquote .quote, .screen19 .copy1 .blockquote .quote, .sub-screen19-1 .copy1 .blockquote .quote, .screen20 .copy1 .blockquote .quote, .screen20 .copy2 .blockquote .quote, .sub-screen20-1 .copy1 .blockquote .quote, .sub-screen20-2 .copy1 .blockquote .quote{
    font-family: ml-light, sans-serif;
    font-size: 63px;
    line-height: 75px;
	padding: 10px 40px 0 80px;
    width: 460px;
    letter-spacing: -0.015em;
}
.screen18 .copy1 .blockquote .quote strong, .sub-screen18-1 .copy1 .blockquote .quote strong, .screen19 .copy1 .blockquote .quote strong, .sub-screen19-1 .copy1 .blockquote .quote strong, .screen20 .copy1 .blockquote .quote strong, .screen20 .copy2 .blockquote .quote strong, .sub-screen20-1 .copy1 .blockquote .quote strong, .sub-screen20-2 .copy1 .blockquote .quote strong{
	 font-family: ml-regular, sans-serif;
}
.screen18 .copy1 .blockquote .quote:before, .sub-screen18-1 .copy1 .blockquote .quote:before, .screen19 .copy1 .blockquote .quote:before, .sub-screen19-1 .copy1 .blockquote .quote:before, .screen20 .copy1 .blockquote .quote:before, .screen20 .copy2 .blockquote .quote:before, .sub-screen20-1 .copy1 .blockquote .quote:before, .sub-screen20-2 .copy1 .blockquote .quote:before {
	top: 0;
    left: -15px;
    font-size: 200px;
    line-height: 165px;
}
.screen18 .copy1 .blockquote .quote:after, .sub-screen18-1 .copy1 .blockquote .quote:after, .screen19 .copy1 .blockquote .quote:after, .sub-screen19-1 .copy1 .blockquote .quote:after, .screen20 .copy1 .blockquote .quote:after, .screen20 .copy2 .blockquote .quote:after, .sub-screen20-1 .copy1 .blockquote .quote:after, .sub-screen20-2 .copy1 .blockquote .quote:after {
	bottom: -10px;
    right: 17px;
	font-size: 200px;
    line-height: 165px;
}
.screen18 .copy2, .sub-screen18-1 .copy2, .screen19 .copy2, .sub-screen19-1 .copy2{
	top: 205px;
    left: 760px;
	letter-spacing: -0.03em;
}
.screen18 .copy2 .s3, .sub-screen18-1 .copy2 .s3{
	padding-bottom: 37px;
}

.screen18 .footnote, .sub-screen18-1 .footnote, .screen19 .footnote, .sub-screen19-1 .footnote{
	left: 760px;
}
.screen18 .read-more, .sub-screen18-1 .read-more, .sub-screen18-2 .read-more, .screen19 .read-more, .sub-screen19-1 .read-more, .screen20 .read-more, .sub-screen20-1 .read-more, .sub-screen20-2 .read-more{
	top: 715px;
    left: 138px;
}
.screen18 .other-concerns, .sub-screen18-1 .other-concerns, .sub-screen18-2 .other-concerns, .screen19 .other-concerns, .sub-screen19-1 .other-concerns, .screen20 .other-concerns, .sub-screen20-1 .other-concerns, .sub-screen20-2 .other-concerns{
	top: 645px;
    left: 133px;
}
.screen18 .screen18-icon, .sub-screen18-1 .screen18-icon, .screen19 .screen19-icon, .sub-screen19-1 .screen19-icon{
	top: 6px;
	left: -128px;
}

.sub-screen18-2 .copy1, .sub-screen18-3 .copy1, .sub-screen18-4 .copy1, .sub-screen18-5 .copy1{
	top:320px;
	left: 60px;
	letter-spacing: -0.09em;
}
.sub-screen18-2 .copy1 h2, .sub-screen18-3 .copy1 h2, .sub-screen18-4 .copy1 h2, .sub-screen18-5 .copy1 h2{
	font-family: ml-light, sans-serif;
    font-size: 63px;
    line-height: 75px;
}
.sub-screen18-2 .copy1 h2 strong, .sub-screen18-3 .copy1 h2 strong, .sub-screen18-4 .copy1 h2 strong, .sub-screen18-5 .copy1 h2 strong{
	font-family: ml-regular, sans-serif;
}

.sub-screen18-2 .read-more, .sub-screen18-3 .read-more, .sub-screen18-4 .read-more, .sub-screen18-5 .read-more{
	top: 715px;
    left: 67px;
}
.sub-screen18-2 .other-concerns, .sub-screen18-3 .other-concerns, .sub-screen18-4 .other-concerns, .sub-screen18-5 .other-concerns{
	top: 645px;
    left: 60px;
}
.sub-screen18-2 .footnote{
    left: 683px;
}
.sub-screen18-2 .copy2{
	top: 205px;
    left: 685px;
	letter-spacing: -0.034em;
}
.sub-screen18-2 .copy2 .s3{
	padding-bottom: 12px;
}

.sub-screen18-3{
	background-image: url("../img/screen18-3.jpg");
}

.sub-screen18-4{
	background-image: url("../img/screen18-4.jpg");
}

.sub-screen18-5{
	background-image: url("../img/screen18-5.jpg");
}

.screen19 .copy1 .blockquote .quote, .sub-screen19-1 .copy1 .blockquote .quote {
	width: 480px;
}
.screen19 .copy1 .blockquote .quote:after, .sub-screen19-1 .copy1 .blockquote .quote:after {
    bottom: -10px;
    right: 115px;
}
.screen19 .copy2, .sub-screen19-1 .copy2{
	top: 145px;
}
.screen19 .copy2 h1{
	font-size: 90px;
	line-height: 100px;
	padding-bottom: 12px;
}
.screen19 .copy2 .s3{
	padding-bottom: 0;
}
.sub-screen19-1 .copy2{
	top: 160px;
}
.sub-screen19-1 .copy2 .s3{
	padding-bottom: 10px;
}

.screen20{
	background-image: url("../img/screen20-bg.jpg");
}
.screen20 .copy1 .blockquote .quote:after, .sub-screen20-1 .copy1 .blockquote .quote:after, .sub-screen20-2 .copy1 .blockquote .quote:after {
    right: 97px;
}
.screen20 .copy2 {
    top: 90px;
    left: 570px;
    letter-spacing: -0.034em;
}
.screen20 .copy2 .blockquote .quote{
	font-size: 49px;
	line-height: 60px;
	color: #fff;
	width: 560px;
	letter-spacing: 0;
}
.screen20 .copy2 .blockquote .quote:before {
	top: -10px;
}
.screen20 .copy2 .blockquote .quote:after {
	bottom: 65px;
    right: -30px;
}
.screen20 .copy2 .blockquote .quotee {
    font-size: 24px;
    line-height: 28px;
	color: #fff;
    padding: 30px 40px 0 80px;
}
.screen20 .copy2 .blockquote .quotee strong{
	color: #14AF28;
	font-size: 29px;
	line-height: 35px;
}

.sub-screen20-1 .copy2 {
	top: 160px;
    left: 755px;
    letter-spacing: -0.02em;
}
.sub-screen20-1 .copy2 .s3{
	padding-bottom: 16px;
}
.sub-screen20-1 .copy2  h1{
	font-size: 200px;
    line-height: 170px;
    letter-spacing: -0.03em;
    padding-bottom: 5px;
}
.sub-screen20-1 .copy2 .screen20-1-icon{
	top: 5px;
	left: -128px;
}
.sub-screen20-1 .screen20-1-icon-2{
	top: 465px;
    left: 995px;
}
.sub-screen20-1 .footnote {
    left: 760px;
}

.sub-screen20-2 .copy2{
	left: 875px;
    top: 135px;
    letter-spacing: -0.03em;
}
.sub-screen20-2 .copy2 .s3{
	padding-bottom: 15px;
}
.sub-screen20-2 .copy2 .screen20-2-icon{
	top: 5px;
	left: -128px;
}
.sub-screen20-2 .screen20-2-icon-2{
	left: 350px;
    top: 240px;
}

.sub-screen20-3{
	background-image: url("../img/screen17-bg.jpg");
}




/* CHAPTER 3 */

.screen21{
	background-image: url("../img/screen21-bg.jpg");
}
.screen21 .copy1{
    top: 67px;
    left: 50px;
}
.screen21 .copy1 h1{
	font-size: 87px;
	line-height: 90px;
	padding-bottom: 43px;
}
.screen21 .copy1 h2{
	font-size: 39px;
	line-height: 50px;
	letter-spacing: -0.02em;
}
.screen21 .screen21-icon{
	top: 660px;
    left: 45px;
}

.screen22{
	background-image: url("../img/screen22-bg.jpg");
}
.screen22 .copy1{
    top: 290px;
    left: 60px;
}
.screen22 .copy1 h1{
	font-size: 87px;
	line-height: 90px;
	color: #3A474A;
	font-family: ml-regular, sans-serif;
}
.screen22 .copy1 h1 strong{
	color: #14AF28;
}
.screen22  .screen22-icon{
	top: 122px;
	left: 800px;
}

.screen23{
	background-image: url("../img/screen23-bg.png");
}
.screen23 .title{
	color: #fff;
}

.screen24{
	background-image: url("../img/screen24-bg.jpg");
}
.screen24 .copy1{
    top: 195px;
    left: 60px;
}
.screen24 .copy1 .s3{
	padding-bottom: 5px;
	letter-spacing: -0.015em;
}
.screen24 .copy1 h1{
	font-size: 87px;
	line-height: 90px;
	color: #3A474A;
	font-family: ml-regular, sans-serif;
}
.screen24 .copy1 h1 strong{
	color: #14AF28;
}
.screen24 .copy1 .s3 strong{
	font-family: ml-regular, sans-serif;
}

.screen26{
	background-image: url("../img/screen26-bg.jpg");
}
.screen26 .copy1, .screen27 .copy1, .screen28 .copy1{
	top: 112px;
    left: 60px;
}
.screen26 .copy1 .s3, .screen27 .copy1 .s3, .screen28 .copy1 .s3{
	letter-spacing: -0.015em;
}
.screen26 .copy1 .s3 strong, .screen27 .copy1 .s3 strong, .screen28 .copy1 .s3 strong{
	color: #14AF28;
	font-size: 49px;
	line-height: 62px;
	letter-spacing: -0.02em;
}
.screen26 .copy2, .screen27 .copy2, .screen28 .copy2{
	top: 672px;
    left: 60px;
	letter-spacing: -0.035em;
}
   

.screen27{
	background-image: url("../img/screen27-bg.jpg");
}
.screen28{
	background-image: url("../img/screen28-bg.jpg");
}
.screen29{
	background-image: url("../img/screen29-bg.jpg");
}
.screen29 .copy1{
	left: 60px;
    top: 185px;
	width: 567px;
	letter-spacing: -0.015em;
}
.screen29 .copy1 .blockquote .quote, #screen8-overlay .copy1 .blockquote .quote{
    font-family: ml-light, sans-serif;
    font-size: 58px;
    line-height: 70px;
    padding: 10px 0 0 85px;
	letter-spacing: -0.02em;
	
}
.screen29 .copy1 .blockquote .quote:before, #screen8-overlay .copy1 .blockquote .quote:before {
	left: -15px;
    font-size: 200px;
    line-height: 150px;
}
.screen29 .copy1 .blockquote .quote:after, #screen8-overlay .copy1 .blockquote .quote:after {
	right: -40px;
    font-size: 200px;
    line-height: 140px;
    bottom: 90px;
}

.screen29 .copy1 .blockquote .quotee, #screen8-overlay .copy1 .blockquote .quotee {
    font-size: 24px;
    line-height: 35px;
    padding: 18px 0 0 85px;
	letter-spacing: -0.02em;
}
.screen29 .copy1 .blockquote .quotee strong, #screen8-overlay .copy1 .blockquote .quotee strong {
	color: #14AF28;
	 font-size: 29px;
}
.screen29 .hear{
	position: absolute;
	top: 760px;
    left: 96px;
}

.screen30{
	background-image: url("../img/screen30-bg.jpg");
}
.screen30 .video-button-wrap{
	width: 1170px;
	top: 109px;
	left: 80px;
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
}
.screen30 .video-button-wrap .video-button{
	width: 547px;
	margin-bottom: 56px;
}
.screen30 .video-button-wrap .video-button a{
	display: block;
	position: relative;
	padding: 35px 0 0 35px;
}
.screen30 .video-button-wrap .video-button a:after{
	display: block;
	content: '';
	width: 77px;
	height: 77px;
	position: absolute;
	top: 0;
	left: 0;
	z-index: 1;
	background: url("../img/icon-play.svg") 0 0 no-repeat;
	background-size: 100% auto;
	
}


.screen31{
	background-image: url("../img/screen31-bg.jpg");
}
.screen31 .copy1{
	 top: 67px;
    left: 50px;
}
.screen31 .copy1 h1{
	font-size: 87px;
	line-height: 90px;
	padding-bottom: 43px;
}
.screen31 .screen31-icon{
	top: 660px;
    left: 45px;
}


.screen32 .screen32-table{
	position: absolute;
	top: 147px;
	left: 60px;
}


.screen33{
	background-image: url("../img/screen33-bg.jpg");
}
.screen33 .copy1, .screen34 .copy1{
	top: 175px;
	left: 60px;
}
.screen33 .copy1 h1, .screen34 .copy1 h1{
	font-size: 49px;
	line-height: 62px;
	padding-bottom: 20px;
}

.screen33 .copy1 ul, .screen34 .copy1 ul{
	margin: 0;
	padding: 0;
	list-style: none;
}
.screen33 .copy1 ul li, .screen34 .copy1 ul li{
	padding-left: 35px;
	position: relative;
	font-size: 36px;
	line-height: 46px;
	margin-bottom: 15px;
	font-family: ml-light, sans-serif;
	letter-spacing: -0.015em;
}
.screen33 .copy1 ul li:before, .screen34 .copy1 ul li:before{
	font-family: ml-bold, sans-serif;
	content: '•';
	font-size: 40px;
	position: absolute;
	top: 1px;
	left: 1px;
	color: #14AF28;
}


.screen34{
	background-image: url("../img/screen34-bg.jpg");
}
.screen34 .copy1{
	top: 175px;
	left: 60px;
}
.screen34 .copy1 h1{
	font-size: 49px;
	line-height: 62px;
	padding-bottom: 20px;
}



.screen35 .copy1{
	top: 175px;
	left: 60px;
}
.screen35 .copy1 .s3{
	letter-spacing: -0.015em;
}
.screen35 .copy1 .s3 strong{
	color: #14AF28;
	font-size: 49px;
}
.screen35 .screen35-image{
	position: absolute;
	top: 397px;
	left: 60px;
}


.screen36{
	background-image: url("../img/screen1-bg.jpg");
}
.screen36 .copy1{
	top: 70px;
	left: 50px;
}
.screen36 .copy1 h1{
	font-size: 120px;
    line-height: 110px;
    letter-spacing: -0.08em;
	padding-bottom: 70px;
}
.screen36 .copy1 p{
	color: #fff;
}
.screen36 .copy1 .s3{
	padding-left: 10px;
	font-family: ml-regular, sans-serif;
	letter-spacing: -0.035em;
	padding-bottom: 0;
}
.screen36 .copy1 .s3 strong{
	font-size: 49px;
	line-height: 62px;
	color: #14AF28;
	letter-spacing: -0.015em;
}
.screen36 .copy1 .s4{
	font-family: ml-bold, sans-serif;
	font-size: 25px;
	line-height: 30px;
	letter-spacing: -0.02em;
	padding: 35px 0 25px 10px;
}
.screen36 .copy1 .s5{
	padding-left: 10px;
	font-size: 19px;
	line-height: 23px;
	padding-bottom: 6px;
}





/* OVERLAYS */

.overlay{
	display: none;
	position: absolute;
	top: 0;
	left: 0;
	bottom: 0;
	right: 0;
	z-index: 99;
	background:rgba(255,255,255,0.95);
}


#screen8-overlay .overlay-inner{
	position: absolute;
	top: 0;
	left: 0;
	bottom: 0;
	right: 0;
	background-image: url("../img/screen8-modal-bg.jpg");
	background-size: cover;
}
#screen8-overlay .copy1{
	left: 60px;
    top: 185px;
	width: 567px;
	letter-spacing: -0.015em;
}
#screen8-overlay .copy1 .blockquote .quote:after {
    right: -50px;
	bottom: 100px;
}
#screen8-overlay .copy1 .blockquote .quotee {
    padding: 40px 0 0 85px;
}


#screen18-overlay{
	display: none;
}
#screen18-overlay .pdf-wrap{
	position: absolute;
	left: 33px;
	top: 125px;
	width: 924px;
	display: flex;
	justify-content: space-between;
	flex-wrap: wrap;
}
#screen18-overlay .pdf-wrap .pdf-item{
	width: 221px;
	display: flex;
	margin-bottom: 30px;
}
#screen18-overlay .pdf-wrap .pdf-item a{
	display: block;
	width: 204px;
}
#screen18-overlay .pdf-wrap .pdf-item p{
	font-size: 20px;
	line-height: 20px;
	font-family: ml-bold, sans-serif;
	padding: 0 6px 0 0;
}
#screen18-overlay .pdf-legend{
	position: absolute;
	top: 124px;
	right: 30px;
	width: 347px;
}
#screen18-overlay .pdf-legend ol{
    list-style: none;
    margin: 0 0 40px 0;
    padding: 0 0 0 0;
    counter-reset: my-counter;
}
#screen18-overlay .pdf-legend ol li{
    margin-bottom: 20px;
    padding-left: 20px;
    position: relative;
    counter-increment: my-counter;
}
#screen18-overlay .pdf-legend ol li:before{
    position: absolute;
    left: 0;
    top: 0;
    content: counter(my-counter);
	color: #14AF28;
	font-family: ml-bold, sans-serif;
}
#screen18-overlay .pdf-legend ol li p.pdf-title{
	font-size: 15px;
	line-height: 20px;
	letter-spacing: -0.02em;
}
#screen18-overlay .pdf-legend ol li p{
	font-size: 12px;
	line-height: 17px;
	letter-spacing: -0.02em;
}

#pdf3-overlay{
	
}


/* PDF */

.pdf-buttons{
	position: absolute;
	top: 80px;
	left: 143px;
	font-size: 12px;
	line-height: 12px;
	font-family: ml-bold, sans-serif;
	text-transform: uppercase;
}
.pdf-buttons button{
	background: #3A474A;
	border: 0;
	outline: 0;
	color: #fff;
	padding: 6px 12px;
	margin-right: 5px;
	text-transform: uppercase;
}
.pdf-buttons.disable button{
	opacity: 0.2;
	pointer-events: none;
}
.canvas_container {
    width: 1080px;
    height: 700px;
    overflow: auto;
	position: absolute;
	top: 120px;
	left: 143px;
}

.canvas_container .pdf{
	width: 100%;
}









/* VIDEO */
.video-wrap{
	position: absolute;
	width: 1050px;
	padding-bottom: 43.225%;
	top: 185px;
    left: 160px;
}
.video-wrap .video-js{
	position: absolute;
    width: 100%;
    height: 100%;
}

.video-play-pause{
	display: block;
	width:100px;
	height:100px;
	background-image: url("../img/icon-play.svg");
	background-size: cover;
	position: absolute;
	top: -50px;
	left: -50px;
	z-index: 15;
}

.video-wrap .video-cover{
	position: absolute;
	top: 0;
	left: 0;
	bottom: 0;
	right: 0;
	z-index: 10;
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: center;
	background: #fff;
}
.video-cover .copy{
	text-align: center;
	font-family: ml-regular, sans-serif;
	letter-spacing: -0.02em;
	font-size: 36px;
	line-height: 40px;
}
.video-cover .copy .s3{
	color: #14AF28;
	font-size: 42px;
	line-height: 46px;
	font-family: ml-regular, sans-serif;
	
}

.screen25 .video-wrap .video-cover{
	background-image: url("../img/screen17-bg.jpg");
	background-size: cover;
}


.bg-video-wrap{
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
	z-index: 0;
}
	
.bg-video-wrap video {
    object-fit: cover;
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
}


.overlay-inner .video-wrap{
	position: absolute;
	width: 1237px;
	top: 131px;
    left: 65px;
	padding-bottom: 50.95%;
}






/*Spinner*/
.lds-roller {
  display: inline-block;
  position: relative;
  width: 80px;
  height: 80px;
}
.lds-roller div {
  animation: lds-roller 1.2s cubic-bezier(0.5, 0, 0.5, 1) infinite;
  transform-origin: 40px 40px;
}
.lds-roller div:after {
  content: " ";
  display: block;
  position: absolute;
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: #fff;
  margin: -4px 0 0 -4px;
}
.lds-roller div:nth-child(1) {
  animation-delay: -0.036s;
}
.lds-roller div:nth-child(1):after {
  top: 63px;
  left: 63px;
}
.lds-roller div:nth-child(2) {
  animation-delay: -0.072s;
}
.lds-roller div:nth-child(2):after {
  top: 68px;
  left: 56px;
}
.lds-roller div:nth-child(3) {
  animation-delay: -0.108s;
}
.lds-roller div:nth-child(3):after {
  top: 71px;
  left: 48px;
}
.lds-roller div:nth-child(4) {
  animation-delay: -0.144s;
}
.lds-roller div:nth-child(4):after {
  top: 72px;
  left: 40px;
}
.lds-roller div:nth-child(5) {
  animation-delay: -0.18s;
}
.lds-roller div:nth-child(5):after {
  top: 71px;
  left: 32px;
}
.lds-roller div:nth-child(6) {
  animation-delay: -0.216s;
}
.lds-roller div:nth-child(6):after {
  top: 68px;
  left: 24px;
}
.lds-roller div:nth-child(7) {
  animation-delay: -0.252s;
}
.lds-roller div:nth-child(7):after {
  top: 63px;
  left: 17px;
}
.lds-roller div:nth-child(8) {
  animation-delay: -0.288s;
}
.lds-roller div:nth-child(8):after {
  top: 56px;
  left: 12px;
}
@keyframes lds-roller {
  0% {
    transform: rotate(0deg);
  }
  100% {
    transform: rotate(360deg);
  }
}



@media (orientation: portrait) {
  body {
    transform: rotate(-90deg);
  }
}


