Cohort4.2
/
PassionProject-HTML
Watch 7
Star 0
Fork 28
Code Issues 0 Pull Requests 18 Releases 0 Wiki Activity
Browse Source

ODA

Elliott Stansbury 7 years ago
parent
b89176a3dc
commit
df1bdedd54
1 changed files with 210 additions and 0 deletions
Split View Show Diff Stats
  1. 210
    0
      index.html

+ 210
- 0
index.html View File 

@@ -0,0 +1,210 @@
1 
+<!DOCTYPE HTML>
2 
+<!--
3 
+	Hyperspace by HTML5 UP
4 
+	html5up.net | @ajlkn
5 
+	Free for personal and commercial use under the CCA 3.0 license (html5up.net/license)
6 
+-->
7 
+<html>
8 
+	<head>
9 
+		<title>Hyperspace by HTML5 UP</title>
10 
+		<meta charset="utf-8" />
11 
+		<meta name="viewport" content="width=device-width, initial-scale=1, user-scalable=no" />
12 
+		<link rel="stylesheet" href="assets/css/main.css" />
13 
+		<noscript><link rel="stylesheet" href="assets/css/noscript.css" /></noscript>
14 
+	</head>
15 
+	<body class="is-preload">
16 
+
17 
+		<!-- Sidebar -->
18 
+			<section id="sidebar">
19 
+				<div class="inner">
20 
+					<nav>
21 
+						<ul>
22 
+							<li><a href="#intro">Welcome</a></li>
23 
+							<li><a href="#one">Accounts</a></li>
24 
+							<li><a href="#two">What we do</a></li>
25 
+							<li><a href="#three">Get in touch</a></li>
26 
+						</ul>
27 
+					</nav>
28 
+				</div>
29 
+			</section>
30 
+
31 
+		<!-- Wrapper -->
32 
+			<div id="wrapper">
33 
+
34 
+				<!-- Intro -->
35 
+					<section id="intro" class="wrapper style1 fullscreen fade-up">
36 
+						<div class="inner">
37 
+							<h1>ODA</h1>
38 
+							<h2>On Demand Art</h2>
39 
+							<p>Connecting Art & Artists together in a very simple, but innovative way!<br />
40 
+							by eliminating the modern day pressures that the industry faces.</a>.</p>
41 
+							<ul class="actions">
42 
+								<li><a href="#one" class="button scrolly">Learn more</a></li>
43 
+							</ul>
44 
+						</div>
45 
+					</section>
46 
+
47 
+				<!-- One -->
48 
+					<section id="one" class="wrapper style2 spotlights">
49 
+						<section>
50 
+							<a href="#" class="image"><img src="images/pic01.jpg" alt="" data-position="center center" /></a>
51 
+							<div class="content">
52 
+								<div class="inner">
53 
+									<h2>Create Account</h2>
54 
+									<p>Here we allow both the Artist and our Model/Art clients to create an account stating what brings them to ODA & what they are looking to gain from it..</p>
55 
+									<ul class="actions">
56 
+										<li><a href="generic.html" class="button">Learn more</a></li>
57 
+									</ul>
58 
+								</div>
59 
+							</div>
60 
+						</section>
61 
+						<section>
62 
+							<a href="#" class="image"><img src="images/pic02.jpg" alt="" data-position="top center" /></a>
63 
+							<div class="content">
64 
+								<div class="inner">
65 
+									<h2>Artist meet Art</h2>
66 
+									<p>We realize that a lot of people are eager to get into the industry, but just dont know where to start. We have fixed this problem.</p>
67 
+									<ul class="actions">
68 
+										<li><a href="generic.html" class="button">Learn more</a></li>
69 
+									</ul>
70 
+								</div>
71 
+							</div>
72 
+						</section>
73 
+						<section>
74 
+							<a href="#" class="image"><img src="images/pic03.jpg" alt="" data-position="25% 25%" /></a>
75 
+							<div class="content">
76 
+								<div class="inner">
77 
+									<h2>Endless Opportunity</h2>
78 
+									<p>We promote positive interactions between aspiring artist and the models they work with. </p>
79 
+									<ul class="actions">
80 
+										<li><a href="generic.html" class="button">Learn more</a></li>
81 
+									</ul>
82 
+								</div>
83 
+							</div>
84 
+						</section>
85 
+					</section>
86 
+
87 
+				<!-- Two -->
88 
+					<section id="two" class="wrapper style3 fade-up">
89 
+						<div class="inner">
90 
+							<h2>What we do</h2>
91 
+							<p>By creating a peer to peer platform offering all, from aspiring photographers to those at the professional level, a medium to express themselves in a "test-safe" environment.</p>
92 
+							<div class="features">
93 
+								<section>
94 
+									<span class="icon major fa-code"></span>
95 
+									<h3>Peer Based Grading</h3>
96 
+									<p>We allow all users of ODA to grade those that they work with on their professionalism, creativity, and pure comfortability.</p>
97 
+								</section>
98 
+								<section>
99 
+									<span class="icon major fa-lock"></span>
100 
+									<h3>Safe Payment System</h3>
101 
+									<p>We use to next-level encryption to handle all payment processing to keep the Artist and their Art both satisfied.</p>
102 
+								</section>
103 
+								<section>
104 
+									<span class="icon major fa-cog"></span>
105 
+									<h3>Instant Notifications</h3>
106 
+									<p>Our Instant Notifications system allows Users to know exactly when they would be needed for any type of event.</p>
107 
+								</section>
108 
+								<section>
109 
+									<span class="icon major fa-desktop"></span>
110 
+									<h3>Real Life Experiences</h3>
111 
+									<p>Being able to connect with people in the real world gives you experiences that you could not receive from school or course work.</p>
112 
+								</section>
113 
+								<section>
114 
+									<span class="icon major fa-chain"></span>
115 
+									<h3>Self Promotion</h3>
116 
+									<p>We allow our users to promote themselves for free on our app, to help bring new artist into the industry.</p>
117 
+								</section>
118 
+								<section>
119 
+									<span class="icon major fa-diamond"></span>
120 
+									<h3>Easy to Use</h3>
121 
+									<p>Very similar to modern day apps, so setting up your account will be a breeze!</p>
122 
+								</section>
123 
+							</div>
124 
+							<ul class="actions">
125 
+								<li><a href="generic.html" class="button">Learn more</a></li>
126 
+							</ul>
127 
+						</div>
128 
+					</section>
129 
+
130 
+				<!-- Three -->
131 
+					<section id="three" class="wrapper style1 fade-up">
132 
+						<div class="inner">
133 
+							<h2>Get in touch</h2>
134 
+							<p>Feel free to reach out to us with any input you have or any ideas you think would make ODA greater than it already is.</p>
135 
+							<div class="split style1">
136 
+								<section>
137 
+									<form method="post" action="#">
138 
+										<div class="fields">
139 
+											<div class="field half">
140 
+												<label for="name">Name</label>
141 
+												<input type="text" name="name" id="name" />
142 
+											</div>
143 
+											<div class="field half">
144 
+												<label for="email">Email</label>
145 
+												<input type="text" name="email" id="email" />
146 
+											</div>
147 
+											<div class="field">
148 
+												<label for="message">Message</label>
149 
+												<textarea name="message" id="message" rows="5"></textarea>
150 
+											</div>
151 
+										</div>
152 
+										<ul class="actions">
153 
+											<li><a href="" class="button submit">Send Message</a></li>
154 
+										</ul>
155 
+									</form>
156 
+								</section>
157 
+								<section>
158 
+									<ul class="contact">
159 
+										<li>
160 
+											<h3>Address</h3>
161 
+											<span>12345 Somewhere Road #654<br />
162 
+											Nashville, TN 00000-0000<br />
163 
+											USA</span>
164 
+										</li>
165 
+										<li>
166 
+											<h3>Email</h3>
167 
+											<a href="#">user@untitled.tld</a>
168 
+										</li>
169 
+										<li>
170 
+											<h3>Phone</h3>
171 
+											<span>(000) 000-0000</span>
172 
+										</li>
173 
+										<li>
174 
+											<h3>Social</h3>
175 
+											<ul class="icons">
176 
+												<li><a href="#" class="fa-twitter"><span class="label">Twitter</span></a></li>
177 
+												<li><a href="#" class="fa-facebook"><span class="label">Facebook</span></a></li>
178 
+												<li><a href="#" class="fa-github"><span class="label">GitHub</span></a></li>
179 
+												<li><a href="#" class="fa-instagram"><span class="label">Instagram</span></a></li>
180 
+												<li><a href="#" class="fa-linkedin"><span class="label">LinkedIn</span></a></li>
181 
+											</ul>
182 
+										</li>
183 
+									</ul>
184 
+								</section>
185 
+							</div>
186 
+						</div>
187 
+					</section>
188 
+
189 
+			</div>
190 
+
191 
+		<!-- Footer -->
192 
+			<footer id="footer" class="wrapper style1-alt">
193 
+				<div class="inner">
194 
+					<ul class="menu">
195 
+						<li>&copy; Untitled. All rights reserved.</li><li>Design: <a href="http://html5up.net">HTML5 UP</a></li>
196 
+					</ul>
197 
+				</div>
198 
+			</footer>
199 
+
200 
+		<!-- Scripts -->
201 
+			<script src="assets/js/jquery.min.js"></script>
202 
+			<script src="assets/js/jquery.scrollex.min.js"></script>
203 
+			<script src="assets/js/jquery.scrolly.min.js"></script>
204 
+			<script src="assets/js/browser.min.js"></script>
205 
+			<script src="assets/js/breakpoints.min.js"></script>
206 
+			<script src="assets/js/util.js"></script>
207 
+			<script src="assets/js/main.js"></script>
208 
+
209 
+	</body>
210 
+</html>