@extends('template_front.index')
@section('url'){{url('bpd')}}
@stop
@section('title','Struktur BPD Desa Nepo Kabupaten Barru')
@section('description','Struktur BPD Desa Nepo Kabupaten Barru')
@section('image'){{asset('assets/img/struktur.png')}}
@stop
@section('content')

<style type="text/css">
  #scroll .col-md-12{
      width: 718px !important;
      left: 0px;margin: 0px;padding: 0px;clear: both;display: inline-flex;
      font-size: 8pt;
    }
  #run{
    border: 1px solid #999292;
    border-radius: 11px;
    padding:2px;
    width: 115px !important;
    display: inline-block;
    background-color: #dfdfdf;
    height: max-content !important;
  }
  .remove .col-md-3{
    border-top: 0px !important;
  }
  #banyak .col-md-2{
    border-left: 1px solid #999292 ;
    border-top: 1px solid #999292 ;
    display: inline-block;
    width: 118px !important;
  }
   #scroll{
      overflow-x: scroll;
    }
  span img{
    height: 57%;
    width: 100%;
  }
  #mantan .col-md-3{
    border:1px solid #999292 ;
    border-radius: 6px;
    text-align: center;
  }
 #fuck{
  border-radius: 4px !important;
  background-color: #dfdfdf;
  border:1px solid #999292  #dfdfdf !important;
 }
 #tagal .col-md-4{
  width: 233px !important;
  display:inline-block;
 }
 span img{
  border-radius: 6px;
 }
 span b,span i{
    padding : 0;
    margin : 0;
    line-height : 20px;
    font-style: normal;
    display: inline-block;
    font-size:12px;
 }
 }
