@media screen and (min-width: 900px) {
	html #root { font-size: 16px; }
}

@media screen and (min-width: 1200px) {
	html #root { font-size: 16px; }
}

body #root{
	margin: 0; font-family: 'CiscoSansExtraLight', Arial, sans-serif, -apple-system, BlinkMacSystemFont, Segoe UI, Roboto, Oxygen, Ubuntu, Cantarell, Fira Sans, Droid Sans, Helvetica Neue; -moz-osx-font-smoothing: grayscale;
	line-height: 1rem; font-size: 1em;
}
#root{position:relative; color:#0d274d;}
@media screen and (min-width: 1200px) {
	#root{font-size:16px;}
}
@media screen and (max-width: 1199px) {
	#root{font-size:16px;}
}
@media screen and (max-width: 768px) {
	#root{font-size:16px;}
}
@media screen and (max-width: 475px) {
	#root{font-size:16px;}
}

.wrapper { position: relative; overflow: hidden; font-family: 'CiscoSansExtraLight', Helvetica, Arial, sans-serif; margin:auto; }
#root .row{display:block !important;}
.container #root .row:not(.section) {padding:0; margin:0; max-width:1366px; column-gap:0;}
.row:after { clear: both; }
.row:before, .row:after { display: table; content: " "; }
.col-l, .col-m, .col-r{float:left;}

