-
Notifications
You must be signed in to change notification settings - Fork 0
/
contact.html
160 lines (149 loc) · 5.59 KB
/
contact.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
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
<!DOCTYPE html>
<html>
<head>
<!-- basic meta tags -->
<meta lang="Eng"/>
<meta charset="UTF-8"/>
<meta name="robots" content="noindex nofollow"/>
<!-- style related meta tags -->
<meta name="viewport" content="width=device-width, initial-scale=1.0"/>
<link rel="stylesheet" type="text/css" href="css/default_style.css"/>
<link rel="stylesheet" type="text/css" href="css/main_style.css"/>
<link rel="stylesheet" type="text/css" href="css/contact_style.css"/>
<link rel="stylesheet" type="text/css" href="css/input_style.css"/>
<!--style related java-script-->
<script defer src="scripts/menu_button_anim.js"></script>
<!-- content related meta tags -->
<title>Mars Ventures - Contact</title>
<meta name="description" content="Trying to sell the surface of Mars"/>
<meta name="keywords" content="mars, sell, venture, profit, invest"/>
</head>
<body>
<div class="top_wrapper">
<header>
<div class="logo">
<button id="logo_home_button" onclick="document.location = 'index.html'">
<h1>Mars Ventures</h1>
</button>
</div>
<div class="hamburger">
<button id="mini_menu" onclick="document.location='mini_menu.html'"><img id="ham" src="pictures/mini_menu.png" alt=""/></button>
</div>
<nav id="nav">
<button class="menu_button" onclick="document.location = 'index.html#fly'">Flight</button>
<button class="menu_button" onclick="document.location = 'index.html#live'">Life</button>
<button class="menu_button" onclick="document.location = 'index.html#mobility'">Mobility</button>
<button class="active" onclick="document.location = 'contact.html'">Contact</button>
</nav>
<div class="login">
<button onclick="document.location='log_in.html'">Log in</button>
</div>
</header>
</div>
<div class="middle_wrapper">
<main>
<section class="top_spacer">
<!-- 1st section _SPACER_ -->
</section>
<!-- 2nd section _GENERAL TEXT_ -->
<section class="content">
<h1>Contact us on Mars</h1>
<aside class="contact_aside">
<p class="white">
This is just <em class="white">some gibberish</em> in order to have some text in this text-box.<br/>
<br/>
You know how this goes, hardest thing while building a site, besides fighting the <code>divs</code>, is to
fill it with useful text. I guess Lorum Ipsum of some kind works, but just some text like this doesn't hurt either.
</p>
</aside>
<div class="contact_container">
<div class="contact_form">
<form action="index.html" method="GET">
<label for="first_name">First Name</label>
<input type="text" id="first_name" name="firstname" placeholder="Your First Name" autofocus />
<label for="last_name">Last Name</label>
<input type="text" id="last_name" name="lastname" placeholder="Your Last Name" />
<label for="e_mail">Email</label>
<input type="email" id="e_mail" name="email" placeholder="You Email" required />
<label for="message">Message</label>
<textarea id="message" name="message" placeholder="Your Message to Us" required ></textarea>
<input type="submit" value="Print"/>
</form>
<p class="special">* After printing your message, you can send it to the address to the right or below.</p>
</div>
<div class="contact_info">
<ul class="clear_list">
<li class="accented">Our Address:</li>
<li><br/></li>
<li>Mars Ventures</li>
<li>Olympus Mons 1</li>
<li>1234 AB Mount Olympus</li>
<li><br/></li>
<li>tel: 123- 45 67 89 10</li>
<li><br/></li>
<li><br/></li>
<li class="accented">Our bankinformation:</li>
<li><br/></li>
<li>IBAN: MS01 SFAA 013 37 101 808</li>
<li><br/></li>
<li>BIC: SFAA MARS 7075</li>
<li></li>
</ul>
</div>
<iframe class="map" src="map_dummy.html" >
</iframe>
</div>
</section>
<!-- 3rd section _SEE THROUGH_design -->
<section class="clear">
</section>
</main>
<!-- End of the MAIN information -->
<footer>
<div class="infooter">
<!-- oldscool <br/> used to 'format/style' this section obviously also possible with margins -->
<h4>Usefull Links:</h4>
<br/>
<a href="contact.html" class="links">Contact Us</a><br/>
FAQ<br/>
<a target="_blank" class="links" href="https://www.google.com/maps/space/mars/@7.0709409,-97.5500469,18854231m/data=!3m1!1e3">Mars-Map</a><br/>
<a target="_blank" class="links" href="https://en.wikipedia.org/wiki/Mars">Wiki-Mars</a><br/>
<br/>
</div>
<div id="currency" class="infooter">
<h4>We accept:</h4>
<br/>
<img id="coins" src="pictures/coins.png" alt="accepted currency: Euro, Dollar, Yen"/>
<br/>
<br/>
</div>
<div id="socials" class="infooter">
<h4>Follow us on:</h4>
<br/>
Facebook<br/>
Twitter<br/>
INterplanitary<br/>
<br/>
<img id="social_logos" src="pictures/social_media.png" alt="social media links"/>
<br/>
<br/>
</div>
<address class="infooter">
<h4>Our Address:</h4>
<br/>
Mars Ventures<br/>
Olympus Mons 1<br/>
1234 AB Mount Olympus<br/>
<br/>
123- 45 67 89 10<br/>
<br/>
<br/>
<br/>
</address>
</footer>
</div>
<div class="bottom_wrapper">
<p class="special">- Mars Ventures - copyrights © 2020 - <a href="#live" class="special">Privacy Statement</a> - <a href="#live" class="special">Terms of Use</a> -</p>
</div>
</body>
</html>