FirstCapStone/about.html at main · Mujeeb4582/FirstCapStone · 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
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
<!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" />
    <link
      rel="stylesheet"
      href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css"
    />
    <link
      href="https://fonts.googleapis.com/icon?family=Material+Icons"
      rel="stylesheet"
    />
    <link rel="stylesheet" href="./styles/global.css" />
    <link rel="stylesheet" href="./styles/header.css" />
    <link rel="stylesheet" href="./styles/about.css" />
    <link rel="stylesheet" href="./styles/footer.css" />
    <title>About</title>
  </head>
  <body>
    <!-- Header and Nav section -->
    <header>
      <nav class="social-nav">
        <ul class="social-icons">
          <li>
            <a href="#"><i class="fa fa-facebook"></i></a>
          </li>
          <li>
            <a href="#"><i class="fa fa-twitter"></i></a>
          </li>
          <li><a href="#">English</a></li>
          <li><a href="#">My Page</a></li>
          <li><a href="#">Logout</a></li>
        </ul>
      </nav>
      <div class="main-nav">
        <div class="hamburger-menu">
          <button class="hamburger-button">
            <i class="menu-icon material-icons">menu</i>
            <i class="close-icon material-icons">close</i>
          </button>
        </div>
        <div class="secondary-nav">
          <div class="logo">
            <a href="#">
              <img
                src="./Imgs/Youth summit logo.PNG"
                alt="logo of DY Global summit 2019"
                height="60px"
            /></a>
          </div>
          <nav class="primary-nav">
            <ul class="nav-items">
              <li class="nav-item"><a href="./index.html">Home</a></li>
              <li class="nav-item"><a href="#contact">Contact</a></li>
              <li class="nav-item"><a href="#logo">Logo</a></li>
              <li class="nav-item"><a href="#photos">Photos</a></li>
              <li class="nav-item"><a href="#sponser">Sponsor</a></li>
              <li class="nav-item box"><a href="#">DY Campaign</a></li>
            </ul>
          </nav>
        </div>
      </div>
    </header>
    <main>
      <section class="banner">
        <div class="banner-content">
          <div class="headline">
            <h1>
              "Hello! Sharing world"<br />
              <span>DIGITAL YOUTH<br />GLOBAL SUMMIT <br />2019</span>
            </h1>
          </div>
          <div class="guide-bar"></div>
          <p class="banner-description">
            The Global Summit brings together the community of experts,
            academics, and activists who comprise the Creative Commons affiliate
            network in a different country every two. This year, we hope to
            expand our invitation list including organizations and individuals
          </p>
          <p class="desktop-banner-description">
            The Global Summit brings together the community of experts,
            academics, and activists who comprise the Creative Commons affiliate
            network in a different country every two. This year, we hope to
            expand our invitation list including organizations and individuals
            Lorem, ipsum dolor sit amet consectetur adipisicing elit. Voluptatem
            a dolores quisquam illo enim alias voluptate maiores aliquid ut,
            porro ad architecto, quos libero laboriosam inventore dolore esse
            debitis neque praesentium ullam. Deserunt natus ea quo amet beatae
            voluptas aperiam? Lorem ipsum dolor sit, amet consectetur
            adipisicing elit. Voluptatibus voluptatum veniam recusandae voluptas
            tenetur quos ipsam harum fugit, itaque a magni soluta consequatur
            ullam ab hic deleniti quidem? Aliquid voluptates beatae ad nisi
            voluptas illo totam optio error enim dolore.
          </p>
          <div class="contact" id="contact">
            <p>
              Please contact us via email for any further question about DY
              Global Summit 2019!
            </p>
            <a href="#">dysummit2019@digital.pk</a>
          </div>
        </div>
      </section>

      <!-- logo section start here  -->
      <section class="logo1" id="logo">
        <h3 class="logo-title">Digital Youth<br />Global Summit 2019 Logo</h3>
        <h3 class="logo-desktop-title">
          Digital Youth Global Summit 2019 Logo
        </h3>
        <div class="guide-bar"></div>
        <p class="logo-details">
          The logo of DY Global Summit 2019 was decided through the logo
          competition from 27th. to 29th. September.
        </p>
        <div class="logo-img">
          <a href="#">
            <img
              src="./Imgs/Youth summit logo.PNG"
              alt="logo of DY Global summit 2019"
              height="200px"
          /></a>
        </div>
      </section>

      <!-- photos section start here  -->
      <section class="photos" id="photos">
        <h3 class="photos-title">See the past DY Global Summits</h3>
        <div class="guide-bar"></div>
        <p class="photos-details">
          Take a look at the last two DY Global Summits which took place in
          Buenos Aires and in warsaw.
        </p>
        <div class="images">
          <img
            src="./Imgs/10-about_2013.png"
            alt="CC Global Summit 2013 in Buenos Aires"
          />
          <img
            src="./Imgs/11-about_2011.png"
            alt="CC Global Summit 2011 in Warsaw"
          />
        </div>
      </section>
      <!-- partner section start -->

      <section class="partner" id="sponser">
        <h3 class="partner-title">Partner</h3>
        <div class="guide-bar"></div>
        <div class="partner-logos">
          <img src="./Imgs/14-mozilla-logo.png" alt="Mozilla-logo" />
          <img src="./Imgs/15-google-logo.png" alt="Google-logo" />
          <img src="./Imgs/16-naver-logo.png" alt="Naver-logo" />
          <img src="./Imgs/17-daumkakao-logo.jfif" alt="Daumkakao-logo" />
          <img src="./Imgs/18-Airbnb-logo.png" alt="Airbnb-logo" />
        </div>
      </section>
    </main>

    <!-- footer start -->
    <footer class="mobile-footer">
      <img src="./Imgs/Youth summit logo.PNG" alt="19-about-footer" />
      <h6>2019 Digital Youth Pakistan Some Rights Reserved</h6>
    </footer>

    <script src="./scripts/navScript.js"></script>
  </body>
</html>