Home

<?php
/**
 * The main template file
 *
 * This is the most generic template file in a WordPress theme
 * and one of the two required files for a theme (the other being style.css).
 * It is used to display a page when nothing more specific matches a query.
 * E.g., it puts together the home page when no home.php file exists.
 *
 * @link https://developer.wordpress.org/themes/basics/template-hierarchy/
 *
 * @package Focal_Point
 */

get_header();
?>

	<main id="primary" class="site-main">

		<?php
		if ( have_posts() ) :

			if ( is_home() && ! is_front_page() ) :
				?>
				<header>
					<h1 class="page-title screen-reader-text"><?php single_post_title(); ?></h1>
				</header>
				<?php
			endif;

			/* Start the Loop */
			while ( have_posts() ) :
				the_post();

				/*
				 * Include the Post-Type-specific template for the content.
				 * If you want to override this in a child theme, then include a file
				 * called content-___.php (where ___ is the Post Type name) and that will be used instead.
				 */
				get_template_part( 'template-parts/content', get_post_type() );

			endwhile;

			the_posts_navigation();

		else :

			get_template_part( 'template-parts/content', 'none' );

		endif;
		?>

	</main><!-- #main -->

<h1 style="font-size:200px">Testing</h1>

	<link rel="stylesheet" type="text/css" href="//cdn.jsdelivr.net/npm/[email protected]/slick/slick.css" />
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/slick-carousel/1.8.1/slick-theme.css" integrity="sha512-6lLUdeQ5uheMFbWm3CP271l14RsX1xtx+J5x2yeIDkkiBpeVTNhTqijME7GgRKKi6hCqovwCoBTlRBEC20M8Mg==" crossorigin="anonymous" referrerpolicy="no-referrer" />
    <link href="https://unpkg.com/[email protected]/dist/aos.css" rel="stylesheet">

    <div class="lit-container-fluid lit-my-1">
        <div id="lit-main-slider">
           <div class="lit-skeleton" style="height: 780px;"></div>
        </div>
    </div>

  <div class="lit-container-fluid lit-my-1">
        <div class="lit-row" data-aos="fade-up">
            <div class="lit-col-md-6 lit-my-2">
                <div class="lit-bg-black lit-d-flex lit-align-items-center lit-justify-content-center lit-h-100">
                    <div>
                        <h3 class="lit-text-regular lit-display-sm lit-text-center lit-text-white">Shop by room</h3>              
                        <p class="lit-text-center lit-text-lg lit-text-white">For the right fit for every room in the house. </p>
                    </div>
                </div>
            </div>
            <div class="lit-col-md-3 lit-col-sm-6 lit-relative lit-my-2">
                <a href="/room/bedroom">
                    <img class="lit-img-fluid" src="/wp-content/themes/focal-point/images/rooms/bedroom.jpg" alt="Bedroom">
                    <div class="lit-rooms-title-background">
                        <p class="lit-rooms-title">Bedroom</p>
                    </div>
                </a>
            </div>
            <div class="lit-col-md-3 lit-col-sm-6 lit-relative lit-my-2">
                <a href="/room/family-great-room">
                    <img class="lit-img-fluid" src="/wp-content/themes/focal-point/images/rooms/living-room.jpg" alt="Family Room">
                    <p class="lit-rooms-title">Family Room</p>
                </a>
            </div>
            <div class="lit-col-md-3 lit-col-sm-6 lit-relative lit-my-2">
                <a href="/room/kitchen">
                    <img class="lit-img-fluid" src="/wp-content/themes/focal-point/images/rooms/kitchen.jpg" alt="kitchen">
                    <p class="lit-rooms-title">Kitchen</p>
                </a>
            </div>
            <div class="lit-col-md-3 lit-col-sm-6 lit-relative lit-my-2">
                <a href="/room/dining-room">
                    <img class="lit-img-fluid" src="/wp-content/themes/focal-point/images/rooms/dining-room.jpg" alt="dining room">
                    <p class="lit-rooms-title">Dining Room</p>
                </a>
            </div>
            <div class="lit-col-md-3 lit-col-sm-6 lit-relative lit-my-2">
                <a href="/room/bathroom">
                    <img class="lit-img-fluid" src="/wp-content/themes/focal-point/images/rooms/bathroom.jpg" alt="bathroom">
                    <p class="lit-rooms-title">Bathroom</p>
                </a>
            </div>
            <div class="lit-col-md-3 lit-col-sm-6 lit-relative lit-my-2">
                <a href="/room/outdoor-patio">
                    <img class="lit-img-fluid" src="/wp-content/themes/focal-point/images/rooms/outdoor.jpg" alt="outdoor">
                    <p class="lit-rooms-title">Outdoor</p>
                </a>
            </div>
        </div>
    </div>


