index.html

<!DOCTYPE html>
<html>

<head>
   
   <link rel="stylesheet" href="styles.css">
</head>

<body>


      <header id="mainHeading">
         <div id ="inner-header">
        <img src="./images/KMATLDR.jpg" id="title-image" alt="Kyle's Mystical Adventure TLDR">
        </div>
      </header>
      <main>
         <div id="fix-margins">
         <article>
            <div class="story-section" id="story-section1">
               <img src="./images/bright-mystic-valley.jpg" id="bright-mystic-valley" class="story-image"
                  alt="image of a bright sunny countryside">

               <p>Kyle was a simple man who lived a quiet life in a small cottage on the
                  outskirts of a quaint village. He
                  loved nothing more than tending to his garden, where he grew all sorts of exotic flowers and herbs.
                  Little
                  did he know, his peaceful life was about to take a mystical turn.
               </p>
            </div>

            <div class="story-section" id="story-section2">
               <img src="./images/magic-seed.png" id="magic-seed" class="story-image"
                  alt="image of a seed sprouting with a glow around it">
               <p>One day, as Kyle was tending to his garden, he stumbled upon a strange and magical seed. He had never
                  seen
                  anything like it before, so he planted it in his garden to see what would happen. To his surprise, the
                  seed
                  grew into a beautiful and mysterious plant that exuded an aura of magic.
               </p>
            </div>
            <div class="story-section" id="story-section3">
               <img src="./images/magic-team.png" class="story-image"
                  alt="image of collage of strange creatures that became friends">
               <p>Kyle soon discovered that the plant had the power to transport him to an alternate realm filled with
                  fantastical creatures and incredible wonders. Every day, he would visit this world, which he dubbed <q>Magic Land</q>, and explore its
                  many
                  wonders. He made friends with the creatures who lived there and learned all sorts of talents and magic spells from
                  them.
               </p>
            </div>
            <div class="story-section" id="story-section4">
               <img src="./images/evil-mage.jpg" class="story-image" alt="image of sorceress casting a powerful spell">
               <p>However, the more time Kyle spent in the mystical world, the more he realized that it was in danger. A
                  wicked sorceress was attempting to take control of Magic Land and plunge it into darkness. Kyle knew he
                  had
                  to do something to stop her. With the help of his new friends, he set out on an epic adventure to
                  defeat
                  the
                  sorceress and restore peace to the mystical world.</p>
            </div>

            <div class="story-section" id="story-section5">
               <img src="./images/hero.jpg" class="story-image" alt="image of a hero with glowing magic">
               <p id="testP" class="funParagraph">Through his bravery and cunning, Kyle was able to defeat the sorceress
                  and save the mystical world. He
                  was
                  hailed as a hero by all the creatures and was given the title of the "Guardian of the Mystical World."
                  From
                  that day on, Kyle spent his days exploring the wonders of the mystical world and using his magic to
                  keep
                  it
                  safe. He may have been a simple gardener in the real world, but in the mystical world, he was a
                  powerful
                  hero.</p>
            </div>


         </article>

      </main>


 </div>
      <footer>This silly webpage made for your enjoyment by Kyle Riebeling
         <br>
         &copy; Kyle Riebeling 2023</footer>
   
</body>

</html>