@extends('layouts.course')
@section('content')
<section class="newpage">
    <div class="innermenu">
        <div class="container">
            <div class="row">
                <div class="col-12 col-sm-12 col-md-12 col-lg-12 col-xl-12">
                    <div class="link-path">
                        <ul>
                            <li>Dashboard</li>
                            <li>/</li>
                            <li class="active">Course Packs</li>
                        </ul>
                        <div class="topfilter">
                            <div class="sort_it">
                                <div class="courselisting-sort">
                                    <i class="fa fa-sort-amount-desc" aria-hidden="true"></i>
                                    <select class="selectpicker">
                                        <option>Filter by Date</option>
                                        <option>Filter by Relevance</option>
                                        <option>Filter by Recent</option>
                                    </select>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>

    <div class="fullpage">
        <div class="container">
            <div class="row">
                <div class="col-12 col-sm-12 col-md-3 col-lg-3 col-xl-3">
                    <div class="boxes">
                        <div class="row">
                            <div class="col-12 col-sm-12 col-md-12 col-lg-12 col-xl-12">
                                <div class="stu-dash">
                                    <div class="jobs-filtersection">
                                        <div class="filterhead">
                                            <h3>Filters <span><button class="no-effect" type="button">Clear
                                                        All</button></span></h3>

                                        </div>

                                        <div class="sorting">
                                            <h4>Category <span><button class="no-effect"
                                                        type="button">Clear</button></span></h4>
                                            <ul>
                                                <li><input type="checkbox" id="account" /><label
                                                        for="account">Accounts</label></li>
                                                <li><input type="checkbox" id="gst" /><label for="gst">GST</label></li>
                                                <li><input type="checkbox" id="audit" /><label for="audit">Audit</label>
                                                </li>
                                                <li><input type="checkbox" id="taxes" /><label for="taxes">Taxes</label>
                                                </li>

                                            </ul>

                                        </div>

                                        <div class="sorting">
                                            <h4>Level<span><button class="no-effect" type="button">Clear</button></span>
                                            </h4>

                                            <ul>
                                                <li><input type="checkbox" id="beginner" /><label
                                                        for="beginner">Beginner</label></li>
                                                <li><input type="checkbox" id="intermediate" /><label
                                                        for="intermediate">Intermediate</label></li>
                                                <li><input type="checkbox" id="advanced" /><label
                                                        for="advanced">Advanced</label></li>
                                            </ul>

                                        </div>

                                        <div class="sorting">
                                            <h4>Course Type<span><button class="no-effect"
                                                        type="button">Clear</button></span></h4>

                                            <ul>
                                                <li><input type="checkbox" id="online" /><label
                                                        for="online">Online</label></li>
                                                <li><input type="checkbox" id="inclass" /><label for="inclass">In
                                                        Class</label></li>
                                                <li><input type="checkbox" id="blended" /><label
                                                        for="blended">Blended</label></li>
                                            </ul>
                                        </div>
                                        <div class="sorting">
                                            <h4>Duration<span><button class="no-effect"
                                                        type="button">Clear</button></span></h4>

                                            <ul>
                                                <li><input type="checkbox" id="hrs" /><label for="hrs">0 - 2 hrs</label>
                                                </li>
                                                <li><input type="checkbox" id="hrs1" /><label for="hrs1">0 - 8
                                                        hrs</label></li>
                                                <li><input type="checkbox" id="hrs2" /><label for="hrs2">8 - 72
                                                        hrs</label></li>
                                            </ul>
                                            <div class="more">72+ More</div>
                                        </div>
                                        <div class="sorting">
                                            <h4>Price<span><button class="no-effect" type="button">Clear</button></span>
                                            </h4>

                                            <ul>
                                                <li><input type="checkbox" id="free" /><label for="free">Free</label>
                                                </li>
                                                <li><input type="checkbox" id="under500" /><label for="under500">Under
                                                        Rs. 500</label></li>
                                                <li><input type="checkbox" id="500to1000" /><label for="500to1000">Rs.
                                                        500 - Rs. 1000</label></li>
                                                <li><input type="checkbox" id="1000to3000" /><label for="1000to3000">Rs.
                                                        1000 - Rs. 3000</label></li>
                                            </ul>
                                            <div class="more">Rs. 3000+ More</div>
                                        </div>
                                        <div class="sorting">
                                            <h4>Location<span><button class="no-effect"
                                                        type="button">Clear</button></span></h4>
                                            <ul>
                                                <li><input type="checkbox" id="location1"><label
                                                        for="location1">Location 1</label></li>
                                                <li><input type="checkbox" id="location2"><label
                                                        for="location2">Location 2</label></li>
                                                <li><input type="checkbox" id="location3"><label
                                                        for="location3">Location 3</label></li>
                                                <li><input type="checkbox" id="location4"><label
                                                        for="location4">Location 4</label></li>
                                            </ul>
                                        </div>
                                        <div class="sorting">
                                            <h4>Institute<span><button class="no-effect"
                                                        type="button">Clear</button></span></h4>
                                            <ul>
                                                <li><input type="checkbox" id="Institute1"><label
                                                        for="Institute1">Institute 1</label></li>
                                                <li><input type="checkbox" id="Institute2"><label
                                                        for="Institute2">Institute 2</label></li>
                                                <li><input type="checkbox" id="Institute3"><label
                                                        for="Institute3">Institute 3</label></li>
                                                <li><input type="checkbox" id="Institute4"><label
                                                        for="Institute4">Institute 4</label></li>
                                            </ul>
                                        </div>


                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>

                </div>

                <div class="col-12 col-sm-12 col-md-9 col-lg-9 col-xl-9">
                    <div class="boxes">
                        <div class="searchbar1">
                            <form>
                                <div class="form-inline search-form">

                                    <input class="form-control mr-sm-2" type="search" placeholder="Search By Course"
                                        aria-label="Search">
                                    <div class="search-button">
                                        <button type="submit">
                                            <img src="{{asset('images/search.png')}}" class="search-one">
                                        </button>
                                    </div>
                                </div>
                            </form>
                        </div>

                        <div class="job-list-content">
                            <div class="listofjob">
                                <div class="row">
                                    <div class="col-12 col-sm-12 col-md-12 col-lg-8 col-xl-8">
                                        <div class="job-list-info">
                                            <h2>GST Course</h2>
                                            <h4>Headrun Technologies</h4>
                                            <div class="companydetailes">
                                                <div class="company-info">
                                                    <div class="companyleft"><img src="{{asset('images/time.svg')}}" />
                                                    </div>
                                                    <div class="companyright">
                                                        <p>Hours</p>
                                                        <span>24</span>
                                                    </div>
                                                </div>
                                                <div class="company-info">
                                                    <div class="companyleft"><img
                                                            src="{{asset('images/3d-boxes.svg')}}" /></div>
                                                    <div class="companyright">
                                                        <p>No of jobs posted</p>
                                                        <span>240</span>
                                                    </div>
                                                </div>
                                                <div class="company-info">
                                                    <div class="companyleft"><img src="{{asset('images/edit.svg')}}" />
                                                    </div>
                                                    <div class="companyright">
                                                        <p>Lessons</p>
                                                        <span>12</span>
                                                    </div>
                                                </div>
                                            </div>
                                            <div class="skillsdetailes">
                                                <h5>Skills:</h5>
                                                <ul>
                                                    <li><a href="javascript:void(0)">Skill1</a></li>
                                                    <li><a href="javascript:void(0)">|</a></li>
                                                    <li><a href="javascript:void(0)">Skill1</a></li>
                                                    <li><a href="javascript:void(0)">|</a></li>
                                                    <li><a href="javascript:void(0)">Skill1</a></li>
                                                    <li><a href="javascript:void(0)">|</a></li>
                                                    <li><a href="javascript:void(0)">Skill1</a></li>
                                                </ul>
                                            </div>
                                        </div>
                                    </div>
                                    <div class="col-6 col-sm-6 col-md-6 col-lg-2 col-xl-2">
                                        <div class="middle-content">
                                            <div class="middle-text">
                                                <h4><img src="{{asset('images/medium.svg')}}" />Medium</h4>
                                            </div>
                                            <div class="middle-text">
                                                <span> <i class="fa fa-star"></i> <i class="fa fa-star"></i> <i
                                                        class="fa fa-star"></i> <i class="fa fa-star"></i> <i
                                                        class="fa fa-star"></i> </span>
                                            </div>
                                            <div class="middle-text">
                                                <h5><img src="{{asset('images/offline.svg')}}" />Offline</h5>
                                            </div>
                                        </div>
                                    </div>
                                    <div class="col-6 col-sm-6 col-md-6 col-lg-2 col-xl-2">
                                        <div class="coursepack-price">
                                            <ul>
                                                <li><button class="no-effect" type="button"> <i
                                                            class="fa fa-share-square"></i> </button></li>
                                                <li><button class="no-effect" type="button"> <i class="fa fa-heart"></i>
                                                    </button></li>
                                            </ul>
                                        </div>
                                        <div class="coursepack-price">
                                            <span> Rs. 5000 </span>
                                        </div>
                                        <div class="buttons">
                                            <a href="#">
                                                <div class="applybut1">Apply</div>
                                            </a>
                                        </div>
                                    </div>
                                </div>
                            </div>

                            <div class="listofjob">
                                <div class="row">
                                    <div class="col-12 col-sm-12 col-md-12 col-lg-8 col-xl-8">
                                        <div class="job-list-info">
                                            <h2>CPF Mastery</h2>
                                            <h4>Headrun Technologies</h4>
                                            <div class="companydetailes">
                                                <div class="company-info">
                                                    <div class="companyleft"><img src="{{asset('images/time.svg')}}" />
                                                    </div>
                                                    <div class="companyright">
                                                        <p>Hours</p>
                                                        <span>24</span>
                                                    </div>
                                                </div>

                                                <div class="company-info">
                                                    <div class="companyleft"><img
                                                            src="{{asset('images/3d-boxes.svg')}}" /></div>
                                                    <div class="companyright">
                                                        <p>No of jobs posted</p>
                                                        <span>240</span>
                                                    </div>
                                                </div>

                                                <div class="company-info">
                                                    <div class="companyleft"><img src="{{asset('images/edit.svg')}}" />
                                                    </div>
                                                    <div class="companyright">
                                                        <p>Lessons</p>
                                                        <span>12</span>
                                                    </div>
                                                </div>
                                            </div>

                                            <div class="skillsdetailes">
                                                <h5>Skills:</h5>
                                                <ul>
                                                    <li><a href="javascript:void(0)">Skill1</a></li>
                                                    <li><a href="javascript:void(0)">|</a></li>
                                                    <li><a href="javascript:void(0)">Skill1</a></li>
                                                    <li><a href="javascript:void(0)">|</a></li>
                                                    <li><a href="javascript:void(0)">Skill1</a></li>
                                                    <li><a href="javascript:void(0)">|</a></li>
                                                    <li><a href="javascript:void(0)">Skill1</a></li>
                                                </ul>
                                            </div>
                                        </div>
                                    </div>
                                    <div class="col-6 col-sm-6 col-md-6 col-lg-2 col-xl-2">
                                        <div class="middle-content">
                                            <div class="middle-text">
                                                <h4><img src="{{asset('images/medium.svg')}}" />Medium</h4>
                                            </div>
                                            <div class="middle-text">
                                                <span> <i class="fa fa-star"></i> <i class="fa fa-star"></i> <i
                                                        class="fa fa-star"></i> <i class="fa fa-star"></i> <i
                                                        class="fa fa-star"></i> </span>
                                            </div>
                                            <div class="middle-text">
                                                <h5><img src="{{asset('images/offline.svg')}}" />Offline</h5>
                                            </div>
                                        </div>
                                    </div>
                                    <div class="col-6 col-sm-6 col-md-6 col-lg-2 col-xl-2">
                                        <div class="coursepack-price">
                                            <ul>
                                                <li><button class="no-effect" type="button"> <i
                                                            class="fa fa-share-square"></i> </button></li>
                                                <li><button class="no-effect" type="button"> <i class="fa fa-heart"></i>
                                                    </button></li>
                                            </ul>
                                        </div>
                                        <div class="coursepack-price">
                                            <span> Rs. 5000 </span>
                                        </div>
                                        <div class="buttons">
                                            <a href="#">
                                                <div class="applybut1">Apply</div>
                                            </a>
                                        </div>
                                    </div>
                                </div>
                            </div>

                            <div class="listofjob">
                                <div class="row">
                                    <div class="col-12 col-sm-12 col-md-12 col-lg-8 col-xl-8">
                                        <div class="job-list-info">
                                            <h2>CPF Mastery</h2>
                                            <h4>Headrun Technologies</h4>
                                            <div class="companydetailes">
                                                <div class="company-info">
                                                    <div class="companyleft"><img src="{{asset('images/time.svg')}}" />
                                                    </div>
                                                    <div class="companyright">
                                                        <p>Hours</p>
                                                        <span>24</span>
                                                    </div>
                                                </div>

                                                <div class="company-info">
                                                    <div class="companyleft"><img
                                                            src="{{asset('images/3d-boxes.svg')}}" /></div>
                                                    <div class="companyright">
                                                        <p>No of jobs posted</p>
                                                        <span>240</span>
                                                    </div>
                                                </div>

                                                <div class="company-info">
                                                    <div class="companyleft"><img src="{{asset('images/edit.svg')}}" />
                                                    </div>
                                                    <div class="companyright">
                                                        <p>Lessons</p>
                                                        <span>12</span>
                                                    </div>
                                                </div>
                                            </div>

                                            <div class="skillsdetailes">
                                                <h5>Skills:</h5>
                                                <ul>
                                                    <li><a href="javascript:void(0)">Skill1</a></li>
                                                    <li><a href="javascript:void(0)">|</a></li>
                                                    <li><a href="javascript:void(0)">Skill1</a></li>
                                                    <li><a href="javascript:void(0)">|</a></li>
                                                    <li><a href="javascript:void(0)">Skill1</a></li>
                                                    <li><a href="javascript:void(0)">|</a></li>
                                                    <li><a href="javascript:void(0)">Skill1</a></li>
                                                </ul>
                                            </div>
                                        </div>
                                    </div>
                                    <div class="col-6 col-sm-6 col-md-6 col-lg-2 col-xl-2">
                                        <div class="middle-content">
                                            <div class="middle-text">
                                                <h4><img src="{{asset('images/medium.svg')}}" />Medium</h4>
                                            </div>
                                            <div class="middle-text">
                                                <span> <i class="fa fa-star"></i> <i class="fa fa-star"></i> <i
                                                        class="fa fa-star"></i> <i class="fa fa-star"></i> <i
                                                        class="fa fa-star"></i> </span>
                                            </div>
                                            <div class="middle-text">
                                                <h5><img src="{{asset('images/offline.svg')}}" />Offline</h5>
                                            </div>
                                        </div>
                                    </div>
                                    <div class="col-6 col-sm-6 col-md-6 col-lg-2 col-xl-2">
                                        <div class="coursepack-price">
                                            <ul>
                                                <li><button class="no-effect" type="button"> <i
                                                            class="fa fa-share-square"></i> </button></li>
                                                <li><button class="no-effect" type="button"> <i class="fa fa-heart"></i>
                                                    </button></li>
                                            </ul>
                                        </div>
                                        <div class="coursepack-price">
                                            <span> Rs. 5000 </span>
                                        </div>
                                        <div class="buttons">
                                            <a href="#">
                                                <div class="applybut1">Apply</div>
                                            </a>
                                        </div>
                                    </div>
                                </div>
                            </div>

                            <div class="listofjob">
                                <div class="row">
                                    <div class="col-12 col-sm-12 col-md-12 col-lg-8 col-xl-8">
                                        <div class="job-list-info">
                                            <h2>CPF Mastery</h2>
                                            <h4>Headrun Technologies</h4>
                                            <div class="companydetailes">
                                                <div class="company-info">
                                                    <div class="companyleft"><img src="{{asset('images/time.svg')}}" />
                                                    </div>
                                                    <div class="companyright">
                                                        <p>Hours</p>
                                                        <span>24</span>
                                                    </div>
                                                </div>

                                                <div class="company-info">
                                                    <div class="companyleft"><img
                                                            src="{{asset('images/3d-boxes.svg')}}" /></div>
                                                    <div class="companyright">
                                                        <p>No of jobs posted</p>
                                                        <span>240</span>
                                                    </div>
                                                </div>

                                                <div class="company-info">
                                                    <div class="companyleft"><img src="{{asset('images/edit.svg')}}" />
                                                    </div>
                                                    <div class="companyright">
                                                        <p>Lessons</p>
                                                        <span>12</span>
                                                    </div>
                                                </div>
                                            </div>

                                            <div class="skillsdetailes">
                                                <h5>Skills:</h5>
                                                <ul>
                                                    <li><a href="javascript:void(0)">Skill1</a></li>
                                                    <li><a href="javascript:void(0)">|</a></li>
                                                    <li><a href="javascript:void(0)">Skill1</a></li>
                                                    <li><a href="javascript:void(0)">|</a></li>
                                                    <li><a href="javascript:void(0)">Skill1</a></li>
                                                    <li><a href="javascript:void(0)">|</a></li>
                                                    <li><a href="javascript:void(0)">Skill1</a></li>
                                                </ul>
                                            </div>
                                        </div>
                                    </div>
                                    <div class="col-6 col-sm-6 col-md-6 col-lg-2 col-xl-2">
                                        <div class="middle-content">
                                            <div class="middle-text">
                                                <h4><img src="{{asset('images/medium.svg')}}" />Medium</h4>
                                            </div>
                                            <div class="middle-text">
                                                <span> <i class="fa fa-star"></i> <i class="fa fa-star"></i> <i
                                                        class="fa fa-star"></i> <i class="fa fa-star"></i> <i
                                                        class="fa fa-star"></i> </span>
                                            </div>
                                            <div class="middle-text">
                                                <h5><img src="{{asset('images/offline.svg')}}" />Offline</h5>
                                            </div>
                                        </div>
                                    </div>
                                    <div class="col-6 col-sm-6 col-md-6 col-lg-2 col-xl-2">
                                        <div class="coursepack-price">
                                            <ul>
                                                <li><button class="no-effect" type="button"> <i
                                                            class="fa fa-share-square"></i> </button></li>
                                                <li><button class="no-effect" type="button"> <i class="fa fa-heart"></i>
                                                    </button></li>
                                            </ul>
                                        </div>
                                        <div class="coursepack-price">
                                            <span> Rs. 5000 </span>
                                        </div>
                                        <div class="buttons">
                                            <a href="#">
                                                <div class="applybut1">Apply</div>
                                            </a>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</section>
@endsection