index.html

<!DOCTYPE html>
<html lang="en" dir="ltr">
  <head>
    <meta charset="utf-8">
    <title>shadab's personal site</title>
    <link rel="stylesheet" href="css/style.css">
    <link rel="icon" href="favicon.ico">
    <link href="https://fonts.googleapis.com/css?family=Merriweather|Montserrat|Sacramento" rel="stylesheet">
  </head>
  <body>
    <div class="top-container">
    <img class="top-cloud" src="images/cloud.png" alt="cloud">
      <h1>I'm shadab</h1>
      <h2 class="programmer">a <span class="pro">pro</span>grammer</h2>
      <img class="bottom-cloud" src="images/cloud.png" alt="cloud">
      <img src="images/mountain.png" alt="mountain">

    </div>
    <div class="middle-container">
      <div class="profile">
        <img class="shadab" src="images/shadab.jpg" alt="shadab">
        <h2>Hello.</h2>
        <p class="intro">Lorem ipsum dolor sit amet, vitae volutpat, dui conubia, dolor urna. Non auctor, montes nulla distinctio.</p>
      </div>
      <hr>
      <div class="skills">
        <h2>My Skills.</h2>
        <div class="skill-row">
          <img class="computer" src="images/computer.png" alt="computer">
          <h3>Design and development</h3>
          <p>Lorem ipsum dolor sit amet, quis in duis, iaculis id felis. Consectetuer vestibulum, nunc urna lectus, erat ligula. Hendrerit nam, lectus ante, ut lorem eros.</p>
        </div>
        <div class="skill-row">
          <img class="chillies" src="images/chillies.png" alt="chillies">
          <h3>Lorem Ipsum Dolor</h3>
          <p>Lorem ipsum dolor sit amet, mauris sed consectetuer. Etiam et eu, bibendum interdum, lacus quis mauris. Curabitur wisi, quisque vel eu, rutrum nam.</p>
        </div>
      </div>
      <hr>
      <div class="contact-me">
        <h2>Get In Touch</h2>
        <h3>Lorem ipsum dolor sit amet, non elit.</h3>
        <p class="msg">Lorem ipsum dolor sit amet, in quis, aenean amet. Phasellus sodales, tellus donec dui, ornare erat.</p>
        <a class="btn" href="mailto:shadab.ali7503@gmail.com">CONTACT ME</a>
      </div>
    </div>


    <div class="bottom-container">
      <a class="footer-link" href="https://www.linkedin.com/">LinkedIn</a>
      <a class="footer-link" href="https://twitter.com/">Twitter</a>
      <a class="footer-link" href="https://www.appbrewery.co/">Website</a>
      <p class="copy">© 2019 shadab ali.</p>
    </div>
  </body>
</html>