Babit Shrestha
6 months ago
@ -0,0 +1,105 @@ |
||||
|
||||
{% extends 'base.html' %} |
||||
{% load static %} |
||||
{% block content %} |
||||
<style> |
||||
/* General Styles */ |
||||
body { |
||||
margin: 0; |
||||
font-family: 'Helvetica Neue', sans-serif; |
||||
background-color: #f4f7fb; |
||||
color: #333; |
||||
} |
||||
|
||||
h1, h2 { |
||||
font-weight: 700; |
||||
color: #2c3e50; |
||||
margin-bottom: 30px; |
||||
} |
||||
|
||||
h1 { |
||||
font-size: 36px; |
||||
} |
||||
|
||||
h2 { |
||||
font-size: 28px; |
||||
} |
||||
|
||||
/* About Us Section */ |
||||
.about-us-section { |
||||
display: flex; |
||||
justify-content: space-between; |
||||
align-items: center; |
||||
padding: 50px 20px; |
||||
background-color: #ffffff; |
||||
margin: 30px auto; |
||||
max-width: 1200px; |
||||
border-radius: 15px; |
||||
box-shadow: 0 10px 30px rgba(0, 0, 0, 0.1); |
||||
transition: transform 0.3s ease, box-shadow 0.3s ease; |
||||
} |
||||
|
||||
.about-us-section:hover { |
||||
transform: translateY(-5px); |
||||
box-shadow: 0 15px 40px rgba(0, 0, 0, 0.15); |
||||
} |
||||
|
||||
.about-us-text { |
||||
flex: 1; |
||||
font-size: 18px; |
||||
line-height: 1.6; |
||||
color: #555; |
||||
text-align: left; |
||||
} |
||||
|
||||
.about-us-text h2 { |
||||
font-size: 28px; |
||||
} |
||||
|
||||
.about-us-text p { |
||||
font-size: 16px; |
||||
color: #777; |
||||
} |
||||
|
||||
.about-us-logo { |
||||
flex: 1; |
||||
display: flex; |
||||
justify-content: center; |
||||
align-items: center; |
||||
} |
||||
|
||||
.about-us-logo img { |
||||
width: 250px; /* Adjust the size as needed */ |
||||
height: auto; |
||||
border-radius: 10px; |
||||
} |
||||
|
||||
/* Responsive Styles */ |
||||
@media (max-width: 768px) { |
||||
.about-us-section { |
||||
flex-direction: column; |
||||
align-items: center; |
||||
} |
||||
|
||||
.about-us-logo { |
||||
margin-top: 20px; |
||||
} |
||||
} |
||||
</style> |
||||
|
||||
<!-- About Us Section --> |
||||
<section class="about-us-section" id="about-us"> |
||||
<div class="about-us-text"> |
||||
<h2>About Us</h2> |
||||
<p>Our Elderly Support App is dedicated to providing high-quality care and assistance to elderly individuals. We understand the importance of independence and security, which is why our app offers features that enhance communication, health monitoring, and emergency support.</p> |
||||
<p>We believe that elderly individuals deserve the best tools to manage their lifestyle, stay connected with loved ones, and receive prompt care when needed. Our mission is to make the lives of seniors safer, healthier, and more fulfilling through technology.</p> |
||||
</div> |
||||
<div class="about-us-logo"> |
||||
<img src="{% static 'img/logofinal.png' %}" alt="Elderly Care Logo"> |
||||
</div> |
||||
</section> |
||||
|
||||
<script> |
||||
// Add any necessary JavaScript here if needed |
||||
</script> |
||||
{% endblock %} |
||||
|
After Width: | Height: | Size: 2.6 MiB |
|
After Width: | Height: | Size: 1.4 MiB |
|
After Width: | Height: | Size: 1.0 MiB |
|
After Width: | Height: | Size: 678 KiB |
|
After Width: | Height: | Size: 1.2 MiB |
|
After Width: | Height: | Size: 4.3 MiB |
|
After Width: | Height: | Size: 4.3 MiB |