<!doctype html>
<html <?php language_attributes(); ?> class="no-js">
	<head>
		<meta charset="<?php bloginfo('charset'); ?>">
		<title><?php wp_title(''); ?></title>

		<link href="//www.google-analytics.com" rel="dns-prefetch">

		<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
		<meta name="viewport" content="width=device-width, initial-scale=1.0">

		<!-- fix for woocommerce remove if not needed
			<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.6.1/jquery.min.js"></script>
			<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/fancybox/3.5.7/jquery.fancybox.min.css" />
			<script src="https://cdnjs.cloudflare.com/ajax/libs/fancybox/3.5.7/jquery.fancybox.min.js"></script>
		fix for woocommerce remove if not needed -->

		<?php wp_head(); ?>
<link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link href="https://fonts.googleapis.com/css2?family=Montserrat:ital,wght@0,100..900;1,100..900&family=Poppins:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap" rel="stylesheet">


		<script>
        conditionizr.config({
            assets: '<?php echo get_template_directory_uri(); ?>',
            tests: {}
        });
        </script>

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

		<div class="wrapper">

<div id="mobile_nav" uk-offcanvas="flip: true">
	<div class="uk-offcanvas-bar">
		<?php html5blank_nav(); ?>
	</div>
</div>
			<div class="float-bg uk-position-fixed uk-text-center uk-position-bottom-right fb-holder uk-margin-right">
				<a href="tel:2508089572">
							<p class="light-grey uk-margin-remove-bottom">Call us to talk!</p>
							<h4 class=" uk-margin-remove-top">250.808.9572</h4>
					</a>	
			</div>	
			<header class="header clear " role="banner">
				<div class="header-ribbon uk-visible@m">
					<div class="uk-container uk-container-large">
						<div class=" uk-flex uk-flex-middle" uk-grid uk-scrollspy="target: > div; cls: uk-animation-fade; delay: 200">
							<div class="uk-width-2-5@m">
								<div class="uk-flex uk-flex-middle uk-grid-small" uk-grid>
									<div class="uk-width-auto">
										<i class="fa-regular brown i-20 fa-clock-eight"></i>
									</div>
									<div class="uk-width-expand">
										<p class="brown uk-margin-remove uk-text-small">Our Hours</p>
										<p class=" uk-margin-remove">Mon - Fri: 8am - 5pm | Sat - Sun: Closed</p>
									</div>
								</div>
							</div>
							<div class="uk-width-1-3@m uk-flex uk-flex-center">
								<div class="uk-flex uk-flex-middle uk-flex-center uk-grid-small" uk-grid>
									<div class="uk-width-auto">
										<i class="fa-regular brown i-20 fa-location-dot"></i>
									</div>
									<div class="uk-width-expand">
										<p class="brown uk-margin-remove uk-text-small">Service Area</p>
										<p class=" uk-margin-remove">From Osoyoos to Lake Country and more!</p>
									</div>
								</div>
							</div>
							<div class="uk-width-expand@m uk-flex uk-flex-right">
								<div class="uk-flex uk-flex-middle uk-flex-right uk-grid-small " uk-grid>
									<div class="uk-width-auto">
										<i class="fa-regular brown i-20 fa-circle-check"></i>
									</div>
									<div class="uk-width-expand">
										<p class="brown uk-margin-remove uk-text-small">For Your Peace of Mind</p>
										<p class=" uk-margin-remove">We are Fully Insured</p>
									</div>
								</div>
							</div>
						</div>
					</div>
				</div>
				<div class="uk-container uk-container-large">
					<div class="uk-flex uk-flex-top" uk-grid>
						<div class="uk-width-1-2 uk-width-1-6@m">
							<a href="<?php echo home_url(); ?>">
								<img class="logo uk-margin-top uk-text-center" src="<?php echo get_template_directory_uri(); ?>/images/apex-appliances-logo-white@2x.webp" alt="Logo">
							</a>

						</div>
						<div class="uk-width-1-2 uk-width-expand@m  uk-flex uk-flex-middle uk-margin-large-top">

							<nav class="nav uk-visible@l" role="navigation">
								<?php html5blank_nav(); ?>
							</nav>
<a class="uk-float-right uk-hidden@l  menu_pointer" href="#mobile_nav" uk-toggle>
								<i class="far fa-bars white fa-3x"></i>
							</a>
							
						</div>
						<div class="uk-width-1-2 uk-width-auto@m uk-visible@m">
							<a href="tel:2508089572">
								<div class="uk-text-right">
									<div class="cta-box uk-text-center light-grey">
										<p class="uk-margin-remove-bottom ">Need a repair?<br>
										Give us a call!</p>
										<h4 class="">250.808.9572</h4>
									</div>
								</div>
							</a>
						</div>
					</div>
					
				</div>	
			</header>
				