-
Notifications
You must be signed in to change notification settings - Fork 0
Expand file tree
/
Copy pathindex.html
More file actions
197 lines (189 loc) · 11 KB
/
index.html
File metadata and controls
197 lines (189 loc) · 11 KB
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
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
<!DOCTYPE html>
<html lang="en">
<head profile>
<title>alchemicode - Develop Your Digital Ecosystem</title>
<meta name="description" content="alchemicode is a digital services company, offering solutions for web, software, administration, and marketing.">
<meta charset="UTF-8">
<link rel="icon" type="image/png" href="images/logos/alchemi.png">
<link rel="stylesheet" href="style.css">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.7.1/jquery.min.js"></script>
<script src="script.js"></script>
<!-- Google tag (gtag.js) -->
<script async src="https://www.googletagmanager.com/gtag/js?id=G-J13940R079">
</script>
<script>
window.dataLayer = window.dataLayer || [];
function gtag(){dataLayer.push(arguments);}
gtag('js', new Date());
gtag('config', 'G-J13940R079');
</script>
</head>
<body>
<div class="glass">
<div id="header">
<a href="https://alchemicode.com" id="header_link">
<h1 id="header_text"><img src="images/logos/alchemi.png" id="header_logo" height="80px" width="80px"></h1>
</a>
<div id="nav_links">
<a href="index.html">Home</a>
<a href="products.html">Portfolio</a>
<a href="pricing.html">Pricing</a>
<a href="contact.html">Contact</a>
</div>
</div>
</div>
<div class="page-block bg-red">
<div>
<h2 class="content-header fade-in-from-left bottom-left-shadow">alchemicode</h2>
</div>
<!-- This needs to be one line otherwise it renders a space between them I wanna end something-->
<h1 class="giant-text bottom-left-shadow fade-in delay-animation">{<p class="in-out-fade" style="display:inline-block;">_</p>
</h1>
</div>
<div class="page-section">
<div class="left-box">
<h3 class="content-header fade-in delay-animation">
We specialize in building digital ecosystems.
</h3>
<h3 class="subcontent-header bottom-left-shadow fade-in delay-animation" style="font-size: 24px">
In today's world, expanding into the realm of technology is a necessity.
<br>
alchemicode was founded with the sole purpose of providing our services to businesses, hobbyists, artists, and whoever else may stumble upon us.
We believe that anyone can benefit from building a digital presence, and making moves to optimize their lives.
</h3>
</div>
<div class="right-box fade-in delay-animation" style="padding: 1em;">
<img src="images/comp_graphic.png" width="512px" height="512px">
</div>
</div>
<div class="page-section center-if-mobile">
<div class="center-if-mobile">
<h2 class="content-header bottom-left-shadow center-if-mobile">Services</h2>
<br>
<div class="elements-section center-if-mobile">
<div class="elements-section">
<div class="left-box rem-bottom rem-top">
<script type="text/javascript">
$(document).ready(function(){
let array = $("#services")
array.children(".array-block").each(function() {
$(this).click(function() {
let id = $(this).attr("id")
arrayClick(id, "services")
});
});
});
</script>
<div id="services" class="flex-array fade-in delay-animation">
<a class="array-block array-top" id="webdev_block">
Web
</a>
<a class="array-block" id="softdev_block">
Software
</a>
<a class="array-block" id="system_block">
Systems
</a>
<a class="array-block" id="marketing_block">
Media
</a>
<a class="array-block array-bottom" id="hosting_block">
Hosting
</a>
</div>
</div>
</div>
<div class="right-box rem-top no-left rem-right">
<div id="services_info" style="display:none; align-items:center;">
<h1 class="page-element-text bottom-left-shadow fade-in delay-animation lg-view" style="margin-right:0.2em"> -> </h1>
<h1 class="page-element-text bottom-left-shadow fade-in delay-animation sm-view" style="margin-bottom:0.2em"> ↓ </h1>
<div id="webdev_text" class="array-click-text fade-in-to-left index-info" style="display:none;">
<p>
A stylish and informative website is essential for a modern business.
<br><br>
Your digital presence can singlehandedly define the success and longevity of your enterprise, and we know how to do it best.
<br><br>
Our signature design brings simplicity and modularity to any site, and makes use of a variety of technologies.
</p>
<div class="image-column">
<img src="images/logos/b&w/js_m.png">
<img src="images/logos/b&w/php.png">
<img src="images/logos/b&w/wordpress.png">
<img src="images/logos/b&w/python.png">
<img src="images/logos/b&w/discord.png">
</div>
</div>
<div id="softdev_text" class="array-click-text fade-in-to-left index-info" style="display:none;">
<p>
Your software can make or break or business operations. Countless businesses are hindered by lackluster and ineffective systems.
<br><br>
Specialized software, tailored specifically to your needs, can improve the speed and efficiency of your work.
<br><br>
These kinds of applications can also be modified whenever you need to add or change a feature. You'll never be bogged down by bad software, because it'll be yours.
</p>
<div class="image-column">
<img src="images/logos/b&w/cs.png">
<img src="images/logos/b&w/cpp.png">
<img src="images/logos/b&w/python.png">
<img src="images/logos/b&w/go.png">
<img src="images/logos/b&w/java.png">
</div>
</div>
<div id="system_text" class="array-click-text fade-in-to-left index-info" style="display:none;">
<p>
While our in-house software or web services can improve your business, they may not be the best fit for you. <u>That's okay</u>!
<br><br>
But where we can still help is in the administration and maintenance of other tools and products.
<br><br>
Achieving the correct architecture or scaling for your business with any software, ours or otherwise, can be a daunting task, and we can make sure your tools are tailor-fit to your needs.
</p>
<div class="image-column">
<img src="images/logos/b&w/docker.png">
<img src="images/logos/b&w/proxmox.png">
<img src="images/logos/b&w/lxc.png">
<img src="images/logos/b&w/linux.png">
<img src="images/logos/b&w/jserv_m.png">
</div>
</div>
<div id="hosting_text" class="array-click-text fade-in-to-left index-info" style="display:none;">
<p>
Make use of our powerful servers for your games.
<br><br>
On our platform, powered by Pterodactyl, we will handle the setup and management of your game servers, so you can focus on fun.
<br><br>
Minecraft, Rust, Mordhau, TF2, Valheim, and more!
</p>
<div class="image-column">
<img src="images/logos/b&w/minecraft.png">
<img src="images/logos/b&w/rust.png">
<img src="images/logos/b&w/mordhau.png">
<img src="images/logos/b&w/tf2.png">
<img src="images/logos/b&w/among-us.png">
</div>
</div>
<div id="marketing_text" class="array-click-text fade-in-to-left index-info" style="display:none; ">
<p>
Online branding and interaction is integral to effective marketing.
<br><br>
The use of social media by businesses has been evolving for years to reach a wider audience, and can be used to great advantage.
<br><br>
Neat graphics, photo and video, and other visual stimuli, are all things that appeal to a potential audience. Our custom content creation can get you the outreach you need.
</p>
<div class="image-column">
<img src="images/logos/b&w/twitter.png">
<img src="images/logos/b&w/tiktok.png">
<img src="images/logos/b&w/youtube.png">
<img src="images/logos/b&w/instagram.png">
<img src="images/logos/b&w/linkedin.png">
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<div id="copyright">
Copyright (c) 2023, alchemicode. All Rights Reserved.
</div>
</body>
</html>