@extends('layouts.app')

@section('content')



    <div class="whitespace-100">
    </div>
    <!-- start latest nieuws -->
            <!-- end -->
    <div class="whitespace-100">
    </div>
        <!-- start near-by-news -->
                <!-- end -->
    <div class="whitespace-100">
    </div>
     <!-- start about -->
        <section id="over-ah-groenlo">
            <div class="d-flex flex-row justify-content-end">
                <div class="col-md-6 flex-row">
                    <h3><b>AH Groenlo:</b></h3>
                    <h1><b>Grolse Naoberschap</b></h1>
                    <p class="underline"></p>
                    <p>
                        Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vivamus sodales, sem vel aliquam
                        egestas, mi nibh ultrices metus, eu efficitur dui eros eget elit. Suspendisse potenti.
                        Phasellus ullamcorper placerat posuere. Donec eget augue eros. Cras nunc dui, molestie
                        quis urna convallis, euismod
                    </p>
                    <a class="more-about-button"><b>Meer over ons <i
                                class="fas fa-external-link-alt"></i></b></a>
                    <div class="col-md-6 dashed-box">
                        <div class="d-flex flex-row">
                            <div class="d-flex col-md-5 employee-box">
                                <div class="flex-row">
                                    <div class="d-flex col-md-12 icon">
                                        <h4><i class="far fa-grin-beam"></i><b> 53</b></h4>
                                    </div>
                                    <div class="d-flex col-md-12">
                                        <p><b>Medewerkers</b></p>
                                    </div>
                                </div>
                            </div>
                            <div class="d-flex col-md-2">

                            </div>
                            <div class="col-md-5 products-box">
                                <div class="d-flex col-md-12 icon">
                                    <h5><i class="far fa-grin-beam"></i><b> ALLE</b></h5>
                                </div>
                                <div class="d-flex col-md-12 text">
                                    <p><b>AH Producten</b></p>
                                </div>
                            </div>
                        </div>
                    </div>

                </div>
                <div class="col-md-5"
                    style="background-image: url('images/albertheijn.jpg'); background-size: cover; min-height: 400px">
                    <div class="align-content-center experience-box">
                        <div class="d-flex flex-row">
                            <div class="d-flex col-md-6">
                                <h1 class="xp-years"><b>25+</b></h1>
                            </div>
                            <div class="d-flex col-md-6">
                                <p class="xp-text">JAREN<br>ERVARING</p>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </section>
     <!-- end -->
    <div class="whitespace-100">
    </div>
    <!-- start socia feed -->
    <section id="social">
        <div class="flex-row justify-content-center" >
            <div class="flex-row ">
                <div class="d-flex flex-row justify-content-center" style="margin-top: 80px">
                    <h1 style="color: #ffffff;"><b>Volg ons overal</b></h1>
                </div>
                <div class="d-flex flex-row justify-content-center">
                    <div class="d-flex">
                        <h1>
                            <a href="https://www.facebook.com/AHGroenlo/" style="color: #ffffff;"><b><i class="fab fa-facebook-f"></i></b></a>
                        </h1>
                    </div>
                    <div class="d-flex ml-4">
                        <h1>
                            <a href="https://www.instagram.com/ahgroenlo/" style="color: #ffffff;"><b><i class="fab fa-instagram"></i></b></a>
                        </h1>
                    </div>
                </div>
            </div>
            <div id="instagram-feed-demo" class="instagram_feed"></div>
            <!-- insta feed -->
                <div class="d-flex flex-row justify-content-center">
                    <div class="d-flex col-md-3">
                        <div class="flex-row col-md-12" style="padding: 0px">
                            <div class="flex-row card">
                                <div class="card-header">
                                    <img src="images/koelwagen.png" width="100%">
                                </div>
                                <div class="card-body">
                                    <p>Sed porttitor lectus nibh. Curabitur aliquet quam id dui posuere blandit. Praesent sapien massa, convallis a pellentesque nec, egestas non nisi. Cras ultricies ligula sed magna dictum porta. Vestibulum ac diam sit amet quam vehicula elementum sed sit amet dui.</p>
                                </div>

                            </div>
                            <div class="d-flex flex-row card">
                                <h1>test</h1>
                            </div>
                        </div>

                    </div>
                    <div class="d-flex col-md-3">
                        <div class="flex-row col-12" style="padding: 0px">
                            <div class="d-flex flex-row card">
                                <h1>test</h1>
                            </div>
                            <div class="d-flex flex-row card">
                                <h1>test</h1>
                            </div>
                        </div>
                    </div>
                    <div class="d-flex col-md-3">
                        <div class="flex-row col-12" style="padding: 0px">
                            <div class="d-flex flex-row card">
                                <h1>test</h1>
                            </div>
                            <div class="d-flex flex-row card">
                                <h1>test</h1>
                            </div>
                        </div>
                    </div>
                </div>
            <!-- insta feed end -->
        </div>
    </section>
    <!-- end -->
    <div class="" style="height: 100px">
    </div>
@endsection