</style>
<div class="container">
  <div class="row">
      <div class="col-md-8">
        <div class="page-header">
          <div class="blog">
            <div class="row" style="text-align: center;" id="scroll">
            <div class="col-md-12" id="tagal">
              <div class="col-md-2"></div>
              <div class="col-md-8"><h4><b>Struktur Organisasi BPD<br> (Badan Permusyawaratan Daerah)</b></h4></div>
              <div class="col-md-2"></div>
            </div>
              <div class="col-md-12">
                <span class="col-md-4" style="width: 298px;display: inline-block;">
                  &nbsp;
                </span>
                 <span class="col-md-4" id="run">
                  @if(empty($pimpinan->nama))
                    No Data<br>
                    <img src="{{asset('assets/img/image_not_found.jpg')}}" alt=""><br>
                    No Data
                  @else
                    <b>{{$pimpinan->nama_jabatan}}</b><br>
                    <img src="{{url(Storage::url($pimpinan->foto))}}" alt="" onerror="this.onerror=null;this.src='{{asset('assets/img/image_not_found.jpg')}}';"><br>
                    <i>{{$pimpinan->nama}}</i>
                  @endif
                 
                </span>
                <span class="col-md-4" style="width: 298px;display: inline-block;">
                  &nbsp;
                </span>
              </div>

              <div class="col-md-12">
                <span class="col-md-1" style="width:57px !important;display: inline-block;">&nbsp;</span>
                <span class="col-md-5" style="width: 301px !important;display: inline-block; border-right: 1px solid #999292 ">&nbsp;</span>
                <span class="col-md-5" style="width: 301px !important;display: inline-block;">&nbsp;</span>
                 <span class="col-md-1" style="width:57px !important;display: inline-block;">&nbsp;</span>
              </div>

              <div class="col-md-12">
                <span class="col-md-1" style="width: 59px !important">&nbsp;</span>
                <span class="col-md-5" style="width: 299px !important;display: inline-block; border-left: 1px solid #999292 ;border-top: 1px solid #999292 ;border-right: 1px solid #999292 ;">&nbsp;
                </span>
                <span class="col-md-5" style="width: 299px !important;display: inline-block; border-right: 1px solid #999292 ;border-top: 1px solid #999292 ">&nbsp;
                </span>
                <span class="col-md-1" style="width: 59px !important">&nbsp;</span>
              </div>
              
              <div class="col-md-12">
                <span class="col-md-2" id="run" style="height: 170px !important">
                  @if(empty($wakil->nama))
                    No Data<br>
                    <img src="{{asset('assets/img/image_not_found.jpg')}}" alt=""><br>
                    No Data
                  @else
                    <b>{{$wakil->nama_jabatan}}</b><br>
                    <img src="{{url(Storage::url($wakil->foto))}}" alt="" onerror="this.onerror=null;this.src='{{asset('assets/img/image_not_found.jpg')}}';"><br>
                     <i>{{$wakil->nama}}</i>
                  @endif
                </span>
                 <span class="col-md-4" style="border-right: 1px solid #999292 ;width: 243px;display: inline-block;height: 190px">
                  &nbsp;
                </span>
                <span class="col-md-4" style="width: 243px;display: inline-block;">
                  &nbsp;
                </span>
                <span class="col-md-2" id="run" style="height: 170px !important">
                  @if(empty($sekertaris->nama))
                    No Data<br>
                    <img src="{{asset('assets/img/image_not_found.jpg')}}" alt=""><br>
                    No Data
                  @else
                    <b>{{$sekertaris->nama_jabatan}}</b><br>
                    <img src="{{url(Storage::url($sekertaris->foto))}}" alt="" onerror="this.onerror=null;this.src='{{asset('assets/img/image_not_found.jpg')}}';"><br>
                      <i>{{$sekertaris->nama}}</i>
                  @endif
                </span>
              </div>

              <div class="col-md-12" id="banyak">
                <span class="col-md-1" style="width: 59px !important">
                  &nbsp;
                </span>
                <span class="col-md-2">
                  &nbsp;
                </span>
                 <span class="col-md-2">
                  &nbsp;
                </span>
                 <span class="col-md-1" style="border-right: 1px solid #999292;width: 65px !important; border-top: 1px solid #999292;border-left: 1px solid #999292">
                 </span>
                 <span class="col-md-1" style="border-top: 1px solid #999292;width: 65px !important">
                </span>
                 <span class="col-md-2">
                  &nbsp;
                </span>
                <span class="col-md-2">
                  &nbsp;
                </span>
                <span class="col-md-1" style="border-left: 1px solid #999292;width: 59px !important">
                  &nbsp;
                </span>                
              </div>

              <div class="col-md-12">
                @if(!empty($bawahan)) 
                @php $jum=0 @endphp
                @foreach($bawahan as $val)
                @php $jum=$jum+1 @endphp
                <span class="col-md-2" style="border: 1px solid #999292 ;margin-right: 2%;margin-left: 2%" id="run">
                    <b>{{$val->nama_jabatan}}</b>
                    <img src="{{url(Storage::url($val->foto))}}" alt="" onerror="this.onerror=null;this.src='{{asset('assets/img/image_not_found.jpg')}}';"><br>
                    <i>{{$val->nama}}</i>
                </span>

                @if(($jum==3)or($jum==9))
                 <span style="border-right: 1px solid #999292 ;margin-left: -1px;margin-right: 4px;">
                  &nbsp;
                </span>
                @endif

                @if(($jum==6)or($jum==11))
                  </div>
                  <div class="col-md-12" id="banyak">
                    <div class="col-md-6" style="width: 359px !important; border-right: 1px solid #999292">&nbsp;</div>
                    <div class="col-md-6" style="width: 359px !important;"></div>
                  </div>
                  <div class="col-md-12" id="banyak">
                    <span class="col-md-1" style="width: 59px !important">
                      &nbsp;
                    </span>
                    <span class="col-md-2">
                      &nbsp;
                    </span>
                     <span class="col-md-2">
                      &nbsp;
                    </span>
                     <span class="col-md-1" style="border-right: 1px solid #999292;width: 65px !important; border-top: 1px solid #999292;border-left: 1px solid #999292">
                     </span>
                     <span class="col-md-1" style="border-top: 1px solid #999292;width: 65px !important">
                    </span>
                     <span class="col-md-2">
                      &nbsp;
                    </span>
                    <span class="col-md-2">
                      &nbsp;
                    </span>
                    <span class="col-md-1" style="border-left: 1px solid #999292;width: 59px !important">
                      &nbsp;
                    </span>                
                  </div>
                  <div class="col-md-12">

                @endif
                @endforeach
                 

                @if(($jum>6)and($jum<=12))
                  @php $a=12-$jum @endphp
                   @for ($i =1; $i <= $a; $i++)
                    @if($a>3)
                      @php $b=$a-2 @endphp 
                    @else
                      @php $b=0 @endphp  
                    @endif
                   
                   @if($i==$b)
                       <span style="border-left: 1px solid #999292;margin-right: 7px;margin-left: 7px; ">
                          &nbsp;
                        </span>
                    @endif
                      <span class="col-md-2" style="border: 1px solid #999292 ;width: 108px !important;margin-left: 15px;margin-right: 12px;" id="fuck">
                    </span>
                  @endfor
                @endif
                @if(($jum>=1)and($jum<=6))
                  @php $a=6-$jum @endphp   
                  @for ($i =1; $i <= $a; $i++)
                    @if($a>3)
                      @php $b=$a-2 @endphp 
                    @else
                      @php $b=0 @endphp  
                    @endif
                   
                   @if($i==$b)
                       <span style="border-left: 1px solid #999292;margin-right: 7px;margin-left: 7px; ">
                          &nbsp;
                        </span>
                    @endif
                      <span class="col-md-2" style="border: 1px solid #999292 ;width: 108px !important;margin-left: 15px;margin-right: 12px;" id="fuck">
                    </span>
                  @endfor
                @endif

                @if($jum=0))
                  @for ($i =1; $i <= 6; $i++)
                     <span class="col-md-2" style="border: 1px solid #999292 ;height:100px;width: 118px;margin-right: 1.2%;" id="fuck">
                    </span>
                  @endfor
                @endif


                @else
                  <div class="col-md-12">
                    <span class="col-md-2" style="border: 1px solid #999292 ;width: 15.666%;margin-right: 1.2%;" id="fuck">
                      No Data<img src="assets/img/image_not_found.jpg" alt="">
                    </span>
                    <span class="col-md-2" style="border: 1px solid #999292 ;width: 15.666%;margin-right: 1.2%;" id="fuck">
                      No Data<img src="assets/img/image_not_found.jpg" alt="">
                    </span>
                    <span class="col-md-2" style="border: 1px solid #999292 ;width: 15.666%;margin-right: 1.2%;" id="fuck">
                      No Data<img src="assets/img/image_not_found.jpg" alt="">
                    </span>
                    <span class="col-md-2" style="border: 1px solid #999292 ;width: 15.666%;margin-right: 1.2%;" id="fuck">
                      No Data<img src="assets/img/image_not_found.jpg" alt="">
                    </span>
                    <span class="col-md-2" style="border: 1px solid #999292 ;width: 15.666%;margin-right: 1.2%;" id="fuck">
                      No Data<img src="assets/img/image_not_found.jpg" alt="">
                    </span>
                    <span class="col-md-2" style="border: 1px solid #999292 ;width: 15.666%;" id="fuck">
                      No Data<img src="assets/img/image_not_found.jpg" alt=""><i class="nama"></i>
                    </span>
                  </div>
                  <br>&nbsp;<br>
                @endif
              </div>
              <br>&nbsp;<br>

           </div>
          </div>
        </div>
        </div>
        {!!view('front.right_page', compact('berita'))!!}      
    </div>
  </div>
  @endsection