<!DOCTYPE html>
<html <?php language_attributes(); ?>>
<head>
<meta charset="<?php bloginfo( 'charset' ); ?>" />
<meta name="viewport" content="width=1024, initial-scale=1" />
<meta name="amp-script-src" content="sha384-JanVy7EpfrXEsXNiHXVpjkVoriN0uCgXmBpDj7vCOzID527alytP-IlEuoHVPqia">
<link type="text/css" rel="stylesheet"  href="<?php echo get_stylesheet_uri(); ?>" media="screen" />
<link rel="icon" type="image/png" href="<?php echo get_template_directory_uri(); ?>/images/brand/favicon.png" />
<?php wp_head(); ?>
<script async src="<?php  echo get_template_directory_uri();?>/js/custom-script.js"></script>
<style amp-custom>
    .background-green {
      background: green;
    }
    .background-red {
      background: red; top:100px;
    }
    .border-red {
     top:200px;
    }
  </style>
</head>
<body <?php body_class(); ?>>
	<header id="header" role="branding">
    <div id="nav-header" role="navigation" class="nav-header">
			<div class="container">
				<div class="row topheader">
					<div id="logo" role="site-branding" class="col-3 site-logo">
						<a href="<?php echo get_option("siteurl"); ?>"><img src="<?php echo get_stylesheet_directory_uri(); ?>/images//brand/logo.png" alt="<?php bloginfo( 'name' ); ?>" width="320" height="70"></a>
					</div>
                    <div id="menu" role="navigation" class=" site-login desktop">
						<?php wp_nav_menu( array(
							'theme_location'	=> 'login-menu',
							'container'			=> false,
							'menu_class' 		=> 'login-menu',
							'depth'  			=> 1,
							'fallback_cb'		=> false ) );
						?>
					</div>
					<amp-script layout="container" script="inline_amp" class="amp-script-sample">
 <div class="menutoggler" id="menutoggler" on="tap:AMP.setState({ myClass: 'background-red' })"></div>
 

  <div class="menutoggler" id="menutoggler"></div>
</amp-script>
<script id="inline_amp" type="text/plain" target="amp-script">

  const button1 = document.querySelector('#menutoggler');
  const nav = document.querySelector('.background-green');
 
   button1.addEventListener('click', () => {
    const h1 = document.createElement('h1');
    h1.textContent = 'Hello World sdfsf!';
    document.body.appendChild(h1);
	
  });
</script>

					
				</div>
			</div>
		</div>
		<!--<div id="top-header" role="branding" class="top-header" >
			<div class="container">
				<div class="row">
					<div id="menu" role="navigation" class="col-6 contact-menu float">
						<div class="container">
							<div class="row">
								<div class="col-12">
								

									<?php wp_nav_menu( array(
										'theme_location'	=> 'contact-menu',
										'container'			=> false,
										'menu_class' 		=> 'contact-menu',
										'depth'  			=> 1,
										'fallback_cb'		=> false ) );
									?>
								</div>
							</div>
						</div>
					</div>
					<div id="menu" role="navigation" class="col-6 site-login desktop">
						<?php wp_nav_menu( array(
							'theme_location'	=> 'login-menu',
							'container'			=> false,
							'menu_class' 		=> 'login-menu',
							'depth'  			=> 1,
							'fallback_cb'		=> false ) );
						?>
					</div>
				</div>
			</div>
		</div>-->
		<div id="nav-header" role="navigation" class="nav-header menu-header "  [class]="myClass">
			<div class="container">
				<div class="row">
				
					<div id="menu" role="navigation" class=" site-login mobile">
						<?php wp_nav_menu( array(
							'theme_location'	=> 'primary-menu',
							'container'			=> false,
							'menu_class' 		=> 'primary-menu',
							'depth'  			=> 3,
							  'walker' => new Custom_Walker_Nav_Menu(),
							'fallback_cb'		=> false ) );
						?>
					</div>
					<div id="menu" role="navigation" class=" site-menu desktop">
						<?php wp_nav_menu( array(
							'theme_location'	=> 'primary-menu',
							'container'			=> false,
							'menu_class' 		=> 'primary-menu',
							'depth'  			=> 3,
							  'walker' => new Custom_Walker_Nav_Menu(),
							'fallback_cb'		=> false ) );
						?>
					</div>
				</div>
			</div>
		</div>
		
	</header>
	<div class="sticky"></div>