@extends('frontend.main')
@section('content')
    
    <section class="page-title-light breadcrumb_section parallax_bg overlay_bg_50" style="background: url({{asset('img/img16.jpg')}})">
        <div class="page-title-light2">
            <div class="container">
                <div class="row align-items-center">
                    <div class="col-sm-6">
                        <div class="heading-title">
                            <h1>{{$service->name}}</h1>
                        </div>
                    </div>
                    <div class="col-sm-6">
                        <nav aria-label="breadcrumb">
                          <ol class="breadcrumb justify-content-sm-end">
                            <li class="breadcrumb-item"><a href="#">Home</a></li>
                            <li class="breadcrumb-item active" aria-current="page">{{$service->name}}</li>
                          </ol>
                        </nav>
                    </div>
                </div>
            </div>  
        </div>
    </section>

    <!--Hosting Section-->
    <section class="hosting-section">
        <div class="auto-container">
            <div class="sec-title centered">
                <h2>{{$service->name}}</h2>
            </div>
            <div class="row clearfix">

                <!--Image Column-->
                <div class="image-column col-lg-6 col-md-12 col-sm-12">
                    <div class="image wow slideInLeft" data-wow-delay="0ms" data-wow-duration="1500ms">
                            <img src="{{asset('frontend/images/resource/bit-bit.png')}}" alt="" />
                    </div>
                </div>

                <!--Content Column-->
                <div class="content-column col-lg-6 col-md-12 col-sm-12">
                    <div class="inner-column">
                        {!! $service->description !!}
                    </div>
                </div>

            </div>
        </div>
    </section>
    <!--End Hosting Section-->

    <!--Info Listing Section-->
    <section class="info-listing-section">
        <div class="auto-container">
            <div class="sec-title centered">
                <h2 style="color: white;">AWT {{$service->name}}</h2>
            </div>
            <div class="cloud-one"></div>
            <div class="cloud-two"></div>
            <div class="row clearfix">

                <!--Hosting Info Block-->
                <div class="hosting-info-block col-lg-12 col-md-12 col-sm-12">
                    <div class="inner-block">
                        {!! $service->short_description !!}
                    </div>
                </div>
            </div>
        </div>
    </section>
    <!--End Info Listing Section-->
    <!--App Section-->
    <section class="app-section">
        <div class="auto-container">
            <div class="row clearfix">
                <div class="app-block col-lg-12 col-md-12 col-sm-12">
                    <div class="inner-box">
                        <div class="content">
                            <h3>
                                {{$service->name}} :
                                <a href="#" data-toggle="modal" data-target="#quoteModal" class="theme-btn btn-style-two float-sm-right float-xs-right"  data-service="{{$service->name}}">
                                    Request a Quote
                                </a>
                            </h3>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </section>
@endsection