Map_of_Indian_Culture/assamEx.html at main · Shh-Coder/Map_of_Indian_Culture · 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
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Assam - Cultural Deep Info</title>

<style>
body {
    margin: 0;
    font-family: Arial, sans-serif;
    background: #f0f8f4;
    color: #333;
    animation: fadeIn 1.2s ease-in;
}

/* Fade Animation */
@keyframes fadeIn {
    from { opacity: 0; }
    to { opacity: 1; }
}

/* Header Section */
header {
    background: linear-gradient(to right, #43a047, #66bb6a);
    color: white;
    text-align: center;
    padding: 50px 15px;
}

header h1 {
    margin: 0;
    font-size: 28px;
}

header p {
    margin-top: 10px;
    font-size: 16px;
}

.scroll-text {
    margin-top: 15px;
    font-size: 14px;
    font-weight: bold;
    animation: bounce 1.5s infinite;
}

/* Bounce animation */
@keyframes bounce {
    0% { transform: translateY(0); }
    50% { transform: translateY(6px); }
    100% { transform: translateY(0); }
}

section {
    padding: 30px 20px;
}

/* Card Styling */
.card {
    background: white;
    margin: 30px auto;
    max-width: 850px;
    border-radius: 12px;
    box-shadow: 0 6px 15px rgba(0,0,0,0.12);
    overflow: hidden;
    transition: 0.4s ease;
}

.card:hover {
    transform: scale(1.03);
}

.card img {
    width: 100%;
    height: 200px;   /* Reduced image size */
    object-fit: cover;
}

.card-content {
    padding: 22px;
}

.card-content h2 {
    margin-top: 0;
    color: #43a047;
}

/* Back Button */
.back-btn {
    display: block;
    width: 220px;
    margin: 50px auto;
    padding: 12px;
    text-align: center;
    background: #43a047;
    color: white;
    text-decoration: none;
    border-radius: 8px;
    font-weight: bold;
    transition: 0.3s;
}

.back-btn:hover {
    background: #2e7d32;
}
</style>
</head>

<body>

<header>
    <h1>🌿 Discover Assam 🌿</h1>
    <p>Land of Festivals, Folklore & Timeless Traditions</p>
    <div class="scroll-text">⬇ Scroll Down to Explore ⬇</div>
</header>

<section>

<div class="card">
    <img src="bihu.jpg" alt="Bihu Festival">
    <div class="card-content">
        <h2>Bihu Festival</h2>
        <p>
        Bihu is the heart of Assamese culture and is celebrated three times a year marking agricultural seasons.
        The festival includes energetic Bihu dance performances, traditional music with dhol and pepa,
        and colorful attire symbolizing joy and prosperity.
        </p>
        <p>
        It represents unity, seasonal change, and the joyful spirit of the Assamese people,
        bringing communities together through music, rhythm, and celebration.
        </p>
    </div>
</div>

<div class="card">
    <img src="assamfolklore.jpg" alt="Assam Folklore">
    <div class="card-content">
        <h2>Assamese Folktales & Legends</h2>
        <p>
        Assam has a rich tradition of oral storytelling filled with myths, heroic tales,
        magical legends, and river spirits deeply connected to nature.
        </p>
        <p>
        Stories passed through generations reflect bravery, spirituality,
        and the cultural identity shaped by forests, rivers, and village life.
        </p>
    </div>
</div>

<div class="card">
    <img src="mugasilk.jpg" alt="Muga Silk">
    <div class="card-content">
        <h2>Traditional Handloom & Muga Silk</h2>
        <p>
        Weaving is an essential part of Assamese household culture, especially among women.
        Muga silk, known for its natural golden shine, is unique to Assam.
        </p>
        <p>
        Traditional mekhela chador attire showcases intricate designs inspired by
        flowers, birds, and folklore, symbolizing pride and cultural heritage.
        </p>
    </div>
</div>

<div class="card">
    <img src="SattriyaDance.jpg" alt="Sattriya Dance">
    <div class="card-content">
        <h2>Sattriya Dance & Vaishnav Culture</h2>
        <p>
        Sattriya is a classical dance form that originated in Assam’s monasteries called Sattras.
        It was introduced by Srimanta Sankardev as part of a devotional movement.
        </p>
        <p>
        The dance blends storytelling, devotion, music, and expressive gestures,
        preserving Assam’s spiritual and artistic legacy.
        </p>
    </div>
</div>

<a href="../index.html" class="back-btn">⬅ Back to Popup</a>

</section>

</body>
</html>