Hospital-Website-HTML-CSS-JS/services.html at master · sameera-87/Hospital-Website-HTML-CSS-JS · GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Asiri Hospital Colombo</title>
    <link rel="icon" type="image/png" href="images/asiri_logo.png">

    <script src="https://kit.fontawesome.com/c1df782baf.js" crossorigin="anonymous"></script>
    <link rel="stylesheet" href="https://cdn-uicons.flaticon.com/2.6.0/uicons-regular-straight/css/uicons-regular-straight.css">
    <link rel="stylesheet" href="style.css">
    <link rel="stylesheet" href="services.css">
</head>

<body>

    <!-- Header -->
    <header>
        <div class="logo">
            <img src="images/asiri_logo.png" alt="Asiri Hospital Logo">
        </div>

        <nav class="navbar">
            <a href="index.html">Home</a>
            <a href="about.html">About</a>
            <a href="services.html" class="active">Services</a>
            <a href="facilities.html">Facilities</a>
            <a href="contact.html">Contact</a>
        </nav>

        <div class="right-icons">
            <i id="menu-bars" class="fas fa-bars"></i>
            <div class="btn book-btn">Schedule Consultation</div>
        </div>
    </header>

<!-- Hospital Stats -->
<section class="icons-container">
    <div class="icons">
        <i class="fas fa-user-nurse"></i>
        <h3>120+</h3>
        <p>Qualified Medical Experts</p>
    </div>

    <div class="icons">
        <i class="fas fa-smile-beam"></i>
        <h3>2500+</h3>
        <p>Satisfied Patients</p>
    </div>

    <div class="icons">
        <i class="fas fa-clinic-medical"></i>
        <h3>300+</h3>
        <p>Advanced Treatment Units</p>
    </div>

    <div class="icons">
        <i class="fas fa-hand-holding-heart"></i>
        <h3>1000+</h3>
        <p>Caring Healthcare Staff</p>
    </div>
</section>

<!-- Services Section -->
<section class="services" id="services">
    <h1 class="heading">Our <span>Services</span></h1>

    <div class="box-container">

        <div class="box">
            <i class="fas fa-stethoscope"></i>
            <h3>Comprehensive Health Checkups</h3>
            <p>Regular screening packages to detect health issues early and promote long-term wellness for every patient.</p>
            <a href="#" class="btn">Learn More <span class="fas fa-chevron-right"></span></a>
        </div>

        <div class="box">
            <i class="fas fa-heartbeat"></i>
            <h3>Emergency Response Unit</h3>
            <p>Our 24-hour emergency team and fully equipped ambulances ensure rapid care during critical situations.</p>
            <a href="#" class="btn">Learn More <span class="fas fa-chevron-right"></span></a>
        </div>

        <div class="box">
            <i class="fas fa-user-nurse"></i>
            <h3>Expert Medical Consultants</h3>
            <p>Board-certified specialists offering personalized consultations and advanced treatment plans for all conditions.</p>
            <a href="#" class="btn">Learn More <span class="fas fa-chevron-right"></span></a>
        </div>

        <div class="box">
            <i class="fas fa-capsules"></i>
            <h3>In-House Pharmacy</h3>
            <p>Provides authentic, high-quality medications and medical supplies with guidance from licensed pharmacists.</p>
            <a href="#" class="btn">Learn More <span class="fas fa-chevron-right"></span></a>
        </div>

        <div class="box">
            <i class="fas fa-brain"></i>
            <h3>Advanced Neurology Unit</h3>
            <p>Dedicated neurological services specializing in stroke management, epilepsy care, and neuro-rehabilitation.</p>
            <a href="#" class="btn">Learn More <span class="fas fa-chevron-right"></span></a>
        </div>

        <div class="box">
            <i class="fas fa-child"></i>
            <h3>Children’s Health Center</h3>
            <p>Providing compassionate pediatric care — from newborn health to adolescent wellness and immunization support.</p>
            <a href="#" class="btn">Learn More <span class="fas fa-chevron-right"></span></a>
        </div>
    </div>
</section>


<!-- Footer -->
<footer class="footer">
  <div class="footer-content">
    <div class="footer-box">
      <h2>Follow Us</h2>
      <div class="social-links">
        <a href="#"><i class="fab fa-facebook-f"></i></a>
        <a href="#"><i class="fab fa-twitter"></i></a>
        <a href="#"><i class="fab fa-instagram"></i></a>
        <a href="#"><i class="fab fa-linkedin"></i></a>
      </div>
    </div>
  </div>

  <div class="credit">
    © 2025 | Department of IT, Asiri Hospitals | All Rights Reserved
  </div>
</footer>

</body>
</html>