Order of routes in Laravel 5

I'm starting in laravel , I have the following routes:

Route::get('/', function () {
     return view('indextemplate');
});

Route::get('/', function () {
     return view('footer');
});

Route::get('/', function () {
     return view('header');
});

Route::get('/', function () {
     return view('script');
});

Route::get('/', function () {
     return view('styles');
});

I have indextemplate :

@extends('layouts.index')

@yield('style')

@section('content')

@yield('header')

    <div id="fh5co-hero" style="background-image: url(images/slide_2.jpg);">
        <div class="overlay"></div>
        <a href="#fh5co-main" class="smoothscroll fh5co-arrow to-animate hero-animate-4"><i class="ti-angle-down"></i></a>
        <!-- End fh5co-arrow -->
        <div class="container">
            <div class="col-md-12">
                <div class="fh5co-hero-wrap">
                    <div class="fh5co-hero-intro">
                        <h1 class="to-animate hero-animate-1">Valet Multi-Purpose Free HTML5 Bootstrap Template</h1>
                        <h2 class="to-animate hero-animate-2">Created by <a href="http://freehtml5.co" target="_blank">FREEHTML5.co</a></h2>
                        <p class="to-animate hero-animate-3"><a href="#" class="btn btn-outline btn-md">Sign up</a></p>
                    </div>
                </div>
            </div>
        </div>      
    </div>

    <div id="fh5co-main">

        <div class="fh5co-cards">
            <div class="container-fluid">
                <div class="row animate-box">
                    <div class="col-md-12 heading text-center"><h2>Outstanding Products</h2></div>
                </div>
                <div class="row">
                    <div class="col-lg-3 col-md-6 col-sm-6 animate-box">
                        <a class="fh5co-card" href="#">
                            <img src="images/img_large_1.jpg" alt="Free HTML5 Bootstrap template" class="img-responsive">
                            <div class="fh5co-card-body">
                                <h3>Web Developer</h3>
                                <p>Lorem ipsum dolor sit amet consectetur adipisicing elit. Iste sunt porro delectus cum officia magnam.</p>
                            </div>
                        </a>
                    </div>
                    <div class="col-lg-3 col-md-6 col-sm-6 animate-box">
                        <a class="fh5co-card" href="#">
                            <img src="images/img_large_2.jpg" alt="Free HTML5 Bootstrap template" class="img-responsive">
                            <div class="fh5co-card-body">
                                <h3>User Experience</h3>
                                <p>Lorem ipsum dolor sit amet consectetur adipisicing elit. Iste sunt porro delectus cum officia magnam.</p>
                            </div>
                        </a>
                    </div>
                    <div class="col-lg-3 col-md-6 col-sm-6 animate-box">
                        <a class="fh5co-card" href="#">
                            <img src="images/img_large_2.jpg" alt="Free HTML5 Bootstrap template" class="img-responsive">
                            <div class="fh5co-card-body">
                                <h3>Web Designer</h3>
                                <p>Lorem ipsum dolor sit amet consectetur adipisicing elit. Iste sunt porro delectus cum officia magnam.</p>
                            </div>
                        </a>
                    </div>
                    <div class="col-lg-3 col-md-6 col-sm-6 animate-box">
                        <a class="fh5co-card" href="#">
                            <img src="images/img_large_3.jpg" alt="Free HTML5 Bootstrap template" class="img-responsive">
                            <div class="fh5co-card-body">
                                <h3>Web Analyst</h3>
                                <p>Lorem ipsum dolor sit amet consectetur adipisicing elit. Iste sunt porro delectus cum officia magnam.</p>
                            </div>
                        </a>
                    </div>
                </div>
            </div>
        </div>

        <div class="container">

            <div class="row text-center" id="fh5co-features">
                <div class="col-md-12 heading animate-box"><h2>Awesome Features</h2></div>
                <div class="col-md-4 col-sm-6 text-center fh5co-feature feature-box">
                    <div class="fh5co-feature-icon">
                        <i class="ti-mobile"></i>
                    </div>
                    <h3 class="heading">Mobile</h3>
                    <p>Lorem ipsum dolor sit amet consectetur adipisicing elit. Iste sunt porro delectus cum officia magnam.</p>
                </div>
                <div class="col-md-4 col-sm-6 text-center fh5co-feature feature-box"> 
                    <div class="fh5co-feature-icon">
                        <i class="ti-lock"></i>
                    </div>
                    <h3 class="heading">Lock</h3>
                    <p>Lorem ipsum dolor sit amet consectetur adipisicing elit. Iste sunt porro delectus cum officia magnam. </p>
                </div>

                <div class="clearfix visible-sm-block"></div>

                <div class="col-md-4 col-sm-6 text-center fh5co-feature feature-box"> 
                    <div class="fh5co-feature-icon">
                        <i class="ti-video-camera"></i>
                    </div>
                    <h3 class="heading">Video</h3>
                    <p>Lorem ipsum dolor sit amet consectetur adipisicing elit. Iste sunt porro delectus cum officia magnam.</p>
                </div>

                <div class="clearfix visible-md-block visible-lg-block"></div>

                <div class="col-md-4 col-sm-6 text-center fh5co-feature feature-box">
                    <div class="fh5co-feature-icon">
                        <i class="ti-shopping-cart"></i>
                    </div>
                    <h3 class="heading">Shop</h3>
                    <p>Lorem ipsum dolor sit amet consectetur adipisicing elit. Iste sunt porro delectus cum officia magnam. </p>
                </div>

                <div class="clearfix visible-sm-block"></div>

                <div class="col-md-4 col-sm-6 text-center fh5co-feature feature-box"> 
                    <div class="fh5co-feature-icon">
                        <i class="ti-palette"></i>
                    </div>
                    <h3 class="heading">Pallete</h3>
                    <p>Lorem ipsum dolor sit amet consectetur adipisicing elit. Iste sunt porro delectus cum officia magnam.</p>
                </div>
                <div class="col-md-4 col-sm-6 text-center fh5co-feature feature-box"> 
                    <div class="fh5co-feature-icon">
                        <i class="ti-truck"></i>
                    </div>
                    <h3 class="heading">Deliver</h3>
                    <p>Lorem ipsum dolor sit amet consectetur adipisicing elit. Iste sunt porro delectus cum officia magnam.</p>
                </div>
            </div>
            <!-- END row -->

        </div>
        <!-- END container -->

        @yield('footer')

        @yield('script')

   @endsection

My HTML

   <!DOCTYPE html>
      <html>
      <head>

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

      <title>index</title>

      @yield('styles')


      </head>
      <body>

      @yield('content')


      @yield('scripts')
      </body>
      </html>

I have all the header , footer files, do not appear in the browser because of the routes orders, tried to use Routes::group(array ...) also did not work, p>