@extends('client.layouts.app')

@section('title', __('Profile'))

@section('content')
<section class="container-fluid tutorial">
    <h2 class="pageTitle">
        <i class="ci ci-computer-green"></i>TUTORIAL
    </h2>
    <div class="row">
        <div class="col-sm-4 col-lg-3">
            <div class="modal-card">
                <h4>OPTOVISTA</h4>
                <p>STORIA DI UN REBRANDING</p>
                <hr />
                <div class="embed-responsive embed-responsive-16by9">
                    <video controls="" playsinline="" preload="none" poster="{{asset('img/2-OPTOVISTA-video.png')}}"> 
                        <source src="{{asset('documents/tutorial.mp4')}}" type="video/mp4" target="_blank"/>
                    </video>
                </div>
            </div>
        </div>
        <div class="col-sm-4 col-lg-3">
            <div class="modal-card">
                <h4>AQT INGENIA</h4>
                <p>AQT INGENIA</p>
                <hr />
                <div class="embed-responsive embed-responsive-16by9">
                    <video controls="" playsinline="" preload="none" poster="{{asset('img/8-AQT-INGENIA-video.png')}}">>
                    <source src="{{asset('documents/aqt.mp4')}}" type="video/mp4" target="_blank"/>
                    </video>
                </div>
            </div>
        </div>
        <div class="col-sm-4 col-lg-3">
            <div class="modal-card">
                <h4>COME REGISTRARSI? </h4>
                <p>SCOPRI COME REGISTRARTI AL PORTALE </p>
                <hr />
                <div class="embed-responsive embed-responsive-16by9">
                    <video controls="" playsinline="" preload="none" poster="{{asset('img/poster-registrati.png')}}">>
                    <source src="{{asset('documents/Pillola1_ComeRegistrarsi_3.mp4')}}" type="video/mp4" target="_blank"/>
                    </video>
                </div>
            </div>
        </div>
        <div class="col-sm-4 col-lg-3">
            <div class="modal-card">
                <h4>PUNTI VENDITA</h4>
                <p>SCOPRI COME AGGIUNGERE UN PUNTO VENDITA SUL PORTALE</p>
                <hr />
                <div class="embed-responsive embed-responsive-16by9">
                    <video controls="" playsinline="" preload="none" poster="{{asset('img/punto-vendita.png')}}"> 
                        <source src="{{asset('documents/Pillola2_PuntoVendita_prev2.mp4')}}" type="video/mp4" target="_blank"/>
                    </video>
                </div>
            </div>
        </div>
        <div class="col-sm-4 col-lg-3">
            <div class="modal-card">
                <h4>NUOVO COLLABORATORE</h4>
                <p>SCOPRI COME AGGIUNGERE NUOVI COLLABORATORI AL PORTALE</p>
                <hr />
                <div class="embed-responsive embed-responsive-16by9">
                    <video controls="" playsinline="" preload="none" poster="{{asset('img/Pillola3.jpg')}}"> 
                        <source src="{{asset('documents/Pillola3_Collaboratore_DEF.mp4')}}" type="video/mp4" target="_blank"/>
                    </video>
                </div>
            </div>
        </div>
        <div class="col-sm-4 col-lg-3">
            <div class="modal-card">
                <h4>MODIFICARE I DATI</h4>
                <p>SCOPRI COME MODIFICARE I DATI INSERITI ALL'INTERNO DEL PORTALE</p>
                <hr />
                <div class="embed-responsive embed-responsive-16by9">
                    <video controls="" playsinline="" preload="none" poster="{{asset('img/Pillola5.jpg')}}"> 
                        <source src="{{asset('documents/Pillola5_ModificareDati_prev1.mp4')}}" type="video/mp4" target="_blank"/>
                    </video>
                </div>
            </div>
        </div>
        <div class="col-sm-4 col-lg-3">
            <div class="modal-card">
                <h4>COME EFFETTUARE UN ORDINE</h4>
                <p>SCOPRI COME EFFETTUARE UN ORDINE ALL'INTERNO DEL PORTALE</p>
                <hr />
                <div class="embed-responsive embed-responsive-16by9">
                    <video controls="" playsinline="" preload="none" poster="{{asset('img/2021-01-19.jpg')}}"> 
                        <source src="{{asset('documents/Pillola4_NuovoOrdine_prev3.mp4')}}" type="video/mp4" target="_blank"/>
                    </video>
                </div>
            </div>
        </div>
        <div class="col-sm-4 col-lg-3">
            <div class="modal-card">
                <h4>BRILLIANCE ZERO</h4>
                <p>ATTIVAZIONE DEL TRATTAMENTO PRIMA DELLA CONSEGNA DELL’OCCHIALE</p>
                <hr />
                <div class="embed-responsive embed-responsive-16by9">
                    <video controls="" playsinline="" preload="none" poster="{{asset('img/brilliance.png')}}"> 
                        <source src="{{asset('documents/OPTOVISTA_BRILLIANCE_ZERO.mp4')}}" type="video/mp4" target="_blank"/>
                    </video>
                </div>
            </div>
        </div>
    </div>
   <!-- <div class="loader"></div>-->
</section>

@endsection