@extends('layouts.app')
    @section('content')
    <style>
        p {
          display: -webkit-box;
          overflow: hidden;
          -webkit-line-clamp: 3;
          -webkit-box-orient: vertical;
        }
    </style>
    <section>
      <div class="container pb-0">
        <div class="row text-center">
          @foreach($careerlist as $job)
          <div class="col-sm-4">
            <div class="icon-box iconbox-border iconbox-theme-colored">
              <a href="#" class="icon icon-gray icon-bordered icon-circled icon-border-effect effect-circled">
                <i class="pe-7s-users"></i>
              </a>
              <h5 class="icon-box-title">{{ $job->position }}</h5>
              <p class="text-gray">{{ $job->jobdesc }}</p>
              <a class="btn btn-dark btn-xs mt-15" href="/apply/{{ $job->id }}">Apply Now</a>
            </div>
          </div>
         @endforeach
         
          <!--<div class="col-sm-4">
            <div class="icon-box iconbox-border iconbox-theme-colored">
              <a href="#" class="icon icon-gray icon-bordered icon-rounded icon-border-effect effect-rounded">
                <i class="pe-7s-users"></i>
              </a>
              <h5 class="icon-box-title">Finance Manager</h5>
              <p class="text-gray">Lorem ipsum dolor sit amet, consectetur adipisicing elit. Molestias non nulla placeat, odio, qui dicta alias.</p>
              <a class="btn btn-dark btn-xs mt-15" href="#">Apply Now</a>
            </div>
          </div>
          
          <div class="col-sm-4">
            <div class="icon-box iconbox-border iconbox-theme-colored">
              <a href="#" class="icon icon-gray icon-bordered icon-circled icon-border-effect effect-circled">
                <i class="pe-7s-users"></i>
              </a>
              <h5 class="icon-box-title">Finance Manager</h5>
              <p class="text-gray">Lorem ipsum dolor sit amet, consectetur adipisicing elit. Molestias non nulla placeat, odio, qui dicta alias.</p>
              <a class="btn btn-dark btn-xs mt-15" href="#">Apply Now</a>
            </div>
          </div>-->
        </div>
      </div>
    </section>
    @endsection