@extends('frontend.layouts.navBar')

@section('content')
    <style>
        .banner img {
            height: 389px;
            width: 100%;
            /* filter: invert(1); */
        }
        .container.about{
        max-width: 1659px;
        margin-top: 96px;
         margin-bottom: 96px;
    }
    </style>

    <div class="page">
        <div class="banner">
            <img src="{{ asset('frontend/images/about.jpg') }}" alt="">

        </div>

        <div class="container about">
        <div style="    justify-content: left;
        display: flex;
    ">
          <h4 style="color:red">A propos de nous</h4>
        </div>
     <div class="row">
       @foreach($presentations as $presentation)
       <div class="col-md-12 col-lg-6" style=" color: black;    text-align: left;">
      <p>
        {!! html_entity_decode($presentation->details)!!}
      </p>

       </div>
       <div class="col-md-12 col-lg-6">
        @if ($presentation->videos != null)
            <video  height="440" style="width:100%" controls>
            <source src="{{ asset('storage/'.$presentation->videos)}}" type="video/mp4">

            </video>
            @else
            <img src="{{ asset('storage/image/'.$presentation->image) }}" alt="description of myimage">

        @endif



       </div>

       @endforeach
     </div>
       </div>
        </div>

        <style>
            .image-style-side {
        float: right;
        margin-left: var(--ck-image-style-spacing);
        max-width: 50%;
    }
        </style>
@endsection