@extends('layout.main')

@section('title', __('strings.indications.title'))

<!-- ======================================================= -->
@section('content')

    <section id="article">

        <style media="screen">
            video {
                max-width: 100%;
                width: 90%;
                margin: 0 auto;
            }
        </style>

        <div class="main-title">
            <h1>{{ __('strings.indications.title') }}</h1>
        </div>
        <div class="main-content">
            <p>
                <b>Av. Periférico Norte Manuel Gómez Morín 1695 Col. Rinconada de La Azalea, Belenes Norte, 45150 Zapopan, Jal.</b>
            </p>

            <iframe src="https://www.google.com/maps/embed?pb=!1m18!1m12!1m3!1d3731.35391333492!2d-103.38350508450901!3d20.73644468615748!2m3!1f0!2f0!3f0!3m2!1i1024!2i768!4f13.1!3m3!1m2!1s0x8428afeb2ed15277%3A0xa4fbc092f3d25133!2sCineteca%20FICG!5e0!3m2!1sen!2smx!4v1573663476497!5m2!1sen!2smx" frameborder="0" style="border:0;" allowfullscreen=""></iframe>

            <h1>{{ __('strings.indications.routes') }}</h1>
            <div class="routes">
                <div class="block">
                    <div class="icon"><i class="fa fa-bus-alt"></i></div>
                    <div class="caption">T08</div>
                    <div class="subcaption">Vía Corta (634 Vía Corta)</div>
                </div>

                <div class="block">
                    <div class="icon"><i class="fa fa-bus-alt"></i></div>
                    <div class="caption">T08</div>
                    <div class="subcaption">(634)</div>
                </div>

                <div class="block">
                    <div class="icon"><i class="fa fa-bus-alt"></i></div>
                    <div class="caption">C82</div>
                    <div class="subcaption">Batán - Mesa (641 Batán - mesa)</div>
                </div>

                <div class="block">
                    <div class="icon"><i class="fa fa-bus-alt"></i></div>
                    <div class="caption">C81</div>
                    <div class="subcaption">Batán - Lomas (642 Batán - Lomas)</div>
                </div>

                <div class="block">
                    <div class="icon"><i class="fa fa-bus-alt"></i></div>
                    <div class="caption">C82</div>
                    <div class="subcaption">Batán Cinco Esquinas (641)</div>
                </div>

                <div class="block">
                    <div class="icon"><i class="fa fa-bus-alt"></i></div>
                    <div class="caption">C43</div>
                    <div class="subcaption">Haciendas (636 Haciendas del Valle)</div>
                </div>

                <div class="block">
                    <div class="icon"><i class="fa fa-bus-alt"></i></div>
                    <div class="caption">C43</div>
                    <div class="subcaption">Valdepeñas (636 Valdepeñas)</div>
                </div>

                <div class="block">
                    <div class="icon"><i class="fa fa-bus-alt"></i></div>
                    <div class="caption">C43</div>
                    <div class="subcaption">Misiones (636 Belenes - Misiones - Rancho Nuevo)</div>
                </div>

                <div class="block">
                    <div class="icon"><i class="fa fa-bus-alt"></i></div>
                    <div class="caption">C117</div>
                    <div class="subcaption">(78 Molinos)</div>
                </div>

                <div class="block">
                    <div class="icon"><i class="fa fa-bus-alt"></i></div>
                    <div class="caption">A06 (368)</div>
                    <div class="subcaption">Mi Macro Periférico</div>
                </div>

                <div class="block">
                    <div class="icon"><i class="fa fa-bus-alt"></i></div>
                    <div class="caption">Valle-Mesa</div>
                </div>

                <div class="block">
                  <div class="icon"><i class="fa fa-bus-alt"></i></div>
                  <div class="caption">A10</div>
                  <div class="subcaption">Mi Macro Periférico</div>
                </div>

                <div class="block">
                  <div class="icon"><i class="fa fa-bus-alt"></i></div>
                  <div class="caption">C02</div>
                </div>

                <div class="block">
                  <div class="icon"><i class="fa fa-bus-alt"></i></div>
                  <div class="caption">A03</div>
                </div>

                <div class="block">
                  <div class="icon"><i class="fa fa-bus-alt"></i></div>
                  <div class="caption">T01</div>
                </div>

                <div class="block">
                  <div class="icon"><i class="fa fa-bus-alt"></i></div>
                  <div class="caption">T02</div>
                </div>

                <div class="block">
                  <div class="icon"><i class="fa fa-bus-alt"></i></div>
                  <div class="caption">T02-A</div>
                </div>

                <div class="block">
                  <div class="icon"><i class="fa fa-bus-alt"></i></div>
                  <div class="caption">C02</div>
                </div>

                <div class="block">
                  <div class="icon"><i class="fa fa-bus-alt"></i></div>
                  <div class="caption">A03</div>
                  <div class="subcaption">(320-A)</div>
                </div>

            </div>
        </div>

    </section>

    <section class="main-section location-section">
    </section>

@endsection


<!-- ======================================================* -->

@push('styles')
    <link rel="stylesheet" href="{{ asset('css/article.min.css?v=2') }}">
@endpush