-
Notifications
You must be signed in to change notification settings - Fork 0
/
index.html
144 lines (135 loc) · 6.21 KB
/
index.html
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
<!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">
<!-- CSS Stylesheet-->
<link rel="stylesheet" type="text/css" href="styles.css">
<!--Google Fonts-->
<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=Fredoka+One&family=Lato:ital,wght@0,300;0,400;0,700;0,900;1,300;1,400;1,700;1,900&display=swap"
rel="stylesheet">
<!-- Font Awesome icons -->
<script src="https://kit.fontawesome.com/11bb635b00.js" crossorigin="anonymous"></script>
<title>Orange Studio</title>
</head>
<body>
<header>
<nav class="language-navbar">
<ul class="navMenu">
<li class="lang-nav-item"><a href="#"><i class="fab fa-facebook-f"></i></a></li>
<li class="lang-nav-item"><a href="#"><i class="fab fa-twitter"></i></a></li>
<li class="lang-nav-item"><a class="top-link">My Page</a></li>
<li class="lang-nav-item"><a class="top-link">Logout</a></li>
</ul>
</nav>
<nav class="white-navbar">
<div class="openMenu hamburger-container icon"><a class="hamburger">≡</a></div>
<a href="index.html"><img class="logo" src="images/Orange.png" alt="Orange Studio Logo"></a>
<ul class="mainMenu navbar-links" id="mainmenu">
<li><a href="about.html" class="navlink">About Us</a></li>
<li><a href="#services" class="navlink">Our Services</a></li>
<li><a href="#contact" class="navlink">Contact Us</a></li>
<li>
<div class="closeMenu"><i class="fas fa-times icons"></i></div>
</li>
</ul>
</nav>
</header>
<main>
<section class="presentation">
<div class="presentation-container">
<h3 class="title-description">"Hello World! We are Orange."</h3>
<h1 class="title">ORANGE STUDIO LAUNCH PARTY</h1>
<h1 class="year">2021</h1>
<div class="intro-text">
<p>An online festival celebrating the launch of Orange Studio, including talks by our team and special guests. Join us online, no matter where you are, we are excited to share us with the world!</p>
</div>
<div class="dates-container">
<h2 class="dates">2021.12.12 (FRI) ~ 14 (SUN)</h2>
<br>
<h4 class="place">@ Restaurante Montecasino Guatemala, Iglú USAC and more</h4>
</div>
</div>
</section>
<section class="program">
<h3 class="main-program">Main Program</h3>
<hr class="underline">
<div class="card-container">
<div class="card">
<img class="card-icon" src="images/conference-icon.png" alt="Conference Icon">
<h5 class="card-title">Lecture</h5>
<div class="card-text-container">
<p class="card-text">Listen to the speakers from various countries about the messages of sharing and opening.</p>
</div>
</div>
<div class="card">
<img class="card-icon" src="images/exhibition-icon.png" alt="Exhibition Icon">
<h5 class="card-title">CC exhibition</h5>
<div class="card-text-container">
<p class="card-text">Let's meet the creations of artists from various fields who share the open spirit of CC.</p>
</div>
</div>
<div class="card">
<img class="card-icon" src="images/forum-icon.png" alt="Forum Icon">
<h5 class="card-title">Forum</h5>
<div class="card-text-container">
<p class="card-text">We have time to share our thoughts and opinions with experts by topic.</p>
</div>
</div>
<div class="card">
<img class="card-icon" src="images/workshop-icon.png" alt="Workshop Icon">
<h5 class="card-title">Workshop</h5>
<div class="card-text-container">
<p class="card-text">You can create your own creations using open source instead of just looking at them.</p>
</div>
</div>
<div class="card">
<img class="card-icon" src="images/party-icon.png" alt="Party Icon">
<h5 class="card-title">CC party</h5>
<div class="card-text-container">
<p class="card-text">Create opportunities to freely network with CC personnel from around the world.</p>
</div>
</div>
</div>
<a class="view" id="view" href="#">View full program></a>
</section>
<section class="speaker-titles">
<div class="team-title">
<h3 class="logo-about">Our Team</h3>
<hr class="underline">
</div>
</section>
<section class="speakers" id="speakers">
</section>
<section class="partners">
<h3 class="our-partners">Our Partners</h3>
<hr class="underline">
<div class="main-logo-container">
<div class="logo-container">
<a class="sponsor-link" href="https://www.google.com/" target="_blank" rel="noopener noreferrer"><i class="sponsor-icon fab fa-google"></i></a>
<a class="sponsor-link" href="https://www.facebook.com/" target="_blank" rel="noopener noreferrer"><i class="sponsor-icon fab fa-facebook"></i></a>
<a class="sponsor-link" href="https://www.uber.com/" target="_blank" rel="noopener noreferrer"><i class="sponsor-icon fab fa-uber"></i></a>
</div>
<div class="logo-container">
<a class="sponsor-link" href="https://stripe.com/" target="_blank" rel="noopener noreferrer"><i class="sponsor-icon fab fa-cc-stripe"></i></a>
<a class="sponsor-link" href="https://www.amazon.com/" target="_blank" rel="noopener noreferrer"><i class="sponsor-icon fab fa-amazon"></i></a>
</div>
</div>
</section>
</main>
<footer class="footer-section">
<br>
<br>
<div class="footer-container">
<img class="logo footer-logo" src="images/Orange.png" alt="Orange Studio Logo">
<p class="footer-text">© 2021 Melanie Sigrid. Some rights reserved. View full license <a href="https://github.com/melaniesigrid/OrangeStudio/blob/main/MIT.md" target="_blank" rel="noopener noreferrer">here</a>.</p>
</div>
</footer>
<!--JavaScript file-->
<script src="main.js"></script>
</body>
</html>