-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathhistory.html
150 lines (127 loc) · 4.89 KB
/
history.html
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
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="shortcut icon" type="x-icon" href="title-image.jpg">
<title> History -PRAYAGRAJ-DARIES</title>
<style>
body {
font-family: Arial, sans-serif;
margin: 0;
padding: 0;
background-color: #f4f4f4;
color: #333;
line-height: 1.6;
}
header {
background-color: #4CAF50;
color: white;
padding: 60px 20px;
text-align: center;
}
nav {
background-color: #000; /* Black */
padding: 15px;
text-align: center;
}
nav a {
color: #fff;
text-decoration: none;
padding: 10px 20px;
margin: 0 10px;
font-size: 1rem;
transition: background-color 0.3s;
}
nav a:hover {
background-color: #28a745; /* Green */
border-radius: 4px;
}
section {
padding: 20px;
}
h2 {
color: #4CAF50;
}
.history-container {
display: flex;
flex-wrap: wrap;
}
.history-item {
background-color: white;
box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);
margin: 10px;
padding: 20px;
flex: 1 1 calc(50% - 40px);
box-sizing: border-box;
transition: transform 0.2s ease-in-out;
}
.history-item:hover {
transform: scale(1.02);
}
.images{
width: 590px;
height: 300px;
}
.history-item img {
border-radius: 5px;
}
footer {
background-color: #333;
color: white;
text-align: center;
padding: 10px;
position: fixed;
bottom: 0;
width: 100%;
}
</style>
</head>
<body>
<header>
<h1>Mera Sahar Mera Goan</h1>
<p>Exploring the rich history of our cities and villages</p>
</header>
<nav>
<a href="index.html">Home</a>
<a href="About.html">About</a>
<a href="Gallery.html">Gallery</a>
<a href="history.html">History</a>
<a href="Culture.html">Culture</a>
<a href="Festivals.html">Festivals</a>
<a href="Food.html">Food</a>
<a href="tourism.html">Tourism</a>
<a href="contact.html">Contact</a>
<a href="faq.html">FAQ</a>
</nav>
<section id="history">
<h2>The Historical Roots of Our Cities and Villages</h2>
<p>Our cities and villages have a deep and rich history, shaped by centuries of culture, trade, and migration. Each has its own story, filled with unique events that have helped shape the community into what it is today. Explore the highlights of this history below.</p>
<div class="history-container">
<div class="history-item">
<h3>Ancient Origins</h3>
<img class="images" src="Photo-vs\download (1).jpg" alt="Ancient Architecture">
<p>Many of our villages date back to ancient times, with evidence of early human settlements. These areas were often located near rivers or other water sources, which provided essential resources for early communities.</p>
</div>
<div class="history-item">
<h3>Medieval Era</h3>
<img class="images" src="Photo-vs\download (2).jpg" alt="Medieval Village">
<p>The medieval period saw the growth of towns and cities as centers of trade and craftsmanship. Fortifications were built to protect inhabitants, and many of the structures from this era still stand today, telling the stories of past generations.</p>
</div>
<div class="history-item">
<h3>Colonial Influence</h3>
<img class="images" src="Photo-vs\images (4).jpg" alt="Colonial Architecture">
<p>The colonial era brought significant changes to the region, with the introduction of new architectural styles, infrastructure, and a blending of cultures. This period has left a lasting impact on the cities, evident in the colonial-era buildings and streetscapes.</p>
</div>
<div class="history-item">
<h3>Post-Independence Development</h3>
<img class="images" src="Photo-vs\download (3).jpg" alt="Modern City">
<p>Since gaining independence, our cities and villages have undergone rapid development, with modernization and urbanization transforming the landscape. However, the essence of our history remains, preserved in the architecture, customs, and traditions that continue to thrive.</p>
</div>
</div>
</section>
<footer>
<p>© 2024 Mera Sahar Mera Goan. All rights reserved.</p>
</footer>
</body>
</html>