<%- include("pages/header")%>
    <!-- Navbar End -->


    <!-- Header Start -->
    <div class="jumbotron jumbotron-fluid mb-5">
        <div class="container text-center py-5">
            <h1 class="text-white display-3">ABOUT</h1>
            <h4 class="text-primary display-3">
                ATAYESHE OIL & MARINE SERVICES
            </h4>
            <div class="d-inline-flex align-items-center text-white">
                <p class="m-0 d-flex align-items-center">
                    
                    <a class="text-white text-decoration-none mx-2" href="/" aria-label="Home">Home</a>
                    <span class="px-2 text-muted">|</span>
                </p>
                <p class="m-0 d-flex align-items-center">
                    
                    <a class="text-white text-decoration-none mx-2" href="/airfrieght" aria-label="Services">Services</a>
                    <span class="px-2 text-muted">|</span>
                </p>
                <p class="m-0 d-flex align-items-center">
                    
                    <a class="text-white text-decoration-none mx-2" href="/contact" aria-label="Contact">Contact</a>
                    <span class="px-2 text-muted">|</span>
                </p>
                <p class="m-0 d-flex align-items-center">
                    
                    <a class="text-white text-decoration-none mx-2" href="/about" aria-label="About">About</a>
                </p>
            </div>
            
        </div>
    </div>
    <!-- Header End -->


    <!-- About Start -->
    <div class="container-fluid py-5">
        <div class="container">
            <div class="row align-items-center">
                <div class="col-lg-5 pb-4 pb-lg-0">
                    <img class="img-fluid w-100" src="img/about.jpg" alt="">
                    <div class="bg-primary text-dark text-center p-4">
                        <h3 class="m-0">10+ Years Experience</h3>
                    </div>
                </div>
                <div class="col-lg-7">
                    <h6 class="text-primary text-uppercase font-weight-bold">About Us</h6>
                    <h1 class="mb-4">Trusted & Faster Freight Service Provider</h1>
                    <p class="mb-4">We provide customized, door-to-door services tailored to meet your specific needs, whether for imports or exports. Our comprehensive solutions cover transportation by land, sea, or air, offering full loads, groupage, trailers, or containers worldwide.</p>
                    <div class="d-flex align-items-center pt-2">
                        <button type="button" class="btn btn-primary">
                            <span>More  <i class="fa fa-plus"></i></span>
                        </button>
                        
                    </div>
                </div>
            </div>
        </div>
        <!-- Video Modal -->
        <div class="modal fade" id="videoModal" tabindex="-1" role="dialog" aria-labelledby="exampleModalLabel" aria-hidden="true">
            <div class="modal-dialog" role="document">
                <div class="modal-content">
                    <div class="modal-body">
                        <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                            <span aria-hidden="true">&times;</span>
                        </button>        
                        <!-- 16:9 aspect ratio -->
                        <div class="embed-responsive embed-responsive-16by9">
                            <iframe class="embed-responsive-item" src="" id="video"  allowscriptaccess="always" allow="autoplay"></iframe>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
   
    <!-- About End -->


  


    <!-- Team Start -->
    <div class="container-fluid pt-5">
        <div class="container">
            <div class="text-center pb-4">
                <h6 class="text-primary text-uppercase font-weight-bold">Our Dedicated Professionals</h6>
                <h1 class="mb-4">Meet the Team Behind Every Successful Delivery</h1>
                <p class="text-muted">Our experienced team ensures timely and reliable delivery for all your freight and logistics needs.</p>
            </div>
            
            <div class="row">
                <div class="col-lg-3 col-md-6">
                    <div class="team card position-relative overflow-hidden border-0 mb-5">
                        <img class="card-img-top" src="img/ajigo.png" alt="" style="height:250px">
                        <div class="card-body text-center p-0">
                            <div class="team-text d-flex flex-column justify-content-center bg-secondary">
                                <h5 class="font-weight-bold">Kola Ajigo</h5>
                                <span>Head of operations</span>
                            </div>
                            <div class="team-social d-flex align-items-center justify-content-center bg-primary">
                                <a class="btn btn-outline-dark btn-social mr-2" href="#"><i class="fab fa-twitter"></i></a>
                                <a class="btn btn-outline-dark btn-social mr-2" href="#"><i class="fab fa-facebook-f"></i></a>
                                <a class="btn btn-outline-dark btn-social mr-2" href="#"><i class="fab fa-linkedin-in"></i></a>
                                <a class="btn btn-outline-dark btn-social" href="#"><i class="fab fa-instagram"></i></a>
                            </div>
                        </div>
                    </div>
                </div>
                <div class="col-lg-3 col-md-6">
                    <div class="team card position-relative overflow-hidden border-0 mb-5">
                        <img class="card-img-top" src="img/sale.png" alt="" style="height:250px">
                        <div class="card-body text-center p-0">
                            <div class="team-text d-flex flex-column justify-content-center bg-secondary">
                                <h5 class="font-weight-bold">Adeyemi Adeola</h5>
                                <span>Sales Operator</span>
                            </div>
                            <div class="team-social d-flex align-items-center justify-content-center bg-primary">
                                <a class="btn btn-outline-dark btn-social mr-2" href="#"><i class="fab fa-twitter"></i></a>
                                <a class="btn btn-outline-dark btn-social mr-2" href="#"><i class="fab fa-facebook-f"></i></a>
                                <a class="btn btn-outline-dark btn-social mr-2" href="#"><i class="fab fa-linkedin-in"></i></a>
                                <a class="btn btn-outline-dark btn-social" href="#"><i class="fab fa-instagram"></i></a>
                            </div>
                        </div>
                    </div>
                </div>
                
                
            </div>
        </div>
    </div>
    <!-- Team End -->
    <%- include('pages/footer')%>

    