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

<style>
    .box {
        background-color: rgba(255, 255, 255, 0.5) !important;
        height: 20rem;
    }
    .img-box{
        margin-top: 1rem;  
    }
</style>

<section class="department_section layout_padding">
    <div class="department_container">
        <div class="container ">
            <div class="heading_container heading_center">
                <h2>
                    Our Departments
                </h2>
                <p>
                    A division of the medical staff of a hospital for the provision of a specified type of medical diagnosis or treatment.
                </p>
            </div>
            <div class="row">
                <div class="col-md-3">
                    <div class="box ">
                        <div class="img-box">
                            <img src="~/img/images/s1.png" alt="">
                        </div>
                        <div class="detail-box">
                            <h5>
                                Cardiology
                            </h5>
                            <p>
                                A branch of medicine that specializes in diagnosing and treating diseases of the heart, blood vessels, and circulatory system.
                            </p>
                        </div>
                    </div>
                </div>
                <div class="col-md-3">
                    <div class="box ">
                        <div class="img-box">
                            <img src="~/img/images/s2.png" alt="">
                        </div>
                        <div class="detail-box">
                            <h5>
                                Diagnosis
                            </h5>
                            <p>
                                The identification of the nature of an illness or other problem by examination of the symptoms.
                            </p>
                        </div>
                    </div>
                </div>
                <div class="col-md-3">
                    <div class="box ">
                        <div class="img-box">
                            <img src="~/img/images/s3.png" alt="">
                        </div>
                        <div class="detail-box">
                            <h5>
                                Surgery
                            </h5>
                            <p>
                                The branch of medical practice that treats injuries, diseases, and deformities by the physical removal, repair, or readjustment of organs and tissues, often involving cutting into the body.
                            </p>
                        </div>
                    </div>
                </div>
                <div   class="col-md-3">
                    <div class="box ">
                        <div class="img-box">
                            <img src="~/img/images/s4.png" alt="">
                        </div>
                        <div class="detail-box">
                            <h5>
                                First Aid
                            </h5>
                            <p>
                                First aid is the first and immediate assistance given to any person with either a minor or serious illness or injury, with care provided to preserve life.
                            </p>
                        </div>
                    </div>
                </div>
            </div>
            <div class="btn-box">
                <a asp-controller="Home" asp-action="AllDepartments">
                    View All
                </a>
            </div>
        </div>
    </div>
</section>
