@charset "UTF-8";
/* CSS Document */
/* header */
.main-banner { width: 100vw; height: 100vh; display: flex;  flex-direction: column; justify-content: center; align-items: center; padding-right: 10%; padding-left: 10%; padding-top: 35vh; /* Needed in order to hide the video overflows. */ position: relative; overflow: hidden; }
.main-banner__video { height: 100vh; position: absolute; top: 0; z-index: 0; }
.main-banner__subtitle { color: #d0c9b4;  font-size: 1.5em; text-transform: uppercase; text-align: center; }
.main-banner__introducing { animation: slide-in-bottom 0.6s cubic-bezier(0.25, 0.46, 0.45, 0.94) both; margin-bottom: 10px; }
.main-banner__legend-container { display: flex; flex-direction: column; justify-content: center; align-items: center; margin-top: 100px; /*margin-bottom: 10vh;*/ }
.main-banner__legend { animation: slide-in-bottom 0.6s cubic-bezier(0.25, 0.46, 0.45, 0.94) 4s both; }
.main-banner__legend__mark { animation: slide-in-bottom 1s cubic-bezier(0.25, 0.46, 0.45, 0.94) 4.2s both; }
.main-banner__quote { display: flex; flex-direction: row; justify-content: center; align-items: center; position: relative; }
.main-banner__quote__fragment { height: 9vw; }
.main-banner__quote__fragment:nth-child(odd) { animation: slide-in-fragment-odd 1s cubic-bezier(0.25, 0.46, 0.45, 0.94) 1s both; }
.main-banner__quote__fragment:nth-child(even) { animation: slide-in-fragment-even 1s cubic-bezier(0.25, 0.46, 0.45, 0.94) 1s both; }
.main-banner__legend__arrow { animation: slide-in-top 1.5s cubic-bezier(0.175, 0.885, 0.32, 1.275) 5.2s both; margin-top: 10px; }
/* header */
/* nav bar */
.main-nav { margin: 0px auto; background-color: #ffffff; z-index: 600; width:700px; }
.etf_nav_wrap { width: 700px; margin: auto; }
.etf_nav { list-style: none; margin: 23px auto 0; display: flex; justify-content: left; padding: 0; }
.etf_nav > .etf_nav_logo { width: 40px; height: 50px; top: -15px; position: relative; margin: 0 30px 0 0; position: relative; }
.etf_nav_logo img { width: 100%; position: absolute; top: 50%; transform: translate(0, -50%); }
.etf_nav > .etf_nav_item { float:left; margin-right:30px; height: 35px; }
.etf_nav > .etf_nav_item a { font-weight:800; font-family:akkurat-pro,arial,sans-serif; color:#555; font-size:18px;  }
.etf_nav > .etf_nav_item a:hover { color:#000; }
.etf_nav > .etf_nav_item a:hover:after { content:""; border-bottom:4px #ccc solid; position:absolute;     bottom: 0; width: 100%; left: 0; }
.etf_nav_item > .our_etfs br { display:none; }
.stick-alt { position: fixed; top: 142px; border-bottom: 1px solid #ccc; width: 100%; left: 0; height: 70px; }
/* End nav bar */
	
/* bny mellon way */
.etf_header_wrap_700 { width:700px; margin:auto; }
.etf_header_wrap_anime { animation: slide-in-bottom 0.8s cubic-bezier(0.25, 0.46, 0.45, 0.94) 2s both; }
.etf_header_wrap_700 > .etf_eyebrow { padding-top: 10px; font-size: 16px; text-transform: uppercase; }
.etf_header_wrap_700 > .etf_header_special { font-size:42px; line-height:48px; color:#57585A; margin: 10px 0; }
.etf_header_wrap_700 > .etf_header_special:before { content:""; top:-40px; border-top:10px solid #99b6bf; width:60px; position:absolute; }
	
.etf_header_wrap_900 { width:900px; margin:auto; }
.etf_header_wrap_900 > .etf_eyebrow { font-size: 16px; text-transform: uppercase; }
.etf_header_wrap_900 > .etf_header_special { font-size:42px; color:#57585A; margin: 10px 0; line-height: 48px; }
.etf_header_wrap_900 > .etf_header_special:before { content:""; top:-40px; border-top:10px solid #99b6bf; width:60px; position:absolute; line-height:36px; }
	
.etf_header_wrap_700 > p, .etf_header_wrap_900 > p { font-size:18px; font-weight:300; color:#57585A }
	
.etf_header_wrap_700 > .etf_link, .etf_header_wrap_900 > .etf_link { display:inline-block; margin-top:30px; font-size:18px; font-weight:400; color:#00475D; position:relative; padding-left:50px; }
.etf_header_wrap_700 > .etf_link:before { background:url(/Assets/img/Icons/Rebrand/etf_link_arrow.svg); content:""; position:absolute; background-repeat:no-repeat; width: 30px; height: 25px; left: 0px; top: 4px; }
.etf_space { padding-top: 20px !important; }
/* end bny mellon way */
	
/* quote */
.row_box { height:300px; overflow:hidden; position:relative; }
.row_box h1 { position: absolute; top: 80px; left: 30px; font-size: 80px; color:#57585A; }
.row_box:last-child { border-right: none; }
.row_box:last-child h2 { position: absolute; top: 200px; left: 50px; font-size: 80px; color:#57585A; }
/* end quote */
	
/* text wrap */
.etf_vid_wrap { height: 500px; }
.etf_vid_wrap:after { visibility: hidden; display: block; content: " "; clear: both; height: 0;  }
.etf_text_box { height: 450px; width: 950px; background-color: rgba(0,0,0,0.5); position: absolute; z-index: 400; overflow:hidden; padding:30px 0; top:0; }
.etf_text_box h1 { color: #fff; font-size:72px; margin-left:20px; line-height:80px; }
.etf_vid_box { height: 500px; width: 900px; background: url(/Assets/img/Banners-and-Body/ETFs/etf_video_image_1200x800.jpg); background-size:cover; position: absolute; z-index: 300; right: 0; top: 30px;  }
/* end text wrap */
	
/* cyan block */
section.module.cyan { background:#f0f6f7 !important; }
.etf_cyan_wrap { height: 400px; padding:40px 0;  }
.etf_cyan_wrap > .etf_sub_title { text-align: center; margin-top: 100px;  color:#57585A;; }
.etf_cyan_wrap > .etf_title { text-align: center; color:#57585A; margin: 10px 0; font-size: 42px; line-height: 48px; }
/* end cyan block */
	
/* etf blocks */
.etf_chart_wrap { position:absolute; top:-220px; z-index:10; height:auto; width:100%; left: 0; }
.etf_chart_wrap:after { visibility: hidden; display: block; content: " "; clear: both; height: 0; }
.etf_fund_box { height:400px; border:1px solid #ccc; padding:15px; background:#fff; margin-bottom:40px; position:relative}
.etf_fund_box h1 { margin-top:5px; font-size: 18px; line-height: 24px; color:#00485e; }
.etf_fund_box > .etf_co_green { padding: 2px 5px; font-weight: 400; font-size: 16px !important; color: #fff; background: #42b02a; margin: 15px 0 40px; display: inline-block; width: 60px; text-align: center; }
.etf_fund_box > .etf_co_teal { padding: 2px 5px; font-weight: 400; font-size: 16px !important; color: #fff; background:#0094aa; margin: 15px 0 40px; display: inline-block; width: 60px; text-align: center; }
.etf_co_green:before, .etf_co_teal:before { content: ""; top: 0px; border-top: 8px solid #66919e; width: 60px; position: absolute; left: 15px; }
.etf_fund_box .etf_source { font-size: 12px; color: #336d7e; text-transform: uppercase; line-height: 16px; letter-spacing: -0.2px; }
.etf_fund_box .etf_caption { font-size: 14px; font-weight: 300; line-height: 21px;}
.etf_fund_footer { margin: 15px 0; position: absolute; bottom: 0; width: 90%; }
.etf_fund_footer:after { visibility: hidden; display: block; content: " "; clear: both; height: 0; }
.etf_fund_footer > .etf_btn { font-size: 13px; color: #00485e; text-align: center; float: left; left: 35px; position: relative; line-height: 24px; }
.etf_fund_footer > .etf_btn:hover { color: #999; }
.etf_fund_footer > .etf_btn:before { content:""; position:absolute; left: -30px; width: 21px; height: 20px; top: 4px; background: url(/Assets/img/Icons/Rebrand/etf_link_arrow.svg) no-repeat; }
.etf_fund_footer > .etf_fee { font-size:13px; float:right; margin:0; line-height: 24px; color:#00485e; font-weight:400; }
.etf_chart_space { height:620px; }
/* end etf blocks */
	
/* video block */
.myVideo_wrap { width: 600px; height: 335px; overflow: hidden; background:#f7f7f7 url(/Assets/img/Banners-and-Body/ETFs/etf-header-1270x720.jpg); background-size: cover; margin:auto; position:relative; }
#myVideo { width: 100%; position: relative; top: 0;  display:none; }
.fadeOutDown { visibility: hidden; }
.myShow { display:block !important; }
.myButton.myHide { width: 100px; height: 50px; bottom:0; background:#b3a177; color:#fff; }
.myButton { position: absolute; width: 100px; height: 50px; bottom:0; display: inline-block; background: #b3a177; z-index: 10; cursor: pointer; color:#fff; text-transform:uppercase; }
.myButton:hover { background:#99b6bf; }
.myButton span { display:none; }
.myButton:hover span { display:block; position:fixed; overflow:hidden; }
video::-webkit-media-controls { display: none; }
/* end video block */
	
/* articles block */
.etf_article_wrap { width:100%; margin-top: 20px; }
.etf_article_box_1 { width: 100%; height: 350px; margin-bottom: 20px; overflow: hidden; }
.etf_article_box_1 img { width: auto; height: 100%; transform: translate(-50%,-50%); top: 50%; position: relative; left: 50%; }
.etf_article_box_2 { width: 100%; height: 300px; margin-bottom: 20px; overflow: hidden; }
.etf_article_box_2 img { width: auto; height: 100%; transform: translate(-50%,-50%); top: 50%; position: relative; left: 50%; width: 100%; height: 300px; background:#eee; }
.etf_article_special { font-size: 21px; color:#57585A; }
.etf_article_special:before { content: ""; top: -30px; border-top: 10px solid #99b6bf; width: 60px; position: absolute; line-height: 36px; }
.etf_article_wrap	h3 { font-size: 21px; color:#57585A; }
.etf_article_wrap	> p { font-size: 16px; color:#57585A; font-weight: 300; }
.etf_article_wrap	> .etf_article_link { font-size: 16px; margin-top:30px;  }
.etf_article_wrap	> .etf_article_link a { font-size: 16px; color:#01426a; text-decoration:underline; }
.etf_article_wrap	> .etf_article_link a:hover { color:#57585A; text-decoration:none; }
.etf_header_special:before { content:""; top:-40px; border-top:10px solid #99b6bf; width:60px; position:absolute; }
/* end articles block */
	
/* audio quote block */
.etf_audio_wrap { padding:60px; display:block; color:#57585A;; quotes: "“" "”"; }
.etf_audio_wrap > .etf_audio_quote { font-size: 30px; line-height: 36px; font-family: publico-banner; margin-top:21px; color:#57585A; }
/* end audio block */
	
/* discover block */
.etf_discover_wrap { display:block; }
.etf_discover_wrap:after { visibility:hidden; content:""; height:0; clear:both; display:block; }
.etf_discover_wrap > .etf_discover_title { font-size: 36px; line-height: 40px; font-family: publico-banner; color:#58595b; }
.etf_discover_subhdr { font-weight:300; font-family: akkurat-pro,arial,sans-serif; margin-top:10px; font-size:24px; color:#57585A; }
.etf_discover_box { margin: 10px 0 30px; display: block; height:auto; position: relative;  }
.etf_discover_box:after { visibility:hidden; content:""; height:0; clear:both; display:block; }
.etf_discover_btn { color: #00485e; position: relative; }
.etf_discover_btn:after { background: url(/Assets/img/Icons/Rebrand/etf_link_arrow.svg) no-repeat; content: ""; width: 35px; height: 20px; margin-left: 10px; position: absolute; top: 4px; }
.etf_discover_btn:hover { cursor:pointer; color:#999; }
.etf_discover_btn > .etf_arrow, .etf_arrow { width:30px; height:auto; position:relative; top:12px; margin-left: 20px; }
.etf_number { font-weight:400; font-family: akkurat-pro,arial,sans-serif; float:left; font-size:21px;  display:block; margin-top: 10px; color:#00485e; }
.etf_number br { display:none; }
/* end discover block */
		
/* media query 1200px */
@media screen and (max-width:1200px) {
	.hero-slider .hero.hero--1080 { height:430px; max-height:430px; min-height:430px !important;  }
	.etf_video_inwrap { height:430px; }
	.stick-alt { top: 75px; padding: 0 20px; }
	.etf_chart_space { height: 1300px; }
	.etf_fund_box h1 br { display: none; }
	.etf_fund_box > .etf_source br { display:none; } 
}
/* media query 1024px */
@media screen and (max-width:1024px) {
	#etf_video_wrap { height:430px; }
	.etf_video_inwrap  { height:430px; }
	.stick-alt { top: 75px; padding: 0 20px; }
	.row_box:last-child h2 { left: 300px; }
	.etf_chart_space { height: 1300px; }
}
/* media query 768px */
@media screen and (max-width:768px) {
	#etf_video_wrap { height:430px; }
	#etf_video_wrap video { width: auto; height: 100% }
	.etf_video_inwrap  { height:430px; }
	.main-banner__legend-container { margin-top: 50px; }
	.hero-slider .hero.hero--1080 { height:430px; max-height:430px; min-height:430px !important;  }
	.main-nav { width:100%; }
	.stick-alt { top:75px; padding: 0 20px; height: 80px; width:100%; }
	.etf_nav > .etf_nav_item a { font-size:16px; }
	*[data-paroller-factor] {
    /*for all elements with background parallax effect*/
    background-position: center !important; 
    /*for all elements with foreground parallax effect*/
    transform: none !important;
  	}
	.row_box:nth-child(1) { display:none; }
	.row_box:nth-child(2), .row_box:nth-child(3) { height: 150px; }
	.row_box:nth-child(2) h1 { top:45px; left: 50%; transform: translateX(-50%) !important; font-size:70px; }
	.row_box:last-child h2 { top: 40px;  left: 50%; transform: translateX(-50%) !important; font-size:70px; }
	.etf_header_wrap_900, .etf_header_wrap_700 { width: 100%; }
	.etf_header_wrap_900 > .etf_text br { display: none; }
	.etf_text_box { width:95%; left:0; }
	.etf_text_box h1 { font-size: 54px; }
	.etf_vid_box { width:95%; right:0; }
	.etf_cyan_wrap { padding: 20px 0; }
	.etf_chart_wrap { position: relative; }
	.etf_chart_space { display:none; }
	.myVideo_wrap { width: 100%; height: 410px; }
	.myButton { width: 80px; height: 30px; bottom: 0; font-size: 9px; }
	.myButton.myHide { width: 80px; height: 30px; bottom: 0;  font-size: 10px; }
	.etf_article_1 { margin-top: -28px; }
	.etf_article_box_1 img { width: auto; height: 100%; }
}
/* media query 600px */
@media screen and (max-width:600px) {
	.myVideo_wrap { width: 100%; height: 210px; }
	.etf_text_box h1 { font-size: 42px; line-height: 50px; }
	.main-nav { width:100%; }
	.etf_nav_wrap { width:100%; }
	.etf_nav { margin: 10px auto 6px; }
	.etf_nav > .etf_nav_logo { top: -2px; width:50px; height:60px; margin:0 20px 0 0; }
	.etf_nav > .etf_nav_item { margin: 0 20px 0 0; height: 60px; width: 120px; text-align: center; position:relative; }
	.etf_nav_item > .our_etfs br { display: block; }
	.stick-alt { top:75px; padding: 0 20px; height: 80px; width:100%; }
	.etf_article_box_1 img { width: auto; height: 100%; }
	.main-banner__quote__fragment { height: 16vw; }
}
/* media query 375px */
@media screen and (max-width:375px) {
	#etf_video_wrap { height:430px; }
	#etf_video_wrap video { width: 100%; height: 430px; }
	.main-banner__quote__fragment { height: 16vw; }
	.hero-slider .hero.hero--1080 { min-height:0; }
	.etf_header_wrap_700 { width:100%; padding:0 20px; }
	.row_box:nth-child(1) { display:none; }
	.row_box:nth-child(2), .row_box:last-child { height: 100px; }
	.row_box:nth-child(2) h1, .row_box:last-child h2 { top: 40px; font-size:70px;  }
	.etf_vid_wrap { height: auto; }
	.etf_text_box {  width: 100%; left: 0; padding: 10px; height: 420px; position: relative; }
	.etf_text_box h1 { font-size: 36px; line-height: 40px;  margin-left: 20px; }
	.etf_vid_box { width: 100%; height: 350px; margin-bottom: 20px; position: relative; }
	.etf_cyan_wrap { height: 250px; padding: 0; }
	.etf_cyan_wrap > .etf_title { font-size: 32px; line-height: 36px; }
	.etf_chart_wrap { width: 100%; position: relative; top: -100px; height:auto; }
	.etf_fund_box { height: 400px; margin-bottom: 30px; }
	.etf_chart_space { height:0; }
	.etf_link_wrap { padding:20px 0; }
	.myVideo_wrap { width: 100%; height: 180px; }
	.myButton { width: 80px; height: 30px; bottom: 0; font-size: 9px; }
	.myButton.myHide { width: 80px; height: 30px; bottom: 0;  font-size: 9px; }
	.etf_header_wrap_900 { width:100%; }
	.etf_audio_wrap { padding: 0;  }
	.etf_audio_wrap > .etf_audio_quote { font-size: 32px;  line-height: 38px; }
	.etf_audio_wrap > .etf_audio_quote br { display:none; } 
	.etf_article_box_1 img { width: auto; height: 100%; }
	.etf_number br { display:block; }
}