basic-101/index.html at master · Harshit101/basic-101 · 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
<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>Harshit Agrawal</title>
  <link rel="stylesheet" href="styles.css">
  <link href="https://fonts.googleapis.com/css2?family=Merriweather&family=Montserrat:wght@500&family=Sacramento&display=swap" rel="stylesheet">
</head>
<body>
  <div class="top-container">
    <img class="top-cloud" src="images/cloud.png" alt="cloud image">
    <h1>I am <br> Harshit Agrawal</h1>
    <h2><span class="pro">Learning</span> Web Dev</h2>
    <img class="bottom-cloud" src="images/cloud.png" alt="cloud image">
    <img src="images/mountain.png" alt="mountain image">

  </div>
  <div class="middle-container">
    <div class="profile">
      <img class="profile-pic" src="images/man.png" alt="harshit-profile-pic">
      <h2>Hello.</h2>
      <p class="intro">I am a student. pursuing B.Tech in Electrical Engineering from MITS Gwalior. currently in 3rd year.</p>
    </div>
    <hr>
    <div class="skills">
      <h2>My Skills.</h2>
      <div class="skill-row">
        <img class="skill-1" src="images/undraw_responsive_6c8s.svg" alt="web-designing">
        <h3>Design & Development</h3>
        <p>Learning web development. currently working with my css skills. Lorem ipsum dolor sit amet consectetur adipisicing elit. Voluptate odio nostrum soluta praesentium tempore dicta. Quasi, sit magnam laboriosam fugit maxime asperiores amet accusantium sed a saepe. Praesentium, enim saepe.</p>
      </div>
      <div class="skill-row">
        <img class="excel" src="images/excel-icon-16679.png" alt="Microsoft Excel">
        <h3>Microsoft Excel</h3>
        <p>Familiar with the basics well and learning advanced excel technologies. Lorem ipsum dolor sit amet consectetur, adipisicing elit. Saepe magnam perspiciatis eum assumenda dolores doloribus voluptatum. Ea beatae, aspernatur reprehenderit accusamus nesciunt rerum velit corrupti, natus, aut excepturi distinctio a.</p>
      </div>
    </div>
    <hr>
    <div class="contact-me">
      <h2>Get In Touch</h2>
      <h3>Lorem ipsum dolor sit amet, non elit.</h3>
      <p class="contact-msg">Lorem ipsum dolor sit amet, in quis, aenean amet. Phasellus sodales, tellus donec dui, ornare erat.</p>
      <a class="btn" href="mailto:harshitagrawal820@email.com">CONTACT ME</a>
    </div>
  </div>


  <div class="bottom-container">
    <a class="footer-link" href="https://www.linkedin.com/in/harshit-agrawal-7362941b1/"><img class="contact-img" src="images/linkedin.png" alt="Linkedin">Linkedin</a>
    <a class="footer-link" href="https://twitter.com/harsh_it2"><img class="contact-img" src="images/twitter.png" alt="Twitter">Twitter</a>
    <a class="footer-link" href="https://github.com/Harshit101"><img class="contact-img" src="images/email.png" alt="Website">Website</a>
    <p class="copyright">© 2018 Harshit Agrawal.</p>
  </div>


</body>
</html>