harrypotter/Blog.html at main · aryauprale/harrypotter · 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
186
187
188
189
190
191
<!DOCTYPE html>
<html><head>
    <title>All About Harry Potter</title>
    <link href="style.css" rel ="stylesheet">
    <script src="index.js"></script>
    <link href="https://fonts.cdnfonts.com/css/harry-potter" rel="stylesheet">
    <link rel="preconnect" href="https://fonts.googleapis.com">
    <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
    <link href="https://fonts.googleapis.com/css2?family=Rye&display=swap" rel="stylesheet">
</head>
  <body>
    <div>
      <img src = "https://i.ytimg.com/vi/abyQXe3hxRc/maxresdefault.jpg" style = "width: 1700px;">
      <div class="container">
        <div class="navbar">
          <div class="logo">
            <img class="logo" src="https://img.icons8.com/?size=50&id=20136&format=png&color=000000">
          </div>
          <div class= "menu" style=" font-family: 'Harry Potter', sans-serif;">
            <ul>
              <li><a href="index.html">Home</a></li>
              <li><a href="#">Blog</a></li>
              <li><a href="About.html">About</a></li>
              <li><a href="Contacts.html">Contacts</a></li>
              <li><a href="Characters.html">Characters</a></li>
              <li><a href="Themes.html">Themes</a></li>
              <li><a href="ReadingBenefits.html">Reading Benefits</a></li>
            </ul>
          </div>
        </div>
      </div>
    <div class="overlay">
     <h1 class="img-inner">Blog</h1>
    </div>

    <section class="hogwarts-section" style="background:url(https://wallpaperaccess.com/full/2268597.jpg);">
      <div class="overlay-ho">
      <div class="container">
        <h1 class="title" style="color:rgb(156, 209, 216)">Introduction</h1>
        <p style="color:rgb(156, 209, 216)">Click on the cards below to learn more</p>
        <div class="elements">
          <div class="left-element">
            <div class="image-grid">
              <div class="image-item">
                <img src="http://images4.fanpop.com/image/photos/24400000/Harry-Potter-Wallpaper-harry-potter-24478545-1280-800.jpg" alt="Hogwarts Image 1" class="hogwarts-image" style="width:800px; height:800px;"">
              </div>
            </div>
          </div>
          <div class="right-element">
            <p style="color:rgb(156, 209, 216)">Welcome to my blog dedicated to the magical world of Harry Potter!<br> Here, we’ll explore the enchanting stories, beloved characters, and the rich lore of J.K. Rowling's series.<br>From the moment we meet an orphaned boy with a lightning scar, J.K. Rowling’s world draws us into a universe brimming with enchantment, friendship, and unforgettable adventures. But what is it that keeps us returning to Hogwarts, even after all these years? Is it the spellbinding world-building? The timeless themes of good versus evil? Or perhaps it’s the sense of belonging that fans feel when they walk through Diagon Alley or ride the Hogwarts Express in their imaginations. Whether you're a lifelong fan or new to the wizarding world, join me as we dive into everything from spellbinding theories and character analyses to the impact of Hogwarts on pop culture.<br> Grab your wand and let’s embark on this magical journey together.</p>
          </div>
        </div>
      </div>
      </div>
    </section>

    <section class="bg-section blog-background" style="height:fit-content;">
      <div class="container">
        <h1 class="title"style="color:rgb(167, 167, 167)">Blog Section</h1>
        <p style="color:rgb(167, 167, 167)">Where the magic of the wizarding world comes to life! Whether you're a devoted fan or just discovering the series, this space is dedicated to exploring the enchanting tales, beloved characters, and deep themes that J.K. Rowling created</p>
        <div class="cards cards-grid">
          <div class="card">
            <a href = "Castle.html"><img src="https://wallpaperaccess.com/full/5930255.jpg" alt="" style="width:100%; height:100%;">
            </a>
              <div class="card-text">
                <h3>The Hogwarts Castle</h3>
                <hr>
                <p> Hogwarts School of Witchcraft and Wizardry is a magical boarding school in Scotland, renowned for educating young witches and wizards in various magical disciplines. The castle features enchanted elements, including moving staircases and a ghostly population... </p>
                <a href="Castle.html" class="card-button">Learn More</a>
              </div>
          </div>
          <div class="card">
            <a href = "All.html"><img src="https://eskipaper.com/images/harry-potter-pics-1.jpg" alt="" width="600" height="400">
            </a>
              <div class="card-text">
                <h3>All About Harry</h3>
                <hr>
                <p>  Harry learns about his past and attends Hogwarts School of Witchcraft and Wizardry.At the beginning of the series, Harry is introduced as a child who has been raised by his cruel aunt and uncle, the Dursleys who are unaware of his magical heritage... </p>
                <a href="All.html" class="card-button">Learn More</a>
              </div>
          </div>
          <div class="card">
            <a href = "Stone.html"><img src="https://eskipaper.com/images/harry-potter-6.jpg" alt="" style="width:100%; height:100%;">
            </a>
            <div class="card-text">
                <h3>Harry Potter and The Sorcerer's Stone</h3>
                <hr>
                <p> Harry is introduced to the wizarding world of magic and tries to fit in with his classmates despite being famous for causing the downfall of Lord Voldemort. He faces many challenges and forges friendships that will shape his destiny... </p>
                <a href="Stone.html" class="card-button">Learn More</a>
            </div>
          </div>
          <div class="card">
            <a href = "Hallows.html"><img src="https://images.alphacoders.com/113/1130112.jpg" alt="" style="width:100%; height:100%;">
            </a>
            <div class="card-text">
              <h3>The Deathly Hallows</h3>
              <hr>
              <p>The Deathly Hallows
                The final book and seventh book in the series where Harry must face Lord Voldemort and fulfill his destiny as seen by the prophecy: Only one can live while the other survives</p>
              <a href="Hallows.html" class="card-button">Learn More</a>
            </div>
        </div>
        <div class="card">
          <a href = "Chamber.html"><img src="https://wallpapercave.com/wp/wp1992171.jpg" alt="" style="width:400px; height:180px">
          </a>
            <div class="card-text">
              <h3>Harry Potter and The Chamber of Secrets</h3>
              <hr>
              <p>  The Chamber of Secrets is a hidden chamber beneath Hogwarts School of Witchcraft and Wizardry, built by Salazar Slytherin, one of the four founders of the school.</p>
              <a href="Chamber.html" class="card-button">Learn More</a>
            </div>
        </div>
        <div class="card">
          <a href = "Map.html"><img src="https://wallpapercave.com/wp/wp2448634.jpg" alt="" style="width:400px; height:224px;">
          </a>
            <div class="card-text">
              <h3>The Marauders Map</h3>
              <hr>
              <p> A special artifact made by people long ago. Is this item a  dangerous thing that causes harm or an innocent map? </p>
              <a href="Map.html" class="card-button">Learn More</a>
            </div>
        </div>
        <div class="card">
          <a href = "Timeline.html"><img src="https://tse1.mm.bing.net/th?id=OIP.8JDGDf53MMoL64Tpx5lrkQHaEK&pid=Api&P=0&h=220" alt="" style="width:100%; height:100%;">
          </a>
          <div class="card-text">
            <h3>A Timeline of Harry Potter</h3>
            <hr>
            <p> Harry Potter was published in the late 90's period. JK Rowling wrote her now astonishingly famous story on napkins before it gained recognition.It was greatly rejected before it became a phenomena. </p>
            <a href="Timeline.html" class="card-button">Learn More</a>
          </div>
      </div>
      <div class="card">
        <a href = "Analysis.html"><img src="http://images2.fanpop.com/images/polls/249000/249779_1244572624913_full.jpg" alt="" style="width:600; height:400;">
        </a>
          <div class="card-text">
            <h3>Voldemort-An Analysis</h3>
            <hr>
            <p>Lord Voldemort is the main villain in Harry Potter. Many fans often were scared of him in the movies. Seeing him as a kid gave everyone garish nightmares.</p>
            <a href="Analysis.html" class="card-button">Learn More</a>
          </div>
      </div>
      <div class="card">
        <a href = "Goblet.html"><img src="https://tse2.mm.bing.net/th?id=OIP.wakKzl_c6v3TFnb8ezg5IwHaEK&pid=Api&P=0&h=220" alt=""  style="width:400px; height:175px;">
        </a>
          <div class="card-text">
            <h3>Harry Potter and The Goblet of Fire</h3>
            <hr>
            <p>Harry, excited about seeing the champions compete in the triwizard tournament is surprised that there is another champion supposed fight as well. </p>
            <a href="Goblet.html" class="card-button">Learn More</a>
          </div>
      </div>
        </div>
      </div>
  </section>
    <footer class="footer">
      <div class="footer-container">
        <div class="footer-logo-section">
          <img src="https://img.icons8.com/?size=50&id=20136&format=png&color=000000" alt="Harry Potter Logo" class="footer-logo">
          <p class="footer-description">
            Enter the magical world of Harry Potter, where every page is filled with wonder, mystery, and the power of friendship.
          </p>
        </div>
        <div class="footer-links">
          <h4>Quick links</h4>
          <ul>
            <li><a href="index.html">Home</a></li>
            <li><a href="#">Blog</a></li>
            <li><a href="About.html">About</a></li>
            <li><a href="Characters.html">Characters</a></li>
            <li><a href="ReadingBenefits.html">Reading Benefits</a></li>
          </ul>
        </div>
        <div class="footer-contact">
          <h4>Contact Me</h4>
          <p>Email: upralearya@gmail.com</p>
          <p>Phone: 713-857-6453</p>
        <div class="footer-social">
          <a href="#" aria-label="Facebook"><img src="https://img.icons8.com/?size=30&id=13923&format=png" alt="Facebook Icon"></a>
          <a href="#" aria-label="Twitter"><img src="https://img.icons8.com/?size=30&id=13930&format=png" alt="Twitter Icon"></a>
          <a href="#" aria-label="Instagram"><img src="https://img.icons8.com/?size=30&id=13939&format=png" alt="Instagram Icon"></a>
        </div>
        </div>
      </div>
      <div class="footer-bottom">
        <p>&copy; 2024 The Wizarding World of Harry Potter. All Rights Reserved.</p>
      </div>
    </footer>
    </div>
  </body>
  </html>