first-assignment/index.html at main · mdimransorker/first-assignment · 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
<!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>Porttfoli</title>
    <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=Poppins&family=Yeseva+One&display=swap" rel="stylesheet">
    <link rel="stylesheet" href="style.css">
</head>
<body>
    <!-- banner-area section start -->
    <section class="banner flexible-area">
        <div class="half-width">
            <h1>Stay Focused on <br><span class="red">Mission 2022</span></h1>
            <p>Lorem ipsum dolor sit amet consectetur, adipisicing elit. Quo, amet?
            </p>
            <a class="button" target="_blank" href="">Explore Now</a><br>
            <small>Scroll down to explore more about us</small>
        </div>
        <div class="half-width">
            <img src="images/person/person-2.png" alt="Person1">
        </div>
    </section>
    <!-- banner-area section end -->
    <section class="my-mission-area">
      <h1 class="section-heading">My Mission in <span class="red">2022</span></h1>
      <div class="flexible-area justify-center">
          <div class="my-mission-item One-third-width">
              <img src="images/illustrators/illustrator-1.png" alt="#">
              <h5>Mission</h5>
              <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Molestias, quia?</p>
          </div>
          <div class="my-mission-item One-third-width lite-pink">
              <img src="images/illustrators/illustrator-2.png" alt="#">
              <h5>Vission</h5>
              <p>Lorem ipsum dolor sit amet consectetur, adipisicing elit. Corrupti, voluptas.</p>
          </div>
          <div class="my-mission-item One-third-width lite-orange">
              <img src="images/illustrators/illustrator-3.png" alt="3">
              <h5>Goals</h5>
              <p>Lorem ipsum dolor sit, amet consectetur adipisicing elit. Nam, sequi?</p>
          </div>
      </div>
  </section>
  <!-- my-mission-area section end -->
   <!-- develop-area section start -->
    <section class="develop-area">
           <div class="flexible-area justify-center">
               <div class="develop-item develop-img">
                    <img src="images/pictures/coding.png" alt="Image of coding">
               </div>
               <div class="develop-item develop-content">
                    <h2>Develop <br> Without Limits</h2>
                    <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Nobis, fuga.</p>
                    <a class="button" target="_blank" href="">Read the Documentation</a>
               </div>
           </div>
    </section>
    <!-- develop-area section end -->


</body>
</html>