<?php
/**
 * The header.
 *
 * This is the template that displays all of the <head> section and everything up until main.
 *
 * @link https://developer.wordpress.org/themes/basics/template-files/#template-partials
 *
 * @package WordPress
 * @subpackage Twenty_Twenty_One
 * @since Twenty Twenty-One 1.0
 */

?>
<!doctype html>
<html <?php language_attributes(); ?> <?php twentytwentyone_the_html_classes(); ?>>
<head>
	<meta charset="<?php bloginfo( 'charset' ); ?>" />
	<meta name="viewport" content="width=device-width, initial-scale=1" />
	<?php wp_head(); ?>
	
<link rel="shortcut icon" type="image/x-icon" href="<?php echo get_template_directory_uri(); ?>/
images/favicon.ico">
      <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.0.2/dist/css/bootstrap.min.css" rel="stylesheet">
      <link rel="canonical" href="https://getbootstrap.com/docs/5.0/examples/masonry/">
      <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/OwlCarousel2/2.3.4/assets/owl.carousel.min.css"
         type="text/css">
      <link rel="stylesheet"
         href="https://cdnjs.cloudflare.com/ajax/libs/OwlCarousel2/2.3.4/assets/owl.theme.default.min.css" type="text/css">
      <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@fancyapps/ui@4.0/dist/fancybox.css" />
      <link rel='stylesheet' href='https://cdnjs.cloudflare.com/ajax/libs/animate.css/3.7.0/animate.min.css'>
      <link rel="stylesheet" href="<?php echo get_template_directory_uri(); ?>/css/style.css">
      <link rel="stylesheet" href="<?php echo get_template_directory_uri(); ?>/css/responsive.css">
      <link href="https://fonts.googleapis.com/css2?family=Barlow:wght@100;200;300;400;500;600;700;800;900&display=swap" rel="stylesheet">
      <link href="https://fonts.googleapis.com/css2?family=Nunito+Sans:opsz,wght@6..12,200..1000&display=swap" rel="stylesheet">	
	
</head>

<body <?php body_class(); ?>>
<?php wp_body_open(); ?>

<!-- header area start -->
     <header class="header_area clearfix">
         <div class="container">
             <div class="header d-flex align-items-center justify-content-between flex-wrap">
			
               <div class="logo"><a href="<?php echo home_url(); ?>"><img src="<?php echo get_field('header_logo','options');?>" alt="logo"></a></div>
               <div class="header-left">
								  <div class="menu">
				   <div class="menuButton">
					  <span></span> <span></span> <span></span>
				   </div>
				   <?php
				   if ( has_nav_menu( 'primary' ) ) {
					  wp_nav_menu(
						 array(
							'container' => 'ul',
							'menu_class' => 'main-menu d-flex gap-3 flex-wrap align-items-center',
							'theme_location' => 'primary',
						 )
					  );
				   }
				   ?>
				</div>


               </div>
               <div class="header-right">
                  <div class="d-flex align-items-center callarea">
                     <div class="phonein d-flex align-items-center">
                        <a href="tel:<?php echo get_field('phone_call_number','options');?>"><div class="callicon"><span><i class="fa-solid fa-phone"></i></span></div></a>
                        <div class="call-body">
                           <h6><?php echo get_field('header_call_title','options');?></h6>
                           <h5><a href="tel:<?php echo get_field('phone_call_number','options');?>"><?php echo get_field('phone_number','options');?></a></h5>
                        </div>
                     </div>
                     <a href="<?php echo get_field('header_button_link','options');?>" class="btn"><?php echo get_field('header_button','options');?><span><i class="fa-solid fa-chevron-right"></i></span></a>
                  </div>
               </div>
            </div>
         </div>
      </header>
      <!-- header area stop --> 