#root h1{ font-size: 3em; line-height:57px; letter-spacing: -0.023em; margin-bottom:0; font-weight:normal;  color:#0d274d;}
#root p{font-size: 1.25em; line-height: 25px; letter-spacing: -0.016em; color:#4d4c4c;}
#root h3{font-size: 1.875em; line-height: 35px; font-weight:normal;  color:#0d274d;}
.desc{font-size: 1.25em; border-left: 11px solid #01bceb;padding-left: 9px; line-height: 24px; color:#4d4c4c;}
.download-button{display: block; border: #6abf4a 2px solid; color: #00213d !important; border-radius: 25px; font-size: 1.125em; text-decoration:none !important; font-family:'CiscoSansRegular';}
@media screen and (min-width: 1200px) {
	.wrapper{max-width:1366px};
	.visible-d{display:block !important;}
	.visible-m{display:none !important;}
}

@media screen and (max-width: 1199px) {
	.wrapper{width:100%;}
	.col-l, .col-m, .col-r{width:auto;padding: 15px 16% 0 14%;}
	img{width:100%;}
	#root h1{ font-size:2em; line-height: 40px;letter-spacing: 0em; }
	#root p{font-size: 1em; line-height: 21px; }
	#root h3{font-size: 1.22em; line-height: 24px; letter-spacing: -0.03em; margin-bottom:4px;}
	.download-button{padding: 10px 0 10px 13px; width: 151px; font-size: 1em;}
	.desc{font-size: 1.03em; line-height:22px; border-left:9px solid #01bceb;}
	.visible-d{display:none !important;}
	.visible-m{display:block !important;}
}


#header .wrapper{z-index:10; position:relative;}
#header .col-r p{margin:15px auto 0 auto;}
@media screen and (min-width: 1200px) {
	#header .col-r h1{margin-right: 33px; }
	#header .col-l{width:52.5%; text-align: right; padding-top: 0;}
	#header .col-l img{width:auto;}
	#header .col-r{width:39%; padding:68px 0 0 30px}
	#header .col-r .download-button{margin-top:40px; padding: 15px 0 10px 30px; width: 173px; }
}
@media screen and (max-width: 1199px) {
	#header .col-l{margin-top:0; padding: 0 11%;}
	#header .col-l img{width:114%; margin-left: -14%;}
	#header .col-r {margin:auto;padding: 0 8% 0 11%;}
	#header .col-r .download-button{margin:40px auto 0; padding: 10px 0 10px 20px; width: 148px;}
	#header .col-r p{margin:0 0 20px 0;}
	#header .col-r h1{margin-top: 10px; margin-right:5%; margin-bottom:15px;}
}
/* #section1  */
#section1 .head .title{letter-spacing: -0.02em; margin-bottom:-3px;}
#section1 .head .subtitle{color:#4d4c4c; margin-top:15px;}
@media screen and (min-width: 1200px) {
	#section1 {margin-top: 60px;}
	#section1 .head{text-align:center; margin-bottom:108px;}
	#section1 .head .title{font-size: 2.5em; line-height:57px; }
	#section1 .head .subtitle{font-size: 1.25em; letter-spacing: 0.02em;}
	#section1 .col-l{width:56%; text-align:right;}
	#section1 .col-l img{width:auto;}
	#section1 .col-r{width:35%; margin-left:-10px;}
	#section1 .col-r h3{margin:96px auto 15px auto;}
	#section1 .col-r .desc{margin-left: -4px;}
}

@media screen and (max-width: 1199px) {
	#section1 {margin-top: 13px;}
	#section1 .head{margin-bottom:10px; padding: 0 12% 0 13%;}
	#section1 .head .title{font-size: 1.6em; line-height: 28px; margin-top: 19px;margin-bottom: 6px;letter-spacing:0.04em;}
	#section1 .head .subtitle{font-size: 1em; line-height: 20px;}
	#section1 .col-l{text-align: center;}
	#section1 .col-l img{width: 100%; margin: 25px 0 0;}
}

@media screen and (max-width: 768px) {
	#section1 {margin-top: -10px;}
}
@media screen and (max-width: 475px) {
	#section1 {margin-top: -10px;}
}

/* #section2  */
#section2 .row{  display: flex !important; flex-wrap:wrap;}
@media screen and (min-width: 1200px) {
	#section2 {padding-top: 23px;}
	#section2 .col-l{width:48%;}
	#section2 .col-r{width:35%;}
	#section2 .col-l h3{margin:133px auto 15px 86px;}
	#section2 .col-l .desc{margin:auto 103px auto 87px;}
}

@media screen and (max-width: 1199px) {
	/* #section2 {padding: 50px 0 25px 0; margin-top: 38px;} */
	#section2 {padding: 0 0 25px 0; margin-top: 0;}
	#section2 .row{flex:1 1 100%;}
	#section2 .col-l{order:2;margin-top: 0; padding-right: 8%;}
	#section2 .col-r{order:1; padding:0 7% 0 13%;}
}

/* #section3  */
@media screen and (min-width: 1200px) {
	#section3 {margin:90px auto 50px auto;}
	#section3 .col-l{width:48%; text-align:right;}
	#section3 .col-l img{width:auto;}
	#section3 .col-r{width:29%; margin-left:98px;}
	#section3 .col-r h3{margin:104px auto 15px auto;}
	#section3 .col-r .desc{margin-left: -3px;}
}

@media screen and (max-width: 1199px) {
	#section3 .col-l{padding-top: 0px; margin-top: 4px;}
	#section3 .col-l img{width:106%;}
	#section3 .col-r{padding-top:0;}
	#section3 .col-r h3{padding-right:4%;}
}

/* #section5  */
#section5 {position:relative;}
#section5 .iFrameClass{border: none; overflow: hidden;}
#section5 .getreport{font-size: 1.25em; line-height: 24px; margin:auto; color:#4d4c4c;}
#section5 .getreport h2{font-weight:normal; color:#0d274d; }
@media screen and (min-width: 1200px) {
	#section5 {margin-top: 200px; text-align:center;}
	#section5 .getreport{ width:660px; padding-left:53px; padding-bottom: 20px;}
	#section5 .getreport h2{margin-bottom:15px; font-size: 2em;}
	#section5 .iFrameClass{width: 540px; height: 800px; padding-left: 90px; padding-bottom: 100px;}
}

@media screen and (max-width: 1199px) {
	#section5{margin-top: 27px; padding-top: 75px; text-align: center; padding-bottom: 46px;}
	#section5 .iFrameClass{width: 100%; height: 880px;}
	#section5 .getreport { font-size: 1.2em; line-height: 24px; margin: 0 9% 20px 13%; text-align: left; }
	#section5 .getreport h2{margin-bottom:12px; font-size: 1.6em; line-height:38px; }
}

#section6{color: #ffffff; text-align:center; margin:auto; line-height: 24px;}
#section6 h3{font-size:2.5em; margin-bottom:15px; color:#ffffff;}
#section6 div{font-size:1.25em;}
#section6 .download-button{width: 160px; background-color: #6bbf4d; color: #00213d; margin: 40px auto; height: auto; padding: 6px; font-size: 1.125em;}
@media screen and (min-width: 1200px) {
	#section6{margin-top: -20px; width: 780px;padding-bottom: 70px;}
}
@media screen and (max-width: 1199px) {
	#section6 h3{font-size:1.6em; margin-bottom:14px; line-height: 31px;}
	#section6{font-size: 1em; width: 70%; text-align:left; margin-top: -55px; padding-top: 55px; padding-bottom: 70px;}
	#section6 .download-button{text-align:center; margin: 35px 0;}
}


.box1,.box2,.box3,.box4{width:100%;}
.box1,.box2 { background:#f2f2f2; }
.box3{background-color:#f3fbfe;}
.box4{background-color:#0d274d;}

@media screen and (min-width: 1200px) {
	.box1 {
		-webkit-clip-path: polygon(0 0, 100% 0, 100% 100%, 0 70%);
		clip-path: polygon(0 0, 100% 0, 100% 100%, 0 70%);
		padding-bottom:222px;
	}
	.box2 {
	 /* -webkit-clip-path: polygon(0 21%, 100% 0, 100% 100%, 0 76%); */
	 /* clip-path: polygon(0 21%, 100% 0, 100% 100%, 0 76%);  */
	 /* padding-bottom:80px; */
	}
	.box3 {
	 -webkit-clip-path: polygon(0 19%, 100% 0, 100% 100%, 0 91%);
	 clip-path: polygon(0 19%, 100% 0, 100% 100%, 0 91%);
	 padding-top:30px;
	 margin-bottom:30px;
	}
	.box4{
		margin-top: -180px;
		padding-top: 180px;
		width:99.9%;
	}
}

@media screen and (max-width: 1199px) {
	.box1 {
		-webkit-clip-path: polygon(0 0, 100% 0, 100% 100%, 0 90%);
		clip-path: polygon(0 0, 100% 0, 100% 100%, 0 90%);
		padding-bottom:90px;
	}
	.box2 {
	 /* -webkit-clip-path: polygon(0 6%, 100% 0, 100% 100%, 0 87); */
	 /* clip-path: polygon(0 6%, 100% 0, 100% 100%, 0 87%); */
	 /* padding-bottom:80px; */
	}
	.box3 {
	 -webkit-clip-path: polygon(0 3%, 100% 0, 100% 100%, 0 96%);
	 clip-path: polygon(0 3%, 100% 0, 100% 100%, 0 96%);
	}
}



/* Element */
#element-container{position:absolute; width:100%; left:0; right:0; height:2500px; z-index:1; display:none;}
.border-element{position:relative; height:1px;z-index:1;}
.img{position:absolute;}
#element1, #element2, #element3, #element4, #element5, #path1, #path2{position:absolute; display:none;}
#element6, #element7, .arrow-down{position:absolute; display:block;}
#element2{right:0;top:-217px;}
#element4{opacity:0.6;}
#element6{top: -208px; right:0;}
#element7{top: 83px; left:0; opacity:0.6;}
@media screen and (min-width: 1200px) {
	.path-cover{width:1200px; margin:auto; position:relative;}
	#element-container{top:670px; display:block}
	#element1, #element2, #element3, #element4, #element5, #element6, #element7,#path1, #path2{display:block;}
	.arrow-down{top:-171px; left:48.5%;}
	#img-l{top:-433px; left:20px;}
	#img-r{top:-300px; right:35px;}
	#element1{top: 200px; left: 110px;}
	#element2{right:0;top:-217px;}
	#element3{top: 750px; right: 20px;}
	#element4{top: 960px; left: 30px;}
	#element5{top: 1690px; right: 5px;}
	#element6{top: -188px; right:0;}
	#element7{top: 138px; left:0;}
	#path1{top: 730px; left: 262px;}
	#path2{top: 1325px; left:60px;}
}
@media screen and (max-width: 1199px) {
	.arrow-down{width: 3.5%; top:-60px; left:48.5%;}
	#img-l{top:-90px; left:0; width:10%; -webkit-transform: scaleX(-1); transform: scaleX(-1); }
	#img-r{top:-100px; right:2%; display:block; width:15%}
	#element6{width:18%; -webkit-transform: scaleX(-1); transform: scaleX(-1); top: -534px; left:0;}
	#element7{width:13%; top:6px;}
}

@media screen and (max-width: 768px) {
	.arrow-down{width: 4%; }
	#img-l{width:13%;}
	#img-r{width:17%}
	#element7{width:14%; top:6px;}
}
@media screen and (max-width: 475px) {
	#img-l{width:17%;}
	#img-r{width:26%}
	.arrow-down{width: 6%; }
	#element7{width:22%; top:6px;}
}

@font-face {
	font-family: 'CiscoSansRegular';
	src: url('../fonts/CiscoSansRegular.eot');
	src: local('☺'), url('../fonts/CiscoSansRegular.woff') format('woff'), url('../fonts/CiscoSansRegular.ttf') format('truetype'), url('../fonts/CiscoSansRegular.svg') format('svg');
	font-weight: normal;
	font-style: normal;
}

@font-face {
	font-family: 'CiscoSansExtraLight';
	src: url('../fonts/CiscoSansExtraLight.eot');
	src: local('☺'), url('../fonts/CiscoSansExtraLight.woff') format('woff'), url('../fonts/CiscoSansExtraLight.ttf') format('truetype'), url('../fonts/CiscoSansExtraLight.svg') format('svg');
	font-weight: normal;
	font-style: normal;
}
@font-face {
	font-family: 'CiscoSansBold';
	src: url('../fonts/CiscoSansBold.eot');
	src: local('☺'), url('../fonts/CiscoSansBold.woff') format('woff'), url('../fonts/CiscoSansBold.ttf') format('truetype'), url('../fonts/CiscoSansBold.svg') format('svg');
	font-weight: normal;
	font-style: normal;
}