<div class="lit-container-fluid lit-my-3">
        <div class="lit-row aos-init aos-animate" data-aos="fade-up">
            <div class="lit-col-md-6">
                <img class="lit-img-fluid" src="/wp-content/themes/focal-point/images/content/in-store.jpg" alt="in store">
            </div>
            <div class="lit-col-md-6">
                <div class="lit-bg-grey lit-p-5 lit-h-100 lit-d-flex lit-align-items-center">
                    <div>
                        <p class="lit-text-regular lit-display-sm lit-my-2">Offering lighting solutions in Vermont Since 1977</p>
                        <p class="lit-text-regular lit-text-lg lit-my-2">Our showroom locations in Midvale is staffed with experts in the commercial lighting and residential lighting industries</p>
                    </div>
                </div> 
            </div>
        </div>
    </div>


<div litcard="parallax">
    <div class="lit-container-fluid lit-my-3 lit-relative">
    <div class="lit-row">
        <div class="lit-col-md-4">
        <img
            class="lit-img-fluid"
            src="/wp-content/themes/focal-point/images/1010-AGB-barron-hudson-valley-style-left.jpg"
            alt="chandelier"
        />
        </div>
        <div class="lit-col-md-4 lit-mt-5">
        <p class="lit-text-light lit-display-md">Modeled after the Danish</p>
        <img
            class="lit-img-fluid lit-my-3 lit-ms-2"
            src="/wp-content/themes/focal-point/images/1010-AGB-barron-hudson-valley-style-text.png"
            alt="classic"
        />
        <p class="lit-ms-5 lit-display-xs lit-text-light">
            these unique pieces are soft but sure to make a statement
        </p>
        </div>
        <div class="lit-col-md-4">
        <img
            class="lit-img-fluid"
            src="/wp-content/themes/focal-point/images/1010-AGB-barron-hudson-valley-style-bottom-right.jpg"
            alt="dining room"
        />
        <img
            class="lit-img-fluid lit-absolute lit-parallax-supporting-image"
            style="left: 50%; transform: translate(10%, 90%)"
            src="/wp-content/themes/focal-point/images/1010-AGB-barron-hudson-valley-style-top-right.jpg"
            alt="chandelier drawing"
        />
        </div>
    </div>
    </div>
</div>

    <div class="lit-container-fluid lit-my-5">
        <div class="lit-row lit-my-4">
            <div class="col-md-12">
                <h2 class="lit-display-md lit-text-regular">Why The Lighting House?</h2>
            </div>
        </div>
        <div class="lit-row lit-my-4">
            <div class="lit-col-md-4 lit-business-highlight lit-relative lit-my-3">
                <p class="lit-display-sm lit-text-regular">Product Knowledge</p>
                <p class="lit-text-regular lit-text-xl lit-pb-3">We know product manufacturers, product lines, comparable items, and more!</p>
            </div>
            <div class="lit-col-md-4 lit-business-highlight lit-relative lit-my-3">
                <p class="lit-display-sm lit-text-regular">Great Value</p>
                <p class="lit-text-regular lit-text-xl lit-pb-3">Get the most for your money without online hassles.</p>
            </div>
            <div class="lit-col-md-4 lit-business-highlight lit-relative lit-my-3">
                <p class="lit-display-sm lit-text-regular">Small Business Benefits</p>
                <p class="lit-text-regular lit-text-xl lit-pb-3">Enjoy a home-town feel in our locally-operated showroom.</p>
            </div>
        </div>
    </div>



<div litcard="collage">
<div class="lit-container-fluid lit-my-3">
  <div class="lit-row">
    <div class="lit-col-md-6">
      <p class="lit-display-md lit-text-center lit-text-semibold lit-my-3">
        Linear chandeliers
      </p>
      <p class="lit-display-sm lit-text-center lit-text-light lit-my-3">
        A perfect fit for long dining tables
      </p>
      <div class="lit-d-flex lit-my-3">
        <a
          class="lit-text-semibold lit-mx-auto lit-btn-border-black lit-py-2 lit-px-3"
          href="/lighting-fixtures/chandeliers/linear-chandeliers"
          >See More Linear Chandeliers</a
        >
      </div>
      <img
        class="lit-img-fluid lit-mx-auto lit-block"
        src="/wp-content/themes/focal-point/images/1157-3P-golden-smyth-bubbles-left.jpg"
        alt="fixtures"
      />
    </div>
    <div class="lit-col-md-6">
      <img
        class="lit-img-fluid"
        src="/wp-content/themes/focal-point/images/1157-3P-golden-smyth-bubbles-right.jpg"
        alt="fixtures"
      />
    </div>
  </div>
