Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Added new Service Container #413

Merged
merged 1 commit into from
Jun 2, 2024
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
16 changes: 6 additions & 10 deletions index.html
Original file line number Diff line number Diff line change
Expand Up @@ -440,24 +440,23 @@ <h2>Services</h2>
<p>Our services are for your good health. We are with you at every digital step.</p>
</div>
<div class="container">
<div class="row">
<div class="col-lg-4 col-md-3 d-flex align-items-stretch ">
<div class="align-items-stretch ">
<div class="icon-box">
<div class="icon"><i class="fas fa-heartbeat"></i></div>
<h4><a href="">Clinics/Labs</a></h4>
<p>Locate the best healthcare facilities around you hassle-free.</p>
</div>
</div>

<div class="col-lg-4 col-md-6 d-flex align-items-stretch ">
<div class="align-items-stretch ">
<div class="icon-box">
<div class="icon"><i class="fas fa-pills"></i></div>
<h4><a href="https://www.1mg.com">Pharmacy</a></h4>
<p>Get your prescribed medicines delivered at your doorstep.</p>
</div>
</div>

<div class="col-lg-4 col-md-6 d-flex align-items-stretch ">
<div class="align-items-stretch ">
<div class="icon-box">
<div class="icon"><i class="fas fa-hospital-user"></i></div>
<h4><a href="">Daily Feed</a></h4>
Expand All @@ -466,33 +465,30 @@ <h4><a href="">Daily Feed</a></h4>
</div>
</div>

<div class="col-lg-4 col-md-6 d-flex align-items-stretch ">
<div class="align-items-stretch ">
<div class="icon-box">
<div class="icon"><i class="fas fa-dna"></i></div>
<h4><a href="Html-Files/blood.html">Blood Bank</a></h4>
<p>Know the blood banks and blood groups available around you. No one should suffer ỉn emergencies.</p>
</div>
</div>

<div class="col-lg-4 col-md-6 d-flex align-items-stretch ">
<div class="align-items-stretch ">
<div class="icon-box">
<div class="icon"><i class="fas fa-wheelchair"></i></div>
<h4><a href="">Disabled Person</a></h4>
<p>Convenient medical care is here. Wheelchair accessible hospitals and clinics, find all in one go.</p>
</div>
</div>

<div class="col-lg-4 col-md-6 d-flex align-items-stretch">
<div class="align-items-stretch">
<div class="icon-box">
<div class="icon"><i class="fas fa-notes-medical"></i></div>
<h4><a href="https://www.medicalnewstoday.com/">Health Post</a></h4>
<p>Weekly, monthly, yearly or each day, however you like it!</p>
</div>
</div>

</div>

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

<!-- Add Patient Portal Section -->
Expand Down
40 changes: 31 additions & 9 deletions style.css
Original file line number Diff line number Diff line change
Expand Up @@ -889,7 +889,6 @@ section {

/*################----Services----################*/
.services .icon-box {
z-index: -1;
text-align: center;
margin-left: 80px;
margin-right: 80px;
Expand All @@ -904,7 +903,6 @@ section {
}

.services .icon-box .icon {

margin: 0 auto;
width: 64px;
height: 64px;
Expand All @@ -919,14 +917,11 @@ section {
}

.services .icon-box .icon i {

color: #060606;
font-size: 28px;
}

.services .icon-box .icon::before {


position: absolute;
content: '';
left: -8px;
Expand All @@ -940,24 +935,26 @@ section {
}

.services .icon-box h4 {

font-weight: 700;
margin-bottom: 15px;
font-size: 24px;
}

.services .icon-box h4 a {

color: #55a5ea;
}

.services .icon-box p {

line-height: 24px;
font-size: 14px;
margin-bottom: 0;
}


.services .container {
display: grid;
grid-template-columns: repeat(3, 1fr);
/* gap: 20px; */
margin-top: 8px;
}

.services .icon-box:hover {
Expand All @@ -982,6 +979,31 @@ section {
color: #111111;
}

/* Styles for medium screens */
@media (max-width: 991px) {
.services .container {
grid-template-columns: repeat(2, 1fr);
}
}

/* Styles for smaller screens */
@media (max-width: 767px) {
.services .container {
grid-template-columns: 1fr;
}
}

/* Additional smaller adjustments */
@media (max-width: 575px) {
.services .icon-box {
padding: 20px;
}
.services .icon i {
font-size: 30px;
}
}




/*################----Appointments----################*/
Expand Down