/ index.html
index.html
1 <!DOCTYPE html> 2 <html lang="en" color-mode="user" class="no-js"> 3 <head> 4 <meta charset="UTF-8"> 5 <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> 6 <title>Biolithic's 2025 Home Page - All The Payments, Pictures, Links, Accounts in one place for him</title> 7 <meta name="viewport" content="width=device-width, initial-scale=1"> 8 <meta http-equiv="x-ua-compatible" content="ie=edge"> 9 <meta name="HandheldFriendly" content="True"> 10 <meta name="MobileOptimized" content="320"> 11 <meta http-equiv="cleartype" content="on"> 12 <meta name="author" content="biolithic"> 13 <meta name="copyright" content="biolithic"> 14 <meta name="apple-mobile-web-app-title" content="biolithic"> 15 <meta name="application-name" content="biolithic"> 16 <meta name="description" content="Biolithic's 2025 Home Page - All The Payments, Pictures, Links, Accounts in one place for him"> 17 18 <meta property="og:title" content="biolithic" /> 19 <meta property="og:description" content="Biolithic's 2025 Home Page - All The Payments, Pictures, Links, Accounts in one place for him" /> 20 <meta property="og:image" content="/apple-touch-icon.png" /> 21 <meta name="og:url" content="https://biolithic.github.io/"> 22 <meta name='og:site_name' content='biolithic'> 23 <meta name='og:email' content='biolithic@tuta.com'> 24 25 <meta name="twitter:card" content="summary" /> 26 <meta name="twitter:card" content="summary_large_image" /> 27 <meta name="twitter:card" content="app" /> 28 <meta name="twitter:card" content="player" /> 29 <meta name="twitter:creator" content="@biolithic" /> 30 <meta name="twitter:site" content="@biolithic" /> 31 <meta name="twitter:title" content="biolithic 2025" /> 32 <meta name="twitter:description" content="Biolithic's 2025 Home Page - All The Payments, Pictures, Links, Accounts in one place for him" /> 33 <meta name="twitter:image" content="/apple-touch-icon.png" /> 34 <meta name="twitter:image:alt" content="biolithic 2025" /> 35 <meta name="twitter:url" content="Biolithic's 2025 Home Page - All The Payments, Pictures, Links, Accounts in one place for him" /> 36 <meta name="twitter:site_name" content="biolithic" /> 37 38 <meta name="msapplication-TileColor" content="#80d890"> 39 <meta name="theme-color" content="#80d890"> 40 <link href="/favicon.ico" rel="icon" sizes="32x32"> 41 <link href="/icon.svg" rel="icon" type="image/svg+xml"> 42 <link href="/apple-touch-icon.png" rel="apple-touch-icon"> 43 <link href="/manifest.webmanifest" crossorigin="use-credentials" rel="manifest" /> 44 <link href="https://biolithic.github.io/" rel="canonical"> 45 <meta name="robots" content="index, follow"> 46 <link href="/style.css" rel="stylesheet"> 47 <script>window.addEventListener('error', function(error) { console.log(error); });</script> 48 <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/picnic"> 49 <style> 50 body { 51 font-size:1.2rem; 52 padding:2em; 53 font-family: sans-serif; 54 background-color:#68a8d8; 55 background-image: 56 linear-gradient( 57 45deg, 58 #80d890 25%, 59 transparent 25%, 60 transparent 75%, 61 #80d890 75% 62 ), 63 linear-gradient( 64 45deg, 65 #80d890 25%, 66 transparent 25%, 67 transparent 75%, 68 #80d890 75% 69 ); 70 background-size: 60px 60px; 71 background-position: 0 0, 30px 30px; 72 animation: slide 4s infinite linear; 73 } 74 75 @keyframes slide { 76 from { 77 background-position: 0 0, 30px 30px; 78 } 79 80 to { 81 background-position: 0 0, -30px -30px; 82 } 83 } 84 85 main { 86 max-width:600px; 87 margin:auto; 88 } 89 90 .right { 91 text-align:right; 92 } 93 94 p { 95 margin-bottom:0; 96 } 97 98 .grid { 99 display:flex; 100 } 101 102 .grid.between { 103 justify-content:space-between; 104 } 105 106 .column:first-child { 107 margin-right:0.5em; 108 } 109 110 /* EARTHBOUND STYLE CHATBOX */ 111 .box { 112 min-width:5em; 113 display:inline-block; 114 position:relative; 115 vertical-align:top; 116 background-color: #280828; 117 color:#e7e6b3; 118 padding:5px 3px; 119 border-radius:1px; 120 transform:translateY(0); 121 transition: transform linear 150ms; 122 box-shadow: 123 0 0 0 5px #383050, /* dark grey */ 124 0 0 0 10px #68d0b8, /* minty blue */ 125 0 0 0 12px #f7e8a8, /* white */ 126 0 0 0 15px #3d3c55; /* black */ 127 } 128 129 .characters figure:hover .box { 130 transform:translateY(-0.1em); 131 } 132 133 .box.full { 134 width:100%; 135 margin-top:2em; 136 display:block; 137 } 138 139 /* BUTTONS */ 140 button { 141 position:relative; 142 cursor:pointer; 143 background:transparent; 144 border:0; 145 color:#e7e6b3; 146 font-size:1em; 147 } 148 149 .box .grid.between button:first-child 150 { 151 margin-right:1em; 152 } 153 154 .box .grid.between button:hover::before { 155 content:''; 156 position:absolute; 157 left:-0.3em; 158 top:0.4em; 159 width: 0; 160 height: 0; 161 border-top: 0.3rem solid transparent; 162 border-bottom: 0.3rem solid transparent; 163 border-left: 0.3rem solid #e7e6b3; 164 } 165 166 .characters figcaption { 167 margin-top:0.5em; 168 } 169 170 .characters figure span { 171 width:32px; 172 height:48px; 173 margin-right:1.5em; 174 display:inline-block; 175 background-size:auto; 176 background-blend-mode: multiply; 177 } 178 179 .ness span { 180 background-image:url('http://www.videogamesprites.net/Earthbound/Party/Ness/Ness%20(Front).gif'); 181 } 182 183 .ness:hover span { 184 background-image:url('http://www.videogamesprites.net/Earthbound/Party/Ness/Ness%20-%20Walk%20(Front).gif') 185 } 186 187 .paula span { 188 background-image:url('http://www.videogamesprites.net/Earthbound/Party/Paula/Paula%20(Front).gif'); 189 } 190 191 .paula:hover span { 192 background-image:url('http://www.videogamesprites.net/Earthbound/Party/Paula/Paula%20-%20Walk%20(Front).gif'); 193 } 194 195 .jeff span { 196 background-image:url('http://www.videogamesprites.net/Earthbound/Party/Jeff/Jeff%20(Front).gif'); 197 } 198 199 .jeff:hover span { 200 background-image:url('http://www.videogamesprites.net/Earthbound/Party/Jeff/Jeff%20-%20Walk%20(Front).gif'); 201 } 202 203 .poo span { 204 background-image:url('http://www.videogamesprites.net/Earthbound/Party/Poo/Poo%20(Front).gif'); 205 } 206 207 .poo:hover span { 208 background-image:url('http://www.videogamesprites.net/Earthbound/Party/Poo/Poo%20-%20Walk%20(Front).gif'); 209 } 210 211 .king span { 212 width:48px !important; 213 height:40px !important; 214 background-image:url('http://www.videogamesprites.net/Earthbound/NPCs/Nonhuman/Animals/King%20(Left).gif'); 215 } 216 </style> 217 </head> 218 <body> 219 <main class="intro"> 220 <section class="grid"> 221 <section class="column characters"> 222 <figure class="ness"> 223 <span></span> 224 <figcaption class="box">Biolithic</figcaption> 225 </figure> 226 </section> 227 228 <section class="column"> 229 <aside class="characters"> 230 <figure class="king"> 231 <span></span> 232 <figcaption class="box">2025</figcaption> 233 </figure> 234 </aside> 235 236 <aside class="box full"> 237 Is Making:<br /> 238 <p class="right"> 239 <a href="https://parleystar.com">ParleyStar</a> 240 </p> 241 </aside> 242 243 <aside class="box full"> 244 Coolest thing:<br /> 245 <p class="right"> 246 <a href="https://open.spotify.com/user/31ebrjf2o4ajbcqkmt7ztarvu5la">Jungle Music</a> 247 </p> 248 </aside> 249 250 <aside class="box full"> 251 Schedule:<br /> 252 <p class="right"> 253 ...coming soon... 254 </p> 255 </aside> 256 257 <aside class="box full"> 258 Say Hi To Me At:<br /> 259 <p class="right"> 260 <ul class="list"> 261 <h4>March 2025</h4> 262 <li><a href="https://lootfest.co" target="_blank">LootFest Ft. Worth</a></li> 263 264 <h4>May 8 - 9</h4> 265 <li><a href="https://east.paxsite.com/indy" target="_blank">Pax East Boston</a></li> 266 267 <h4>May 10</h4> 268 <li><a href="https://www.fortnite.com/competitive/news/fortnite-creators-and-competitors-team-up-in-the-fncs-pro-am-in-los-angeles" target="_blank">Fortnite ProAM Los Angeles</a></li> 269 270 <h4>May 23 – 25</h4> 271 <li><a href="https://www.dreamhack.com/dallas" target="_blank">Dreamhack Dallas</a></li> 272 273 <h4>May 23 – 25</h4> 274 <li><a href="https://fanexpohq.com/fanexpodallas" target="_blank">Fan Expo Dallas</a></li> 275 276 <h4>July 31 - August 3</h4> 277 <li><a href="https://www.gencon.com/indy" target="_blank">GENCON Indy</a></li> 278 279 <h4>October 3 - 5</h4> 280 <li><a href="https://www.furnacefest.us" target="_blank">FurnaceFest Birmingham</a></li> 281 282 <h4>October 18</h4> 283 <li><a href="https://twitchcon.com/san-diego-2025" target="_blank">TwitchCon San Diego</a></li> 284 285 <h4>October 26</h4> 286 <li><a href="https://retropalooza.com" target="_blank">Retropalooza Ft. Worth</a></li> 287 288 <h4>November 6 - 8</h4> 289 <li><a href="https://www.reachconf.org" target="_blank">Reach Conf. Orlando</a></li> 290 291 <h4>November 27 - 30</h4> 292 <li><a href="https://www.dreamhack.com/stockholm" target="_blank">Dreamhack Stockholm</a></li> 293 </ul> 294 </p> 295 </aside> 296 297 <aside class="box full"> 298 Contact Me:<br /> 299 <p class="right"> 300 <a href="mailto:biolithic@tuta.com">biolithic@tuta.com</a><br /> 301 </p> 302 </aside> 303 </section> 304 </section> 305 306 <footer> 307 <p> 308 Design from Earthbound <br /> 309 Images from videogamesprites.net <br /> 310 This page is not connected to, affiliated, or associated with 311 Ape Inc. 312 HAL Laboratory 313 Nintendo 314 Shigesato Itoi 315 Satoru Iwata 316 Tsunekazu Ishihara . 317 This is a independent entity not connected, associated by, owned in part, or funded with or by any parent or affiliated company, any political party, political entity or elected official except the copyright entity. 318 All rights belong to these owners. Thank you. 319 © 2025 biolithic All Rights Reserved. 320 321 322 323 </p> 324 </footer> 325 </main> 326 </body> 327 </html>