</div>
</div>

<div litcard="plain">
<div class="lit-container-fluid lit-my-3" data-aos="fade-up">
  <div class="lit-row">
    <div class="lit-col-md-6 lit-my-2">
      <div
        class="lit-bg-grey lit-h-100 lit-d-flex lit-align-items-center lit-justify-content-center"
      >
        <div>
          <p
            class="lit-text-regular lit-text-xl lit-text-center lit-py-3 lit-px-2"
          >
            Our vast inventory covers every price range.
          </p>
        </div>
      </div>
    </div>
    <div class="lit-col-md-6 lit-my-2">
      <img
        class="lit-img-fluid"
        src="/wp-content/themes/focal-point/images/poppy_40698bk_40692bk_h.jpg"
        alt="bedroom lighting"
      />
    </div>
  </div>
</div>

</div>

    <div class="lit-container-fluid lit-my-3">
        <div class="lit-row">
            <div class="lit-col-md-3">
                <img class="lit-img-fluid" src="/wp-content/themes/focal-point/images/content/dozensofbrands-1.png" alt="kitchen">
            </div>
            <div class="lit-col-md-3">
                <img class="lit-img-fluid" src="/wp-content/themes/focal-point/images/content/dozensofbrands-2.png" alt="chandelier">
            </div>
            <div class="lit-col-md-3">
                <div class="lit-bg-black lit-h-100 lit-d-flex lit-direction-column lit-justify-content-around lit-py-5">
                    <p class="lit-text-white lit-text-regular lit-display-sm lit-text-center">Dozens of Brands</p>
                    <div class="lit-dot lit-mx-auto"></div>
                    <p class="lit-text-white lit-text-regular lit-display-sm lit-text-center">100s of Styles</p>
                    <div class="lit-dot lit-mx-auto"></div>
                    <p class="lit-text-white lit-text-regular lit-display-sm lit-text-center">1 Stop</p>
                </div>
            </div>
            <div class="lit-col-md-3">
                <img class="lit-img-fluid" src="/wp-content/themes/focal-point/images/content/dozensofbrands-3.png" alt="chandelier">
            </div>
        </div>
    </div>

<div litcard="vegas">
    <div class="lit-container-fluid lit-my-3">
    <div class="lit-row">
        <div class="lit-col-md-3">
        <img
            class="lit-img-fluid"
            src="/wp-content/themes/focal-point/images/Quentin_Mercer_4815KZ_3650HB_V.png"
            alt="chandelier"
        />
        </div>
        <div class="lit-col-md-9">
        <div
            style="background-color: #e6e1df"
            class="lit-d-flex lit-justify-content-between lit-align-items-center lit-h-100"
        >
            <img
            class="lit-img-fluid lit-vegas-image lit-mx-3"
            src="/wp-content/themes/focal-point/images/Quentin_Mercer.png"
            alt="chandlier"
            />

            <div class="lit-mx-3">
            <p class="lit-text-semibold lit-display-md lit-overflow-wrap">
                Spice Up Your Kitchen
            </p>
            <p class="lit-text-light lit-display-sm lit-overflow-wrap">
                Geometric lighting will give your kitchen a whole new personality.
            </p>
            <div class="lit-mt-5">
                <a class="lit-bg-brown lit-p-3 lit-text-white" href="/room/kitchen"
                >BROWSE KITCHEN LIGHTING</a
                >
            </div>
            </div>

            <img
            class="lit-img-fluid lit-vegas-image"
            src="/wp-content/themes/focal-point/images/Quentin_Mercer 1.png"
            alt="wall light"
            />
        </div>
        </div>
    </div>
    </div>
