PowerPoint Slide

<!DOCTYPE html>
<html>
   <head>
      <title>PowerPoint Slide</title>
   <link rel="stylesheet" type="text/css" href="styles.css">
   </head>
   <body>
      <a class="logo" href="https://softuni.bg/"><img src="images/softuni-logo.jpg" alt="softuni-logo"/></a>
      <h1>Headings and Paragraphs</h1>
      <div class="first-section">
         <div class="title">
            <img src="images/square.png" alt="square" width="8" height="8">
            <span class="heading">Heading Tags: <span class="styled-heading">&lt;h1&gt;</span> &#8211; <span class="styled-heading">&lt;h6&gt;</span></span>
         </div>
         <div class="inner-block">
            &lt;h1&gt;Heading 1&lt;/h1&gt;<br/>
            &lt;h2&gt;Sub heading 2&lt;/h2&gt;<br/>
            &lt;h3&gt;Sub heading 3&lt;/h3&gt;
         </div>
      </div>
      <div class="second-section">
         <div class="title">
            <img src="images/square.png" alt="square" width="8" height="8">
            <span class="heading">Paragraph Tags: <span class="styled-heading">&lt;p&gt;</span></span>
         </div>
         <div class="inner-block">
            &lt;p&gt;This is my first paragraph&lt;/p&gt;<br/>
            &lt;p&gt;This is my second paragraph&lt;/p&gt;
         </div>
      </div>
      <div class="third-section">
         <div class="title">
            <img src="images/square.png" alt="square" width="8" height="8">
            <span class="heading">Sections: <span class="styled-heading">&lt;div&gt;</span> and <span class="styled-heading">&lt;span&gt;</span></span>
         </div>
         <div class="inner-block">
            &lt;div style="background: skyblue;"&gt;<br/>
            &nbsp;&nbsp;&nbsp;This is a div<br/>
            &lt;/div&gt;
         </div>
      </div>
   </body>
</html>