@model IEnumerable<FirstThreeServicesViewModel>

@{
    ViewData["Title"] = "Services";
}

<section style="background-color: rgba(255, 255, 255, 0.5);padding-top:50px" class="doctor_section layout_padding">
    <div class="container">
        <div class="heading_container heading_center">
            <h2 style="margin-top: 1em">
                Our Services
            </h2>
            <div style="padding:0" class="alert alert-primary" role="alert">
                <h4 class="alert-heading">To list all our services and make appointment, create account as PATIENT! </h4>
            </div>
            <p class="col-md-10 mx-auto px-0">
                We have the best and modern medical devices that you can use!
            </p>
        </div>
        <div class="row">

            @foreach (var service in Model)
            {
                <div class="col-sm-6 col-lg-4 mx-auto">
                    <div class="box">
                        <div class="img-box">
                            <img src="@service.EquipmentPicture" alt="Picture">
                        </div>
                        <div class="detail-box">
                            <h5>
                                @service.Name
                            </h5>
                            <h6 class="">
                                Price Per Appointment: @service.Price &euro;
                            </h6>
                        </div>
                    </div>
                </div>
            }
        </div>
    </div>
</section>
