@extends("layout.header_main")
<!--==========================
  Header
============================-->
@section("layout_main")
    <!--==========================
	  Header
	============================-->
    <header id="header">
        <div class="container">
            <div id="logo" class="pull-left">
                <h1>
                    <a href="{{route("home")}}" class="scrollto">{{config('app.project_name')}}</a>
                </h1>
            </div>
            <nav id="nav-menu-container">
                <ul class="nav-menu">
                    <li class="menu-active"><a href="{{route("home")}}">صفحه نخست</a></li>

                </ul>
            </nav>
            <!-- #nav-menu-container -->
        </div>
    </header>
    <!-- #header -->

    <!--==========================
	  Intro Section
	============================-->
    <section>
        <div style="background-color:#1DD6AF; width: 100%;height: 120px; ">

        </div>

    </section>

    <!-- #intro -->

    <main id="main">
        <section id="more-features" class="section-bg">
                        <div class="text-center mb-5"><h3>راهنمای استفاده از اپلیکیشن ال بار</h3></div>

            <div class="container">
              
                
            <div class="section-header"></div>
               <div class="row text-center mb-5">
                    <div class="col-lg-2"></div>
                    <div class="col-lg-4 shadow p-5 card" style="margin-left: 5px;">
                        <video style="width: 300px; height: 350px;" controls>
                        <source src="mainpage/video-elbar/sabtenam-ranandegan.mp4" type="video/mp4">
                        </video>
                        <label class="mt-3">ثبت نام در اپلیکیشن ال بار</label>
                    </div>

                    <div class="col-lg-4 shadow card p-5" style="margin-right: 5px;">
                        <video style="width: 300px; height: 350px;" controls>
                        <source src="mainpage/video-elbar/bargraftan.mp4" type="video/mp4">
                        </video>
                        <label class="mt-3">انتخاب و گرفتن بار و پرداخت کمیسیون</label>
                    </div>
                    <div class="col-lg-2"></div>
                </div>
        

                <div class="row text-center mb-5">
                    <div class="col-lg-2"></div>
                    <div class="col-lg-4 shadow card p-5" style="margin-left: 5px;">
                        <video style="width: 300px; height: 350px;" controls>
                        <source src="mainpage/video-elbar/bargiri-download.mp4" type="video/mp4">
                        </video>
                        <label class="mt-3">بارگیری و دریافت بارنامه</label>
                    </div>

                    <div class="col-lg-4 shadow card p-5" style="margin-right: 5px;">
                        <video style="width: 300px; height: 350px;" controls>
                        <source src="mainpage/video-elbar/bar-tonazhi.mp4" type="video/mp4">
                        </video>
                        <label class="mt-3">دریافت و بارنامه بارهای تناژی</label>
                    </div>
                    <div class="col-lg-2"></div>

                </div>
                
                
                <div class="row text-center">
                    <div class="col-lg-2"></div>
                    <div class="col-lg-4 shadow card p-5" style="margin-left: 5px;">
                        <video style="width: 300px; height: 350px;" controls>
                        <source src="mainpage/video-elbar/taghazaye-barname.mp4" type="video/mp4">
                        </video>
                        <label class="mt-3">تقاضای بارنامه</label>
                    </div>

                  

                </div>

        </div>
        </section>
                
                
             
            </div>
        </section>
        <!-- #more-features -->

    </main>


    <a href="#" class="back-to-top"><i class="fa fa-chevron-up"></i></a>
@endsection