</div>

    <div class="lit-container-fluid lit-my-3">
        <div class="lit-row">
            <div class="lit-col-md-3">
                <div class="lit-relative">
                    <img class="lit-img-fluid" src="/wp-content/themes/focal-point//images/call-to-action/schedule-consultation.jpg" alt="Schedule a free consultation">
                    <a class="lit-bg-brown lit-text-white lit-p-2 lit-call-to-action" href="/contact-us">SCHEDULE A FREE <br>DESIGN CONSULTATION</a>
                </div>
            </div>
            <div class="lit-col-md-3">
                <div class="lit-relative">
                    <img class="lit-img-fluid" src="/wp-content/themes/focal-point//images/call-to-action/wishlist.jpg" alt="start your wishlist">
                    <a class="lit-bg-brown lit-text-white lit-p-2 lit-call-to-action" href="/catalog">START A WISHLIST</a>
                </div>
            </div>
            <div class="lit-col-md-6 lit-relative">
                <div class="lit-relative">
                    <img class="lit-img-fluid" src="/wp-content/themes/focal-point//images/call-to-action/collection.jpg" alt="browse the collection">
                    <a class="lit-bg-brown lit-text-white lit-p-2 lit-call-to-action" href="/catalog">BROWSE THE COLLECTION</a>
                </div>
            </div>
        </div>
    </div>

    <div class="lit-container-fluid lit-my-3">
        <div class="lit-row lit-relative">
            <h3 class="lit-text-semibold lit-display-xs">Shop by category</h3>
        </div>
        <div class="lit-row" >
            <div class="lit-px-4" id="shopByCategory">
                <div>
                    <a href="/lighting-fixtures/exterior">
                        <img class="lit-img-fluid" src="/wp-content/themes/focal-point//images/category-slider/slider_outdoor.jpg" alt="outdoor">
                        <p class="lit-text-medium lit-text-sm shopByRoom-item">Outdoor</p>
                    </a>
                </div>
                <div>
                    <a href="/lighting-fixtures/fans">
                        <img class="lit-img-fluid" src="/wp-content/themes/focal-point/images/category-slider/slider_fan.jpg" alt="fan">
                        <p class="lit-text-medium lit-text-sm">Fan</p>
                    </a>
                </div>
                <div>
                    <a href="/lighting-fixtures/sconces">
                        <img  class="lit-img-fluid" src="/wp-content/themes/focal-point/images/category-slider/slider_wall-fixtures.jpg" alt="wall fixture">
                        <p class="lit-text-medium lit-text-sm">Wall Fixture</p>
                    </a>
                </div>
                <div>
                    <a href="/lighting-fixtures/chandeliers">
                        <img class="lit-img-fluid" src="/wp-content/themes/focal-point/images/category-slider/slider_chandelier.jpg" alt="chandelier">
                        <p class="lit-text-medium lit-text-sm">Chandelier</p>
                    </a>
                </div>
                <div>
                    <a href="/lighting-fixtures/lamps">
                        <img class="lit-img-fluid" src="/wp-content/themes/focal-point/images/category-slider/slider_lamp.jpg" alt="lamp">
                        <p class="lit-text-medium lit-text-sm">Lamp</p>
                    </a>
                </div>
                <div>
                    <a href="/lighting-fixtures/pendants">
                        <img class="lit-img-fluid" src="/wp-content/themes/focal-point/images/category-slider/slider_pendant.jpg" alt="pendant">
                        <p class="lit-text-medium lit-text-sm">Pendant</p>
                    </a>
                </div>
            </div>
        </div>
    </div>
<div litcard="double-wide">
<div class="lit-container-fluid lit-my-3">
  <div class="lit-row lit-relative">
    <div class="lit-col-md-6">
      <img
        class="lit-img-fluid"
        src="/wp-content/themes/focal-point/images/content/LANGSTON 24028BK.jpg"
        alt="exterior fixture"
      />
    </div>
    <div class="lit-col-md-6">
      <img
        class="lit-img-fluid"
        src="/wp-content/themes/focal-point/images/content/langston 24028bk detail.jpg"
        alt="exterior lights"
      />
    </div>
    <div class="lit-double-wide-text lit-p-2">
      <p class="lit-text-semibold lit-display-md lit-text-center">
        Outdoor Elegance
      </p>
      <p class="lit-text-light lit-display-sm lit-text-center">
        Add some simple sophistication to your patio.
      </p>
    </div>
  </div>
</div>

</div>

    <div class="lit-container-fluid">
        <div class="lit-row">
            <div class="lit-col-md-4">
                <img class="lit-img-fluid" src="/wp-content/themes/focal-point/images/content/dining-room.jpg" alt="living-room"></div>
            <div class="lit-col-md-4">
                <img class="lit-img-fluid" src="/wp-content/themes/focal-point/images/content/designer.jpg" alt="lighting designer">
            </div>
            <div class="lit-col-md-4 lit-d-flex lit-align-items-center lit-justify-content-center">
                <div>
                    <h3 class="lit-text-semibold lit-display-md lit-text-center">Get personalized advice from a lighting expert</h3>
                    <div class="lit-d-flex lit-my-3">
                        <a class="lit-text-semibold lit-mx-auto lit-bg-black lit-text-white lit-py-2 lit-px-3" href="/contact-us">Contact Us</a>
                    </div>
                </div>
            </div>
        </div>
    </div>

