<!DOCTYPE html>
<!--[if lt IE 7]> <html class="no-js lt-ie10 lt-ie9 lt-ie8 lt-ie7" lang="en"> <![endif]-->
<!--[if IE 7]> <html class="no-js lt-ie10 lt-ie9 lt-ie8" lang="en" <![endif]-->
<!--[if IE 8]> <html class="no-js lt-ie10 lt-ie9" lang="en"> <![endif]-->
<!--[if IE 9]> <html class="no-js lt-ie10" lang="en"> <![endif]-->
<!--[if gt IE 9] -->
<html class="no-js {{ htmlClass }}" lang="ge">

<head>
	<meta charset="UTF-8">

	<title>{{ title }}</title>
	<meta name="description" content="Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod
	tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam">

	<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no">

	<link rel="stylesheet" href="{{assetsPath}}css/plugins.css" media="all">
	<link rel="stylesheet" href="{{assetsPath}}css/styles.css" media="all">
	<link rel="stylesheet" href="{{assetsPath}}css/components.css" media="all">
	<link rel="stylesheet" href="{{assetsPath}}css/components2.css" media="all">
	{{!-- <link rel="stylesheet" href="{{assetsPath}}css/patternlab.css" media="all"> --}}
	<meta name="theme-color" content="#3d4855">

	{{#if components.infographics }}
		<link rel="stylesheet" href="{{assetsPath}}css/infographics.css" media="all">
	{{/if }}

	{{#if components.financialWeatherSmall }}
		<link rel="stylesheet" href="{{assetsPath}}features/financial-weather/css/styles-small.css" />
	{{/if }}

	{{#if components.financialWeather }}
		<link rel="stylesheet" href="{{assetsPath}}features/financial-weather/css/styles-small.css" />
		<link rel="stylesheet" href="{{assetsPath}}features/financial-weather/css/styles.css" />
	{{/if }}

	<!--[if lt IE 10]>
		<script src="{{assetsPath}}js/es5-shim.min.js"></script>
	<![endif]-->

	<link rel="stylesheet" href="{{assetsPath}}css/print.css" media="print">

	<script src="{{assetsPath}}js/modernizr-latest.js"></script>

	{{#if etfus }}
		<script src="{{assetsPath}}js/webtrekk_v4.js"></script>
	{{/if }}

	<!-- ENGINE CODE -->
	{{> $$engineHeader}}
	<!-- END ENGINE CODE -->

	<!-- STYLES FOR ENGINE -->
	<link rel="stylesheet" href="{{assetsPath}}css/patternlab.css" media="all">
	<!-- END STYLES FOR ENGINE -->
</head>
<body class="{{partialClass}}">
	{{! yield }}
	{{ $yield }}


	{{#if etfus }}
	<script>
		window.wt = new webtrekkV3({
			sitefamily: 'etfus',
	        product: 'passive',
	        country: 'us',
	        language: 'en'
		});
	</script>
	{{/if }}

	{{#unless nojs }}
	<script src="{{assetsPath}}js/application.js"></script>


	{{ render "atoms/scripts/script-default" }}

	{{/unless }}

	<!-- ENGINE CODE -->
	{{> $$engineFooter }}
	<!-- END ENGINE CODE -->

	{{#if cioview}}
		<style>
			.btn-toggle-theme {
				position: fixed;
				bottom: 0;
				right: 0;
				width: 30px;
				height: 30px;
				background-color: rgba(255, 255, 255, 0.5);
				border: none;
				border-top: 1px solid #222222;
				border-left: 1px solid #222222;
			}
			.btn-toggle-theme img {
				max-width: 100%;
			}
		</style>

		<button class="btn-toggle-theme contrast">
			<img src="http://cdn.flaticon.com/svg/28/28538.svg">
		</button>
		<button class="btn-toggle-theme default">
			<img src="http://cdn.flaticon.com/svg/28/28538.svg">
		</button>
		<script>
			function toggleTheme(linkPath, toggleTo) {
				linkPath.styles.attr('href', toggleTo.styles);
				linkPath.components.attr('href', toggleTo.components);
				linkPath.components2.attr('href', toggleTo.components2);
				linkPath.infographics.attr('href', toggleTo.infographics);

			}

			function getLinksToTheme (theme) {
				if(theme === 'db') {
					return {
						styles: jQuery('link[href="{{assetsPath}}css/themes/dbonline/styles.css"]'),
						components: jQuery('link[href="{{assetsPath}}css/themes/dbonline/components.css"]'),
						components2: jQuery('link[href="{{assetsPath}}css/themes/dbonline/components2.css"]'),
						infographics: jQuery('link[href="{{assetsPath}}css/themes/dbonline/infographics.css"]')
					};
				}
				if(theme === 'default') {
					return {
						styles: jQuery('link[href="{{assetsPath}}css/styles.css"]'),
						components: jQuery('link[href="{{assetsPath}}css/components.css"]'),
						components2: jQuery('link[href="{{assetsPath}}css/components2.css"]'),
						infographics: jQuery('link[href="{{assetsPath}}css/infographics.css"]')
					};
				}
			}

			function getOnlyLink (theme) {
				if(theme === 'db') {
					return {
						styles: "{{assetsPath}}css/themes/dbonline/styles.css",
						components: "{{assetsPath}}css/themes/dbonline/components.css",
						components2: "{{assetsPath}}css/themes/dbonline/components2.css",
						infographics: "{{assetsPath}}css/themes/dbonline/infographics.css"
					};
				}
				if(theme === 'default') {
					return {
						styles: "{{assetsPath}}css/styles.css",
						components: "{{assetsPath}}css/components.css",
						components2: "{{assetsPath}}css/components2.css",
						infographics: "{{assetsPath}}css/infographics.css"
					};
				}
			}

		if(Boolean(sessionStorage.getItem('theme-banking')) === true) {
			var linkPath = '',
				toggleTo = '';

			linkPath = getLinksToTheme('default');
			toggleTo = getOnlyLink('db');
			jQuery('body').addClass('theme-db-banking');
			$('[data-highcharts-chart]').html('');
			if(window.createAllPageCharts) {
				window.createAllPageCharts('dbdotcom');
			}
			toggleTheme(linkPath, toggleTo)
		}

		jQuery('.btn-toggle-theme.default').click(function() {
			var linkPath = '',
				toggleTo = '';

			$('[data-highcharts-chart]').html('');

			if(Boolean(sessionStorage.getItem('theme-banking')) === true) {
				linkPath = getLinksToTheme('db');
				toggleTo = getOnlyLink('default');
				jQuery('body').removeClass('theme-db-banking');
				delete sessionStorage['theme-banking'];
				if(window.createAllPageCharts) {
					window.createAllPageCharts('standard');
				}
			}
			else {
				linkPath = getLinksToTheme('default');
				toggleTo = getOnlyLink('db');
				jQuery('body').addClass('theme-db-banking');
				sessionStorage['theme-banking'] = true;
				if(window.createAllPageCharts) {
					window.createAllPageCharts('dbdotcom');
				}
			}

			toggleTheme(linkPath, toggleTo);
		});
		</script>
	{{/if}}
</body>
</html>