<div litcard="bubbles">
<div class="lit-container-fluid lit-my-3">
  <div class="lit-row">
    <div class="lit-col-md-6">
      <p class="lit-display-md lit-text-center lit-text-semibold lit-my-3">
        Luxury Lighting
      </p>
      <p class="lit-display-sm lit-text-center lit-text-light lit-my-3">
        Exclusive geometric design that's staggeringly beautiful
      </p>
      <div class="lit-d-flex lit-my-3">
        <a
          class="lit-text-semibold lit-mx-auto lit-btn-border-black lit-py-2 lit-px-3"
          href="/catalog"
          >Browse Modern Designs</a
        >
      </div>
      <img
        class="lit-img-fluid lit-mx-auto lit-block"
        src="/wp-content/themes/focal-point/images/content/d49638OZ-kichler-caterham-bubbles-left.jpg"
        alt="fixtures"
      />
    </div>
    <div class="lit-col-md-6">
      <img
        class="lit-img-fluid"
        src="/wp-content/themes/focal-point/images/content/d49638OZ-kichler-caterham-bubbles-right.jpg"
        alt="fixtures"
      />
    </div>
  </div>
</div>

</div>

        <div class="lit-container-fluid lit-my-3">
        <div class="lit-row" id="lit-article-list">
            <div class="lit-col-md-6 lit-my-2">
                <div class="lit-d-flex lit-article-container">
                    <img class="lit-me-3 lit-skeleton" width="260" height="195">
                    <div class="lit-article-content-container">
                        <a class="lit-text-semibold lit-text-xl lit-my-2 lit-block lit-skeleton lit-skeleton-text"></a>
                        <div class="lit-skeleton lit-skeleton-text"></div>
                        <div class="lit-skeleton lit-skeleton-text"></div>
                        <div class="lit-skeleton lit-skeleton-text"></div>
                    </div>
                </div>
            </div>
            <div class="lit-col-md-6 lit-my-2">
                <div class="lit-d-flex lit-article-container">
                    <img class="lit-me-3 lit-skeleton" width="260" height="195">
                    <div class="lit-article-content-container">
                        <a class="lit-text-semibold lit-text-xl lit-my-2 lit-block lit-skeleton lit-skeleton-text"></a>
                        <div class="lit-skeleton lit-skeleton-text"></div>
                        <div class="lit-skeleton lit-skeleton-text"></div>
                        <div class="lit-skeleton lit-skeleton-text"></div>
                    </div>
                </div>
            </div>
            <div class="lit-col-md-6 lit-my-2">
                <div class="lit-d-flex lit-article-container">
                    <img class="lit-me-3 lit-skeleton" width="260" height="195">
                    <div class="lit-article-content-container">
                        <a class="lit-text-semibold lit-text-xl lit-my-2 lit-block lit-skeleton lit-skeleton-text"></a>
                        <div class="lit-skeleton lit-skeleton-text"></div>
                        <div class="lit-skeleton lit-skeleton-text"></div>
                        <div class="lit-skeleton lit-skeleton-text"></div>
                    </div>
                </div>
            </div>
            <div class="lit-col-md-6 lit-my-2">
                <div class="lit-d-flex lit-article-container">
                    <img class="lit-me-3 lit-skeleton" width="260" height="195">
                    <div class="lit-article-content-container">
                        <a class="lit-text-semibold lit-text-xl lit-my-2 lit-block lit-skeleton lit-skeleton-text"></a>
                        <div class="lit-skeleton lit-skeleton-text"></div>
                        <div class="lit-skeleton lit-skeleton-text"></div>
                        <div class="lit-skeleton lit-skeleton-text"></div>
                    </div>
                </div>
            </div>
        </div>
    </div>

<script type="text/javascript" src="//cdn.jsdelivr.net/npm/[email protected]/slick/slick.min.js"></script>
<script src="<?php bloginfo('template_url'); ?>/js/focal-point-homepage.js"></script>
<script src="https://unpkg.com/[email protected]/dist/aos.js"></script>
    <script>
      AOS.init({
        duration: 1200,
        once: true
      });
    </script>

<?php
get_sidebar();
get_footer();