1<!doctype html> 2<html 3 class="no-js" 4 lang="en" 5> 6 <head><link 7 rel="icon" 8 type="image/png" 9 href="//five12.org/cdn/shop/files/FIVE.12_favicon_9dbd98bd-d51b-4b20-8cba-e04f05e3bd7f.png?crop=center&height=32&v=1764907289&width=32" 10 > 11 <link 12 rel="expect" 13 href="#MainContent" 14 blocking="render" 15 id="view-transition-render-blocker" 16 ><meta charset="utf-8"> 17<meta 18 http-equiv="X-UA-Compatible" 19 content="IE=edge" 20> 21<meta 22 name="viewport" 23 content="width=device-width,initial-scale=1" 24> 25<meta 26 name="view-transition" 27 content="same-origin" 28> 29<meta 30 name="theme-color" 31 content="" 32> 33 34<meta 35 property="og:site_name" 36 content="Five.12 Foundation" 37> 38<meta 39 property="og:url" 40 content="https://five12.org/" 41> 42<meta 43 property="og:title" 44 content="Five.12 Foundation" 45> 46<meta 47 property="og:type" 48 content="website" 49> 50<meta 51 property="og:description" 52 content="Five.12 Foundation" 53><meta 54 name="twitter:card" 55 content="summary_large_image" 56> 57<meta 58 name="twitter:title" 59 content="Five.12 Foundation" 60> 61<meta 62 name="twitter:description" 63 content="Five.12 Foundation" 64> 65 66<title> 67 Five.12 Foundation 68</title> 69 70<link 71 rel="canonical" 72 href="https://five12.org/" 73> 74 75 76<link href="//five12.org/cdn/shop/t/1/assets/overflow-list.css?v=168694168152117541881764799996" as="style" rel="preload"> 77<link href="//five12.org/cdn/shop/t/1/assets/base.css?v=91370114524021989831764799997" rel="stylesheet" type="text/css" media="all" /> 78 79<link 80 rel="preload" 81 as="font" 82 href="//five12.org/cdn/fonts/mona_sans/monasans_n6.5d5afd0b2b72184e5278ec54199a380a2957f340.woff2" 83 type="font/woff2" 84 crossorigin 85 fetchpriority="low" 86 ><link 87 rel="preload" 88 as="font" 89 href="//five12.org/cdn/fonts/mona_sans/monasans_i5.580b6c672a6b300dbcb22f1ef422b4bfbcdc28c8.woff2" 90 type="font/woff2" 91 crossorigin 92 fetchpriority="low" 93 ><link 94 rel="preload" 95 as="font" 96 href="//five12.org/cdn/fonts/mona_sans/monasans_n9.d2e646a31f6e79cd5f1c15442a269c98e7de7917.woff2" 97 type="font/woff2" 98 crossorigin 99 fetchpriority="low" 100 ><link 101 rel="preload" 102 as="font" 103 href="//five12.org/cdn/fonts/inter/inter_n7.02711e6b374660cfc7915d1afc1c204e633421e4.woff2" 104 type="font/woff2" 105 crossorigin 106 fetchpriority="low" 107 >
108<script async crossorigin fetchpriority="high" src="/cdn/shopifycloud/importmap-polyfill/es-modules-shim.2.4.0.js"></script>
vendor: 1 bytes, line 108
108
109<script type="importmap"> 110 { 111 "imports": { 112 "@theme/critical": "//five12.org/cdn/shop/t/1/assets/critical.js?v=169402557219780209121764799996", 113 "@theme/product-title": "//five12.org/cdn/shop/t/1/assets/product-title-truncation.js?v=81744426891537421781764799996", 114 "@theme/component": "//five12.org/cdn/shop/t/1/assets/component.js?v=74239122572524296041764799997", 115 "@theme/dialog": "//five12.org/cdn/shop/t/1/assets/dialog.js?v=122984339961420548111764799996", 116 "@theme/events": "//five12.org/cdn/shop/t/1/assets/events.js?v=59172389608566392641764799996", 117 "@theme/focus": "//five12.org/cdn/shop/t/1/assets/focus.js?v=60436577539430446401764799996", 118 "@theme/morph": "//five12.org/cdn/shop/t/1/assets/morph.js?v=92630016404903954311764799996", 119 "@theme/paginated-list": "//five12.org/cdn/shop/t/1/assets/paginated-list.js?v=95298315036233333871764799997", 120 "@theme/performance": "//five12.org/cdn/shop/t/1/assets/performance.js?v=171015751390534793081764799996", 121 "@theme/product-form": "//five12.org/cdn/shop/t/1/assets/product-form.js?v=83283661069322333421764799996", 122 "@theme/recently-viewed-products": "//five12.org/cdn/shop/t/1/assets/recently-viewed-products.js?v=94729125001750262651764799996", 123 "@theme/scrolling": "//five12.org/cdn/shop/t/1/assets/scrolling.js?v=10957690925586738441764799997", 124 "@theme/section-renderer": "//five12.org/cdn/shop/t/1/assets/section-renderer.js?v=117273408521114569061764799997", 125 "@theme/section-hydration": "//five12.org/cdn/shop/t/1/assets/section-hydration.js?v=177651605160027701221764799996", 126 "@theme/utilities": "//five12.org/cdn/shop/t/1/assets/utilities.js?v=171919950116664653001764799996", 127 "@theme/variant-picker": "//five12.org/cdn/shop/t/1/assets/variant-picker.js?v=95439354777694360091764799997", 128 "@theme/media-gallery": "//five12.org/cdn/shop/t/1/assets/media-gallery.js?v=111441960308641931071764799996", 129 "@theme/quick-add": "//five12.org/cdn/shop/t/1/assets/quick-add.js?v=102040698639320169661764799996", 130 "@theme/paginated-list-aspect-ratio": "//five12.org/cdn/shop/t/1/assets/paginated-list-aspect-ratio.js?v=25254270272143792451764799996", 131 "@theme/popover-polyfill": "//five12.org/cdn/shop/t/1/assets/popover-polyfill.js?v=119029313658895111201764799996", 132 "@theme/component-quantity-selector": "//five12.org/cdn/shop/t/1/assets/component-quantity-selector.js?v=7782950339315554041764799996" 133 } 134 } 135</script>
135 136 137 138 139<link 140 rel="modulepreload" 141 href="//five12.org/cdn/shop/t/1/assets/critical.js?v=169402557219780209121764799996" 142> 143 144<link 145 rel="modulepreload" 146 href="//five12.org/cdn/shop/t/1/assets/utilities.js?v=171919950116664653001764799996" 147 fetchpriority="low" 148> 149<link 150 rel="modulepreload" 151 href="//five12.org/cdn/shop/t/1/assets/component.js?v=74239122572524296041764799997" 152 fetchpriority="low" 153> 154<link 155 rel="modulepreload" 156 href="//five12.org/cdn/shop/t/1/assets/section-renderer.js?v=117273408521114569061764799997" 157 fetchpriority="low" 158> 159<link 160 rel="modulepreload" 161 href="//five12.org/cdn/shop/t/1/assets/section-hydration.js?v=177651605160027701221764799996" 162 fetchpriority="low" 163> 164<link 165 rel="modulepreload" 166 href="//five12.org/cdn/shop/t/1/assets/morph.js?v=92630016404903954311764799996" 167 fetchpriority="low" 168> 169 170 171 172<link 173 rel="modulepreload" 174 href="//five12.org/cdn/shop/t/1/assets/focus.js?v=60436577539430446401764799996" 175 fetchpriority="low" 176> 177<link 178 rel="modulepreload" 179 href="//five12.org/cdn/shop/t/1/assets/recently-viewed-products.js?v=94729125001750262651764799996" 180 fetchpriority="low" 181> 182<link 183 rel="modulepreload" 184 href="//five12.org/cdn/shop/t/1/assets/scrolling.js?v=10957690925586738441764799997" 185 fetchpriority="low" 186> 187<link 188 rel="modulepreload" 189 href="//five12.org/cdn/shop/t/1/assets/events.js?v=59172389608566392641764799996" 190 fetchpriority="low" 191>
192<script 193 src="//five12.org/cdn/shop/t/1/assets/popover-polyfill.js?v=119029313658895111201764799996" 194 type="module" 195 fetchpriority="low" 196></script>
vendor: 1 bytes, line 196
196
197<script 198 src="//five12.org/cdn/shop/t/1/assets/quick-add.js?v=102040698639320169661764799996" 199 type="module" 200 fetchpriority="low" 201></script>
201 202
203<script 204 src="//five12.org/cdn/shop/t/1/assets/dialog.js?v=122984339961420548111764799996" 205 type="module" 206 fetchpriority="low" 207></script>
vendor: 1 bytes, line 207
207
208<script 209 src="//five12.org/cdn/shop/t/1/assets/variant-picker.js?v=95439354777694360091764799997" 210 type="module" 211 fetchpriority="low" 212></script>
vendor: 1 bytes, line 212
212
213<script 214 src="//five12.org/cdn/shop/t/1/assets/product-card.js?v=84089801565227384841764799996" 215 type="module" 216 fetchpriority="low" 217></script>
vendor: 1 bytes, line 217
217
218<script 219 src="//five12.org/cdn/shop/t/1/assets/product-form.js?v=83283661069322333421764799996" 220 type="module" 221 fetchpriority="low" 222></script>
vendor: 1 bytes, line 222
222
223<script 224 src="//five12.org/cdn/shop/t/1/assets/accordion-custom.js?v=99000499017714805851764799996" 225 type="module" 226 fetchpriority="low" 227></script>
vendor: 1 bytes, line 227
227
228<script 229 src="//five12.org/cdn/shop/t/1/assets/disclosure-custom.js?v=168050880623268140331764799996" 230 type="module" 231 fetchpriority="low" 232></script>
vendor: 1 bytes, line 232
232
233<script 234 src="//five12.org/cdn/shop/t/1/assets/media.js?v=37825095869491791421764799997" 235 type="module" 236 fetchpriority="low" 237></script>
vendor: 1 bytes, line 237
237
238<script 239 src="//five12.org/cdn/shop/t/1/assets/product-price.js?v=30079423257668675401764799996" 240 type="module" 241 fetchpriority="low" 242></script>
vendor: 1 bytes, line 242
242
243<script 244 src="//five12.org/cdn/shop/t/1/assets/product-title-truncation.js?v=81744426891537421781764799996" 245 type="module" 246 fetchpriority="low" 247></script>
vendor: 1 bytes, line 247
247
248<script 249 src="//five12.org/cdn/shop/t/1/assets/product-inventory.js?v=16343734458933704981764799996" 250 type="module" 251 fetchpriority="low" 252></script>
vendor: 1 bytes, line 252
252
253<script 254 src="//five12.org/cdn/shop/t/1/assets/show-more.js?v=94563802205717136101764799997" 255 type="module" 256 fetchpriority="low" 257></script>
vendor: 1 bytes, line 257
257
258<script 259 src="//five12.org/cdn/shop/t/1/assets/slideshow.js?v=154015486816472108841764799997" 260 type="module" 261 fetchpriority="low" 262></script>
vendor: 1 bytes, line 262
262
263<script 264 src="//five12.org/cdn/shop/t/1/assets/anchored-popover.js?v=95953304814728754461764799997" 265 type="module" 266 fetchpriority="low" 267></script>
vendor: 1 bytes, line 267
267
268<script 269 src="//five12.org/cdn/shop/t/1/assets/floating-panel.js?v=128677600744947036551764799996" 270 type="module" 271 fetchpriority="low" 272></script>
vendor: 1 bytes, line 272
272
273<script 274 src="//five12.org/cdn/shop/t/1/assets/video-background.js?v=25237992823806706551764799996" 275 type="module" 276 fetchpriority="low" 277></script>
vendor: 1 bytes, line 277
277
278<script 279 src="//five12.org/cdn/shop/t/1/assets/component-quantity-selector.js?v=7782950339315554041764799996" 280 type="module" 281 fetchpriority="low" 282></script>
vendor: 1 bytes, line 282
282
283<script 284 src="//five12.org/cdn/shop/t/1/assets/media-gallery.js?v=111441960308641931071764799996" 285 type="module" 286 fetchpriority="low" 287></script>
vendor: 1 bytes, line 287
287
288<script 289 src="//five12.org/cdn/shop/t/1/assets/rte-formatter.js?v=101420294193111439321764799996" 290 type="module" 291 fetchpriority="low" 292></script>
vendor: 1 bytes, line 292
292
293<script 294 src="//five12.org/cdn/shop/t/1/assets/gift-card-recipient-form.js?v=129634859299628245901764799996" 295 type="module" 296 fetchpriority="low" 297></script>
297 298 299 300
300<script 301 src="//five12.org/cdn/shop/t/1/assets/localization.js?v=87759161307859666401764799996" 302 type="module" 303 fetchpriority="low" 304 ></script>
304 305 306 307 308 309 310
311<script 312 src="//five12.org/cdn/shop/t/1/assets/auto-close-details.js?v=58350291535404441581764799997" 313 defer="defer" 314></script>
314 315
316<script> 317 const basePath = 'https://cdn.shopify.com/static/themes/horizon/placeholders'; 318 const Theme = { 319 placeholders: { 320 general: [ 321 `${basePath}/general-1.png`, 322 `${basePath}/general-2.png`, 323 `${basePath}/general-3.png`, 324 `${basePath}/general-4.png`, 325 `${basePath}/general-5.png`, 326 `${basePath}/general-6.png`, 327 `${basePath}/general-7.png`, 328 ], 329 product: [`${basePath}/product-ball.png`, `${basePath}/product-cone.png`, `${basePath}/product-cube.png`], 330 }, 331 translations: { 332 placeholder_image: `Placeholder image`, 333 added: `Added`, 334 recipient_form_fields_visible: `Recipient form fields are now visible`, 335 recipient_form_fields_hidden: `Recipient form fields are now hidden`, 336 recipient_form_error: `There was an error with the form submission`, 337 }, 338 routes: { 339 cart_add_url: '/cart/add.js', 340 cart_change_url: '/cart/change', 341 cart_update_url: '/cart/update', 342 cart_url: '/cart', 343 predictive_search_url: '/search/suggest', 344 search_url: '/search', 345 }, 346 template: { 347 name: 'index', 348 }, 349 }; 350</script>
350 351<style data-shopify> 352 353 354 @font-face { 355 font-family: "Mona Sans"; 356 font-weight: 600; 357 font-style: normal; 358 font-display: swap; 359 src: url("//five12.org/cdn/fonts/mona_sans/monasans_n6.5d5afd0b2b72184e5278ec54199a380a2957f340.woff2") format("woff2"), 360 url("//five12.org/cdn/fonts/mona_sans/monasans_n6.45753868d285ab3a52629bcbec5e85b7c82785b6.woff") format("woff"); 361} 362 363 @font-face { 364 font-family: "Mona Sans"; 365 font-weight: 700; 366 font-style: normal; 367 font-display: swap; 368 src: url("//five12.org/cdn/fonts/mona_sans/monasans_n7.7a174deadcf23a8eb1f5b59b4449a81c215adf52.woff2") format("woff2"), 369 url("//five12.org/cdn/fonts/mona_sans/monasans_n7.fa6a2ddc8ef9995151c1d6e9116360bce89c3e37.woff") format("woff"); 370} 371 372 @font-face { 373 font-family: "Mona Sans"; 374 font-weight: 600; 375 font-style: italic; 376 font-display: swap; 377 src: url("//five12.org/cdn/fonts/mona_sans/monasans_i6.8158067a759f82c75d200b973ada02c1db0cb985.woff2") format("woff2"), 378 url("//five12.org/cdn/fonts/mona_sans/monasans_i6.93e225c20dcc815e2ee34550fa4b577c53912569.woff") format("woff"); 379} 380 381 @font-face { 382 font-family: "Mona Sans"; 383 font-weight: 700; 384 font-style: italic; 385 font-display: swap; 386 src: url("//five12.org/cdn/fonts/mona_sans/monasans_i7.89aaf4e957e47c275eefdc2401ad05ae83998937.woff2") format("woff2"), 387 url("//five12.org/cdn/fonts/mona_sans/monasans_i7.c3ddf121e9050e4a9b2cd9e66994f7aca1957aad.woff") format("woff"); 388} 389 390 391 392 393 394 @font-face { 395 font-family: "Mona Sans"; 396 font-weight: 500; 397 font-style: italic; 398 font-display: swap; 399 src: url("//five12.org/cdn/fonts/mona_sans/monasans_i5.580b6c672a6b300dbcb22f1ef422b4bfbcdc28c8.woff2") format("woff2"), 400 url("//five12.org/cdn/fonts/mona_sans/monasans_i5.71b753aef9304e644890b0ff5cbc117787f65313.woff") format("woff"); 401} 402 403 @font-face { 404 font-family: "Mona Sans"; 405 font-weight: 700; 406 font-style: italic; 407 font-display: swap; 408 src: url("//five12.org/cdn/fonts/mona_sans/monasans_i7.89aaf4e957e47c275eefdc2401ad05ae83998937.woff2") format("woff2"), 409 url("//five12.org/cdn/fonts/mona_sans/monasans_i7.c3ddf121e9050e4a9b2cd9e66994f7aca1957aad.woff") format("woff"); 410} 411 412 @font-face { 413 font-family: "Mona Sans"; 414 font-weight: 500; 415 font-style: italic; 416 font-display: swap; 417 src: url("//five12.org/cdn/fonts/mona_sans/monasans_i5.580b6c672a6b300dbcb22f1ef422b4bfbcdc28c8.woff2") format("woff2"), 418 url("//five12.org/cdn/fonts/mona_sans/monasans_i5.71b753aef9304e644890b0ff5cbc117787f65313.woff") format("woff"); 419} 420 421 @font-face { 422 font-family: "Mona Sans"; 423 font-weight: 700; 424 font-style: italic; 425 font-display: swap; 426 src: url("//five12.org/cdn/fonts/mona_sans/monasans_i7.89aaf4e957e47c275eefdc2401ad05ae83998937.woff2") format("woff2"), 427 url("//five12.org/cdn/fonts/mona_sans/monasans_i7.c3ddf121e9050e4a9b2cd9e66994f7aca1957aad.woff") format("woff"); 428} 429 430 431 432 433 434 435 @font-face { 436 font-family: "Mona Sans"; 437 font-weight: 900; 438 font-style: normal; 439 font-display: swap; 440 src: url("//five12.org/cdn/fonts/mona_sans/monasans_n9.d2e646a31f6e79cd5f1c15442a269c98e7de7917.woff2") format("woff2"), 441 url("//five12.org/cdn/fonts/mona_sans/monasans_n9.40e5e1fd08ae64ba3566e77a5618bbf51d22ab31.woff") format("woff"); 442} 443 444 @font-face { 445 font-family: "Mona Sans"; 446 font-weight: 700; 447 font-style: normal; 448 font-display: swap; 449 src: url("//five12.org/cdn/fonts/mona_sans/monasans_n7.7a174deadcf23a8eb1f5b59b4449a81c215adf52.woff2") format("woff2"), 450 url("//five12.org/cdn/fonts/mona_sans/monasans_n7.fa6a2ddc8ef9995151c1d6e9116360bce89c3e37.woff") format("woff"); 451} 452 453 @font-face { 454 font-family: "Mona Sans"; 455 font-weight: 900; 456 font-style: italic; 457 font-display: swap; 458 src: url("//five12.org/cdn/fonts/mona_sans/monasans_i9.9bf194b23dc98da21eba221ad43de0f0b7eff4df.woff2") format("woff2"), 459 url("//five12.org/cdn/fonts/mona_sans/monasans_i9.09d680a96f99519fad20d46e4107b5ab118f9a2d.woff") format("woff"); 460} 461 462 @font-face { 463 font-family: "Mona Sans"; 464 font-weight: 700; 465 font-style: italic; 466 font-display: swap; 467 src: url("//five12.org/cdn/fonts/mona_sans/monasans_i7.89aaf4e957e47c275eefdc2401ad05ae83998937.woff2") format("woff2"), 468 url("//five12.org/cdn/fonts/mona_sans/monasans_i7.c3ddf121e9050e4a9b2cd9e66994f7aca1957aad.woff") format("woff"); 469} 470 471 472 473 474 475 476 @font-face { 477 font-family: Inter; 478 font-weight: 700; 479 font-style: normal; 480 font-display: swap; 481 src: url("//five12.org/cdn/fonts/inter/inter_n7.02711e6b374660cfc7915d1afc1c204e633421e4.woff2") format("woff2"), 482 url("//five12.org/cdn/fonts/inter/inter_n7.6dab87426f6b8813070abd79972ceaf2f8d3b012.woff") format("woff"); 483} 484 485 @font-face { 486 font-family: Inter; 487 font-weight: 700; 488 font-style: normal; 489 font-display: swap; 490 src: url("//five12.org/cdn/fonts/inter/inter_n7.02711e6b374660cfc7915d1afc1c204e633421e4.woff2") format("woff2"), 491 url("//five12.org/cdn/fonts/inter/inter_n7.6dab87426f6b8813070abd79972ceaf2f8d3b012.woff") format("woff"); 492} 493 494 @font-face { 495 font-family: Inter; 496 font-weight: 700; 497 font-style: italic; 498 font-display: swap; 499 src: url("//five12.org/cdn/fonts/inter/inter_i7.b377bcd4cc0f160622a22d638ae7e2cd9b86ea4c.woff2") format("woff2"), 500 url("//five12.org/cdn/fonts/inter/inter_i7.7c69a6a34e3bb44fcf6f975857e13b9a9b25beb4.woff") format("woff"); 501} 502 503 @font-face { 504 font-family: Inter; 505 font-weight: 700; 506 font-style: italic; 507 font-display: swap; 508 src: url("//five12.org/cdn/fonts/inter/inter_i7.b377bcd4cc0f160622a22d638ae7e2cd9b86ea4c.woff2") format("woff2"), 509 url("//five12.org/cdn/fonts/inter/inter_i7.7c69a6a34e3bb44fcf6f975857e13b9a9b25beb4.woff") format("woff"); 510} 511 512 513 514 :root { 515 /* Page Layout */ 516 --sidebar-width: 25rem; 517 --narrow-content-width: 36rem; 518 --normal-content-width: 42rem; 519 --wide-content-width: 46rem; 520 --narrow-page-width: 90rem; 521 --normal-page-width: 120rem; 522 --wide-page-width: 150rem; 523 524 /* Section Heights */ 525 --section-height-small: 15rem; 526 --section-height-medium: 25rem; 527 --section-height-large: 35rem; 528 529 @media screen and (min-width: 40em) { 530 --section-height-small: 40svh; 531 --section-height-medium: 55svh; 532 --section-height-large: 70svh; 533 } 534 535 @media screen and (min-width: 60em) { 536 --section-height-small: 50svh; 537 --section-height-medium: 65svh; 538 --section-height-large: 80svh; 539 } 540 541 /* Letter spacing */ 542 --letter-spacing-sm: 0.06em; 543 --letter-spacing-md: 0.13em; 544 545 /* Font families */ 546 --font-body--family: "Mona Sans", sans-serif; 547 --font-body--style: normal; 548 --font-body--weight: 600; 549 --font-subheading--family: "Mona Sans", sans-serif; 550 --font-subheading--style: italic; 551 --font-subheading--weight: 500; 552 --font-heading--family: "Mona Sans", sans-serif; 553 --font-heading--style: normal; 554 --font-heading--weight: 900; 555 --font-accent--family: Inter, sans-serif; 556 --font-accent--style: normal; 557 --font-accent--weight: 700; 558 559 /* Margin sizes */ 560 --font-h1--spacing: 0.25em; 561 --font-h2--spacing: 0.25em; 562 --font-h3--spacing: 0.25em; 563 --font-h4--spacing: 0.25em; 564 --font-h5--spacing: 0.25em; 565 --font-h6--spacing: 0.25em; 566 --font-paragraph--spacing: 0.5em; 567 568 /* Heading colors */ 569 --font-h1--color: var(--color-foreground-heading); 570 --font-h2--color: var(--color-foreground-heading); 571 --font-h3--color: var(--color-foreground-heading); 572 --font-h4--color: var(--color-foreground-heading); 573 --font-h5--color: var(--color-foreground-heading); 574 --font-h6--color: var(--color-foreground-heading); 575 576 /** Z-Index / Layering */ 577 --layer-section-background: -2; 578 --layer-lowest: -1; 579 --layer-base: 0; 580 --layer-flat: 1; 581 --layer-raised: 2; 582 --layer-heightened: 4; 583 --layer-sticky: 8; 584 --layer-window-overlay: 10; 585 --layer-header-menu: 12; 586 --layer-overlay: 16; 587 --layer-menu-drawer: 18; 588 --layer-temporary: 20; 589 590 /* Max-width / Measure */ 591 --max-width--body-normal: 50ch; 592 --max-width--body-narrow: 35ch; 593 594 --max-width--heading-normal: 50ch; 595 --max-width--heading-narrow: 30ch; 596 597 --max-width--display-normal: 20ch; 598 --max-width--display-narrow: 15ch; 599 --max-width--display-tight: 5ch; 600 601 /* Letter-spacing / Tracking */ 602 --letter-spacing--display-tight: -0.03em; 603 --letter-spacing--display-normal: 0em; 604 --letter-spacing--display-loose: 0.03em; 605 606 --letter-spacing--heading-tight: -0.03em; 607 --letter-spacing--heading-normal: 0em; 608 --letter-spacing--heading-loose: 0.03em; 609 610 --letter-spacing--body-tight: -0.03em; 611 --letter-spacing--body-normal: 0em; 612 --letter-spacing--body-loose: 0.03em; 613 614 /* Line height / Leading */ 615 --line-height: 1; 616 617 --line-height--display-tight: 1; 618 --line-height--display-normal: 1.1; 619 --line-height--display-loose: 1.2; 620 621 --line-height--heading-tight: 1.15; 622 --line-height--heading-normal: 1.25; 623 --line-height--heading-loose: 1.35; 624 625 --line-height--body-tight: 1.2; 626 --line-height--body-normal: 1.4; 627 --line-height--body-loose: 1.6; 628 629 /* Typography presets */ 630 --font-size--paragraph: 0.875rem;--font-size--h1: clamp(3.0rem, 5.6vw, 3.5rem);--font-size--h2: clamp(2.25rem, 4.8vw, 3.0rem);--font-size--h3: 2.0rem;--font-size--h4: 1.5rem;--font-size--h5: 0.875rem;--font-size--h6: 0.75rem;--font-paragraph--weight: 400;--font-paragraph--letter-spacing: var(--letter-spacing--body-normal);--font-paragraph--size: var(--font-size--paragraph);--font-paragraph--family: var(--font-body--family);--font-paragraph--style: var(--font-body--style);--font-paragraph--case: ;--font-paragraph--line-height: var(--line-height--body-loose);--font-h1--weight: var(--font-heading--weight);--font-h1--letter-spacing: var(--letter-spacing--heading-normal);--font-h1--size: var(--font-size--h1);--font-h1--family: var(--font-heading--family);--font-h1--style: var(--font-heading--style);--font-h1--case: none;--font-h1--line-height: var(--line-height--display-tight);--font-h2--weight: var(--font-heading--weight);--font-h2--letter-spacing: var(--letter-spacing--heading-normal);--font-h2--size: var(--font-size--h2);--font-h2--family: var(--font-heading--family);--font-h2--style: var(--font-heading--style);--font-h2--case: none;--font-h2--line-height: var(--line-height--display-tight);--font-h3--weight: var(--font-heading--weight);--font-h3--letter-spacing: var(--letter-spacing--heading-normal);--font-h3--size: var(--font-size--h3);--font-h3--family: var(--font-heading--family);--font-h3--style: var(--font-heading--style);--font-h3--case: none;--font-h3--line-height: var(--line-height--display-normal);--font-h4--weight: var(--font-heading--weight);--font-h4--letter-spacing: var(--letter-spacing--heading-normal);--font-h4--size: var(--font-size--h4);--font-h4--family: var(--font-heading--family);--font-h4--style: var(--font-heading--style);--font-h4--case: none;--font-h4--line-height: var(--line-height--display-tight);--font-h5--weight: var(--font-subheading--weight);--font-h5--letter-spacing: var(--letter-spacing--heading-normal);--font-h5--size: var(--font-size--h5);--font-h5--family: var(--font-subheading--family);--font-h5--style: var(--font-subheading--style);--font-h5--case: none;--font-h5--line-height: var(--line-height--display-loose);--font-h6--weight: var(--font-subheading--weight);--font-h6--letter-spacing: var(--letter-spacing--heading-normal);--font-h6--size: var(--font-size--h6);--font-h6--family: var(--font-subheading--family);--font-h6--style: var(--font-subheading--style);--font-h6--case: none;--font-h6--line-height: var(--line-height--display-loose); 631 632 /* Hardcoded font sizes */ 633 --font-size--2xs: 0.625rem; 634 --font-size--xs: 0.8125rem; 635 --font-size--sm: 0.875rem; 636 --font-size--md: 1rem; 637 --font-size--lg: 1.125rem; 638 --font-size--xl: 1.25rem; 639 --font-size--2xl: 1.5rem; 640 --font-size--3xl: 2rem; 641 --font-size--4xl: 2.5rem; 642 --font-size--5xl: 3rem; 643 --font-size--6xl: 3.5rem; 644 645 /* Menu font sizes */ 646 --menu-font-sm--size: 0.875rem; 647 --menu-font-sm--line-height: calc(1.1 + 0.5 * min(16 / 14)); 648 --menu-font-md--size: 1rem; 649 --menu-font-md--line-height: calc(1.1 + 0.5 * min(16 / 16)); 650 --menu-font-lg--size: 1.125rem; 651 --menu-font-lg--line-height: calc(1.1 + 0.5 * min(16 / 18)); 652 --menu-font-xl--size: 1.25rem; 653 --menu-font-xl--line-height: calc(1.1 + 0.5 * min(16 / 20)); 654 --menu-font-2xl--size: 1.75rem; 655 --menu-font-2xl--line-height: calc(1.1 + 0.5 * min(16 / 28)); 656 657 /* Colors */ 658 --color-error: #8B0000; 659 --color-success: #006400; 660 --color-white: #FFFFFF; 661 --color-white-rgb: 255 255 255; 662 --color-black: #000000; 663 --color-instock: #3ED660; 664 --color-lowstock: #EE9441; 665 --color-outofstock: #C8C8C8; 666 667 /* Opacity */ 668 --opacity-5: 0.05; 669 --opacity-8: 0.08; 670 --opacity-10: 0.1; 671 --opacity-15: 0.15; 672 --opacity-20: 0.2;
673 --opacity-25: 0.25; 674 --opacity-30: 0.3; 675 --opacity-40: 0.4; 676 --opacity-50: 0.5; 677 --opacity-60: 0.6; 678 --opacity-70: 0.7; 679 --opacity-80: 0.8; 680 --opacity-85: 0.85; 681 --opacity-90: 0.9; 682 --opacity-subdued-text: var(--opacity-70); 683 684 --shadow-button: 0 2px 3px rgb(0 0 0 / 20%); 685 --gradient-image-overlay: linear-gradient(to top, rgb(0 0 0 / 0.5), transparent); 686 687 /* Spacing */ 688 --margin-3xs: 0.125rem; 689 --margin-2xs: 0.3rem; 690 --margin-xs: 0.5rem; 691 --margin-sm: 0.7rem; 692 --margin-md: 0.8rem; 693 --margin-lg: 1rem; 694 --margin-xl: 1.25rem; 695 --margin-2xl: 1.5rem; 696 --margin-3xl: 1.75rem; 697 --margin-4xl: 2rem; 698 --margin-5xl: 3rem; 699 --margin-6xl: 5rem; 700 701 --scroll-margin: 50px; 702 703 --padding-3xs: 0.125rem; 704 --padding-2xs: 0.25rem; 705 --padding-xs: 0.5rem; 706 --padding-sm: 0.7rem; 707 --padding-md: 0.8rem; 708 --padding-lg: 1rem; 709 --padding-xl: 1.25rem; 710 --padding-2xl: 1.5rem; 711 --padding-3xl: 1.75rem; 712 --padding-4xl: 2rem; 713 --padding-5xl: 3rem; 714 --padding-6xl: 4rem; 715 716 --gap-3xs: 0.125rem; 717 --gap-2xs: 0.3rem; 718 --gap-xs: 0.5rem; 719 --gap-sm: 0.7rem; 720 --gap-md: 0.9rem; 721 --gap-lg: 1rem; 722 --gap-xl: 1.25rem; 723 --gap-2xl: 2rem; 724 --gap-3xl: 3rem; 725 726 --spacing-scale-sm: 0.6; 727 --spacing-scale-md: 0.7; 728 --spacing-scale-default: 1.0; 729 730 /* Checkout buttons gap */ 731 --checkout-button-gap: 10px; 732 733 /* Borders */ 734 --style-border-width: 1px; 735 --style-border-radius-xs: 0.2rem; 736 --style-border-radius-sm: 0.6rem; 737 --style-border-radius-md: 0.8rem; 738 --style-border-radius-50: 50%; 739 --style-border-radius-lg: 1rem; 740 --style-border-radius-pills: 40px; 741 --style-border-radius-inputs: 4px; 742 --style-border-radius-buttons-primary: 72px; 743 --style-border-radius-buttons-secondary: 14px; 744 --style-border-width-primary: 0px; 745 --style-border-width-secondary: 1px; 746 --style-border-width-inputs: 1px; 747 --style-border-radius-popover: 14px; 748 --style-border-popover: 1px none rgb(var(--color-border-rgb) / 50%); 749 --style-border-drawer: 1px none rgb(var(--color-border-rgb) / 50%); 750 --style-border-swatch-opacity: 10%; 751 --style-border-swatch-width: 1px; 752 --style-border-swatch-style: solid; 753 754 /* Animation */ 755 --ease-out-cubic: cubic-bezier(0.33, 1, 0.68, 1); 756 --ease-out-quad: cubic-bezier(0.32, 0.72, 0, 1); 757 --animation-speed-fast: 0.0625s; 758 --animation-speed: 0.125s; 759 --animation-speed-slow: 0.2s; 760 --animation-speed-medium: 0.15s; 761 --animation-easing: ease-in-out; 762 --animation-slideshow-easing: cubic-bezier(0.4, 0, 0.2, 1); 763 --drawer-animation-speed: 0.2s; 764 --animation-values-slow: var(--animation-speed-slow) var(--animation-easing); 765 --animation-values: var(--animation-speed) var(--animation-easing); 766 --animation-values-fast: var(--animation-speed-fast) var(--animation-easing); 767 --animation-values-allow-discrete: var(--animation-speed) var(--animation-easing) allow-discrete; 768 --animation-timing-hover: cubic-bezier(0.25, 0.46, 0.45, 0.94); 769 --animation-timing-active: cubic-bezier(0.5, 0, 0.75, 0); 770 --animation-timing-bounce: cubic-bezier(0.34, 1.56, 0.64, 1); 771 --animation-timing-default: cubic-bezier(0, 0, 0.2, 1); 772 --animation-timing-fade-in: cubic-bezier(0.16, 1, 0.3, 1); 773 --animation-timing-fade-out: cubic-bezier(0.4, 0, 0.2, 1); 774 775 /* View transitions */ 776 /* View transition old */ 777 --view-transition-old-main-content: var(--animation-speed) var(--animation-easing) both fadeOut; 778 779 /* View transition new */ 780 --view-transition-new-main-content: var(--animation-speed) var(--animation-easing) both fadeIn, var(--animation-speed) var(--animation-easing) both slideInTopViewTransition; 781 782 /* Focus */ 783 --focus-outline-width: 0.09375rem; 784 --focus-outline-offset: 0.2em; 785 786 /* Badges */ 787 --badge-blob-padding-block: 1px; 788 --badge-blob-padding-inline: 12px 8px; 789 --badge-rectangle-padding-block: 1px; 790 --badge-rectangle-padding-inline: 6px; 791 @media screen and (min-width: 750px) { 792 --badge-blob-padding-block: 4px; 793 --badge-blob-padding-inline: 16px 12px; 794 --badge-rectangle-padding-block: 4px; 795 --badge-rectangle-padding-inline: 10px; 796 } 797 798 /* Icons */ 799 --icon-size-2xs: 0.6rem; 800 --icon-size-xs: 0.85rem; 801 --icon-size-sm: 1.25rem; 802 --icon-size-md: 1.375rem; 803 --icon-size-lg: 1.5rem; 804 --icon-stroke-width: 1.5px; 805 806 /* Input */ 807 --input-email-min-width: 200px; 808 --input-search-max-width: 650px; 809 --input-padding-y: 0.8rem; 810 --input-padding-x: 0.8rem; 811 --input-padding: var(--input-padding-y) var(--input-padding-x); 812 --input-box-shadow-width: var(--style-border-width-inputs); 813 --input-box-shadow: 0 0 0 var(--input-box-shadow-width) var(--color-input-border); 814 --input-box-shadow-focus: 0 0 0 calc(var(--input-box-shadow-width) + 0.5px) var(--color-input-border); 815 --input-disabled-background-color: rgb(var(--color-foreground-rgb) / var(--opacity-10)); 816 --input-disabled-border-color: rgb(var(--color-foreground-rgb) / var(--opacity-5)); 817 --input-disabled-text-color: rgb(var(--color-foreground-rgb) / var(--opacity-50));
818 --input-textarea-min-height: 55px; 819 820 /* Button size */ 821 --button-size-sm: 30px; 822 --button-size-md: 36px; 823 --button-size: var(--minimum-touch-target); 824 --button-padding-inline: 24px; 825 --button-padding-block: 16px; 826 827 /* Button font-family */ 828 --button-font-family-primary: var(--font-accent--family); 829 --button-font-family-secondary: var(--font-body--family); 830 831 /* Button text case */ 832 --button-text-case: ; 833 --button-text-case-primary: uppercase; 834 --button-text-case-secondary: default; 835 836 /* Borders */ 837 --border-color: rgb(var(--color-border-rgb) / var(--opacity-50)); 838 --border-width-sm: 1px; 839 --border-width-md: 2px; 840 --border-width-lg: 5px; 841 842 /* Drawers */ 843 --drawer-inline-padding: 25px; 844 --drawer-menu-inline-padding: 2.5rem; 845 --drawer-header-block-padding: 20px; 846 --drawer-content-block-padding: 10px; 847 --drawer-header-desktop-top: 0rem; 848 --drawer-padding: calc(var(--padding-sm) + 7px); 849 --drawer-height: 100dvh; 850 --drawer-width: 95vw; 851 --drawer-max-width: 500px; 852 853 /* Variant Picker Swatches */ 854 --variant-picker-swatch-width-unitless: 34; 855 --variant-picker-swatch-height-unitless: 34; 856 --variant-picker-swatch-width: 34px; 857 --variant-picker-swatch-height: 34px; 858 --variant-picker-swatch-radius: 32px; 859 --variant-picker-border-width: 1px; 860 --variant-picker-border-style: solid; 861 --variant-picker-border-opacity: 10%; 862 863 /* Variant Picker Buttons */ 864 --variant-picker-button-radius: 14px; 865 --variant-picker-button-border-width: 1px; 866 867 /* Slideshow */ 868 --slideshow-controls-size: 3.5rem; 869 --slideshow-controls-icon: 2rem; 870 --peek-next-slide-size: 3rem; 871 872 /* Utilities */ 873 --backdrop-opacity: 0.15; 874 --backdrop-color-rgb: var(--color-shadow-rgb); 875 --minimum-touch-target: 44px; 876 --disabled-opacity: 0.5; 877 --skeleton-opacity: 0.025; 878 879 /* Shapes */ 880 --shape--circle: circle(50% at center); 881 --shape--sunburst: polygon(100% 50%,94.62% 55.87%,98.3% 62.94%,91.57% 67.22%,93.3% 75%,85.7% 77.39%,85.36% 85.36%,77.39% 85.7%,75% 93.3%,67.22% 91.57%,62.94% 98.3%,55.87% 94.62%,50% 100%,44.13% 94.62%,37.06% 98.3%,32.78% 91.57%,25% 93.3%,22.61% 85.7%,14.64% 85.36%,14.3% 77.39%,6.7% 75%,8.43% 67.22%,1.7% 62.94%,5.38% 55.87%,0% 50%,5.38% 44.13%,1.7% 37.06%,8.43% 32.78%,6.7% 25%,14.3% 22.61%,14.64% 14.64%,22.61% 14.3%,25% 6.7%,32.78% 8.43%,37.06% 1.7%,44.13% 5.38%,50% 0%,55.87% 5.38%,62.94% 1.7%,67.22% 8.43%,75% 6.7%,77.39% 14.3%,85.36% 14.64%,85.7% 22.61%,93.3% 25%,91.57% 32.78%,98.3% 37.06%,94.62% 44.13%); 882 --shape--diamond: polygon(50% 0%, 100% 50%, 50% 100%, 0% 50%); 883 --shape--blob: polygon(85.349% 11.712%, 87.382% 13.587%, 89.228% 15.647%, 90.886% 17.862%, 92.359% 20.204%, 93.657% 22.647%, 94.795% 25.169%, 95.786% 27.752%, 96.645% 30.382%, 97.387% 33.048%, 98.025% 35.740%, 98.564% 38.454%, 99.007% 41.186%, 99.358% 43.931%, 99.622% 46.685%, 99.808% 49.446%, 99.926% 52.210%, 99.986% 54.977%, 99.999% 57.744%, 99.975% 60.511%, 99.923% 63.278%, 99.821% 66.043%, 99.671% 68.806%, 99.453% 71.565%, 99.145% 74.314%, 98.724% 77.049%, 98.164% 79.759%, 97.433% 82.427%, 96.495% 85.030%, 95.311% 87.529%, 93.841% 89.872%, 92.062% 91.988%, 89.972% 93.796%, 87.635% 95.273%, 85.135% 96.456%, 82.532% 97.393%, 79.864% 98.127%, 77.156% 98.695%, 74.424% 99.129%, 71.676% 99.452%, 68.918% 99.685%, 66.156% 99.844%, 63.390% 99.942%, 60.624% 99.990%, 57.856% 99.999%, 55.089% 99.978%, 52.323% 99.929%, 49.557% 99.847%, 46.792% 99.723%, 44.031% 99.549%, 41.273% 99.317%, 38.522% 99.017%, 35.781% 98.639%, 33.054% 98.170%, 30.347% 97.599%, 27.667% 96.911%, 25.024% 96.091%, 22.432% 95.123%, 19.907% 93.994%, 17.466% 92.690%, 15.126% 91.216%, 12.902% 89.569%, 10.808% 87.761%, 8.854% 85.803%, 7.053% 83.703%, 5.418% 81.471%, 3.962% 79.119%, 2.702% 76.656%, 1.656% 74.095%, 0.846% 71.450%, 0.294% 68.740%, 0.024% 65.987%, 0.050% 63.221%, 0.343% 60.471%, 0.858% 57.752%, 1.548% 55.073%, 2.370% 52.431%, 3.283% 49.819%, 4.253% 47.227%, 5.249% 44.646%, 6.244% 42.063%, 7.211% 39.471%, 8.124% 36.858%, 8.958% 34.220%, 9.711% 31.558%, 10.409% 28.880%, 11.083% 26.196%, 11.760% 23.513%, 12.474% 20.839%, 13.259% 18.186%, 14.156% 15.569%, 15.214% 13.012%, 16.485% 10.556%, 18.028% 8.261%, 19.883
883% 6.211%, 22.041% 4.484%, 24.440% 3.110%, 26.998% 2.057%, 29.651% 1.275%, 32.360% 0.714%, 35.101% 0.337%, 37.859% 0.110%, 40.624% 0.009%, 43.391% 0.016%, 46.156% 0.113%, 48.918% 0.289%, 51.674% 0.533%, 54.425% 0.837%, 57.166% 1.215%, 59.898% 1.654%, 62.618% 2.163%, 65.322% 2.750%, 68.006% 3.424%, 70.662% 4.197%, 73.284% 5.081%, 75.860% 6.091%, 78.376% 7.242%, 80.813% 8.551%, 83.148% 10.036%, 85.349% 11.712%); 884 885 /* Buy buttons */ 886 --height-buy-buttons: calc(var(--padding-lg) * 2 + var(--icon-size-sm)); 887 888 /* Card image width and height variables */ 889 --card-width-small: 10rem; 890 891 --height-small: 10rem; 892 --height-medium: 11.5rem; 893 --height-large: 13rem; 894 --height-full: 100vh; 895 896 @media screen and (min-width: 750px) { 897 --height-small: 17.5rem; 898 --height-medium: 21.25rem; 899 --height-large: 25rem; 900 } 901 902 /* Modal */ 903 --modal-max-height: 65dvh; 904 905 /* Card styles for search */ 906 --card-bg-hover: rgb(var(--color-foreground-rgb) / var(--opacity-5)); 907 --card-border-hover: rgb(var(--color-foreground-rgb) / var(--opacity-30)); 908 --card-border-focus: rgb(var(--color-foreground-rgb) / var(--opacity-10)); 909 910 /* Cart */ 911 --cart-primary-font-family: var(--font-body--family); 912 --cart-primary-font-style: var(--font-body--style); 913 --cart-primary-font-weight: var(--font-body--weight); 914 --cart-secondary-font-family: var(--font-secondary--family); 915 --cart-secondary-font-style: var(--font-secondary--style); 916 --cart-secondary-font-weight: var(--font-secondary--weight); 917 } 918</style> 919<style data-shopify> 920 921 922 :root, 923 924 925 926 .color-scheme-1 { 927 --color-background: rgb(249 242 226 / 1.0); 928 /* RGB values only to apply different opacities - Relative color values are not supported in iOS < 16.4 */ 929 --color-background-rgb: 249 242 226; 930 --opacity-5-15: 0.05; 931 --opacity-10-25: 0.1; 932 --opacity-35-55: 0.35; 933 --opacity-40-60: 0.4; 934 --opacity-30-60: 0.3; 935 --color-foreground: rgb(0 0 0 / 0.81); 936 --color-foreground-rgb: 0 0 0; 937 --color-foreground-heading: rgb(0 0 0 / 1.0); 938 --color-foreground-heading-rgb: 0 0 0; 939 --color-primary: rgb(0 0 0 / 0.81); 940 --color-primary-rgb: 0 0 0; 941 --color-primary-hover: rgb(0 0 0 / 1.0); 942 --color-primary-hover-rgb: 0 0 0; 943 --color-border: rgb(0 0 0 / 0.06); 944 --color-border-rgb: 0 0 0; 945 --color-shadow: rgb(0 0 0 / 1.0); 946 --color-shadow-rgb: 0 0 0; 947 --color-primary-button-text: rgb(255 255 255 / 1.0); 948 --color-primary-button-background: rgb(133 23 204 / 1.0); 949 --color-primary-button-border: rgb(0 0 0 / 1.0); 950 --color-primary-button-hover-text: rgb(255 255 255 / 1.0); 951 --color-primary-button-hover-background: rgb(51 51 51 / 1.0); 952 --color-primary-button-hover-border: rgb(0 0 0 / 1.0); 953 --color-secondary-button-text: rgb(0 0 0 / 1.0); 954 --color-secondary-button-background: rgb(0 0 0 / 0.0); 955 --color-secondary-button-border: rgb(0 0 0 / 1.0); 956 --color-secondary-button-hover-text: rgb(51 51 51 / 1.0); 957 --color-secondary-button-hover-background: rgb(250 250 250 / 1.0); 958 --color-secondary-button-hover-border: rgb(51 51 51 / 1.0); 959 --color-input-background: rgb(255 255 255 / 0.78); 960 --color-input-text: rgb(51 51 51 / 1.0); 961 --color-input-text-rgb: 51 51 51; 962 --color-input-border: rgb(223 223 223 / 1.0); 963 --color-input-hover-background: rgb(0 0 0 / 0.01); 964 --color-variant-background: rgb(255 255 255 / 1.0); 965 --color-variant-border: rgb(0 0 0 / 0.13); 966 --color-variant-text: rgb(0 0 0 / 1.0); 967 --color-variant-text-rgb: 0 0 0; 968 --color-variant-hover-background: rgb(245 245 245 / 1.0); 969 --color-variant-hover-text: rgb(0 0 0 / 1.0); 970 --color-variant-hover-border: rgb(230 230 230 / 1.0); 971 --color-selected-variant-background: rgb(0 0 0 / 1.0); 972 --color-selected-variant-border: rgb(0 0 0 / 1.0); 973 --color-selected-variant-text: rgb(255 255 255 / 1.0); 974 --color-selected-variant-hover-background: rgb(26 26 26 / 1.0); 975 --color-selected-variant-hover-text: rgb(255 255 255 / 1.0); 976 --color-selected-variant-hover-border: rgb(26 26 26 / 1.0); 977 978 --input-disabled-background-color: rgb(var(--color-foreground-rgb) / var(--opacity-10)); 979 --input-disabled-border-color: rgb(var(--color-foreground-rgb) / var(--opacity-5-15)); 980 --input-disabled-text-color: rgb(var(--color-foreground-rgb) / var(--opacity-50)); 981 --color-foreground-muted: rgb(var(--color-foreground-rgb) / var(--opacity-60)); 982 --font-h1--color: var(--color-foreground-heading); 983 --font-h2--color: var(--color-foreground-heading); 984 --font-h3--color: var(--color-foreground-heading); 985 --font-h4--color: var(--color-foreground-heading); 986 --font-h5--color: var(--color-foreground-heading); 987 --font-h6--color: var(--color-foreground-heading); 988 989 /* Shadows */ 990 991 --shadow-drawer: 0px 4px 20px rgb(var(--color-shadow-rgb) / var(--opacity-15)); 992 993 994 --shadow-blur: 20px; 995 --shadow-popover: 0px 4px 20px rgb(var(--color-shadow-rgb) / var(--opacity-15)); 996 997 } 998 999 1000 1001 1002 .color-scheme-2 {
1003 --color-background: rgb(133 23 204 / 1.0); 1004 /* RGB values only to apply different opacities - Relative color values are not supported in iOS < 16.4 */ 1005 --color-background-rgb: 133 23 204; 1006 --opacity-5-15: 0.05; 1007 --opacity-10-25: 0.1; 1008 --opacity-35-55: 0.35; 1009 --opacity-40-60: 0.4; 1010 --opacity-30-60: 0.3; 1011 --color-foreground: rgb(255 255 255 / 1.0); 1012 --color-foreground-rgb: 255 255 255; 1013 --color-foreground-heading: rgb(0 0 0 / 1.0); 1014 --color-foreground-heading-rgb: 0 0 0; 1015 --color-primary: rgb(0 0 0 / 0.81); 1016 --color-primary-rgb: 0 0 0; 1017 --color-primary-hover: rgb(255 255 255 / 1.0); 1018 --color-primary-hover-rgb: 255 255 255; 1019 --color-border: rgb(223 223 223 / 1.0); 1020 --color-border-rgb: 223 223 223; 1021 --color-shadow: rgb(0 0 0 / 1.0); 1022 --color-shadow-rgb: 0 0 0; 1023 --color-primary-button-text: rgb(255 255 255 / 1.0); 1024 --color-primary-button-background: rgb(0 0 0 / 1.0); 1025 --color-primary-button-border: rgb(0 0 0 / 1.0); 1026 --color-primary-button-hover-text: rgb(255 255 255 / 1.0); 1027 --color-primary-button-hover-background: rgb(51 51 51 / 1.0); 1028 --color-primary-button-hover-border: rgb(51 51 51 / 1.0); 1029 --color-secondary-button-text: rgb(0 0 0 / 1.0); 1030 --color-secondary-button-background: rgb(0 0 0 / 0.0); 1031 --color-secondary-button-border: rgb(0 0 0 / 1.0); 1032 --color-secondary-button-hover-text: rgb(0 0 0 / 1.0); 1033 --color-secondary-button-hover-background: rgb(255 255 255 / 0.36); 1034 --color-secondary-button-hover-border: rgb(51 51 51 / 0.73); 1035 --color-input-background: rgb(0 0 0 / 0.0); 1036 --color-input-text: rgb(0 0 0 / 0.53); 1037 --color-input-text-rgb: 0 0 0; 1038 --color-input-border: rgb(0 0 0 / 0.13); 1039 --color-input-hover-background: rgb(255 255 255 / 0.36); 1040 --color-variant-background: rgb(255 255 255 / 1.0); 1041 --color-variant-border: rgb(230 230 230 / 1.0); 1042 --color-variant-text: rgb(0 0 0 / 1.0); 1043 --color-variant-text-rgb: 0 0 0; 1044 --color-variant-hover-background: rgb(245 245 245 / 1.0); 1045 --color-variant-hover-text: rgb(0 0 0 / 1.0); 1046 --color-variant-hover-border: rgb(230 230 230 / 1.0); 1047 --color-selected-variant-background: rgb(0 0 0 / 1.0); 1048 --color-selected-variant-border: rgb(0 0 0 / 1.0); 1049 --color-selected-variant-text: rgb(255 255 255 / 1.0); 1050 --color-selected-variant-hover-background: rgb(26 26 26 / 1.0); 1051 --color-selected-variant-hover-text: rgb(255 255 255 / 1.0); 1052 --color-selected-variant-hover-border: rgb(26 26 26 / 1.0); 1053 1054 --input-disabled-background-color: rgb(var(--color-foreground-rgb) / var(--opacity-10)); 1055 --input-disabled-border-color: rgb(var(--color-foreground-rgb) / var(--opacity-5-15)); 1056 --input-disabled-text-color: rgb(var(--color-foreground-rgb) / var(--opacity-50)); 1057 --color-foreground-muted: rgb(var(--color-foreground-rgb) / var(--opacity-60)); 1058 --font-h1--color: var(--color-foreground-heading); 1059 --font-h2--color: var(--color-foreground-heading); 1060 --font-h3--color: var(--color-foreground-heading); 1061 --font-h4--color: var(--color-foreground-heading); 1062 --font-h5--color: var(--color-foreground-heading); 1063 --font-h6--color: var(--color-foreground-heading); 1064 1065 /* Shadows */ 1066 1067 --shadow-drawer: 0px 4px 20px rgb(var(--color-shadow-rgb) / var(--opacity-15)); 1068 1069 1070 --shadow-blur: 20px; 1071 --shadow-popover: 0px 4px 20px rgb(var(--color-shadow-rgb) / var(--opacity-15)); 1072 1073 } 1074 1075 1076 1077 1078 .color-scheme-3 { 1079 --color-background: rgb(238 241 234 / 1.0); 1080 /* RGB values only to apply different opacities - Relative color values are not supported in iOS < 16.4 */ 1081 --color-background-rgb: 238 241 234; 1082 --opacity-5-15: 0.05; 1083 --opacity-10-25: 0.1; 1084 --opacity-35-55: 0.35; 1085 --opacity-40-60: 0.4; 1086 --opacity-30-60: 0.3; 1087 --color-foreground: rgb(0 0 0 / 0.81); 1088 --color-foreground-rgb: 0 0 0; 1089 --color-foreground-heading: rgb(0 0 0 / 1.0); 1090 --color-foreground-heading-rgb: 0 0 0; 1091 --color-primary: rgb(0 0 0 / 0.81); 1092 --color-primary-rgb: 0 0 0; 1093 --color-primary-hover: rgb(0 0 0 / 1.0); 1094 --color-primary-hover-rgb: 0 0 0; 1095 --color-border: rgb(0 0 0 / 0.81); 1096 --color-border-rgb: 0 0 0; 1097 --color-shadow: rgb(0 0 0 / 1.0); 1098 --color-shadow-rgb: 0 0 0; 1099 --color-primary-button-text: rgb(255 255 255 / 1.0); 1100 --color-primary-button-background: rgb(0 0 0 / 1.0); 1101 --color-primary-button-border: rgb(0 0 0 / 1.0); 1102 --color-primary-button-hover-text: rgb(255 255 255 / 1.0); 1103 --color-primary-button-hover-background: rgb(51 51 51 / 1.0); 1104 --color-primary-button-hover-border: rgb(51 51 51 / 1.0); 1105 --color-secondary-button-text: rgb(0 0 0 / 1.0); 1106 --color-secondary-button-background: rgb(0 0 0 / 0.0); 1107 --color-secondary-button-border: rgb(0 0 0 / 1.0); 1108 --color-secondary-button-hover-text: rgb(0 0 0 / 0.81); 1109 --color-secondary-button-hover-background: rgb(255 255 255 / 0.36); 1110 --color-secondary-button-hover-border: rgb(0 0 0 / 0.81); 1111 --color-input-background: rgb(0 0 0 / 0.0); 1112 --color-input-text: rgb(0 0 0 / 0.81); 1113 --color-input-text-rgb: 0 0 0; 1114 --color-input-border: rgb(0 0 0 / 0.81); 1115 --color-input-hover-background: rgb(255 255 255 / 0.36); 1116 --color-variant-background: rgb(255 255 255 / 1.0); 1117 --color-variant-border: rgb(230 230 230 / 1.0); 1118 --color-variant-text: rgb(0 0 0 / 1.0); 1119 --color-variant-text-rgb: 0 0 0; 1120 --color-variant-hover-background: rgb(245 245 245 / 1.0); 1121 --color-variant-hover-text: rgb(0 0 0 / 1.0); 1122 --color-variant-hover-border: rgb(230 230 230 / 1.0); 1123 --color-selected-variant-background: rgb(0 0 0 / 1.0); 1124 --color-selected-variant-border: rgb(0 0 0 / 1.0); 1125 --color-selected-variant-text: rgb(255 255 255 / 1.0); 1126 --color-selected-variant-hover-background: rgb(26 26 26 / 1.0); 1127 --color-selected-variant-hover-text: rgb(255 255 255 / 1.0); 1128 --color-selected-variant-hover-border: rgb(26 26 26 / 1.0); 1129 1130 --input-disabled-background-color: rgb(var(--color-foreground-rgb) / var(--opacity-10)); 1131 --input-disabled-border-color: rgb(var(--color-foreground-rgb) / var(--opacity-5-15)); 1132 --input-disabled-text-color: rgb(var(--color-foreground-rgb) / var(--opacity-50)); 1133 --color-foreground-muted: rgb(var(--color-foreground-rgb) / var(--opacity-60)); 1134 --font-h1--color: var(--color-foreground-heading); 1135 --font-h2--color: var(--color-foreground-heading); 1136 --font-h3--color: var(--color-foreground-heading); 1137 --font-h4--color: var(--color-foreground-heading); 1138 --font-h5--color: var(--color-foreground-heading); 1139 --font-h6--color: var(--color-foreground-heading); 1140 1141 /* Shadows */ 1142 1143 --shadow-drawer: 0px 4px 20px rgb(var(--color-shadow-rgb) / var(--opacity-15)); 1144 1145 1146 --shadow-blur: 20px; 1147 --shadow-popover: 0px 4px 20px rgb(var(--color-shadow-rgb) / var(--opacity-15)); 1148 1149 } 1150 1151 1152 1153 1154 .color-scheme-4 { 1155 --color-background: rgb(2 33 51 / 1.0); 1156 /* RGB values only to apply different opacities - Relative color values are not supported in iOS < 16.4 */ 1157 --color-background-rgb: 2 33 51; 1158 --opacity-5-15: 0.15; 1159 --opacity-10-25: 0.25; 1160 --opacity-35-55: 0.55; 1161 --opacity-40-60: 0.6; 1162 --opacity-30-60: 0.6; 1163 --color-foreground: rgb(255 255 255 / 0.78); 1164 --color-foreground-rgb: 255 255 255; 1165 --color-foreground-heading: rgb(250 250 250 / 1.0); 1166 --color-foreground-heading-rgb: 250 250 250; 1167 --color-primary: rgb(133 23 204 / 1.0); 1168 --color-primary-rgb: 133 23 204; 1169 --color-primary-hover: rgb(0 0 0 / 1.0); 1170 --color-primary-hover-rgb: 0 0 0; 1171 --color-border: rgb(29 54 134 / 0.5); 1172 --color-border-rgb: 29 54 134; 1173 --color-shadow: rgb(0 0 0 / 1.0); 1174 --color-shadow-rgb: 0 0 0; 1175 --color-primary-button-text: rgb(255 255 255 / 1.0); 1176 --color-primary-button-background: rgb(255 196 63 / 1.0); 1177 --color-primary-button-border: rgb(29 54 134 / 1.0); 1178 --color-primary-button-hover-text: rgb(255 255 255 / 1.0); 1179 --color-primary-button-hover-background: rgb(2 32 51 / 1.0); 1180 --color-primary-button-hover-border: rgb(0 0 0 / 1.0); 1181 --color-secondary-button-text: rgb(0 0 0 / 1.0); 1182 --color-secondary-button-background: rgb(0 0 0 / 0.0); 1183 --color-secondary-button-border: rgb(0 0 0 / 1.0); 1184 --color-secondary-button-hover-text: rgb(0 0 0 / 0.81); 1185 --color-secondary-button-hover-background: rgb(255 255 255 / 0.36); 1186 --color-secondary-button-hover-border: rgb(0 0 0 / 0.81); 1187 --color-input-background: rgb(0 0 0 / 0.0); 1188 --color-input-text: rgb(0 0 0 / 0.81); 1189 --color-input-text-rgb: 0 0 0; 1190 --color-input-border: rgb(0 0 0 / 0.81); 1191 --color-input-hover-background: rgb(255 255 255 / 0.36); 1192 --color-variant-background: rgb(255 255 255 / 1.0); 1193 --color-variant-border: rgb(230 230 230 / 1.0); 1194 --color-variant-text: rgb(0 0 0 / 1.0); 1195 --color-variant-text-rgb: 0 0 0; 1196 --color-variant-hover-background: rgb(245 245 245 / 1.0); 1197 --color-variant-hover-text: rgb(0 0 0 / 1.0); 1198 --color-variant-hover-border: rgb(230 230 230 / 1.0); 1199 --color-selected-variant-background: rgb(0 0 0 / 1.0); 1200 --color-selected-variant-border: rgb(0 0 0 / 1.0); 1201 --color-selected-variant-text: rgb(255 255 255 / 1.0); 1202 --color-selected-variant-hover-background: rgb(26 26 26 / 1.0); 1203 --color-selected-variant-hover-text: rgb(255 255 255 / 1.0); 1204 --color-selected-variant-hover-border: rgb(26 26 26 / 1.0); 1205 1206 --input-disabled-background-color: rgb(var(--color-foreground-rgb) / var(--opacity-10)); 1207 --input-disabled-border-color: rgb(var(--color-foreground-rgb) / var(--opacity-5-15)); 1208 --input-disabled-text-color: rgb(var(--color-foreground-rgb) / var(--opacity-50)); 1209 --color-foreground-muted: rgb(var(--color-foreground-rgb) / var(--opacity-60)); 1210 --font-h1--color: var(--color-foreground-heading); 1211 --font-h2--color: var(--color-foreground-heading); 1212 --font-h3--color: var(--color-foreground-heading); 1213 --font-h4--color: var(--color-foreground-heading); 1214 --font-h5--color: var(--color-foreground-heading); 1215 --font-h6--color: var(--color-foreground-heading); 1216 1217 /* Shadows */ 1218 1219 --shadow-drawer: 0px 4px 20px rgb(var(--color-shadow-rgb) / var(--opacity-15)); 1220 1221 1222 --shadow-blur: 20px; 1223 --shadow-popover: 0px 4px 20px rgb(var(--color-shadow-rgb) / var(--opacity-15)); 1224 1225 } 1226 1227 1228 1229 1230 .color-scheme-5 { 1231 --color-background: rgb(51 51 51 / 1.0); 1232 /* RGB values only to apply different opacities - Relative color values are not supported in iOS < 16.4 */ 1233 --color-background-rgb: 51 51 51; 1234 --opacity-5-15: 0.15; 1235 --opacity-10-25: 0.25; 1236 --opacity-35-55: 0.55; 1237 --opacity-40-60: 0.6; 1238 --opacity-30-60: 0.6; 1239 --color-foreground: rgb(255 255 255 / 1.0); 1240 --color-foreground-rgb: 255 255 255; 1241 --color-foreground-heading: rgb(255 255 255 / 1.0); 1242 --color-foreground-heading-rgb: 255 255 255; 1243 --color-primary: rgb(255 255 255 / 1.0); 1244 --color-primary-rgb: 255 255 255; 1245 --color-primary-hover: rgb(255 255 255 / 0.69); 1246 --color-primary-hover-rgb: 255 255 255; 1247 --color-border: rgb(255 255 255 / 0.69); 1248 --color-border-rgb: 255 255 255; 1249 --color-shadow: rgb(0 0 0 / 1.0); 1250 --color-shadow-rgb: 0 0 0; 1251 --color-primary-button-text: rgb(0 0 0 / 1.0); 1252 --color-primary-button-background: rgb(255 255 255 / 1.0); 1253 --color-primary-button-border: rgb(255 255 255 / 1.0); 1254 --color-primary-button-hover-text: rgb(255 255 255 / 1.0); 1255 --color-primary-button-hover-background: rgb(0 0 0 / 1.0); 1256 --color-primary-button-hover-border: rgb(0 0 0 / 1.0); 1257 --color-secondary-button-text: rgb(255 255 255 / 1.0); 1258 --color-secondary-button-background: rgb(0 0 0 / 0.0); 1259 --color-secondary-button-border: rgb(255 255 255 / 0.69); 1260 --color-secondary-button-hover-text: rgb(255 255 255 / 0.93); 1261 --color-secondary-button-hover-background: rgb(255 255 255 / 0.04); 1262 --color-secondary-button-hover-border: rgb(255 255 255 / 0.69); 1263 --color-input-background: rgb(51 51 51 / 1.0); 1264 --color-input-text: rgb(255 255 255 / 0.93); 1265 --color-input-text-rgb: 255 255 255; 1266 --color-input-border: rgb(255 255 255 / 0.69); 1267 --color-input-hover-background: rgb(255 255 255 / 0.04); 1268 --color-variant-background: rgb(255 255 255 / 1.0); 1269 --color-variant-border: rgb(230 230 230 / 1.0); 1270 --color-variant-text: rgb(0 0 0 / 1.0); 1271 --color-variant-text-rgb: 0 0 0; 1272 --color-variant-hover-background: rgb(245 245 245 / 1.0); 1273 --color-variant-hover-text: rgb(0 0 0 / 1.0); 1274 --color-variant-hover-border: rgb(230 230 230 / 1.0); 1275 --color-selected-variant-background: rgb(0 0 0 / 1.0); 1276 --color-selected-variant-border: rgb(0 0 0 / 1.0); 1277 --color-selected-variant-text: rgb(255 255 255 / 1.0); 1278 --color-selected-variant-hover-background: rgb(26 26 26 / 1.0); 1279 --color-selected-variant-hover-text: rgb(255 255 255 / 1.0); 1280 --color-selected-variant-hover-border: rgb(26 26 26 / 1.0); 1281 1282 --input-disabled-background-color: rgb(var(--color-foreground-rgb) / var(--opacity-10)); 1283 --input-disabled-border-color: rgb(var(--color-foreground-rgb) / var(--opacity-5-15)); 1284 --input-disabled-text-color: rgb(var(--color-foreground-rgb) / var(--opacity-50)); 1285 --color-foreground-muted: rgb(var(--color-foreground-rgb) / var(--opacity-60)); 1286 --font-h1--color: var(--color-foreground-heading); 1287 --font-h2--color: var(--color-foreground-heading); 1288 --font-h3--color: var(--color-foreground-heading); 1289 --font-h4--color: var(--color-foreground-heading); 1290 --font-h5--color: var(--color-foreground-heading); 1291 --font-h6--color: var(--color-foreground-heading); 1292 1293 /* Shadows */ 1294 1295 --shadow-drawer: 0px 4px 20px rgb(var(--color-shadow-rgb) / var(--opacity-15)); 1296 1297 1298 --shadow-blur: 20px; 1299 --shadow-popover: 0px 4px 20px rgb(var(--color-shadow-rgb) / var(--opacity-15)); 1300 1301 } 1302 1303 1304 1305 1306 .color-scheme-6 { 1307 --color-background: rgb(2 33 53 / 1.0); 1308 /* RGB values only to apply different opacities - Relative color values are not supported in iOS < 16.4 */ 1309 --color-background-rgb: 2 33 53; 1310 --opacity-5-15: 0.15; 1311 --opacity-10-25: 0.25; 1312 --opacity-35-55: 0.55; 1313 --opacity-40-60: 0.6; 1314 --opacity-30-60: 0.6; 1315 --color-foreground: rgb(255 255 255 / 1.0); 1316 --color-foreground-rgb: 255 255 255; 1317 --color-foreground-heading: rgb(255 255 255 / 1.0); 1318 --color-foreground-heading-rgb: 255 255 255; 1319 --color-primary: rgb(255 255 255 / 1.0); 1320 --color-primary-rgb: 255 255 255; 1321 --color-primary-hover: rgb(255 255 255 / 0.69); 1322 --color-primary-hover-rgb: 255 255 255; 1323 --color-border: rgb(230 230 230 / 1.0); 1324 --color-border-rgb: 230 230 230; 1325 --color-shadow: rgb(0 0 0 / 1.0); 1326 --color-shadow-rgb: 0 0 0; 1327 --color-primary-button-text: rgb(0 0 0 / 1.0); 1328 --color-primary-button-background: rgb(255 255 255 / 1.0); 1329 --color-primary-button-border: rgb(255 255 255 / 1.0); 1330 --color-primary-button-hover-text: rgb(255 255 255 / 1.0); 1331 --color-primary-button-hover-background: rgb(0 0 0 / 1.0); 1332 --color-primary-button-hover-border: rgb(0 0 0 / 1.0); 1333 --color-sec
1333ondary-button-text: rgb(255 255 255 / 1.0); 1334 --color-secondary-button-background: rgb(0 0 0 / 0.0); 1335 --color-secondary-button-border: rgb(255 255 255 / 1.0); 1336 --color-secondary-button-hover-text: rgb(255 255 255 / 1.0); 1337 --color-secondary-button-hover-background: rgb(255 255 255 / 0.08); 1338 --color-secondary-button-hover-border: rgb(255 255 255 / 1.0); 1339 --color-input-background: rgb(255 255 255 / 1.0); 1340 --color-input-text: rgb(0 0 0 / 0.53); 1341 --color-input-text-rgb: 0 0 0; 1342 --color-input-border: rgb(0 0 0 / 0.13); 1343 --color-input-hover-background: rgb(250 250 250 / 1.0); 1344 --color-variant-background: rgb(255 255 255 / 1.0); 1345 --color-variant-border: rgb(230 230 230 / 1.0); 1346 --color-variant-text: rgb(0 0 0 / 1.0); 1347 --color-variant-text-rgb: 0 0 0; 1348 --color-variant-hover-background: rgb(245 245 245 / 1.0); 1349 --color-variant-hover-text: rgb(0 0 0 / 1.0); 1350 --color-variant-hover-border: rgb(230 230 230 / 1.0); 1351 --color-selected-variant-background: rgb(0 0 0 / 1.0); 1352 --color-selected-variant-border: rgb(0 0 0 / 1.0); 1353 --color-selected-variant-text: rgb(255 255 255 / 1.0); 1354 --color-selected-variant-hover-background: rgb(26 26 26 / 1.0); 1355 --color-selected-variant-hover-text: rgb(255 255 255 / 1.0); 1356 --color-selected-variant-hover-border: rgb(26 26 26 / 1.0); 1357 1358 --input-disabled-background-color: rgb(var(--color-foreground-rgb) / var(--opacity-10)); 1359 --input-disabled-border-color: rgb(var(--color-foreground-rgb) / var(--opacity-5-15)); 1360 --input-disabled-text-color: rgb(var(--color-foreground-rgb) / var(--opacity-50)); 1361 --color-foreground-muted: rgb(var(--color-foreground-rgb) / var(--opacity-60)); 1362 --font-h1--color: var(--color-foreground-heading); 1363 --font-h2--color: var(--color-foreground-heading); 1364 --font-h3--color: var(--color-foreground-heading); 1365 --font-h4--color: var(--color-foreground-heading); 1366 --font-h5--color: var(--color-foreground-heading); 1367 --font-h6--color: var(--color-foreground-heading); 1368 1369 /* Shadows */ 1370 1371 --shadow-drawer: 0px 4px 20px rgb(var(--color-shadow-rgb) / var(--opacity-15)); 1372 1373 1374 --shadow-blur: 20px; 1375 --shadow-popover: 0px 4px 20px rgb(var(--color-shadow-rgb) / var(--opacity-15)); 1376 1377 } 1378 1379 1380 1381 1382 .color-scheme-58084d4c-a86e-4d0a-855e-a0966e5043f7 { 1383 --color-background: rgb(0 0 0 / 0.0); 1384 /* RGB values only to apply different opacities - Relative color values are not supported in iOS < 16.4 */ 1385 --color-background-rgb: 0 0 0; 1386 --opacity-5-15: 0.15; 1387 --opacity-10-25: 0.25; 1388 --opacity-35-55: 0.55; 1389 --opacity-40-60: 0.6; 1390 --opacity-30-60: 0.6; 1391 --color-foreground: rgb(0 0 0 / 1.0); 1392 --color-foreground-rgb: 0 0 0; 1393 --color-foreground-heading: rgb(0 0 0 / 1.0); 1394 --color-foreground-heading-rgb: 0 0 0; 1395 --color-primary: rgb(0 0 0 / 1.0); 1396 --color-primary-rgb: 0 0 0; 1397 --color-primary-hover: rgb(0 0 0 / 0.53); 1398 --color-primary-hover-rgb: 0 0 0; 1399 --color-border: rgb(230 230 230 / 1.0); 1400 --color-border-rgb: 230 230 230; 1401 --color-shadow: rgb(0 0 0 / 1.0); 1402 --color-shadow-rgb: 0 0 0; 1403 --color-primary-button-text: rgb(255 255 255 / 1.0); 1404 --color-primary-button-background: rgb(0 0 0 / 1.0); 1405 --color-primary-button-border: rgb(0 0 0 / 1.0); 1406 --color-primary-button-hover-text: rgb(255 255 255 / 1.0); 1407 --color-primary-button-hover-background: rgb(51 51 51 / 1.0); 1408 --color-primary-button-hover-border: rgb(51 51 51 / 1.0); 1409 --color-secondary-button-text: rgb(0 0 0 / 1.0); 1410 --color-secondary-button-background: rgb(0 0 0 / 0.0); 1411 --color-secondary-button-border: rgb(0 0 0 / 1.0); 1412 --color-secondary-button-hover-text: rgb(51 51 51 / 1.0); 1413 --color-secondary-button-hover-background: rgb(250 250 250 / 1.0); 1414 --color-secondary-button-hover-border: rgb(51 51 51 / 1.0); 1415 --color-input-background: rgb(255 255 255 / 1.0); 1416 --color-input-text: rgb(0 0 0 / 0.53); 1417 --color-input-text-rgb: 0 0 0; 1418 --color-input-border: rgb(0 0 0 / 0.13); 1419 --color-input-hover-background: rgb(250 250 250 / 1.0); 1420 --color-variant-background: rgb(255 255 255 / 1.0); 1421 --color-variant-border: rgb(230 230 230 / 1.0); 1422 --color-variant-text: rgb(0 0 0 / 1.0); 1423 --color-variant-text-rgb: 0 0 0; 1424 --color-variant-hover-background: rgb(245 245 245 / 1.0); 1425 --color-variant-hover-text: rgb(0 0 0 / 1.0); 1426 --color-variant-hover-border: rgb(230 230 230 / 1.0); 1427 --color-selected-variant-background: rgb(0 0 0 / 1.0); 1428 --color-selected-variant-border: rgb(0 0 0 / 1.0); 1429 --color-selected-variant-text: rgb(255 255 255 / 1.0); 1430 --color-selected-variant-hover-background: rgb(26 26 26 / 1.0); 1431 --color-selected-variant-hover-text: rgb(255 255 255 / 1.0); 1432 --color-selected-variant-hover-border: rgb(26 26 26 / 1.0); 1433 1434 --input-disabled-background-color: rgb(var(--color-foreground-rgb) / var(--opacity-10)); 1435 --input-disabled-border-color: rgb(var(--color-foreground-rgb) / var(--opacity-5-15)); 1436 --input-disabled-text-color: rgb(var(--color-foreground-rgb) / var(--opacity-50)); 1437 --color-foreground-muted: rgb(var(--color-foreground-rgb) / var(--opacity-60)); 1438 --font-h1--color: var(--color-foreground-heading); 1439 --font-h2--color: var(--color-foreground-heading); 1440 --font-h3--color: var(--color-foreground-heading); 1441 --font-h4--color: var(--color-foreground-heading); 1442 --font-h5--color: var(--color-foreground-heading); 1443 --font-h6--color: var(--color-foreground-heading); 1444 1445 /* Shadows */ 1446 1447 --shadow-drawer: 0px 4px 20px rgb(var(--color-shadow-rgb) / var(--opacity-15)); 1448 1449 1450 --shadow-blur: 20px; 1451 --shadow-popover: 0px 4px 20px rgb(var(--color-shadow-rgb) / var(--opacity-15)); 1452 1453 } 1454 1455 1456 body, .color-scheme-1, .color-scheme-2, .color-scheme-3, .color-scheme-4, .color-scheme-5, .color-scheme-6, .color-scheme-58084d4c-a86e-4d0a-855e-a0966e5043f7 { 1457 color: var(--color-foreground); 1458 background-color: var(--color-background); 1459 } 1460</style> 1461 1462 1463
1463<script>window.performance && window.performance.mark && window.performance.mark('shopify.content_for_header.start');</script>
1463<meta id="shopify-digital-wallet" name="shopify-digital-wallet" content="/77130858718/digital_wallets/dialog"> 1464<meta id="in-context-paypal-metadata" data-shop-id="77130858718" data-venmo-supported="false" data-environment="production" data-locale="en_US" data-paypal-v4="true" data-currency="USD"> 1465<link rel="ucp" href="/.well-known/ucp" version="2026-08-25">
1465<script async="async" src="/checkouts/internal/preloads.js?locale=en-US"></script>
1465 1466<link rel="preconnect" href="https://shop.app" crossorigin="anonymous">
1467<script async="async" src="https://shop.app/checkouts/internal/preloads.js?locale=en-US&shop_id=77130858718" crossorigin="anonymous"></script>
vendor: 1 bytes, line 1467
1467
1468<script id="apple-pay-shop-capabilities" type="application/json">{"shopId":77130858718,"countryCode":"US","currencyCode":"USD","merchantCapabilities":["supports3DS"],"merchantId":"gid:\/\/shopify\/Shop\/77130858718","merchantName":"Five.12 Foundation","requiredBillingContactFields":["postalAddress","email"],"requiredShippingContactFields":["postalAddress","email"],"shippingType":"shipping","supportedNetworks":["visa","masterCard","amex","discover","elo","jcb"],"total":{"type":"pending","label":"Five.12 Foundation","amount":"1.00"},"shopifyPaymentsEnabled":true,"supportsSubscriptions":true}</script>
vendor: 1 bytes, line 1468
1468
1469<script id="shopify-features" type="application/json">{"accessToken":"c3d0b3f304d6c8b2382551da4af02486","betas":["rich-media-storefront-analytics"],"domain":"five12.org","predictiveSearch":true,"shopId":77130858718,"locale":"en"}</script>
vendor: 1 bytes, line 1469
1469
1470<script>var Shopify = Shopify || {}; 1471Shopify.shop = "t24ihi-49.myshopify.com"; 1472Shopify.locale = "en"; 1473Shopify.currency = {"active":"USD","rate":"1.0"}; 1474Shopify.country = "US"; 1475Shopify.theme = {"name":"Five.12 12\/5\/25","id":153047236830,"schema_name":"Horizon","schema_version":"3.1.0","theme_store_id":2481,"role":"main"}; 1476Shopify.theme.handle = "null"; 1477Shopify.theme.style = {"id":null,"handle":null}; 1478Shopify.cdnHost = "five12.org/cdn"; 1479Shopify.routes = Shopify.routes || {}; 1480Shopify.routes.root = "/"; 1481Shopify.shopJsCdnBaseUrl = "https://cdn.shopify.com/shopifycloud/shop-js"; 1482Shopify.SignInWithShop = Shopify.SignInWithShop || {}; 1483Shopify.SignInWithShop.User = Shopify.SignInWithShop.User || {}; 1484Shopify.SignInWithShop.User.recognized = false;</script>
vendor: 1 bytes, line 1484
1484
1485<script type="module">!function(o){(o.Shopify=o.Shopify||{}).modules=!0}(window);</script>
vendor: 1 bytes, line 1485
1485
1486<script>!function(o){function n(){var o=[];function n(){o.push(Array.prototype.slice.apply(arguments))}return n.q=o,n}var t=o.Shopify=o.Shopify||{};t.loadFeatures=n(),t.autoloadFeatures=n()}(window);</script>
vendor: 1 bytes, line 1486
1486
1487<script> 1488 window.ShopifyPay = window.ShopifyPay || {}; 1489 window.ShopifyPay.apiHost = "shop.app\/pay"; 1490 window.ShopifyPay.redirectState = null; 1491</script>
vendor: 1 bytes, line 1491
1491
1492<script> 1493 window.Shopify = window.Shopify || {}; 1494 window.Shopify.SignInWithShop = window.Shopify.SignInWithShop || {}; 1495 window.Shopify.SignInWithShop.assetMetrics = { sampleRate: 0.25 }; 1496 window.Shopify.SignInWithShop.eligible = true; 1497</script>
vendor: 1 bytes, line 1497
1497
1498<script id="shop-js-analytics" type="application/json">{"pageType":"index"}</script>
vendor: 1 bytes, line 1498
1498
1499<script defer="defer" async type="module" src="https://cdn.shopify.com/shopifycloud/shop-js/modules/v2/loader.init-shop-cart-sync.en.esm.js"></script>
vendor: 1 bytes, line 1499
1499
1500<script type="module"> 1501 await import("https://cdn.shopify.com/shopifycloud/shop-js/modules/v2/loader.init-shop-cart-sync.en.esm.js"); 1502 1503 window.Shopify.SignInWithShop?.initShopCartSync?.({"fedCMEnabled":true,"windoidEnabled":true}); 1504 1505</script>
vendor: 1 bytes, line 1505
1505
1506<script> 1507 window.Shopify = window.Shopify || {}; 1508 if (!window.Shopify.featureAssets) window.Shopify.featureAssets = {}; 1509 window.Shopify.featureAssets['shop-js'] = {"avatar":["modules/v2/loader.avatar.en.esm.js"],"checkout-modal":["modules/v2/loader.checkout-modal.en.esm.js"],"init-customer-accounts-sign-up":["modules/v2/loader.init-customer-accounts-sign-up.en.esm.js"],"init-customer-accounts":["modules/v2/loader.init-customer-accounts.en.esm.js"],"init-fed-cm":["modules/v2/loader.init-fed-cm.en.esm.js"],"init-shop-cart-sync":["modules/v2/loader.init-shop-cart-sync.en.esm.js"],"init-shop-email-lookup-coordinator":["modules/v2/loader.init-shop-email-lookup-coordinator.en.esm.js"],"init-shop-for-new-customer-accounts":["modules/v2/loader.init-shop-for-new-customer-accounts.en.esm.js"],"init-shop-user-recognition":["modules/v2/loader.init-shop-user-recognition.en.esm.js"],"init-windoid":["modules/v2/loader.init-windoid.en.esm.js"],"lead-capture":["modules/v2/loader.lead-capture.en.esm.js"],"listener":["modules/v2/loader.listener.en.esm.js"],"pay-button":["modules/v2/loader.pay-button.en.esm.js"],"payment-terms":["modules/v2/loader.payment-terms.en.esm.js"],"shop-button":["modules/v2/loader.shop-button.en.esm.js"],"shop-cart-sync":["modules/v2/loader.shop-cart-sync.en.esm.js"],"shop-cash-offers":["modules/v2/loader.shop-cash-offers.en.esm.js"],"shop-follow-button":["modules/v2/loader.shop-follow-button.en.esm.js"],"shop-login-button":["modules/v2/loader.shop-login-button.en.esm.js"],"shop-login":["modules/v2/loader.shop-login.en.esm.js"],"shop-toast-manager":["modules/v2/loader.shop-toast-manager.en.esm.js"],"shop-user-recognition":["modules/v2/loader.shop-user-recognition.en.esm.js"]}; 1510</script>
vendor: 1 bytes, line 1510
1510
1511<script>(function() { 1512 var isLoaded = false; 1513 function asyncLoad() { 1514 if (isLoaded) return; 1515 isLoaded = true; 1516 var urls = ["https:\/\/noti.bestfreecdn.com\/storage\/js\/noti-77130858718.js?ver=23\u0026shop=t24ihi-49.myshopify.com","https:\/\/noti.bestfreecdn.com\/storage\/js\/noti-77130858718.js?ver=23\u0026shop=t24ihi-49.myshopify.com"]; 1517 for (var i = 0; i < urls.length; i++) { 1518 var s = document.createElement('script'); 1519 s.type = 'text/javascript'; 1520 s.async = true; 1521 s.src = urls[i]; 1522 var x = document.getElementsByTagName('script')[0]; 1523 x.parentNode.insertBefore(s, x); 1524 } 1525 }; 1526 if(window.attachEvent) { 1527 window.attachEvent('onload', asyncLoad); 1528 } else { 1529 window.addEventListener('load', asyncLoad, false); 1530 } 1531})();</script>
vendor: 1 bytes, line 1531
1531
1532<script id="__st">var __st={"a":77130858718,"offset":-21600,"reqid":"0e2154e2-4954-4184-9310-61047748df30-1791155867","pageurl":"five12.org\/","u":"9a107b9aedb6","p":"home"};</script>
vendor: 1 bytes, line 1532
1532
1533<script>window.ShopifyPaypalV4VisibilityTracking = true;</script>
vendor: 1 bytes, line 1533
1533
1534<script id="captcha-bootstrap">!function(){'use strict';const t='contact',e='account',n='new_comment',o=[[t,t],['blogs',n],['comments',n],[t,'customer']],c=[[e,'customer_login'],[e,'guest_login'],[e,'recover_customer_password'],[e,'create_customer']],r=t=>t.map((([t,e])=>`form[action*='/${t}']:not([data-nocaptcha='true']) input[name='form_type'][value='${e}']`)).join(','),a=t=>()=>t?[...document.querySelectorAll(t)].map((t=>t.form)):[];function s(){const t=[...o],e=r(t);return a(e)}const i='password',u='form_key',d=['recaptcha-v3-token','g-recaptcha-response','h-captcha-response',i],f=()=>{try{return window.sessionStorage}catch{return}},m='__shopify_v',_=t=>t.elements[u];function p(t,e,n=!1){try{const o=window.sessionStorage,c=JSON.parse(o.getItem(e)),{data:r}=function(t){const{data:e,action:n}=t;return t[m]||n?{data:e,action:n}:{data:t,action:n}}(c);for(const[e,n]of Object.entries(r))t.elements[e]&&(t.elements[e].value=n);n&&o.removeItem(e)}catch(o){console.error('form repopulation failed',{error:o})}}const l='form_type',E='cptcha';function T(t){t.dataset[E]=!0}const w=window,h=w.document,L='Shopify',v='ce_forms',y='captcha';let A=!1;((t,e)=>{const n=(g='f06e6c50-85a8-45c8-87d0-21a2b65856fe',I='https://cdn.shopify.com/shopifycloud/storefront-forms-hcaptcha/ce_storefront_forms_captcha_hcaptcha.v1.5.3.iife.js',D={infoText:'Protected by hCaptcha',privacyText:'Privacy',termsText:'Terms'},(t,e,n)=>{const o=w[L][v],c=o.bindForm;if(c)return c(t,g,e,D).then(n);var r;o.q.push([[t,g,e,D],n]),r=I,A||(h.body.append(Object.assign(h.createElement('script'),{id:'captcha-provider',async:!0,src:r})),A=!0)});var g,I,D;w[L]=w[L]||{},w[L][v]=w[L][v]||{},w[L][v].q=[],w[L][y]=w[L][y]||{},w[L][y].protect=function(t,e){n(t,void 0,e),T(t)},Object.freeze(w[L][y]),function(t,e,n,w,h,L){const[v,y,A,g]=function(t,e,n){const i=e?o:[],u=t?c:[],d=[...i,...u],f=r(d),m=r(i),_=r(d.filter((([t,e])=>n.includes(e))));return[a(f),a(m),a(_),s()]}(w,h,L),I=t=>{const e=t.target;return e instanceof HTMLFormElement?e:e&&e.form},D=t=>v().includes(t);t.addEventListener('submit',(t=>{const e=I(t);if(!e)return;const n=D(e)&&!e.dataset.hcaptchaBound&&!e.dataset.recaptchaBound,o=_(e),c=g().includes(e)&&(!o||!o.value);(n||c)&&t.preventDefault(),c&&!n&&(function(t){try{if(!f())return;!function(t){const e=f();if(!e)return;const n=_(t);if(!n)return;const o=n.value;o&&e.removeItem(o)}(t);const e=Array.from(Array(32),(()=>Math.random().toString(36)[2])).join('');!function(t,e){_(t)||t.append(Object.assign(document.createElement('input'),{type:'hidden',name:u})),t.elements[u].value=e}(t,e),function(t,e){const n=f();if(!n)return;const o=[...t.querySelectorAll(`input[type='${i}']`)].map((({name:t})=>t)),c=[...d,...o],r={};for(const[a,s]of new FormData(t).entries())c.includes(a)||(r[a]=s);n.setItem(e,JSON.stringify({[m]:1,action:t.action,data:r}))}(t,e)}catch(e){console.error('failed to persist form',e)}}(e),e.submit())}));const S=(t,e)=>{t&&!t.dataset[E]&&(n(t,e.some((e=>e===t))),T(t))};for(const o of['focusin','change'])t.addEventListener(o,(t=>{const e=I(t);D(e)&&S(e,y())}));const B=e.get('form_key'),M=e.get(l),P=B&&M;t.addEventListener('DOMContentLoaded',(()=>{const t=y();if(P)for(const e of t)e.elements[l].value===M&&p(e,B);[...new Set([...A(),...v().filter((t=>'true'===t.dataset.shopifyCaptcha))])].forEach((e=>S(e,t)))}))}(h,new URLSearchParams(w.location.search),n,t,e,['guest_login'])})(!0,!0)}();</script>
vendor: 1 bytes, line 1534
1534
1535<script integrity="sha256-JjoPp5ZfB1sSAs5SQaol1x1GgvveM+BgmRzyDexInEQ=" data-source-attribution="shopify.loadfeatures" defer="defer" src="//five12.org/cdn/shopifycloud/storefront/assets/storefront/load_feature-1bd60354.js" crossorigin="anonymous"></script>
vendor: 1 bytes, line 1535
1535
1536<script>(function () {var userAgent = navigator.userAgent;var platform = navigator.platform;var maxTouchPoints = navigator.maxTouchPoints || 0;var isIOS = /iPad|iPhone|iPod/.test(platform) || (platform === 'MacIntel' && maxTouchPoints > 1);var isMacSafari = platform.indexOf('Mac') === 0 && /Safari/.test(userAgent) && !/Chrome|Chromium|CriOS|FxiOS|Edg|OPR|Android/.test(userAgent);var isAppleSafari = isIOS || isMacSafari;if (isAppleSafari) {fetch('/sf_private_access_tokens' + location.search).catch(function () {});}function browserMajorVersion(pattern) {var match = userAgent.match(pattern);return match ? parseInt(match[1], 10) : null;}function shouldLoadAutosizesPolyfill() {if (!window.PerformanceObserver?.supportedEntryTypes?.includes('paint')) {return false;}var chromeVersion = browserMajorVersion(/Chrome\/(\d+)/);if (chromeVersion !== null) {return chromeVersion < 126;}var firefoxVersion = browserMajorVersion(/Firefox\/(\d+)/);if (firefoxVersion !== null) {return firefoxVersion < 150;}var safariVersion = isAppleSafari ? browserMajorVersion(/Version\/(\d+).*Safari\//) : null;if (safariVersion !== null) {return safariVersion < 27;}return true;}if (shouldLoadAutosizesPolyfill()) {var autosizesScript = document.createElement('script');autosizesScript.async = true;autosizesScript.crossOrigin = 'anonymous';autosizesScript.src = "//five12.org/cdn/shopifycloud/storefront/assets/storefront/autosizes-84416378.js";(document.head || document.documentElement).appendChild(autosizesScript);}window.ShopifyAnalytics = window.ShopifyAnalytics || {};window.ShopifyAnalytics.performance = window.ShopifyAnalytics.performance || {};(function () {var LONG_FRAME_THRESHOLD = 50;var longAnimationFrames = [];var activeRafId = null;function collectLongFrames() {var previousTime = null;function rafMonitor(now) {if (activeRafId === null) {return;}var delta = now - previousTime;if (delta > LONG_FRAME_THRESHOLD) {longAnimationFrames.push({startTime: previousTime,endTime: now,});}previousTime = now;activeRafId = requestAnimationFrame(rafMonitor);}previousTime = performance.now();activeRafId = requestAnimationFrame(rafMonitor);}if (!window.PerformanceObserver?.supportedEntryTypes?.includes('long-animation-frame')) {collectLongFrames();var timeoutId = setTimeout(function () {cancelAnimationFrame(activeRafId);}, 10000);window.ShopifyAnalytics.performance.getLongAnimationFrames = function (stopCollection) {if (stopCollection === undefined) {stopCollection = false;}if (stopCollection) {clearTimeout(timeoutId);cancelAnimationFrame(activeRafId);}return longAnimationFrames;};}})();})();</script>
1536<script crossorigin="anonymous" defer="defer" src="//five12.org/cdn/shopifycloud/storefront/assets/shopify_pay/storefront-616277c7.js?v=20250812"></script>
vendor: 1 bytes, line 1536
1536
1537<script id="shopify-origin-trials" async="async" integrity="sha256-qJbe/jEZBHtr5W/BlA2cKAz3vkXu6vJQyLjgvgCC86g=" src="//cdn.shopify.com/shopifycloud/storefront/assets/storefront/origin_trials-318ab40a.js" crossorigin="anonymous" onload="window.__shopifyOriginTrialsDone = true" onerror="window.__shopifyOriginTrialsDone = true"></script>
vendor: 1 bytes, line 1537
1537
1538<script> 1539 window.Shopify = window.Shopify || {}; 1540 window.Shopify.MCP = window.Shopify.MCP || {}; 1541 window.Shopify.MCP.enabled = true; 1542 window.Shopify.MCP.shop = "t24ihi-49.myshopify.com"; 1543 window.Shopify.MCP.mcpEndpoint = "https:\/\/five12.org\/api\/mcp"; 1544 window.Shopify.MCP.tools = [{"name":"search_shop_policies_and_faqs","description":"Used to get facts about the stores policies, products, or services.\nSome examples of questions you can ask are:\n - What is your return policy?\n - What is your shipping policy?\n - What is your phone number?\n - What are your hours of operation?\"\n","inputSchema":{"$schema":"https:\/\/json-schema.org\/draft\/2020-12\/schema","type":"object","properties":{"query":{"type":"string","description":"A natural language query."},"context":{"type":"string","description":"Additional information about the request such as user demographics, mood, location, or other relevant details that could help in tailoring the response appropriately."}},"required":["query"]}}]; 1545</script>
vendor: 1 bytes, line 1545
1545
1546<script>(()=>{var d="shopify:webmcp_adapter_loaded",n=Symbol.for("shopify.webmcp_adapter_loading");function s(c,a,{win:r=window,doc:o=document}={}){function p(){try{return r.localStorage.getItem(d)==="true"}catch{return!1}}function l(){try{r.localStorage.setItem(d,"true")}catch{}}function u(){return typeof(o.modelContext||r.navigator?.modelContext)?.registerTool=="function"}function f(){if(r[n]||!u())return;let t=o.head||o.getElementsByTagName("head")[0];if(!t)return;let e=o.createElement("script");e.type="module",e.crossOrigin="anonymous",a&&(e.integrity=a),e.src=c,e.addEventListener("load",l,{once:!0}),e.addEventListener("error",()=>{r[n]=!1},{once:!0}),t.appendChild(e),r[n]=!0}function _(t){let e=o.getElementById("shopify-origin-trials");if(!e||r.__shopifyOriginTrialsDone){t();return}e.addEventListener("load",t,{once:!0}),e.addEventListener("error",t,{once:!0})}function i(){_(()=>r.setTimeout(f,0))}function m(){o.addEventListener("DOMContentLoaded",i,{once:!0})}p()?i():m()}s("\/\/five12.org\/cdn\/shopifycloud\/storefront\/assets\/storefront\/webmcp-c6b62ece.js","sha256-ke4DDuBjdvea3vxLWxHc9E9nq8zihuG4IfYEGbb77ys=");})(); 1547</script>
vendor: 1 bytes, line 1547
1547
1548<script data-source-attribution="shopify.dynamic_checkout.dynamic.init">var Shopify=Shopify||{};Shopify.PaymentButton=Shopify.PaymentButton||{isStorefrontPortableWallets:!0,init:function(){window.Shopify.PaymentButton.init=function(){};var t=document.createElement("script");t.src="https://five12.org/cdn/shopifycloud/portable-wallets/latest/portable-wallets.en.js",t.type="module",document.head.appendChild(t)}}; 1549</script>
vendor: 1 bytes, line 1549
1549
1550<script data-source-attribution="shopify.dynamic_checkout.buyer_consent"> 1551 function portableWalletsHideBuyerConsent(e){var t=document.getElementById("shopify-buyer-consent"),n=document.getElementById("shopify-subscription-policy-button");t&&n&&(t.classList.add("hidden"),t.setAttribute("aria-hidden","true"),n.removeEventListener("click",e))}function portableWalletsShowBuyerConsent(e){var t=document.getElementById("shopify-buyer-consent"),n=document.getElementById("shopify-subscription-policy-button");t&&n&&(t.classList.remove("hidden"),t.removeAttribute("aria-hidden"),n.addEventListener("click",e))}window.Shopify?.PaymentButton&&(window.Shopify.PaymentButton.hideBuyerConsent=portableWalletsHideBuyerConsent,window.Shopify.PaymentButton.showBuyerConsent=portableWalletsShowBuyerConsent); 1552</script>
vendor: 1 bytes, line 1552
1552
1553<script data-source-attribution="shopify.dynamic_checkout.cart.bootstrap">document.addEventListener("DOMContentLoaded",(function(){function t(){return document.querySelector("shopify-accelerated-checkout-cart, shopify-accelerated-checkout")}if(t())Shopify.PaymentButton.init();else{new MutationObserver((function(e,n){t()&&(Shopify.PaymentButton.init(),n.disconnect())})).observe(document.body,{childList:!0,subtree:!0})}})); 1554</script>
vendor: 1 bytes, line 1554
1554
1555<script id='scb4127' type='text/javascript' async='' src='https://five12.org/cdn/shopifycloud/privacy-banner/storefront-banner.js'></script>
1555<link id="shopify-accelerated-checkout-styles" rel="stylesheet" media="screen" href="https://five12.org/cdn/shopifycloud/portable-wallets/latest/accelerated-checkout-backwards-compat.css" crossorigin="anonymous"> 1556<style id="shopify-accelerated-checkout-cart"> 1557 #shopify-buyer-consent { 1558 margin-top: 1em; 1559 display: inline-block; 1560 width: 100%; 1561} 1562 1563#shopify-buyer-consent.hidden { 1564 display: none; 1565} 1566 1567#shopify-subscription-policy-button { 1568 background: none; 1569 border: none; 1570 padding: 0; 1571 text-decoration: underline; 1572 font-size: inherit; 1573 cursor: pointer; 1574} 1575 1576#shopify-subscription-policy-button::before { 1577 box-shadow: none; 1578} 1579 1580 </style> 1581<link rel="stylesheet" media="screen" href="//five12.org/cdn/shop/t/1/compiled_assets/styles.css?v=108518566444202875221764800017">
1582<script id="shopify-cfh-end">window.performance && window.performance.mark && window.performance.mark('shopify.content_for_header.end');</script>
1582 1583 <link href="https://monorail-edge.shopifysvc.com" rel="dns-prefetch">
1584<script>(function(){if ("sendBeacon" in navigator && "performance" in window) {try {var session_token_from_headers = performance.getEntriesByType('navigation')[0].serverTiming.find(x => x.name == '_s').description;} catch {var session_token_from_headers = undefined;}var session_cookie_matches = document.cookie.match(/_shopify_s=([^;]*)/);var session_token_from_cookie = session_cookie_matches && session_cookie_matches.length === 2 ? session_cookie_matches[1] : "";var session_token = session_token_from_headers || session_token_from_cookie || "";function handle_abandonment_event(e) {var entries = performance.getEntries().filter(function(entry) {return /monorail-edge.shopifysvc.com/.test(entry.name);});if (!window.abandonment_tracked && entries.length === 0) {window.abandonment_tracked = true;var currentMs = Date.now();var navigation_start = performance.timing.navigationStart;var payload = {shop_id: 77130858718,url: window.location.href,navigation_start,duration: currentMs - navigation_start,session_token,page_type: "index"};window.navigator.sendBeacon("https://monorail-edge.shopifysvc.com/v1/produce", JSON.stringify({schema_id: "online_store_buyer_site_abandonment/1.1",payload: payload,metadata: {event_created_at_ms: currentMs,event_sent_at_ms: currentMs}}));}}window.addEventListener('pagehide', handle_abandonment_event);}}());</script>
vendor: 1 bytes, line 1584
1584
1585<script> 1586 window.__TREKKIE_SHIM_QUEUE = window.__TREKKIE_SHIM_QUEUE || []; 1587</script>
vendor: 1 bytes, line 1587
1587
1588<script>(function(){var wpmLoader=function(){"use strict";var e=/Googlebot|Storebot-Google|bingbot|Baiduspider|YandexBot|DuckDuckBot|Slurp|facebookexternalhit|Twitterbot|LinkedInBot|Applebot|AdsBot-Google|Mediapartners-Google|APIs-Google|PetalBot|SemrushBot|AhrefsBot|MJ12bot|DotBot|Acunetix|PerplexityBot|Perplexity-User/i,t=/bytedance/i;function i(){try{var e=document.cookie;if(!e||"string"!=typeof e)return;for(var t=0,i=e.split(";");t<i.length;t++){var n=i[t],r=n.indexOf("=");if(-1!==r){var o=n.slice(0,r).trim();if(o){var a=void 0;try{a=decodeURIComponent(o)}catch(e){a=o}if("_shopify_s"===a){var d=n.slice(r+1).trim();try{return decodeURIComponent(d)}catch(e){return d}}}}}return}catch(e){return}}function n(e){try{"undefined"!=typeof console&&"function"==typeof console.warn&&console.warn(e)}catch(e){}}function r(e,t){return"string"==typeof e&&e.length>0&&e.length<=t?e:void 0}function o(e){var t;switch(null==(t=null==e?void 0:e.navigation)?void 0:t.type){case 0:return"navigate";case 1:return"reload";case 2:return"back_forward";default:return}}function a(){var e,t,i;try{var n=null==(i=null==(t=null==(e=self.ShopifyAnalytics)?void 0:e.lib)?void 0:t.trekkie)?void 0:i.state;return"awaiting-consent"===n||"initialized"===n?n:void 0}catch(e){return}}return function(d,s,u,l){var c=arguments.length>4&&void 0!==arguments[4]?arguments[4]:{};try{var p=c.trekkieShim;!0!==p&&"true"!==p||null!=window.__TREKKIE_SHIM_QUEUE||(window.__TREKKIE_SHIM_QUEUE=[])}catch(e){}var f,v,h,y,g=(v=(f={modern:/Edge?\/(1{2}[4-9]|1[2-9]\d|[2-9]\d{2}|\d{4,})\.\d+(\.\d+|)|Firefox\/(1{2}[4-9]|1[2-9]\d|[2-9]\d{2}|\d{4,})\.\d+(\.\d+|)|Chrom(ium|e)\/(9{2}|\d{3,})\.\d+(\.\d+|)|(Maci|X1{2}).+ Version\/(15\.\d+|(1[6-9]|[2-9]\d|\d{3,})\.\d+)([,.]\d+|)( \(\w+\)|)( Mobile\/\w+|) Safari\/|Chrome.+OPR\/(9{2}|\d{3,})\.\d+\.\d+|(CPU[ +]OS|iPhone[ +]OS|CPU[ +]iPhone|CPU IPhone OS|CPU iPad OS)[ +]+(15[._]\d+|(1[6-9]|[2-9]\d|\d{3,})[._]\d+)([._]\d+|)|Android:?[ /-](14[89]|1[5-9]\d|[2-9]\d{2}|\d{4,})(\.\d+|)(\.\d+|)|Android.+Firefox\/(15\d|1[6-9]\d|[2-9]\d{2}|\d{4,})\.\d+(\.\d+|)|Android.+Chrom(ium|e)\/(14[89]|1[5-9]\d|[2-9]\d{2}|\d{4,})\.\d+(\.\d+|)|SamsungBrowser\/([2-9]\d|\d{3,})\.\d+/,legacy:/Edge?\/(1[6-9]|[2-9]\d|\d{3,})\.\d+(\.\d+|)|Firefox\/(5[4-9]|[6-9]\d|\d{3,})\.\d+(\.\d+|)|Chrom(ium|e)\/(5[1-9]|[6-9]\d|\d{3,})\.\d+(\.\d+|)([\d.]+$|.*Safari\/(?![\d.]+ Edge\/[\d.]+$))|(Maci|X1{2}).+ Version\/(10\.\d+|(1[1-9]|[2-9]\d|\d{3,})\.\d+)([,.]\d+|)( \(\w+\)|)( Mobile\/\w+|) Safari\/|Chrome.+OPR\/(3[89]|[4-9]\d|\d{3,})\.\d+\.\d+|(CPU[ +]OS|iPhone[ +]OS|CPU[ +]iPhone|CPU IPhone OS|CPU iPad OS)[ +]+(10[._]\d+|(1[1-9]|[2-9]\d|\d{3,})[._]\d+)([._]\d+|)|Android:?[ /-](14[89]|1[5-9]\d|[2-9]\d{2}|\d{4,})(\.\d+|)(\.\d+|)|Mobile Safari.+OPR\/([89]\d|\d{3,})\.\d+\.\d+|Android.+Firefox\/(15\d|1[6-9]\d|[2-9]\d{2}|\d{4,})\.\d+(\.\d+|)|Android.+Chrom(ium|e)\/(14[89]|1[5-9]\d|[2-9]\d{2}|\d{4,})\.\d+(\.\d+|)|Android.+(UC? ?Browser|UCWEB|U3)[ /]?(15\.([5-9]|\d{2,})|(1[6-9]|[2-9]\d|\d{3,})\.\d+)\.\d+|SamsungBrowser\/(5\.\d+|([6-9]|\d{2,})\.\d+)|Android.+MQ{2}Browser\/(14(\.(9|\d{2,})|)|(1[5-9]|[2-9]\d|\d{3,})(\.\d+|))(\.\d+|)|K[Aa][Ii]OS\/(3\.\d+|([4-9]|\d{2,})\.\d+)(\.\d+|)/}).modern,h=f.legacy,(y=navigator.userAgent).match(e)?"bot":y.match(v)?"modern":y.match(h)?"legacy":y.match(t)?"bot":"unknown"),m=function(e){var t,i,n=r(e,128);try{var a=window.performance,d=null==(t=null==a?void 0:a.getEntriesByType)?void 0:t.call(a,"navigation")[0];if(!d)return{requestId:n,navigationType:o(a)};var s="type"in d?r(d.type,64):void 0,u="serverTiming"in d&&Array.isArray(d.serverTiming)?d.serverTiming:[];return{requestId:null!=n?n:r(null==(i=u.find(function(e){return"requestID"===e.name}))?void 0:i.description,128),navigationType:s}}catch(e){return{requestId:n}}}(c.requestId),w=function(e){var t=e.version,r=e.browserTarget,o=e.surface,a=e.shopId,d=e.monorailEndpoint,s=window.location.href;return{emit:function(e){var u=e.status,l=e.errorMsg,c=e.failureReason,p=e.useKeepaliveFallback,f=void 0!==p&&p,v=e.navigationType,h=e.pagehidePersisted,y=e.requestId,g=e.trekkieState;if(d){var m,w;try{var b=(new Date).getTime();m=JSON.stringify({metadata:{event_sent_at_ms:b},events:[{schema_id:"web_pixels_manager_load/3.3",payload:{version:t,bundle_target:r,page_url:s,status:u,surface:o,error_msg:l,failure_reason:c,navigation_type:v,pagehide_persisted:h,request_id:y,trekkie_state:g,shop_id:a,visit_token:i()},metadata:{event_created_at_ms:b}}]})}catch(e){return}try{if("function"==typeof window.navigator.sendBeacon&&-1===(w=window.navigator.userAgent).indexOf("iPhone; CPU iPhone OS 12_")&&-1===w.indexOf("iPad; CPU OS 12_")&&-1===w.indexOf("iPod touch; CPU iPhone OS 12_")&&window.navigator.sendBeacon.bind(window.navigator)(d,m))return}catch(e){}if(f)try{"function"==typeof window.fetch&&window.fetch(d,{method:"POST",headers:{"Content-Type":"text/plain"},body:m,keepalive:!0}
1588).catch(function(){})}catch(e){}else try{var _=new XMLHttpRequest;_.open("POST",d,!0),_.setRequestHeader("Content-Type","text/plain"),_.send(m)}catch(e){n("[Web Pixels Manager] Got an unhandled error while logging to Monorail.")}}else n("[Web Pixels Manager] No Monorail endpoint provided, skipping logging.")}}}({version:u,browserTarget:g,surface:d.surface,shopId:d.shopId,monorailEndpoint:d.monorailEndpoint});if(Boolean(null==(_=null==(b=window.Shopify)?void 0:b.analytics)?void 0:_.replayQueue))w.emit({status:"setup-skipped",errorMsg:"replay queue already initialized."});else{var b,_;w.emit({status:"setup-started"}),window.Shopify=window.Shopify||{};var S=window.Shopify;S.analytics=S.analytics||{};var P=S.analytics;P.replayQueue=[],P.publish=function(e,t,i){return P.replayQueue.push([e,t,i]),!0};try{self.performance.mark("wpm:start")}catch(e){}var k,C="modern"===g?"modern":"legacy",E=(null!=l?l:{modern:"",legacy:""})[C],I=[(k={baseUrl:s,hashVersion:u,buildTarget:C}).baseUrl,"/wpm","/b",k.hashVersion,"modern"===k.buildTarget?"m":"l",".js"].join(""),O=!1,T=!1;try{c.browserTarget=g,function(){O=!0;try{window.addEventListener("pagehide",M)}catch(e){O=!1}}(),R(function(){try{R(x)}catch(e){D(e)}}),w.emit({status:"loading",requestId:m.requestId,navigationType:m.navigationType,trekkieState:a()})}catch(e){D(e)}}function U(){var e;if(q(),!function(){var e,t;return Boolean(null==(t=null==(e=window.Shopify)?void 0:e.analytics)?void 0:t.initialized)}()){var t,i,n;try{if("function"!=typeof(null==(e=window.webPixelsManager)?void 0:e.init))return void A();if(!(null!==(n=i=t=window.webPixelsManager.init(d))&&"function"!=typeof n&&Object(n)===n&&"publish"in i&&"function"==typeof i.publish&&"publishCustomEvent"in i&&"function"==typeof i.publishCustomEvent&&"visitor"in i&&"function"==typeof i.visitor))return void A()}catch(e){return void A(e)}var r=window.Shopify.analytics;r.replayQueue.forEach(function(e){var i=e[0],n=e[1],r=e[2];t.publishCustomEvent(i,n,r)}),r.replayQueue=[],r.publish=t.publishCustomEvent,r.visitor=t.visitor,r.initialized=!0}}function A(e){B("manager_api_unavailable",void 0===e?void 0:Q(e))}function x(){B("script_load_failed","".concat(I," has failed to load"))}function B(e,t){T||(T=!0,q(),w.emit({status:"failed",errorMsg:t,failureReason:e,requestId:m.requestId,navigationType:m.navigationType,trekkieState:a()}))}function M(e){O&&(q(),w.emit({status:"pagehide-while-loading",useKeepaliveFallback:!0,pagehidePersisted:e.persisted,requestId:m.requestId,navigationType:m.navigationType,trekkieState:a()}))}function q(){O=!1;try{window.removeEventListener("pagehide",M)}catch(e){}}function R(e){var t;!function(e){var t=e.src,i=e.async,n=void 0===i||i,r=e.onload,o=e.onerror,a=e.sri,d=e.scriptDataAttributes,s=void 0===d?{}:d,u=document.createElement("script"),l=document.querySelector("head"),c=document.querySelector("body");if(u.async=n,u.src=t,a&&(u.integrity=a,u.crossOrigin="anonymous"),s)for(var p in s)if(Object.prototype.hasOwnProperty.call(s,p))try{u.dataset[p]=String(s[p])}catch(e){}if(r&&u.addEventListener("load",r),o&&u.addEventListener("error",o),l)l.appendChild(u);else{if(!c)throw new Error("Did not find a head or body element to append the script");c.appendChild(u)}}({src:I,async:!0,onload:U,onerror:e,sri:(t=E,"string"==typeof t&&/^sha384-[A-Za-z0-9+/=]+$/.test(t)?E:""),scriptDataAttributes:c})}function D(e){B("script_append_failed",Q(e))}function Q(e){return e instanceof Error?e.message:"Unknown error"}}}();wpmLoader({shopId: 77130858718,storefrontBaseUrl: "https://five12.org",extensionsBaseUrl: "https://extensions.shopifycdn.com/cdn/shopifycloud/web-pixels-manager",monorailEndpoint: "https://five12.org/.well-known/shopify/monorail/unstable/produce_batch",surface: "storefront-renderer",enabledBetaFlags: ["4c64608a","16072cab","8450a54b","7ee89bf1"],webPixelsConfigList: [{"id":"shopify-app-pixel","configuration":"{}","eventPayloadVersion":"v1","runtimeContext":"STRICT","scriptVersion":"0530","apiClientId":"shopify-pixel","type":"APP","privacyPurposes":["ANALYTICS","MARKETING"]},{"id":"shopify-custom-pixel","eventPayloadVersion":"v1","runtimeContext":"LAX","scriptVersion":"0530","apiClientId":"shopify-pixel","type":"CUSTOM","privacyPurposes":["ANALYTICS","MARKETING"]}],isMerchantRequest: false,initData: {"shop":{"name":"Five.12 Foundation","paymentSettings":{"currencyCode":"USD"},"myshopifyDomain":"t24ihi-49.myshopify.com","countryCode":"US","storefrontUrl":"https:\/\/five12.org"},"customer":null,"cart":null,"checkout":null,"productVariants":[],"products":[{"id":"9069956858078","handle":"1","isCollective":null,"title":null,"type":null,"untranslatedTitle":null,"url":null,"vendor":null,"remoteShopId":null,"variants":[{"id":"47729560453342","image":null,"price":null,"sku":null,"title":null,"untranslatedTitle":null}]}],"purchasingCompany":null},},"https://five12.org/cdn","5982071ew7ea472e3p69b68784m2150dfea",{"modern":"","legacy":""},{"trekkieShim":true,"agentContext":true,"apiClientId":"580111","facebookCapiEnabled":"false","themeId":"153047236830","themeStoreId":"2481","themePublished":"true","eventMetadataId":"b298de75-ecc2-4ee5-a7ab-12abe1fe529f","pageType":"home","shopId":"77130858718","storefrontBaseUrl":"https:\/\/five12.org","extensionBaseUrl":"https:\/\/extensions.shopifycdn.com\/cdn\/shopifycloud\/web-pixels-manager","surface":"storefront-renderer","enabledBetaFlags":"[\"4c64608a\", \"16072cab\", \"8450a54b\", \"7ee89bf1\"]","isMerchantRequest":"false","hashVersion":"5982071ew7ea472e3p69b68784m2150dfea","publish":"custom","events":"[[\"page_viewed\",{}]]"});})();</script>
1588<script> 1589 window.ShopifyAnalytics = window.ShopifyAnalytics || {}; 1590 window.ShopifyAnalytics.meta = window.ShopifyAnalytics.meta || {}; 1591 window.ShopifyAnalytics.meta.currency = 'USD'; 1592 var meta = {"page":{"pageType":"home","requestId":"0e2154e2-4954-4184-9310-61047748df30-1791155867"}}; 1593 for (var attr in meta) { 1594 window.ShopifyAnalytics.meta[attr] = meta[attr]; 1595 } 1596</script>
vendor: 1 bytes, line 1596
1596
1597<script class="analytics"> 1598 (function () { 1599 var customDocumentWrite = function(content) { 1600 var jquery = null; 1601 1602 if (window.jQuery) { 1603 jquery = window.jQuery; 1604 } else if (window.Checkout && window.Checkout.$) { 1605 jquery = window.Checkout.$; 1606 } 1607 1608 if (jquery) { 1609 jquery('body').append(content); 1610 } 1611 }; 1612 1613 var hasLoggedConversion = function(token) { 1614 if (token) { 1615 return document.cookie.indexOf('loggedConversion=' + token) !== -1; 1616 } 1617 return false; 1618 } 1619 1620 var setCookieIfConversion = function(token) { 1621 if (token) { 1622 var twoMonthsFromNow = new Date(Date.now()); 1623 twoMonthsFromNow.setMonth(twoMonthsFromNow.getMonth() + 2); 1624 1625 document.cookie = 'loggedConversion=' + token + '; expires=' + twoMonthsFromNow; 1626 } 1627 } 1628 1629 var trekkie = window.ShopifyAnalytics.lib = window.trekkie = window.trekkie || []; 1630 window.ShopifyAnalytics.lib.trekkie = window.trekkie; 1631 if (trekkie.integrations) { 1632 return; 1633 } 1634 trekkie.methods = [ 1635 'identify', 1636 'page', 1637 'ready', 1638 'track', 1639 'trackForm', 1640 'trackLink' 1641 ]; 1642 trekkie.factory = function(method) { 1643 return function() { 1644 var args = Array.prototype.slice.call(arguments); 1645 args.unshift(method); 1646 trekkie.push(args); 1647 if (method == 'track' || method == 'page') { 1648 var pageUrl; 1649 try { 1650 pageUrl = window.location.href; 1651 } catch (e) {} 1652 var pageReferrer; 1653 try { 1654 pageReferrer = document.referrer; 1655 } catch (e) {} 1656 try { 1657 if (window.__TREKKIE_SHIM_QUEUE == null) { 1658 window.__TREKKIE_SHIM_QUEUE = []; 1659 } 1660 window.__TREKKIE_SHIM_QUEUE.push({ 1661 from: 'trekkie-stub', 1662 method: method, 1663 args: args.slice(1), 1664 pageContext: { 1665 url: pageUrl, 1666 referrer: pageReferrer 1667 } 1668 }); 1669 } catch (e) { 1670 // no-op 1671 } 1672 } 1673 return trekkie; 1674 }; 1675 }; 1676 for (var i = 0; i < trekkie.methods.length; i++) { 1677 var key = trekkie.methods[i]; 1678 trekkie[key] = trekkie.factory(key); 1679 } 1680 trekkie.load = function(config) { 1681 trekkie.config = config || {}; 1682 trekkie.config.initialDocumentCookie = document.cookie; 1683 var first = document.getElementsByTagName('script')[0]; 1684var script = document.createElement('script'); 1685script.type = 'text/javascript'; 1686script.onerror = function(e) { 1687 var scriptFallback = document.createElement('script'); 1688 scriptFallback.type = 'text/javascript'; 1689 scriptFallback.onerror = function(error) { 1690 var Monorail = { 1691 produce: function produce(monorailDomain, schemaId, payload) { 1692 var currentMs = new Date().getTime(); 1693 var event = { 1694 schema_id: schemaId, 1695 payload: payload, 1696 metadata: { 1697 event_created_at_ms: currentMs, 1698 event_sent_at_ms: currentMs 1699 } 1700 }; 1701 return Monorail.sendRequest("https://" + monorailDomain + "/v1/produce", JSON.stringify(event)); 1702 }, 1703 sendRequest: function sendRequest(endpointUrl, payload) { 1704 // Try the sendBeacon API 1705 if (window && window.navigator && typeof window.navigator.sendBeacon === 'function' && typeof window.Blob === 'function' && !Monorail.isIos12()) { 1706 var blobData = new window.Blob([payload], { 1707 type: 'text/plain' 1708 }); 1709 1710 if (window.navigator.sendBeacon(endpointUrl, blobData)) { 1711 return true; 1712 } // sendBeacon was not successful 1713 1714 } // XHR beacon 1715 1716 var xhr = new XMLHttpRequest(); 1717 1718 try { 1719 xhr.open('POST', endpointUrl); 1720 xhr.setRequestHeader('Content-Type', 'text/plain'); 1721 xhr.send(payload); 1722 } catch (e) { 1723 console.log(e); 1724 } 1725 1726 return false; 1727 }, 1728 isIos12: function isIos12() { 1729 return window.navigator.userAgent.lastIndexOf('iPhone; CPU iPhone OS 12_') !== -1 || window.navigator.userAgent.lastIndexOf('iPad; CPU OS 12_') !== -1; 1730 } 1731 }; 1732 Monorail.produce('monorail-edge.shopifysvc.com', 1733 'trekkie_storefront_load_errors/1.1', 1734 {shop_id: 77130858718, 1735 theme_id: 153047236830, 1736 app_name: "storefront", 1737 context_url: window.location.href, 1738 source_url: "//five12.org/cdn/s/trekkie.storefront.2f6d7d7ede7d24234881a9cd5f47e679642fa1f6.min.js"}); 1739 1740 }; 1741 scriptFallback.async = true; 1742 scriptFallback.src = '//five12.org/cdn/s/trekkie.storefront.2f6d7d7ede7d24234881a9cd5f47e679642fa1f6.min.js'; 1743 first.parentNode.insertBefore(scriptFallback, first); 1744}; 1745script.async = true; 1746script.src = '//five12.org/cdn/s/trekkie.storefront.2f6d7d7ede7d24234881a9cd5f47e679642fa1f6.min.js'; 1747first.parentNode.insertBefore(script, first); 1748 1749 }; 1750 trekkie.load( 1751 {"Trekkie":{"appName":"storefront","development":false,"defaultAttributes":{"shopId":77130858718,"isMerchantRequest":null,"themeId":153047236830,"themeCityHash":"6433340631960660482","contentLanguage":"en","currency":"USD","eventMetadataId":"b298de75-ecc2-4ee5-a7ab-12abe1fe529f"},"isServerSideCookieWritingEnabled":true,"monorailRegion":"shop_domain","enabledBetaFlags":["764d78cb","8450a54b","7ee89bf1","4c64608a"]},"Session Attribution":{},"S2S":{"facebookCapiEnabled":false,"source":"trekkie-storefront-renderer","apiClientId":580111}} 1752 ); 1753 1754 var loaded = false;
1755 trekkie.ready(function() { 1756 if (loaded) return; 1757 loaded = true; 1758 1759 window.ShopifyAnalytics.lib = window.trekkie; 1760 1761 var originalDocumentWrite = document.write; 1762 document.write = customDocumentWrite; 1763 try { window.ShopifyAnalytics.merchantGoogleAnalytics.call(this); } catch(error) {}; 1764 document.write = originalDocumentWrite; 1765 1766 var match = window.location.pathname.match(/checkouts\/(.+)\/(thank_you|post_purchase)/) 1767 var token = match? match[1]: undefined; 1768 if (!hasLoggedConversion(token)) { 1769 setCookieIfConversion(token); 1770 1771 } 1772 }); 1773 1774 window.ShopifyAnalytics.lib.page(null,{"pageType":"home","requestId":"0e2154e2-4954-4184-9310-61047748df30-1791155867","shopifyEmitted":true}); 1775 1776 var eventsListenerScript = document.createElement('script'); 1777 eventsListenerScript.async = true; 1778 eventsListenerScript.src = "//five12.org/cdn/shopifycloud/storefront/assets/shop_events_listener-4e26a9ce.js"; 1779 document.getElementsByTagName('head')[0].appendChild(eventsListenerScript); 1780})();</script>
vendor: 1 bytes, line 1780
1780
1781<script 1782 defer 1783 src="https://five12.org/cdn/shopifycloud/perf-kit/shopify-perf-kit-3.9.4.min.js" 1784 data-application="storefront-renderer" 1785 data-shop-id="77130858718" 1786 data-render-region="gcp-us-central1" 1787 data-page-type="index" 1788 data-theme-instance-id="153047236830" 1789 data-theme-name="Horizon" 1790 data-theme-version="3.1.0" 1791 data-monorail-region="shop_domain" 1792 data-resource-timing-sampling-rate="10" 1793 data-shs="true" 1794 data-shs-beacon="true" 1795 data-shs-export-with-fetch="true" 1796 data-shs-logs-sample-rate="1" 1797 data-shs-beacon-endpoint="https://five12.org/api/collect" 1798></script>
1798 1799<meta name="shopify-y" content="56b9e29e-1ab4-4b2f-84c1-066e4e796fcc" data-expiration="1822713467000"><meta name="shopify-s" content="1d16e6c4-7635-47ff-85b2-eb5b4125e1e3" data-expiration="1791157667000"><meta name="new-cookie-storage-activated" content="t"> 1800</head> 1801 1802 <body class="page-width-normal card-hover-effect-none"> 1803 <a 1804 class="skip-to-content-link button-secondary" 1805 href="#MainContent" 1806> 1807 Skip to content 1808</a> 1809 1810 <div id="header-group"> 1811 <!-- BEGIN sections: header-group --> 1812<div id="shopify-section-sections--20135224344798__header_announcements_9jGBFp" class="shopify-section shopify-section-group-header-group"> 1813 1814 1815 1816<div class="section-background color-scheme-1"></div> 1817<aside 1818 class="announcement-bar spacing-style section section--page-width color-scheme-1" 1819 style="--padding-block-start: 15px; --padding-block-end:15px; 1820--padding-inline-start:0px; --padding-inline-end:0px; 1821; --border-bottom-width: 1px;" 1822> 1823 1824 1825 <announcement-bar-component 1826 class="announcement-bar__slider" 1827 1828 > 1829 1830 1831 <div class="announcement-bar__slides"> 1832 1833 1834 1835 1836 1837 </div> 1838 </announcement-bar-component> 1839</aside> 1840 1841 1842 1843 1844</div><header id="shopify-section-sections--20135224344798__header_section" class="shopify-section shopify-section-group-header-group header-section"> 1845 1846 1847
1848<script type="application/ld+json"> 1849 { 1850 "@context": "http://schema.org", 1851 "@type": "Organization", 1852 "name": "Five.12 Foundation", 1853 1854 "logo": "https:\/\/five12.org\/cdn\/shop\/files\/FIVE.12_logo_pair_288x1_481da8cc-5c4e-4bf0-b1de-65594abbda15.png?v=1764882603\u0026width=500", 1855 1856 "url": "https:\/\/five12.org" 1857 } 1858</script>
1858 1859 1860<header-component 1861 id="header-component" 1862 class="header" 1863 1864 1865 sticky="always" 1866 1867 data-skip-node-update 1868 data-scroll-direction="none" 1869><h1 class="visually-hidden">Five.12 Foundation</h1> 1870 1871 1872 1873 1874 1875 1876 <div 1877 class="header__row header__row--top color-scheme-1 section section--full-width-margin section--page-width" 1878 ref="headerRowTop"style="--border-bottom-width: 0px; --border-bottom-width-mobile: 0px;"> 1879 <div class="header__columns spacing-style"> 1880 <div 1881 class="header__column header__column--left" 1882 data-testid="header-top-left" 1883 > 1884 1885 1886 1887 1888 1889 1890 1891 <div 1892 class="header__drawer desktop:hidden" 1893 ref="headerDrawerContainer" 1894 1895 > 1896 1897
1898<script 1899 src="//five12.org/cdn/shop/t/1/assets/header-drawer.js?v=160607022407653843031764799996" 1900 type="module" 1901 fetchpriority="low" 1902></script>
1902 1903 1904<header-drawer 1905 class="header-drawer header__drawer--mobile" 1906 style="--menu-image-border-radius: 0px; --resource-card-corner-radius: 0px;" 1907> 1908 <details 1909 id="Details-menu-drawer-container" 1910 data-skip-node-update="true" 1911 class="menu-drawer-container" 1912 ref="details" 1913 scroll-lock 1914 > 1915 <summary 1916 class="header__icon header__icon--menu header__icon--summary" 1917 aria-label="Menu" 1918 on:click="/toggle" 1919 > 1920 <span class="svg-wrapper header-drawer-icon header-drawer-icon--open"><svg width="14" height="14" viewBox="0 0 14 14" fill="none" xmlns="http://www.w3.org/2000/svg"> 1921 <path d="M1 3.5H13" stroke="currentColor" stroke-width="var(--icon-stroke-width)" stroke-linecap="round"/> 1922 <path d="M1 10.5H13" stroke="currentColor" stroke-width="var(--icon-stroke-width)" stroke-linecap="round"/> 1923</svg> 1924</span> 1925 <span class="svg-wrapper header-drawer-icon header-drawer-icon--close"><svg width="14" height="14" viewBox="0 0 14 14" fill="none" xmlns="http://www.w3.org/2000/svg"> 1926 <path d="M12 2L2 12" stroke="currentColor" stroke-width="var(--icon-stroke-width)" stroke-linecap="round" stroke-linejoin="round"/> 1927 <path d="M12 12L2 2" stroke="currentColor" stroke-width="var(--icon-stroke-width)" stroke-linecap="round" stroke-linejoin="round"/> 1928</svg> 1929</span> 1930 </summary> 1931 <div 1932 data-header-drawer 1933 class=" 1934 menu-drawer 1935 motion-reduce 1936 color-scheme-1 1937 " 1938 > 1939 <button 1940 class="button button-unstyled close-button menu-drawer__close-button" 1941 type="button" 1942 aria-label="Close" 1943 on:click="/close" 1944 > 1945 <span class="svg-wrapper header-drawer-icon header-drawer-icon--close"><svg width="14" height="14" viewBox="0 0 14 14" fill="none" xmlns="http://www.w3.org/2000/svg"> 1946 <path d="M12 2L2 12" stroke="currentColor" stroke-width="var(--icon-stroke-width)" stroke-linecap="round" stroke-linejoin="round"/> 1947 <path d="M12 12L2 2" stroke="currentColor" stroke-width="var(--icon-stroke-width)" stroke-linecap="round" stroke-linejoin="round"/> 1948</svg> 1949</span> 1950 </button> 1951 <nav 1952 class="menu-drawer__navigation" 1953 style="--menu-top-level-font-family: var(--font-body--family); 1954--menu-top-level-font-size-desktop: 0.875rem; --menu-top-level-font-style: var(--font-body--style); --menu-top-level-font-weight: var(--font-body--weight); --menu-top-level-font-case:none; 1955 1956 --menu-top-level-font-size: var(--menu-font-2xl--size); --menu-top-level-font-line-height: 1957 var(--menu-font-2xl--line-height); 1958 1959--menu-top-level-font-color: var(--color-foreground); --menu-top-level-font-color-rgb: var(--color-foreground-rgb); 1960 1961--menu-parent-font-family: var(--font-body--family); --menu-parent-font-style: 1962var(--font-body--style); --menu-parent-font-weight: var(--font-body--weight); --menu-parent-font-case: 1963none; 1964 1965 --menu-parent-font-size: var(--menu-font-sm--size); --menu-parent-font-line-height: 1966 var(--menu-font-sm--line-height); --menu-parent-font-color: rgb(var(--color-foreground-rgb) / 1967 var(--opacity-subdued-text)); --menu-parent-active-font-color: var(--color-foreground); 1968 1969--menu-child-font-family: var(--font-body--family); --menu-child-font-style: 1970var(--font-body--style); --menu-child-font-weight: var(--font-body--weight); --menu-child-font-case: 1971none; 1972 1973 --menu-child-font-size: var(--menu-font-md--size); --menu-child-font-line-height: var(--menu-font-md--line-height); 1974 --menu-child-font-color: var(--color-foreground); --menu-child-active-font-color: rgb(var(--color-foreground-rgb) / 1975 var(--opacity-subdued-text)); 1976 1977 1978 " 1979 > 1980 <ul 1981 class="menu-drawer__menu has-submenu" 1982 role="list" 1983 > 1984 1985 1986 1987 <li 1988 style="--menu-drawer-animation-index: 1;" 1989 class="menu-drawer__list-item--deep" 1990 > 1991 1992<a 1993 id="HeaderDrawer-home" 1994 href="/" 1995 class="menu-drawer__menu-item menu-drawer__menu-item--mainlist menu-drawer__animated-element focus-inset menu-drawer__menu-item--active" 1996 1997 aria-current="page" 1998 1999 >
2000 <span class="menu-drawer__menu-item-text wrap-text">HOME</span> 2001 </a> 2002 2003 </li> 2004 <li 2005 style="--menu-drawer-animation-index: 2;" 2006 class="menu-drawer__list-item--deep" 2007 > 2008 2009<a 2010 id="HeaderDrawer-donate-now" 2011 href="/products/1" 2012 class="menu-drawer__menu-item menu-drawer__menu-item--mainlist menu-drawer__animated-element focus-inset" 2013 2014 > 2015 <span class="menu-drawer__menu-item-text wrap-text">DONATE NOW</span> 2016 </a> 2017 2018 </li> 2019 </ul> 2020 </nav> 2021 <div 2022 class="menu-drawer__utility-links menu-drawer__animated-element" 2023 style="--menu-drawer-animation-index: 2;" 2024 > 2025 2026 </div> 2027 2028 2029 </div> 2030 <div 2031 class="menu-drawer__backdrop" 2032 on:click="header-drawer/close" 2033 ></div> 2034 </details> 2035</header-drawer> 2036 2037 2038 2039 </div> 2040 2041 2042 2043 2044 2045 2046 2047 2048 2049 2050 2051 2052 2053 2054 2055 2056 2057<a 2058 2059 href="/" 2060 class="size-style spacing-style header-logo" 2061 style=" 2062 --size-style-width: ;--size-style-height: ; 2063 --padding-block-start: 0px;--padding-block-end: 0px;--padding-inline-start: 0px;--padding-inline-end: 0px; 2064 --font-family: var(--font-body--family); 2065 --font-style: var(--font-body--style); 2066 --font-weight: 600; 2067 " 2068 2069> 2070 2071 2072 <span 2073 class="header-logo__image-container header-logo__image-container--original" 2074 data-testid="header-logo" 2075 > 2076 2077 2078 2079 2080 2081 2082 2083 2084 2085 2086 2087 <img src="//five12.org/cdn/shop/files/FIVE.12_logo_pair_288x1_481da8cc-5c4e-4bf0-b1de-65594abbda15.png?height=78&v=1764882603" alt="" width="267" height="78" class="header-logo__image" srcset="//five12.org/cdn/shop/files/FIVE.12_logo_pair_288x1_481da8cc-5c4e-4bf0-b1de-65594abbda15.png?height=78&v=1764882603 1x, //five12.org/cdn/shop/files/FIVE.12_logo_pair_288x1_481da8cc-5c4e-4bf0-b1de-65594abbda15.png?height=156&v=1764882603 2x, //five12.org/cdn/shop/files/FIVE.12_logo_pair_288x1_481da8cc-5c4e-4bf0-b1de-65594abbda15.png?height=234&v=1764882603 3x" style="--header-logo-image-width: 268px;--header-logo-image-width-mobile: 257px; --header-logo-image-height: 78px; --header-logo-image-height-mobile: 75px;"> 2088 2089 2090 </span> 2091 2092 2093</a> 2094 2095 2096 2097 2098 2099 2100 2101 2102 2103 2104 2105 2106 2107 2108 </div><div 2109 class="header__column header__column--right" 2110 data-testid="header-top-right" 2111 > 2112 2113 2114 2115 2116 2117 2118 2119 <header-menu 2120 ref="headerMenu" 2121 class="header-menu mobile:hidden" 2122 data-animation-delay="200" 2123 2124 style="--submenu-animation-speed: 200ms;" 2125 > 2126 <div class="header-menu__inner"> 2127 2128 2129 2130<nav header-menu> 2131 <div 2132 class="menu-list" 2133 style="--menu-top-level-font-family: var(--font-body--family); 2134--menu-top-level-font-size-desktop: 0.875rem; --menu-top-level-font-style: var(--font-body--style); --menu-top-level-font-weight: var(--font-body--weight); --menu-top-level-font-case:none; 2135 2136 --menu-top-level-font-size: var(--menu-font-sm--size); --menu-top-level-font-line-height: 2137 var(--menu-font-sm--line-height); 2138 2139--menu-top-level-font-color: var(--color-foreground); --menu-top-level-font-color-rgb: var(--color-foreground-rgb); 2140" 2141 > 2142 2143 <overflow-list 2144 2145 ref="overflowMenu" 2146 2147 2148 class="overflow-menu color-scheme-matches-parent" 2149 2150 2151 minimum-items="2" 2152 2153 2154 defer 2155 2156> 2157 <template shadowrootmode="open"> 2158 <link href="//five12.org/cdn/shop/t/1/assets/overflow-list.css?v=168694168152117541881764799996" rel="stylesheet" type="text/css" media="all" /> 2159 2160 <ul part="list"> 2161 <slot></slot> 2162 <slot 2163 name="more" 2164 part="more" 2165 hidden 2166 2167 > 2168 <li 2169 part="more" 2170 > 2171 <button 2172 class="button" 2173 type="button" 2174 tabindex="0" 2175 > 2176 More 2177 </button> 2178 </li> 2179 </slot> 2180 <li 2181 part="placeholder" 2182 hidden 2183 ></li> 2184 </ul> 2185 2186 <div part="overflow"> 2187 <ul part="overflow-list"> 2188 <slot name="overflow"></slot> 2189 </ul> 2190 </div> 2191 </template> 2192 2193 2194 2195 <li 2196 role="presentation" 2197 class="menu-list__list-item" 2198 on:focus="/activate" 2199 on:blur="/deactivate"
2200 on:pointerenter="/activate" 2201 on:pointerleave="/deactivate" 2202 > 2203 <a 2204 href="/" 2205 data-skip-node-update="true" 2206 class="menu-list__link menu-list__link--active"ref="menuitem" 2207 > 2208 <span class="menu-list__link-title">HOME</span> 2209 </a></li> 2210 2211 <li 2212 role="presentation" 2213 class="menu-list__list-item" 2214 on:focus="/activate" 2215 on:blur="/deactivate" 2216 on:pointerenter="/activate" 2217 on:pointerleave="/deactivate" 2218 > 2219 <a 2220 href="/products/1" 2221 data-skip-node-update="true" 2222 class="menu-list__link"ref="menuitem" 2223 > 2224 <span class="menu-list__link-title">DONATE NOW</span> 2225 </a></li> 2226 2227 <li 2228 class="menu-list__list-item" 2229 role="presentation" 2230 slot="more" 2231 on:focus="/activate" 2232 on:blur="/deactivate" 2233 on:pointerenter="/activate" 2234 on:pointerleave="/deactivate" 2235 > 2236 <button role="menuitem" class="button menu-list__link button-unstyled"> 2237 <span class="menu-list__link-title">More</span> 2238 </button> 2239 </li> 2240 2241</overflow-list> 2242 2243 </div> 2244</nav> 2245 2246 </div> 2247 2248
2248<script 2249 src="//five12.org/cdn/shop/t/1/assets/header-menu.js?v=98986771878453457241764799996" 2250 type="module" 2251 fetchpriority="low" 2252 ></script>
2252 2253 </header-menu> 2254 2255 2256 2257 2258 2259 2260 2261 2262 2263 2264 2265 2266 2267 2268 2269 2270 2271 2272 2273 2274 2275 2276 2277 2278 2279 2280
2280<script 2281 type="module" 2282 src="//five12.org/cdn/shop/t/1/assets/cart-icon.js?v=14733679814066288171764799996" 2283 fetchpriority="low" 2284></script>
2284 2285 2286<header-actions> 2287 2288 2289 2290
2290<script 2291 src="//five12.org/cdn/shop/t/1/assets/cart-drawer.js?v=92290163633888904321764799997" 2292 type="module" 2293 fetchpriority="low" 2294></script>
2294 2295 2296<cart-drawer-component 2297 class="cart-drawer" 2298 2299 2300 auto-open 2301 2302> 2303 <button 2304 class="button header-actions__action button-unstyled" 2305 on:click="/open" 2306 aria-haspopup="dialog" 2307 aria-label="Cart" 2308 aria-describedby="cart-bubble-text" 2309 data-testid="cart-drawer-trigger" 2310 > 2311 <cart-icon 2312 class=" 2313 header-actions__cart-icon 2314 2315 " 2316 data-testid="cart-icon" 2317> 2318 <span 2319 class="svg-wrapper" 2320 aria-hidden="true" 2321 > 2322 <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 20 20" fill="none"><path stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="var(--icon-stroke-width)" d="M3.392 6.875h13.216v8.016c0 .567-.224 1.112-.624 1.513-.4.402-.941.627-1.506.627H5.522a2.13 2.13 0 0 1-1.506-.627 2.15 2.15 0 0 1-.624-1.513zM8.818 2.969h2.333c.618 0 1.211.247 1.649.686a2.35 2.35 0 0 1 .683 1.658v1.562H6.486V5.313c0-.622.246-1.218.683-1.658a2.33 2.33 0 0 1 1.65-.686"/></svg> 2323 2324 </span> 2325 2326 <div 2327 ref="cartBubble" 2328 class="cart-bubble visually-hidden" 2329 2330 2331 data-maintain-ratio 2332 2333> 2334 <span class="cart-bubble__background"></span> 2335 <span 2336 ref="cartBubbleText" 2337 id="cart-bubble-text" 2338 class="cart-bubble__text" 2339 2340 role="status" 2341 2342 > 2343 <span class="visually-hidden">Total items in cart: 0 2344 </span> 2345 <span 2346 class="cart-bubble__text-count hidden" 2347 ref="cartBubbleCount" 2348 aria-hidden="true" 2349 data-testid="cart-bubble" 2350 > 23510</span> 2352 </span> 2353</div> 2354 2355</cart-icon> 2356 2357 2358 2359 </button> 2360 2361 <dialog 2362 ref="dialog" 2363 class="cart-drawer__dialog dialog-modal dialog-drawer color-scheme-1 cart-drawer--empty" 2364 aria-labelledby="cart-drawer-heading-empty" 2365 scroll-lock 2366 > 2367 <div class="cart-drawer__inner"> 2368 <cart-items-component 2369 class="cart-items-component" 2370 data-section-id="sections--20135224344798__header_section" 2371 ><div class="cart-drawer__header"> 2372 <button 2373 ref="closeButton" 2374 on:click="cart-drawer-component/close" 2375 class="button close-button cart-drawer__close-button button-unstyled" 2376 aria-label="Close dialog" 2377 > 2378 <span class="svg-wrapper"><svg width="14" height="14" viewBox="0 0 14 14" fill="none" xmlns="http://www.w3.org/2000/svg"> 2379 <path d="M12 2L2 12" stroke="currentColor" stroke-width="var(--icon-stroke-width)" stroke-linecap="round" stroke-linejoin="round"/> 2380 <path d="M12 12L2 2" stroke="currentColor" stroke-width="var(--icon-stroke-width)" stroke-linecap="round" stroke-linejoin="round"/> 2381</svg> 2382</span> 2383 </button> 2384 </div> 2385 2386 <div 2387 class="cart-drawer__content motion-reduce" 2388 aria-label="Cart" 2389 > 2390 <h2 2391 class="cart-drawer__heading h3 cart-drawer__heading--empty" 2392 id="cart-drawer-heading-empty" 2393 > 2394 Your cart is empty 2395 </h2> 2396 2397 <div class="cart-drawer__items"> 2398 2399
2400<script 2401 src="//five12.org/cdn/shop/t/1/assets/component-cart-items.js?v=153612958899122878591764799996" 2402 type="module" 2403 fetchpriority="low" 2404></script>
vendor: 1 bytes, line 2404
2404
2405<script 2406 src="//five12.org/cdn/shop/t/1/assets/component-cart-quantity-selector.js?v=105130809908858639751764799996" 2407 type="module" 2408 fetchpriority="low" 2409></script>
2409 2410 2411<div 2412 2413 class="cart-items__wrapper" 2414 2415> 2416 2417<a 2418 class="button cart-items__empty-button" 2419 href="/collections/all" 2420 > 2421 Donate Now 2422 </a></div> 2423 2424 2425 2426 </div> 2427 </div></cart-items-component> 2428 </div> 2429 </dialog> 2430</cart-drawer-component> 2431 2432 2433 2434 2435</header-actions> 2436 2437 2438 2439 2440 2441 2442 </div> 2443 </div> 2444 </div> 2445 2446 2447 2448 2449 2450 2451 2452 2453 2454 2455 2456</header-component> 2457
2458<script 2459 src="//five12.org/cdn/shop/t/1/assets/header.js?v=78043468934677320351764799996" 2460 type="module" 2461></script>
2461 2462 2463 2464 2465 2466
2466<script type="module"> 2467 import { hydrate } from '@theme/section-hydration'; 2468 const url = new URL(window.location.href); 2469 url.searchParams.delete('page'); 2470 hydrate('sections--20135224344798__header_section', url); 2471 </script>
2471 2472 2473 2474 2475</header> 2476<!-- END sections: header-group --> 2477 </div> 2478 2479
2479<script 2480 src="//five12.org/cdn/shop/t/1/assets/critical.js?v=169402557219780209121764799996" 2481 type="module" 2482 async 2483 blocking="render" 2484 ></script>
2484 2485 2486 <main 2487 id="MainContent" 2488 class="content-for-layout" 2489 role="main" 2490 data-page-transition-enabled="false" 2491 data-product-transition="false" 2492 data-template="index" 2493 > 2494 <div id="shopify-section-template--20135223820510__176488505676a58faf" class="shopify-section section-wrapper"> 2495 2496 2497 2498<div class="section-background color-scheme-1"></div> 2499<div 2500 class="section section--page-width color-scheme-1" 2501 data-testid="ui-test-section" 2502 2503 2504 2505 style=" 2506 2507 2508 2509 " 2510> 2511 <div class="custom-section-background"> 2512 2513 2514 </div> 2515 2516 <div 2517 class="border-style custom-section-content" 2518 style="--border-width: 1px; --border-style: none; --border-color: 2519rgb(var(--color-border-rgb) / 1.0); --border-radius: 25200px; 2521" 2522 > 2523 2524 2525 <div 2526 class=" 2527 spacing-style 2528 layout-panel-flex 2529 layout-panel-flex--column 2530 section-content-wrapper 2531 mobile-column 2532 " 2533 style=" 2534 --flex-direction: column; --flex-wrap: nowrap; --flex-wrap-mobile: wrap; 2535 2536--gap: 12px; 2537 2538--horizontal-alignment: flex-start; --vertical-alignment: center; 2539--vertical-alignment-mobile: center; 2540 2541 --padding-block-start: 0px;--padding-block-end: 0px; 2542 " 2543 data-testid="section-content" 2544 > 2545 2546 2547 2548 2549<style data-shopify> 2550 .ai-hero-video-askznd2riym9kndruwaigenblock4fc15d0n4bfml { 2551 position: relative; 2552 width: 100%; 2553 cursor: pointer; 2554 } 2555 2556 .ai-hero-video-askznd2riym9kndruwaigenblock4fc15d0n4bfml__image-wrapper { 2557 position: relative; 2558 width: 100%; 2559 display: block; 2560 } 2561 2562 .ai-hero-video-askznd2riym9kndruwaigenblock4fc15d0n4bfml__image { 2563 width: 100%; 2564 height: auto; 2565 display: block; 2566 } 2567 2568 .ai-hero-video-askznd2riym9kndruwaigenblock4fc15d0n4bfml__placeholder { 2569 width: 100%; 2570 background-color: #f4f4f4; 2571 display: flex; 2572 align-items: center; 2573 justify-content: center; 2574 position: relative; 2575 min-height: 400px; 2576 } 2577 2578 .ai-hero-video-askznd2riym9kndruwaigenblock4fc15d0n4bfml__placeholder svg { 2579 width: 100%; 2580 height: 100%; 2581 max-width: 500px; 2582 max-height: 500px; 2583 } 2584 2585 .ai-hero-video-askznd2riym9kndruwaigenblock4fc15d0n4bfml__empty-state { 2586 position: absolute; 2587 bottom: 20px; 2588 left: 50%; 2589 transform: translateX(-50%); 2590 padding: 12px 20px; 2591 font-size: 14px; 2592 color: #666; 2593 text-align: center; 2594 pointer-events: none; 2595 } 2596 2597 .ai-hero-video-askznd2riym9kndruwaigenblock4fc15d0n4bfml__play-button { 2598 position: absolute; 2599 top: 50%; 2600 left: 50%; 2601 transform: translate(-50%, -50%); 2602 width: 80px; 2603 height: 80px; 2604 background-color: #ffffff; 2605 border-radius: 50%; 2606 display: flex; 2607 align-items: center; 2608 justify-content: center; 2609 transition: transform 0.3s ease, opacity 0.3s ease; 2610 pointer-events: none; 2611 opacity: 0.9; 2612 } 2613 2614 .ai-hero-video-askznd2riym9kndruwaigenblock4fc15d0n4bfml:hover .ai-hero-video-askznd2riym9kndruwaigenblock4fc15d0n4bfml__play-button { 2615 transform: translate(-50%, -50%) scale(1.1); 2616 } 2617 2618 .ai-hero-video-askznd2riym9kndruwaigenblock4fc15d0n4bfml__play-icon { 2619 width: calc(80px * 0.4); 2620 height: calc(80px * 0.4); 2621 margin-left: calc(80px * 0.05); 2622 } 2623 2624 .ai-hero-video-askznd2riym9kndruwaigenblock4fc15d0n4bfml__play-icon polygon { 2625 fill: #000000; 2626 } 2627 2628 .ai-hero-video-askznd2riym9kndruwaigenblock4fc15d0n4bfml__video-container { 2629 position: fixed; 2630 top: 0; 2631 left: 0; 2632 width: 100%; 2633 height: 100%; 2634 background-color: rgba(0, 0, 0, 0.95); 2635 z-index: 9999; 2636 display: none; 2637 align-items: center; 2638 justify-content: center; 2639 } 2640 2641 .ai-hero-video-askznd2riym9kndruwaigenblock4fc15d0n4bfml__video-container.active { 2642 display: flex; 2643 } 2644 2645 .ai-hero-video-askznd2riym9kndruwaigenblock4fc15d0n4bfml__video-wrapper { 2646 position: relative; 2647 width: 90%; 2648 max-width: 1200px; 2649 aspect-ratio: 16 / 9; 2650 } 2651 2652 .ai-hero-video-askznd2riym9kndruwaigenblock4fc15d0n4bfml__iframe { 2653 position: absolute; 2654 top: 0; 2655 left: 0; 2656 width: 100%; 2657 height: 100%; 2658 border: none; 2659 } 2660 2661 .ai-hero-video-askznd2riym9kndruwaigenblock4fc15d0n4bfml__close-button { 2662 position: absolute; 2663 top: -50px; 2664 right: 0; 2665 background: none; 2666 border: none; 2667 color: #ffffff; 2668 cursor: pointer; 2669 padding: 10px; 2670 font-size: 32px; 2671 line-height: 1; 2672 opacity: 0.8; 2673 transition: opacity 0.3s ease; 2674 } 2675 2676 .ai-hero-video-askznd2riym9kndruwaigenblock4fc15d0n4bfml__close-button:hover { 2677 opacity: 1; 2678 } 2679 2680 @media screen and (max-width: 749px) { 2681 .ai-hero-video-askznd2riym9kndruwaigenblock4fc15d0n4bfml__play-button { 2682 width: calc(80px * 0.8); 2683 height: calc(80px * 0.8); 2684 } 2685 2686 .ai-hero-video-askznd2riym9kndruwaigenblock4fc15d0n4bfml__play-icon { 2687 width: calc(80px * 0.32); 2688 height: calc(80px * 0.32); 2689 margin-left: calc(80px * 0.04); 2690 } 2691 2692 .ai-hero-video-askznd2riym9kndruwaigenblock4fc15d0n4bfml__close-button { 2693 top: -40px; 2694 font-size: 28px; 2695 } 2696 } 2697</style> 2698 2699<hero-video-askznd2riym9kndruwaigenblock4fc15d0n4bfml 2700 class="ai-hero-video-askznd2riym9kndruwaigenblock4fc15d0n4bfml" 2701 data-youtube-url="https://www.youtube.com/watch?v=5x71c6M4d-g" 2702 2703> 2704 <div class="ai-hero-video-askznd2riym9kndruwaigenblock4fc15d0n4bfml__image-wrapper"> 2705 2706 <img 2707 src="//five12.org/cdn/shop/files/placeholder-hero.jpg?v=1764804524&width=2400" 2708 alt="" 2709 loading="lazy" 2710 width="1439" 2711 height="721" 2712 class="ai-hero-video-askznd2riym9kndruwaigenblock4fc15d0n4bfml__image" 2713 > 2714 2715 2716 2717 </div> 2718 2719 <div class="ai-hero-video-askznd2riym9kndruwaigenblock4fc15d0n4bfml__video-container"> 2720 <div class="ai-hero-video-askznd2riym9kndruwaigenblock4fc15d0n4bfml__video-wrapper"> 2721 <button 2722 class="ai-hero-video-askznd2riym9kndruwaigenblock4fc15d0n4bfml__close-button" 2723 aria-label="Close video" 2724 > 2725 Ã 2726 </button> 2727 <iframe 2728 class="ai-hero-video-askznd2riym9kndruwaigenblock4fc15d0n4bfml__iframe" 2729 src="" 2730 allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" 2731 allowfullscreen 2732 ></iframe> 2733 </div> 2734 </div> 2735</hero-video-askznd2riym9kndruwaigenblock4fc15d0n4bfml> 2736
2737<script> 2738 (function() { 2739 class HeroVideoaskznd2riym9kndruwaigenblock4fc15d0n4bfml extends HTMLElement { 2740 constructor() { 2741 super(); 2742 this.youtubeUrl = this.dataset.youtubeUrl; 2743 this.videoContainer = this.querySelector('.ai-hero-video-askznd2riym9kndruwaigenblock4fc15d0n4bfml__video-container'); 2744 this.iframe = this.querySelector('.ai-hero-video-askznd2riym9kndruwaigenblock4fc15d0n4bfml__iframe'); 2745 this.closeButton = this.querySelector('.ai-hero-video-askznd2riym9kndruwaigenblock4fc15d0n4bfml__close-button'); 2746 this.imageWrapper = this.querySelector('.ai-hero-video-askznd2riym9kndruwaigenblock4fc15d0n4bfml__image-wrapper'); 2747 } 2748 2749 connectedCallback() { 2750 this.setupEventListeners(); 2751 } 2752 2753 setupEventListeners() { 2754 this.imageWrapper.addEventListener('click', () => { 2755 this.openVideo(); 2756 }); 2757 2758 this.closeButton.addEventListener('click', (e) => { 2759 e.stopPropagation(); 2760 this.closeVideo(); 2761 }); 2762 2763 this.videoContainer.addEventListener('click', (e) => { 2764 if (e.target === this.videoContainer) { 2765 this.closeVideo(); 2766 } 2767 }); 2768 2769 window.addEventListener('message', (event) => { 2770 if (event.data === 0 || event.data === '0') { 2771 this.closeVideo(); 2772 } 2773 }); 2774 } 2775 2776 openVideo() { 2777 if (!this.youtubeUrl) return; 2778 2779 const videoId = this.extractVideoId(this.youtubeUrl); 2780 if (!videoId) return; 2781 2782 const embedUrl = 'https://www.youtube.com/embed/' + videoId + '?autoplay=1&enablejsapi=1'; 2783 this.iframe.src = embedUrl; 2784 this.videoContainer.classList.add('active'); 2785 document.body.style.overflow = 'hidden'; 2786 } 2787 2788 closeVideo() { 2789 this.videoContainer.classList.remove('active'); 2790 this.iframe.src = ''; 2791 document.body.style.overflow = ''; 2792 } 2793 2794 extractVideoId(url) { 2795 if (!url) return null; 2796 2797 const regExp = /^.*((youtu.be\/)|(v\/)|(\/u\/\w\/)|(embed\/)|(watch\?))\??v?=?([^#&?]*).*/; 2798 const match = url.match(regExp); 2799 return match && match[7].length === 11 ? match[7] : null; 2800 } 2801 } 2802 2803 customElements.define('hero-video-askznd2riym9kndruwaigenblock4fc15d0n4bfml', HeroVideoaskznd2riym9kndruwaigenblock4fc15d0n4bfml); 2804 })(); 2805</script>
2805 2806 2807 2808 2809 2810 </div> 2811 </div> 2812</div> 2813 2814 2815 2816 2817 2818</div><div id="shopify-section-template--20135223820510__17648830977a63d11a" class="shopify-section section-wrapper"> 2819 2820 2821 2822<div class="section-background color-scheme-1"></div> 2823<div 2824 class="section section--page-width color-scheme-1" 2825 data-testid="ui-test-section" 2826 2827 2828 2829 style=" 2830 2831 2832 2833 " 2834> 2835 <div class="custom-section-background"> 2836 2837 2838 </div> 2839 2840 <div 2841 class="border-style custom-section-content" 2842 style="--border-width: 1px; --border-style: none; --border-color: 2843rgb(var(--color-border-rgb) / 1.0); --border-radius: 28440px; 2845" 2846 > 2847 2848 2849 <div 2850 class=" 2851 spacing-style 2852 layout-panel-flex 2853 layout-panel-flex--column 2854 section-content-wrapper 2855 mobile-column 2856 " 2857 style=" 2858 --flex-direction: column; --flex-wrap: nowrap; --flex-wrap-mobile: wrap; 2859 2860--gap: 12px; 2861 2862--horizontal-alignment: flex-start; --vertical-alignment: center; 2863--vertical-alignment-mobile: center; 2864 2865 --padding-block-start: 0px;--padding-block-end: 0px; 2866 " 2867 data-testid="section-content" 2868 > 2869 2870 2871 2872 </div> 2873 </div> 2874</div> 2875 2876 2877 2878 2879 2880</div><div id="shopify-section-template--20135223820510__divider_widQWc" class="shopify-section"> 2881 2882 2883 2884 2885 2886<div class="section-background color-scheme-1"></div> 2887<div 2888 class="section section--full-width color-scheme-1" 2889 data-testid="divider-template--20135223820510__divider_widQWc" 2890> 2891 <div 2892 class="divider divider-template--20135223820510__divider_widQWc spacing-style" 2893 style=" 2894 --divider-justify-content: center; 2895 --padding-block-start: 16px;--padding-block-end: 16px; 2896 " 2897 2898 2899> 2900 <span 2901 class="divider__line" 2902 style=" 2903 --divider-border-thickness: 0.5px; 2904 2905 --divider-border-rounded: 0; 2906 2907 --divider-flex-basis: 5%; 2908 " 2909 ></span> 2910</div> 2911 2912 2913 2914</div> 2915 2916 2917</div><section id="shopify-section-template--20135223820510__hero_BFAnez" class="shopify-section hero-wrapper section-wrapper"> 2918 2919 2920 2921 2922 2923 2924 2925 2926 2927<div 2928 id="Hero-template--20135223820510__hero_BFAnez" 2929 class="hero color-scheme-5 hero--no-blocks-auto-height" 2930 style=" 2931 --hero-border-style: ; 2932 --hero-border-width: px; 2933 --hero-border-opacity: %; 2934 --blur-opacity: 0.75; 2935 2936 --hero-min-height: var(--section-height-auto); 2937 2938 " 2939 2940 2941> 2942 2943 2944 2945 2946 <div 2947 class="hero__container spacing-style section section--full-width" 2948 style="--padding-block-start: 0px;--padding-block-end: 0px;" 2949 ><div 2950 class="hero__media-wrapper" 2951 style="--hero-media-count: 1;--hero-media-count-mobile: 1;--hero-media-aspect-ratio: 2.768421052631579;" 2952 data-testid="hero-media-wrapper" 2953 > 2954 <div 2955 class="overlay overlay--gradient" 2956 style=" 2957 --overlay-layer: var(--layer-flat); 2958 --overlay-color: #00000026; 2959 --overlay-color--end: rgba(0, 0, 0, 0); 2960 --overlay-direction: to top;" 2961></div> 2962 2963 2964 2965 2966<img src="//five12.org/cdn/shop/files/Screenshot_2025-12-04_at_8.11.12_PM.png?v=1764904426&width=3840" srcset="//five12.org/cdn/shop/files/Screenshot_2025-12-04_at_8.11.12_PM.png?v=1764904426&width=832 832w, //five12.org/cdn/shop/files/Screenshot_2025-12-04_at_8.11.12_PM.png?v=1764904426&width=1200 1200w, //five12.org/cdn/shop/files/Screenshot_2025-12-04_at_8.11.12_PM.png?v=1764904426&width=1600 1600w, //five12.org/cdn/shop/files/Screenshot_2025-12-04_at_8.11.12_PM.png?v=1764904426&width=1920 1920w, //five12.org/cdn/shop/files/Screenshot_2025-12-04_at_8.11.12_PM.png?v=1764904426&width=2560 2560w, //five12.org/cdn/shop/files/Screenshot_2025-12-04_at_8.11.12_PM.png?v=1764904426&width=3840 3840w" width="3156" height="1140" loading="lazy" class="hero__image hero__image--desktop hero__image--mobile" sizes="(min-width: 750px) 100vw, 100vw" fetchpriority="auto" data-testid="hero-desktop-image-1"> 2967 2968 2969 2970 </div> 2971 <div 2972 class=" 2973 hero__content-wrapper 2974 layout-panel-flex 2975 layout-panel-flex--column 2976 mobile-column 2977 section-content-wrapper 2978 full-width 2979 2980 " 2981 style="--flex-direction: column; --flex-wrap: nowrap; --flex-wrap-mobile: wrap; 2982 2983--gap: 16px; 2984 2985--horizontal-alignment: center; --vertical-alignment: center; 2986--vertical-alignment-mobile: center; 2987" 2988 > 2989 2990 </div> 2991 </div> 2992</div> 2993 2994 2995 2996 2997</section><section id="shopify-section-template--20135223820510__hero_rLeDf3" class="shopify-section hero-wrapper section-wrapper"> 2998 2999 3000 3001 3002 3003 3004 3005 3006 3007<div 3008 id="Hero-template--20135223820510__hero_rLeDf3" 3009 class="hero color-scheme-5 hero--no-blocks-auto-height" 3010 style=" 3011 --hero-border-style: ; 3012 --hero-border-width: px; 3013 --hero-border-opacity: %; 3014 --blur-opacity: 0.75; 3015
3016 --hero-min-height: var(--section-height-auto); 3017 3018 " 3019 3020 3021> 3022 3023 3024 3025 3026 <div 3027 class="hero__container spacing-style section section--full-width" 3028 style="--padding-block-start: 0px;--padding-block-end: 0px;" 3029 ><div 3030 class="hero__media-wrapper" 3031 style="--hero-media-count: 1;--hero-media-count-mobile: 1;--hero-media-aspect-ratio: 2.66893039049236;" 3032 data-testid="hero-media-wrapper" 3033 > 3034 3035 3036<img src="//five12.org/cdn/shop/files/Screenshot_2025-12-04_at_8.19.03_PM.png?v=1764904816&width=3840" srcset="//five12.org/cdn/shop/files/Screenshot_2025-12-04_at_8.19.03_PM.png?v=1764904816&width=832 832w, //five12.org/cdn/shop/files/Screenshot_2025-12-04_at_8.19.03_PM.png?v=1764904816&width=1200 1200w, //five12.org/cdn/shop/files/Screenshot_2025-12-04_at_8.19.03_PM.png?v=1764904816&width=1600 1600w, //five12.org/cdn/shop/files/Screenshot_2025-12-04_at_8.19.03_PM.png?v=1764904816&width=1920 1920w, //five12.org/cdn/shop/files/Screenshot_2025-12-04_at_8.19.03_PM.png?v=1764904816&width=2560 2560w, //five12.org/cdn/shop/files/Screenshot_2025-12-04_at_8.19.03_PM.png?v=1764904816&width=3840 3840w" width="3144" height="1178" loading="lazy" class="hero__image hero__image--desktop hero__image--mobile" sizes="(min-width: 750px) 100vw, 100vw" fetchpriority="auto" data-testid="hero-desktop-image-1"> 3037 3038 3039 3040 </div> 3041 <div 3042 class=" 3043 hero__content-wrapper 3044 layout-panel-flex 3045 layout-panel-flex--column 3046 mobile-column 3047 section-content-wrapper 3048 full-width 3049 3050 " 3051 style="--flex-direction: column; --flex-wrap: nowrap; --flex-wrap-mobile: wrap; 3052 3053--gap: 16px; 3054 3055--horizontal-alignment: center; --vertical-alignment: center; 3056--vertical-alignment-mobile: center; 3057" 3058 > 3059 3060 </div> 3061 </div> 3062</div> 3063 3064 3065 3066 3067</section><section id="shopify-section-template--20135223820510__hero_MAgQca" class="shopify-section hero-wrapper section-wrapper"> 3068 3069 3070 3071 3072 3073 3074 3075 3076 3077<div 3078 id="Hero-template--20135223820510__hero_MAgQca" 3079 class="hero color-scheme-5 hero--no-blocks-auto-height" 3080 style=" 3081 --hero-border-style: ; 3082 --hero-border-width: px; 3083 --hero-border-opacity: %; 3084 --blur-opacity: 0.75; 3085 3086 --hero-min-height: var(--section-height-auto); 3087 3088 " 3089 3090 3091> 3092 3093 3094 3095 3096 <div 3097 class="hero__container spacing-style section section--full-width" 3098 style="--padding-block-start: 0px;--padding-block-end: 0px;" 3099 ><div 3100 class="hero__media-wrapper" 3101 style="--hero-media-count: 1;--hero-media-count-mobile: 1;--hero-media-aspect-ratio: 2.802139037433155;" 3102 data-testid="hero-media-wrapper" 3103 > 3104 3105 3106<img src="//five12.org/cdn/shop/files/Screenshot_2025-12-04_at_8.12.40_PM_a28c6b94-a73f-4496-a445-681ea09e76a9.png?v=1764904842&width=3840" srcset="//five12.org/cdn/shop/files/Screenshot_2025-12-04_at_8.12.40_PM_a28c6b94-a73f-4496-a445-681ea09e76a9.png?v=1764904842&width=832 832w, //five12.org/cdn/shop/files/Screenshot_2025-12-04_at_8.12.40_PM_a28c6b94-a73f-4496-a445-681ea09e76a9.png?v=1764904842&width=1200 1200w, //five12.org/cdn/shop/files/Screenshot_2025-12-04_at_8.12.40_PM_a28c6b94-a73f-4496-a445-681ea09e76a9.png?v=1764904842&width=1600 1600w, //five12.org/cdn/shop/files/Screenshot_2025-12-04_at_8.12.40_PM_a28c6b94-a73f-4496-a445-681ea09e76a9.png?v=1764904842&width=1920 1920w, //five12.org/cdn/shop/files/Screenshot_2025-12-04_at_8.12.40_PM_a28c6b94-a73f-4496-a445-681ea09e76a9.png?v=1764904842&width=2560 2560w, //five12.org/cdn/shop/files/Screenshot_2025-12-04_at_8.12.40_PM_a28c6b94-a73f-4496-a445-681ea09e76a9.png?v=1764904842&width=3840 3840w" width="3144" height="1122" loading="lazy" class="hero__image hero__image--desktop hero__image--mobile" sizes="(min-width: 750px) 100vw, 100vw" fetchpriority="auto" data-testid="hero-desktop-image-1"> 3107 3108 3109 3110 </div> 3111 <div 3112 class=" 3113 hero__content-wrapper 3114 layout-panel-flex 3115 layout-panel-flex--column 3116 mobile-column 3117 section-content-wrapper 3118 full-width 3119 3120 " 3121 style="--flex-direction: column; --flex-wrap: nowrap; --flex-wrap-mobile: wrap; 3122 3123--gap: 16px; 3124 3125--horizontal-alignment: center; --vertical-alignment: center; 3126--vertical-alignment-mobile: center; 3127" 3128 > 3129 3130 </div> 3131 </div> 3132</div> 3133 3134 3135 3136 3137</section><section id="shopify-section-template--20135223820510__hero_NwKbiK" class="shopify-section hero-wrapper section-wrapper"> 3138 3139 3140 3141 3142 3143 3144 3145 3146 3147<div 3148 id="Hero-template--20135223820510__hero_NwKbiK" 3149 class="hero color-scheme-5 hero--no-blocks-auto-height" 3150 style=" 3151 --hero-border-style: ; 3152 --hero-border-width: px; 3153 --hero-border-opacity: %; 3154 --blur-opacity: 0.75; 3155
3156 --hero-min-height: var(--section-height-auto); 3157 3158 " 3159 3160 3161> 3162 3163 3164 3165 3166 <div 3167 class="hero__container spacing-style section section--full-width" 3168 style="--padding-block-start: 0px;--padding-block-end: 0px;" 3169 ><div 3170 class="hero__media-wrapper" 3171 style="--hero-media-count: 1;--hero-media-count-mobile: 1;--hero-media-aspect-ratio: 2.593698175787728;" 3172 data-testid="hero-media-wrapper" 3173 > 3174 3175 3176<img src="//five12.org/cdn/shop/files/Screenshot_2025-12-04_at_1.56.41_PM.png?v=1764881829&width=3840" srcset="//five12.org/cdn/shop/files/Screenshot_2025-12-04_at_1.56.41_PM.png?v=1764881829&width=832 832w, //five12.org/cdn/shop/files/Screenshot_2025-12-04_at_1.56.41_PM.png?v=1764881829&width=1200 1200w, //five12.org/cdn/shop/files/Screenshot_2025-12-04_at_1.56.41_PM.png?v=1764881829&width=1600 1600w, //five12.org/cdn/shop/files/Screenshot_2025-12-04_at_1.56.41_PM.png?v=1764881829&width=1920 1920w, //five12.org/cdn/shop/files/Screenshot_2025-12-04_at_1.56.41_PM.png?v=1764881829&width=2560 2560w, //five12.org/cdn/shop/files/Screenshot_2025-12-04_at_1.56.41_PM.png?v=1764881829&width=3840 3840w" width="3128" height="1206" loading="lazy" class="hero__image hero__image--desktop hero__image--mobile" sizes="(min-width: 750px) 100vw, 100vw" fetchpriority="auto" data-testid="hero-desktop-image-1"> 3177 3178 3179 3180 </div> 3181 <div 3182 class=" 3183 hero__content-wrapper 3184 layout-panel-flex 3185 layout-panel-flex--column 3186 mobile-column 3187 section-content-wrapper 3188 page-width 3189 3190 " 3191 style="--flex-direction: column; --flex-wrap: nowrap; --flex-wrap-mobile: wrap; 3192 3193--gap: 16px; 3194 3195--horizontal-alignment: center; --vertical-alignment: center; 3196--vertical-alignment-mobile: center; 3197" 3198 > 3199 3200 </div> 3201 </div> 3202</div> 3203 3204 3205 3206 3207</section><div id="shopify-section-template--20135223820510__1764889740256078db" class="shopify-section section-wrapper"> 3208 3209 3210 3211<div class="section-background color-scheme-1"></div> 3212<div 3213 class="section section--page-width color-scheme-1" 3214 data-testid="ui-test-section" 3215 3216 3217 3218 style=" 3219 3220 3221 3222 " 3223> 3224 <div class="custom-section-background"> 3225 3226 3227 </div> 3228 3229 <div 3230 class="border-style custom-section-content" 3231 style="--border-width: 1px; --border-style: none; --border-color: 3232rgb(var(--color-border-rgb) / 1.0); --border-radius: 32330px; 3234" 3235 > 3236 3237 3238 <div 3239 class=" 3240 spacing-style 3241 layout-panel-flex 3242 layout-panel-flex--column 3243 section-content-wrapper 3244 mobile-column 3245 " 3246 style=" 3247 --flex-direction: column; --flex-wrap: nowrap; --flex-wrap-mobile: wrap; 3248 3249--gap: 12px; 3250 3251--horizontal-alignment: center; --vertical-alignment: center; 3252--vertical-alignment-mobile: center; 3253 3254 --padding-block-start: 0px;--padding-block-end: 0px; 3255 " 3256 data-testid="section-content" 3257 > 3258 3259 3260 3261 </div> 3262 </div> 3263</div> 3264 3265 3266 3267 3268 3269</div><div id="shopify-section-template--20135223820510__section_dCgVRF" class="shopify-section section-wrapper"> 3270 3271 3272 3273<div class="section-background color-scheme-1"></div> 3274<div 3275 class="section section--page-width color-scheme-1" 3276 data-testid="ui-test-section" 3277 3278 3279 3280 style=" 3281 3282 3283 3284 " 3285> 3286 <div class="custom-section-background"> 3287 <div 3288 class="background-image-container" 3289> 3290 3291 3292 <img src="//five12.org/cdn/shop/files/Quote_Section_Five12.avif?v=1764885913&width=3840" alt="" srcset="//five12.org/cdn/shop/files/Quote_Section_Five12.avif?v=1764885913&width=832 832w, //five12.org/cdn/shop/files/Quote_Section_Five12.avif?v=1764885913&width=1200 1200w, //five12.org/cdn/shop/files/Quote_Section_Five12.avif?v=1764885913&width=1600 1600w, //five12.org/cdn/shop/files/Quote_Section_Five12.avif?v=1764885913&width=1920 1920w, //five12.org/cdn/shop/files/Quote_Section_Five12.avif?v=1764885913&width=2560 2560w, //five12.org/cdn/shop/files/Quote_Section_Five12.avif?v=1764885913&width=3840 3840w" width="3840" height="1278" loading="lazy" sizes="100vw" fetchpriority="auto"> 3293</div> 3294 3295 3296 </div> 3297 3298 <div 3299 class="border-style custom-section-content" 3300 style="--border-width: 1px; --border-style: none; --border-color: 3301rgb(var(--color-border-rgb) / 1.0); --border-radius: 33020px; 3303" 3304 > 3305 3306 3307 <div 3308 class=" 3309 spacing-style 3310 layout-panel-flex 3311 layout-panel-flex--row 3312 section-content-wrapper 3313 mobile-column 3314 " 3315 style=" 3316 --flex-direction: row; --flex-wrap: nowrap; --flex-wrap-mobile: wrap; 3317 3318--gap: 16px; 3319 3320--horizontal-alignment: flex-start; --vertical-alignment: flex-start; 3321--vertical-alignment-mobile: flex-start; 3322 3323 --padding-block-start: max(20px, calc(var(--spacing-scale) * 48px));--padding-block-end: max(20px, calc(var(--spacing-scale) * 48px)); 3324 " 3325 data-testid="section-content" 3326 > 3327 3328 3329 3330 3331<div 3332 class=" 3333 group-block 3334 group-block--height-fit 3335 group-block--width-fill 3336 border-style 3337 spacing-style 3338 size-style 3339 3340 3341 " 3342 style=" 3343 --border-width: 1px; --border-style: none; --border-color: 3344rgb(var(--color-border-rgb) / 1.0); --border-radius: 334535px; overflow: hidden; 3346 3347 --padding-block-start: 10px;--padding-block-end: 0px;--padding-inline-start: 0px;--padding-inline-end: 0px; 3348 --size-style-width: 100%;--size-style-height: fit;--size-style-width-mobile: 100%; --size-style-width-mobile-min: 5rem; 3349 3350 " 3351 3352 data-testid="group-block" 3353><div class="group-block__media-wrapper"> 3354 <div 3355 class="background-image-container" 3356> 3357 3358 3359 <img src="//five12.org/cdn/shop/files/Screenshot_2025-12-04_at_3.09.30_PM.png?v=1764886189&width=3840" alt="" srcset="//five12.org/cdn/shop/files/Screenshot_2025-12-04_at_3.09.30_PM.png?v=1764886189&width=832 832w, //five12.org/cdn/shop/files/Screenshot_2025-12-04_at_3.09.30_PM.png?v=1764886189&width=1200 1200w, //five12.org/cdn/shop/files/Screenshot_2025-12-04_at_3.09.30_PM.png?v=1764886189&width=1600 1600w, //five12.org/cdn/shop/files/Screenshot_2025-12-04_at_3.09.30_PM.png?v=1764886189&width=1920 1920w, //five12.org/cdn/shop/files/Screenshot_2025-12-04_at_3.09.30_PM.png?v=1764886189&width=2560 2560w, //five12.org/cdn/shop/files/Screenshot_2025-12-04_at_3.09.30_PM.png?v=1764886189&width=3840 3840w" width="3840" height="3760" loading="lazy" sizes="(min-width: 1920px) 1920px, 100vw" fetchpriority="auto"> 3360</div> 3361 3362 3363 3364 </div> 3365 3366 <div 3367 class=" 3368 group-block-content 3369 3370 layout-panel-flex 3371 layout-panel-flex--column 3372 mobile-column 3373 " 3374 style="--flex-direction: column; --flex-wrap: nowrap; --flex-wrap-mobile: wrap; 3375 3376--gap: 8px; 3377 3378--horizontal-alignment: flex-start; --vertical-alignment: flex-start; 3379--vertical-alignment-mobile: flex-start; 3380" 3381 > 3382 3383 3384 3385 3386 3387 3388 3389 3390 <div 3391 class=" spacing-style text-block text-block--Ab2hSSUpPbHNkZ2VGY__text_eBqKkT h4 3392 text-block--align-center 3393 " 3394 3395 style=" 3396 --padding-block-start: 0px; --padding-block-end:0px; 3397--padding-inline-start:0px; --padding-inline-end:0px; 3398 3399 3400--color: var(--color-foreground); 3401 --width: 100%; 3402 --max-width: var(--max-width--body-normal); 3403 3404 --text-align: center; 3405 3406 3407 " 3408 3409 3410> 3411 <h2>"</h2> 3412 </div> 3413 3414 3415 3416 3417 3418 3419 3420 3421 3422 3423 3424 3425 3426 3427 <rte-formatter 3428 class=" spacing-style text-block text-block--AS3F6MDJ1N3ZGc0dNV__text_8U46P4 rte 3429 text-block--align-center rte 3430 " 3431 3432 style=" 3433 --padding-block-start: 0px; --padding-block-end:0px; 3434--padding-inline-start:0px; --padding-inline-end:0px; 3435 3436 3437 3438 --width: 100%; 3439 --max-width: var(--max-width--body-normal); 3440 3441 --text-align: center; 3442 3443 3444 " 3445 3446 3447> 3448 <p>A small bag of food may seem like a small thing, but it makes all the difference in the world for these students... If students feel good they will be able to learn. If a student can learn... they can escape their circumstances. A small bag of food represents a happy future for these children so thank you for all that you have done. </p><p><strong>Sandy Sharks</strong></p> 3449 </rte-formatter> 3450 3451 3452 3453 3454 3455 3456 3457</div> 3458</div> 3459 3460 3461 3462 3463 3464 3465 3466 3467<div 3468 class=" 3469 group-block 3470 group-block--height-fit 3471 group-block--width-fill 3472 border-style 3473 spacing-style 3474 size-style 3475 3476 3477 " 3478 style=" 3479 --border-width: 1px; --border-style: none; --border-color: 3480rgb(var(--color-border-rgb) / 1.0); --border-radius: 348135px; overflow: hidden; 3482 3483 --padding-block-start: 10px;--padding-block-end: 0px;--padding-inline-start: 0px;--padding-inline-end: 0px; 3484 --size-style-width: 100%;--size-style-height: fit;--size-style-width-mobile: 100%; --size-style-width-mobile-min: 5rem; 3485 3486 " 3487 3488 data-testid="group-block" 3489><div class="group-block__media-wrapper"> 3490 <div 3491 class="background-image-container" 3492> 3493 3494 3495 <img src="//five12.org/cdn/shop/files/Screenshot_2025-12-04_at_3.09.30_PM.png?v=1764886189&width=3840" alt="" srcset="//five12.org/cdn/shop/files/Screenshot_2025-12-04_at_3.09.30_PM.png?v=1764886189&width=832 832w, //five12.org/cdn/shop/files/Screenshot_2025-12-04_at_3.09.30_PM.png?v=1764886189&width=1200 1200w, //five12.org/cdn/shop/files/Screenshot_2025-12-04_at_3.09.30_PM.png?v=1764886189&width=1600 1600w, //five12.org/cdn/shop/files/Screenshot_2025-12-04_at_3.09.30_PM.png?v=1764886189&width=1920 1920w, //five12.org/cdn/shop/files/Screenshot_2025-12-04_at_3.09.30_PM.png?v=1764886189&width=2560 2560w, //five12.org/cdn/shop/files/Screenshot_2025-12-04_at_3.09.30_PM.png?v=1764886189&width=3840 3840w" width="3840" height="3760" loading="lazy" sizes="(min-width: 1920px) 1920px, 100vw" fetchpriority="auto"> 3496</div> 3497 3498 3499 3500 </div> 3501 3502 <div 3503 class=" 3504 group-block-content 3505 3506 layout-panel-flex 3507 layout-panel-flex--column 3508 mobile-column 3509 " 3510 style="--flex-direction: column; --flex-wrap: nowrap; --flex-wrap-mobile: wrap; 3511 3512--gap: 8px; 3513 3514--horizontal-alignment: flex-start; --vertical-alignment: flex-start; 3515--vertical-alignment-mobile: flex-start; 3516" 3517 > 3518 3519 3520 3521 3522 3523 3524 3525 3526 <div 3527 class=" spacing-style text-block text-block--AZVBabndPdjNtOXVxO__text_Yiekhj h4 3528 text-block--align-center 3529 " 3530 3531 style=" 3532 --padding-block-start: 0px; --padding-block-end:0px; 3533--padding-inline-start:0px; --padding-inline-end:0px; 3534 3535 3536--color: var(--color-foreground); 3537 --width: 100%; 3538 --max-width: var(--max-width--body-normal); 3539 3540 --text-align: center; 3541 3542 3543 " 3544 3545 3546> 3547 <h2>"</h2> 3548 </div> 3549 3550 3551 3552 3553 3554 3555 3556 3557 3558 3559 3560 3561 3562 3563 <rte-formatter 3564 class=" spacing-style text-block text-block--AWmIyRGhWNG9IZHFVb__text_fzBH6c rte 3565 text-block--align-center rte 3566 " 3567 3568 style=" 3569 --padding-block-start: 0px; --padding-block-end:0px; 3570--padding-inline-start:0px; --padding-inline-end:0px; 3571 3572 3573 3574 --width: 100%; 3575 --max-width: var(--max-width--body-normal); 3576 3577 --text-align: center; 3578 3579 3580 " 3581 3582 3583> 3584 <p>When my family and I had some financial difficulties my children's school used this program, and benefited from having food sent home every weekend...Now I get work closely with Five.12 and distribute the weekend bags to my own community... <br/>Full circle moment. It is truly inspiring and essential for our community.</p><p><strong>Alyson Madsen</strong></p> 3585 </rte-formatter> 3586 3587 3588 3589 3590 3591 3592 3593</div> 3594</div> 3595 3596 3597 3598 3599 3600 3601 3602 3603<div 3604 class=" 3605 group-block 3606 group-block--height-fit 3607 group-block--width-fill 3608 border-style 3609 spacing-style 3610 size-style 3611 3612 3613 " 3614 style=" 3615 --border-width: 1px; --border-style: none; --border-color: 3616rgb(var(--color-border-rgb) / 1.0); --border-radius: 361735px; overflow: hidden; 3618 3619 --padding-block-start: 10px;--padding-block-end: 0px;--padding-inline-start: 0px;--padding-inline-end: 0px; 3620 --size-style-width: 100%;--size-style-height: fit;--size-style-width-mobile: 100%; --size-style-width-mobile-min: 5rem; 3621 3622 " 3623 3624 data-testid="group-block" 3625><div class="group-block__media-wrapper"> 3626 <div 3627 class="background-image-container" 3628> 3629 3630 3631 <img src="//five12.org/cdn/shop/files/Screenshot_2025-12-04_at_3.09.30_PM.png?v=1764886189&width=3840" alt="" srcset="//five12.org/cdn/shop/files/Screenshot_2025-12-04_at_3.09.30_PM.png?v=1764886189&width=832 832w, //five12.org/cdn/shop/files/Screenshot_2025-12-04_at_3.09.30_PM.png?v=1764886189&width=1200 1200w, //five12.org/cdn/shop/files/Screenshot_2025-12-04_at_3.09.30_PM.png?v=1764886189&width=1600 1600w, //five12.org/cdn/shop/files/Screenshot_2025-12-04_at_3.09.30_PM.png?v=1764886189&width=1920 1920w, //five12.org/cdn/shop/files/Screenshot_2025-12-04_at_3.09.30_PM.png?v=1764886189&width=2560 2560w, //five12.org/cdn/shop/files/Screenshot_2025-12-04_at_3.09.30_PM.png?v=1764886189&width=3840 3840w" width="3840" height="3760" loading="lazy" sizes="(min-width: 1920px) 1920px, 100vw" fetchpriority="auto"> 3632</div> 3633 3634 3635 3636 </div> 3637 3638 <div 3639 class=" 3640 group-block-content 3641 3642 layout-panel-flex 3643 layout-panel-flex--column 3644 mobile-column 3645 " 3646 style="--flex-direction: column; --flex-wrap: nowrap; --flex-wrap-mobile: wrap; 3647 3648--gap: 8px; 3649 3650--horizontal-alignment: flex-start; --vertical-alignment: flex-start; 3651--vertical-alignment-mobile: flex-start; 3652" 3653 > 3654 3655 3656 3657 3658 3659 3660 3661 3662 <div 3663 class=" spacing-style text-block text-block--Ab0xDMVpHenNpRS9DU__text_ymJNLw h4 3664 text-block--align-center 3665 " 3666 3667 style=" 3668 --padding-block-start: 0px; --padding-block-end:0px; 3669--padding-inline-start:0px; --padding-inline-end:0px; 3670 3671 3672--color: var(--color-foreground); 3673 --width: 100%; 3674 --max-width: var(--max-width--body-normal); 3675 3676 --text-align: center; 3677 3678 3679 " 3680 3681 3682> 3683 <h2>"</h2> 3684 </div> 3685 3686 3687 3688 3689 3690 3691 3692 3693 3694 3695 3696 3697 3698 3699 <rte-formatter 3700 class=" spacing-style text-block text-block--AWXpzVDR1bmQwNCt1U__text_qriNM9 rte 3701 text-block--align-center rte 3702 " 3703 3704 style=" 3705 --padding-block-start: 0px; --padding-block-end:0px; 3706--padding-inline-start:0px; --padding-inline-end:0px; 3707 3708 3709 3710 --width: 100%; 3711 --max-width: var(--max-width--body-normal); 3712 3713 --text-align: center; 3714 3715 3716 " 3717 3718 3719> 3720 <p>100% of the students in our title one elementary school receive free breakfast and lunch every day. Food insecurity is significant among our families and sending students with meals for the weekend allows them to stay fed and ready to learn again on Monday morning... I am so grateful to be one of the schools within the Five.12 family.</p><p><strong>East Midvale Elementary</strong></p> 3721 </rte-formatter> 3722 3723 3724 3725 3726 3727 3728 3729</div> 3730</div> 3731 3732 3733 3734 3735 3736 3737 3738 </div> 3739 </div> 3740</div> 3741 3742 3743 3744 3745 3746</div><div id="shopify-section-template--20135223820510__blocks_qMar7K" class="shopify-section section-wrapper"> 3747 3748 3749 3750<div class="section-background color-scheme-1"></div> 3751<div 3752 class="section section--page-width color-scheme-1" 3753 data-testid="ui-test-section" 3754 3755 3756 3757 style=" 3758 3759 3760 3761 " 3762> 3763 <div class="custom-section-background"> 3764 3765 3766 </div> 3767 3768 <div 3769 class="border-style custom-section-content" 3770 style="--border-width: 1px; --border-style: none; --border-color: 3771rgb(var(--color-border-rgb) / 1.0); --border-radius: 37720px; 3773" 3774 > 3775 3776 3777 <div 3778 class=" 3779 spacing-style 3780 layout-panel-flex 3781 layout-panel-flex--column 3782 section-content-wrapper 3783 mobile-column 3784 " 3785 style=" 3786 --flex-direction: column; --flex-wrap: nowrap; --flex-wrap-mobile: wrap; 3787 3788--gap: 12px; 3789 3790--horizontal-alignment: flex-start; --vertical-alignment: center; 3791--vertical-alignment-mobile: center; 3792 3793 --padding-block-start: 0px;--padding-block-end: 0px; 3794 " 3795 data-testid="section-content" 3796 > 3797 3798 3799 3800 </div> 3801 </div> 3802</div> 3803 3804 3805 3806 3807 3808</div><div id="shopify-section-template--20135223820510__divider_bMW6Ki" class="shopify-section"> 3809 3810 3811 3812 3813 3814<div class="section-background color-scheme-1"></div> 3815<div 3816 class="section section--full-width color-scheme-1" 3817 data-testid="divider-template--20135223820510__divider_bMW6Ki" 3818> 3819 <div 3820 class="divider divider-template--20135223820510__divider_bMW6Ki spacing-style" 3821 style=" 3822 --divider-justify-content: center; 3823 --padding-block-start: max(20px, calc(var(--spacing-scale) * 40px));--padding-block-end: max(20px, calc(var(--spacing-scale) * 37px)); 3824 " 3825 3826 3827> 3828 <span 3829 class="divider__line" 3830 style=" 3831 --divider-border-thickness: 0.5px; 3832 3833 --divider-border-rounded: 0; 3834 3835 --divider-flex-basis: 5%; 3836 " 3837 ></span> 3838</div> 3839 3840 3841 3842</div> 3843 3844 3845</div><div id="shopify-section-template--20135223820510__1764892052473d0543" class="shopify-section section-wrapper"> 3846 3847 3848 3849<div class="section-background
3849color-scheme-1"></div> 3850<div 3851 class="section section--page-width color-scheme-1" 3852 data-testid="ui-test-section" 3853 3854 3855 3856 style=" 3857 3858 3859 3860 " 3861> 3862 <div class="custom-section-background"> 3863 3864 3865 </div> 3866 3867 <div 3868 class="border-style custom-section-content" 3869 style="--border-width: 1px; --border-style: none; --border-color: 3870rgb(var(--color-border-rgb) / 1.0); --border-radius: 38710px; 3872" 3873 > 3874 3875 3876 <div 3877 class=" 3878 spacing-style 3879 layout-panel-flex 3880 layout-panel-flex--column 3881 section-content-wrapper 3882 mobile-column 3883 " 3884 style=" 3885 --flex-direction: column; --flex-wrap: nowrap; --flex-wrap-mobile: wrap; 3886 3887--gap: 12px; 3888 3889--horizontal-alignment: center; --vertical-alignment: center; 3890--vertical-alignment-mobile: center; 3891 3892 --padding-block-start: 0px;--padding-block-end: 0px; 3893 " 3894 data-testid="section-content" 3895 > 3896 3897 <div id="shopify-block-ASXlWaldSV1NudzFNd__ai_gen_block_57795aa_hAhVMW" class="shopify-block"> 3898 3899<style data-shopify> 3900 /* â Your exact original styles â unchanged â */ 3901 .ai-featured-product-asxlwaldsv1nudzfndaigenblock57795aahahvmw { 3902 padding: 0px 0; 3903 background-color: #f9f2e2; 3904 } 3905 .ai-featured-product__container-asxlwaldsv1nudzfndaigenblock57795aahahvmw { 3906 max-width: 1200px; 3907 margin: 0 auto; 3908 padding: 0 20px; 3909 } 3910 .ai-featured-product__grid-asxlwaldsv1nudzfndaigenblock57795aahahvmw { 3911 display: grid; 3912 grid-template-columns: 1fr 1fr; 3913 gap: 60px; 3914 align-items: start; 3915 } 3916 .ai-featured-product__media-asxlwaldsv1nudzfndaigenblock57795aahahvmw { position: relative; } 3917 .ai-featured-product__image-asxlwaldsv1nudzfndaigenblock57795aahahvmw { 3918 width: 100%; 3919 height: auto; 3920 display: block; 3921 border-radius: 36px; 3922 } 3923 .ai-featured-product__image-placeholder-asxlwaldsv1nudzfndaigenblock57795aahahvmw { 3924 width: 100%; 3925 aspect-ratio: 1; 3926 background-color: #f4f4f4; 3927 display: flex; 3928 align-items: center; 3929 justify-content: center; 3930 border-radius: 36px; 3931 } 3932 .ai-featured-product__badge-asxlwaldsv1nudzfndaigenblock57795aahahvmw { 3933 position: absolute; 3934 top: 16px; 3935 right: 16px; 3936 background-color: ; 3937 color: ; 3938 padding: 8px 16px; 3939 border-radius: 100px; 3940 font-size: 12px; 3941 font-weight: 600; 3942 text-transform: uppercase; 3943 } 3944 .ai-featured-product__content-asxlwaldsv1nudzfndaigenblock57795aahahvmw { 3945 display: flex; 3946 flex-direction: column; 3947 gap: 20px; 3948 } 3949 .ai-featured-product__title-asxlwaldsv1nudzfndaigenblock57795aahahvmw { 3950 font-size: 32px; 3951 color: #000000; 3952 margin: 0; 3953 line-height: 1.2; 3954 } 3955 .ai-featured-product__description-asxlwaldsv1nudzfndaigenblock57795aahahvmw { 3956 font-size: 16px; 3957 line-height: 1.7; 3958 color: #000000; 3959 } 3960 .ai-featured-product__form-asxlwaldsv1nudzfndaigenblock57795aahahvmw { 3961 display: flex; 3962 flex-direction: column; 3963 gap: 16px; 3964 } 3965 .ai-featured-product__variant-select-asxlwaldsv1nudzfndaigenblock57795aahahvmw { 3966 width: 100%; 3967 padding: 14px 16px; 3968 font-size: 14px; 3969 border: 1px solid #e6e6e6; 3970 border-radius: 8px; 3971 background-color: #ffffff; 3972 color: #000000; 3973 cursor: pointer; 3974 } 3975 .ai-featured-product__variant-select-asxlwaldsv1nudzfndaigenblock57795aahahvmw:hover { 3976 background-color: ; 3977 } 3978 .ai-featured-product__quantity-input-asxlwaldsv1nudzfndaigenblock57795aahahvmw { 3979 width: 80px; 3980 padding: 12px; 3981 text-align: center; 3982 border: 1px solid #e6e6e6; 3983 border-radius: 8px; 3984 background-color: #ffffff; 3985 } 3986 .ai-featured-product__add-to-cart-asxlwaldsv1nudzfndaigenblock57795aahahvmw { 3987 width: 100%; 3988 padding: 16px 32px; 3989 background-color: #8517cc; 3990 color: #ffffff; 3991 border: none; 3992 border-radius: 8px; 3993 font-size: 16px; 3994 font-weight: 600; 3995 cursor: pointer; 3996 transition: background-color 0.3s ease; 3997 } 3998 .ai-featured-product__add-to-cart-asxlwaldsv1nudzfndaigenblock57795aahahvmw:hover { 3999 background-color: #333333; 4000 } 4001 .ai-featured-product__add-to-cart-asxlwaldsv1nudzfndaigenblock57795aahahvmw:disabled { 4002 opacity: 0.5; 4003 cursor: not-allowed; 4004 } 4005 @media (max-width: 768px) { 4006 .ai-featured-product__grid-asxlwaldsv1nudzfndaigenblock57795aahahvmw { 4007 grid-template-columns: 1fr; 4008 } 4009 } 4010</style> 4011 4012<featured-product-asxlwaldsv1nudzfndaigenblock57795aahahvmw class="ai-featured-product-asxlwaldsv1nudzfndaigenblock57795aahahvmw" > 4013 <div class="ai-featured-product__container-asxlwaldsv1nudzfndaigenblock57795aahahvmw"> 4014 4015 4016 4017 <div class="ai-featured-product__grid-asxlwaldsv1nudzfndaigenblock57795aahahvmw"> 4018 4019 <!-- Non-clickable Image --> 4020 <div class="ai-featured-product__media-asxlwaldsv1nudzfndaigenblock57795aahahvmw"> 4021 4022 <img src="//five12.org/cdn/shop/files/Five12ProdImg_c9e76a8d-0a19-4864-9ed5-264e6198cb41.jpg?v=1764895750&width=1000" 4023 alt="Donation to Five.12" 4024 loading="lazy" 4025 class="ai-featured-product__image-asxlwaldsv1nudzfndaigenblock57795aahahvmw"> 4026 4027 </div> 4028 4029 <!-- Content --> 4030 <div class="ai-featured-product__content-asxlwaldsv1nudzfndaigenblock57795aahahvmw"> 4031 <h2 class="ai-featured-product__title-asxlwaldsv1nudzfndaigenblock57795aahahvmw">Donation to Five.12</h2> 4032 4033 <!-- Full description --> 4034 4035 <div class="ai-featured-product__description-asxlwaldsv1nudzfndaigenblock57795aahahvmw"> 4036 <p style="text-align: center;">Elementary school students in the United States are going home from school on Friday and coming back to school hungry on Monday. Five.12 provides weekend backpacks full of food for those students in need.<br>100% of all donated money and time goes to providing for students in need. Period.<br><strong>No overhead.</strong><br><strong>No ulterior motives.</strong><br><strong>No exceptions.</strong></p> 4037 </div> 4038 4039 4040 <!-- FORM â now correctly wraps everything and works --> 4041 <form method="post" action="/cart/add" id="form-{{ ai_gen_id }}" accept-charset="UTF-8" class="ai-featured-product__form-{{ ai_gen_id }}" enctype="multipart/form-data"><input type="hidden" name="form_type" value="product" /><input type="hidden" name="utf8" value="â" /> 4042 4043 <!-- Variant Dropdown (styled exactly like your original) --> 4044 <select name="id" 4045 class="ai-featured-product__variant-select-asxlwaldsv1nudzfndaigenblock57795aahahvmw" 4046 id="variant-select-asxlwaldsv1nudzfndaigenblock57795aahahvmw" 4047 required> 4048 4049 <option value="47729560453342" 4050 selected 4051 4052 data-price="$5.12"> 4053 The Five.12 Spark â $5.12 4054 4055 </option> 4056 4057 <option value="47729560518878" 4058 4059 4060 data-price="$10.00"> 4061 Breakfast Hero â $10.00 4062 4063 </option> 4064 4065 <option value="47729560551646" 4066 4067 4068 data-price="$15.00"> 4069 Lunch Lifeline â $15.00 4070 4071 </option> 4072 4073 <option value="47729560584414" 4074 4075 4076 data-price="$20.00"> 4077 Week of Meals â $20.00 4078 4079 </option> 4080 4081 <option value="47729560617182" 4082 4083 4084 data-price="$25.00"> 4085 Classroom Champion â $25.00 4086 4087 </option> 4088 4089 <option value="47729560649950" 4090 4091 4092 data-price="$50.00"> 4093 Hunger Fighter â $50.00 4094 4095 </option> 4096 4097 <option value="47729560682718" 4098 4099 4100 data-price="$100.00"> 4101 Table Builder â $100.00 4102 4103 </option> 4104 4105 <option value="47729560715486" 4106 4107 4108 data-price="$250.00"> 4109 Hope Multiplier â $250.00 4110 4111 </option> 4112 4113 <option value="47729560748254" 4114 4115 4116 data-price="$500.00"> 4117 Legacy Maker â $500.00 4118 4119 </option> 4120 4121 </select> 4122 4123 <!-- Optional Quantity --> 4124 4125 4126 <!-- Add to Cart Button â fully styled & functional --> 4127 <div class="ai-featured-product__buttons-asxlwaldsv1nudzfndaigenblock57795aahahvmw"> 4128 <button type="submit" 4129 name="add" 4130 class="ai-featured-product__add-to-cart-asxlwaldsv1nudzfndaigenblock57795aahahvmw" 4131 > 4132 Donate Now 4133 </button> 4134 4135 4136 </div> 4137 <input type="hidden" name="product-id" value="9069956858078" /><input type="hidden" name="section-id" value="template--20135223820510__1764892052473d0543" /></form> 4138 </div> 4139 </div> 4140 4141 4142 </div> 4143</featured-product-asxlwaldsv1nudzfndaigenblock57795aahahvmw> 4144
4145<!-- Tiny JS to update button state (optional but nice) -->
4146<script> 4147 document.addEventListener('DOMContentLoaded', () => { 4148 const select = document.getElementById('variant-select-asxlwaldsv1nudzfndaigenblock57795aahahvmw'); 4149 const button = document.querySelector('.ai-featured-product__add-to-cart-asxlwaldsv1nudzfndaigenblock57795aahahvmw'); 4150 if (!select || !button) return; 4151 4152 const originalText = button.textContent.trim(); 4153 4154 select.addEventListener('change', () => { 4155 const selected = select.options[select.selectedIndex]; 4156 button.disabled = selected.disabled; 4157 button.textContent = selected.disabled ? 'Sold Out' : originalText; 4158 }); 4159 }); 4160</script>
4160 4161 4162</div> 4163 4164 4165 4166<style data-shopify> 4167 .ai-contact-section-aemlndnhgz2jqclevbaigenblock5846a67prknyw { 4168 padding: 60px 0 60px; 4169 background-color: #f9f2e2; 4170 } 4171 4172 .ai-contact-container-aemlndnhgz2jqclevbaigenblock5846a67prknyw { 4173 max-width: 1200px; 4174 margin: 0 auto; 4175 padding: 0 20px; 4176 } 4177 4178 .ai-contact-grid-aemlndnhgz2jqclevbaigenblock5846a67prknyw { 4179 display: grid; 4180 grid-template-columns: 1fr 1fr; 4181 gap: 60px; 4182 align-items: center; 4183 } 4184 4185 .ai-contact-image-wrapper-aemlndnhgz2jqclevbaigenblock5846a67prknyw { 4186 width: 100%; 4187 height: auto; 4188 } 4189 4190 .ai-contact-image-aemlndnhgz2jqclevbaigenblock5846a67prknyw { 4191 width: 100%; 4192 height: auto; 4193 display: block; 4194 border-radius: 8px; 4195 } 4196 4197 .ai-contact-image-placeholder-aemlndnhgz2jqclevbaigenblock5846a67prknyw { 4198 width: 100%; 4199 aspect-ratio: 4 / 3; 4200 background-color: #f4f4f4; 4201 display: flex; 4202 align-items: center; 4203 justify-content: center; 4204 border-radius: 8px; 4205 position: relative; 4206 } 4207 4208 .ai-contact-image-placeholder-aemlndnhgz2jqclevbaigenblock5846a67prknyw svg { 4209 width: 100%; 4210 height: 100%; 4211 max-width: 300px; 4212 max-height: 300px; 4213 } 4214 4215 .ai-contact-empty-state-aemlndnhgz2jqclevbaigenblock5846a67prknyw { 4216 position: absolute; 4217 bottom: 20px; 4218 left: 50%; 4219 transform: translateX(-50%); 4220 padding: 12px 20px; 4221 font-size: 14px; 4222 color: #666; 4223 text-align: center; 4224 pointer-events: none; 4225 } 4226 4227 .ai-contact-form-wrapper-aemlndnhgz2jqclevbaigenblock5846a67prknyw { 4228 width: 100%; 4229 } 4230 4231 .ai-contact-heading-aemlndnhgz2jqclevbaigenblock5846a67prknyw { 4232 margin: 0 0 12px; 4233 color: #000000; 4234 font-size: 32px; 4235 } 4236 4237 .ai-contact-subheading-aemlndnhgz2jqclevbaigenblock5846a67prknyw { 4238 margin: 0 0 32px; 4239 color: #000000; 4240 font-size: 16px; 4241 opacity: 0.8; 4242 } 4243 4244 .ai-contact-form-content-aemlndnhgz2jqclevbaigenblock5846a67prknyw { 4245 display: flex; 4246 flex-direction: column; 4247 gap: 20px; 4248 } 4249 4250 .ai-contact-form-row-aemlndnhgz2jqclevbaigenblock5846a67prknyw { 4251 display: grid; 4252 grid-template-columns: 1fr 1fr; 4253 gap: 16px; 4254 } 4255 4256 .ai-contact-form-group-aemlndnhgz2jqclevbaigenblock5846a67prknyw { 4257 display: flex; 4258 flex-direction: column; 4259 gap: 8px; 4260 } 4261 4262 .ai-contact-label-aemlndnhgz2jqclevbaigenblock5846a67prknyw { 4263 font-size: 14px; 4264 font-weight: 500; 4265 color: #000000; 4266 } 4267 4268 .ai-contact-input-aemlndnhgz2jqclevbaigenblock5846a67prknyw, 4269 .ai-contact-textarea-aemlndnhgz2jqclevbaigenblock5846a67prknyw { 4270 width: 100%; 4271 padding: 12px 16px; 4272 border: 1px solid #e6e6e6; 4273 border-radius: 4px; 4274 background-color: #ffffff; 4275 color: #000000; 4276 font-size: 14px; 4277 font-family: inherit; 4278 transition: border-color 0.2s ease, background-color 0.2s ease; 4279 } 4280 4281 .ai-contact-input-aemlndnhgz2jqclevbaigenblock5846a67prknyw:hover, 4282 .ai-contact-textarea-aemlndnhgz2jqclevbaigenblock5846a67prknyw:hover { 4283 background-color: #f5f5f5; 4284 } 4285 4286 .ai-contact-input-aemlndnhgz2jqclevbaigenblock5846a67prknyw:focus, 4287 .ai-contact-textarea-aemlndnhgz2jqclevbaigenblock5846a67prknyw:focus { 4288 outline: none; 4289 border-color: #000000; 4290 } 4291 4292 .ai-contact-textarea-aemlndnhgz2jqclevbaigenblock5846a67prknyw { 4293 min-height: 120px; 4294 resize: vertical; 4295 } 4296 4297 .ai-contact-button-aemlndnhgz2jqclevbaigenblock5846a67prknyw { 4298 padding: 14px 32px; 4299 background-color: #8517cc; 4300 color: #ffffff; 4301 border: none; 4302 border-radius: 14px; 4303 font-size: 16px; 4304 font-weight: 500; 4305 cursor: pointer; 4306 transition: background-color 0.3s ease; 4307 width: fit-content; 4308 } 4309 4310 .ai-contact-button-aemlndnhgz2jqclevbaigenblock5846a67prknyw:hover { 4311 background-color: #6b12a3; 4312 } 4313 4314 .ai-contact-success-aemlndnhgz2jqclevbaigenblock5846a67prknyw { 4315 padding: 16px; 4316 background-color: #d4edda; 4317 color: #155724; 4318 border-radius: 4px; 4319 font-size: 14px; 4320 } 4321 4322 .ai-contact-error-aemlndnhgz2jqclevbaigenblock5846a67prknyw { 4323 padding: 16px; 4324 background-color: #f8d7da; 4325 color: #721c24; 4326 border-radius: 4px; 4327 font-size: 14px; 4328 } 4329 4330 @media screen and (max-width: 768px) {
4331 .ai-contact-grid-aemlndnhgz2jqclevbaigenblock5846a67prknyw { 4332 grid-template-columns: 1fr; 4333 gap: 40px; 4334 } 4335 4336 .ai-contact-form-row-aemlndnhgz2jqclevbaigenblock5846a67prknyw { 4337 grid-template-columns: 1fr; 4338 } 4339 4340 .ai-contact-heading-aemlndnhgz2jqclevbaigenblock5846a67prknyw { 4341 font-size: 25.6px; 4342 } 4343 4344 .ai-contact-subheading-aemlndnhgz2jqclevbaigenblock5846a67prknyw { 4345 font-size: 14.4px; 4346 } 4347 } 4348</style> 4349 4350<div class="ai-contact-section-aemlndnhgz2jqclevbaigenblock5846a67prknyw" > 4351 <div class="ai-contact-container-aemlndnhgz2jqclevbaigenblock5846a67prknyw"> 4352 <div class="ai-contact-grid-aemlndnhgz2jqclevbaigenblock5846a67prknyw"> 4353 <div class="ai-contact-image-wrapper-aemlndnhgz2jqclevbaigenblock5846a67prknyw"> 4354 4355 <img 4356 src="//five12.org/cdn/shop/files/Screenshot_2025-12-04_at_4.38.52_PM.png?v=1764894211&width=1000" 4357 alt="" 4358 loading="lazy" 4359 width="1498" 4360 height="1372" 4361 class="ai-contact-image-aemlndnhgz2jqclevbaigenblock5846a67prknyw" 4362 > 4363 4364 </div> 4365 4366 <div class="ai-contact-form-wrapper-aemlndnhgz2jqclevbaigenblock5846a67prknyw"> 4367 4368 <h2 class="ai-contact-heading-aemlndnhgz2jqclevbaigenblock5846a67prknyw">Contact us</h2> 4369 4370 4371 4372<form method="post" action="/contact#contact_form" id="contact_form" accept-charset="UTF-8" class="contact-form"><input type="hidden" name="form_type" value="contact" /><input type="hidden" name="utf8" value="â" /><div class="ai-contact-form-content-aemlndnhgz2jqclevbaigenblock5846a67prknyw"><div class="ai-contact-form-row-aemlndnhgz2jqclevbaigenblock5846a67prknyw"> 4373 <div class="ai-contact-form-group-aemlndnhgz2jqclevbaigenblock5846a67prknyw"> 4374 <label for="ai-contact-first-name-aemlndnhgz2jqclevbaigenblock5846a67prknyw" class="ai-contact-label-aemlndnhgz2jqclevbaigenblock5846a67prknyw"> 4375 First name 4376 </label> 4377 <input 4378 type="text" 4379 id="ai-contact-first-name-aemlndnhgz2jqclevbaigenblock5846a67prknyw" 4380 name="contact[first_name]" 4381 class="ai-contact-input-aemlndnhgz2jqclevbaigenblock5846a67prknyw" 4382 autocomplete="given-name" 4383 4384 required 4385 > 4386 </div> 4387 4388 <div class="ai-contact-form-group-aemlndnhgz2jqclevbaigenblock5846a67prknyw"> 4389 <label for="ai-contact-last-name-aemlndnhgz2jqclevbaigenblock5846a67prknyw" class="ai-contact-label-aemlndnhgz2jqclevbaigenblock5846a67prknyw"> 4390 Last name 4391 </label> 4392 <input 4393 type="text" 4394 id="ai-contact-last-name-aemlndnhgz2jqclevbaigenblock5846a67prknyw" 4395 name="contact[last_name]" 4396 class="ai-contact-input-aemlndnhgz2jqclevbaigenblock5846a67prknyw" 4397 autocomplete="family-name" 4398 4399 required 4400 > 4401 </div> 4402 </div> 4403 4404 <div class="ai-contact-form-group-aemlndnhgz2jqclevbaigenblock5846a67prknyw"> 4405 <label for="ai-contact-phone-aemlndnhgz2jqclevbaigenblock5846a67prknyw" class="ai-contact-label-aemlndnhgz2jqclevbaigenblock5846a67prknyw"> 4406 Phone 4407 </label> 4408 <input 4409 type="tel" 4410 id="ai-contact-phone-aemlndnhgz2jqclevbaigenblock5846a67prknyw" 4411 name="contact[phone]" 4412 class="ai-contact-input-aemlndnhgz2jqclevbaigenblock5846a67prknyw" 4413 autocomplete="tel" 4414 4415 > 4416 </div> 4417 4418 <div class="ai-contact-form-group-aemlndnhgz2jqclevbaigenblock5846a67prknyw"> 4419 <label for="ai-contact-email-aemlndnhgz2jqclevbaigenblock5846a67prknyw" class="ai-contact-label-aemlndnhgz2jqclevbaigenblock5846a67prknyw"> 4420 Email 4421 </label> 4422 <input 4423 type="email"
4424 id="ai-contact-email-aemlndnhgz2jqclevbaigenblock5846a67prknyw" 4425 name="contact[email]" 4426 class="ai-contact-input-aemlndnhgz2jqclevbaigenblock5846a67prknyw" 4427 autocomplete="email" 4428 autocorrect="off" 4429 autocapitalize="off" 4430 4431 4432 required 4433 > 4434 </div> 4435 4436 <div class="ai-contact-form-group-aemlndnhgz2jqclevbaigenblock5846a67prknyw"> 4437 <label for="ai-contact-message-aemlndnhgz2jqclevbaigenblock5846a67prknyw" class="ai-contact-label-aemlndnhgz2jqclevbaigenblock5846a67prknyw"> 4438 Message 4439 </label> 4440 <textarea 4441 id="ai-contact-message-aemlndnhgz2jqclevbaigenblock5846a67prknyw" 4442 name="contact[body]" 4443 class="ai-contact-textarea-aemlndnhgz2jqclevbaigenblock5846a67prknyw" 4444 4445 required 4446 ></textarea> 4447 </div> 4448 4449 <button type="submit" class="ai-contact-button-aemlndnhgz2jqclevbaigenblock5846a67prknyw"> 4450 Send message 4451 </button> 4452 </div></form></div> 4453 </div> 4454 </div> 4455</div> 4456 4457 4458 4459 4460 </div> 4461 </div> 4462</div> 4463 4464 4465 4466 4467 4468</div> 4469 </main> 4470 4471 <!-- BEGIN sections: footer-group --> 4472<footer id="shopify-section-sections--20135224246494__footer_m9NzUG" class="shopify-section shopify-section-group-footer-group section-wrapper"> 4473 4474<div class="section-background color-scheme-1"></div> 4475<div 4476 class="section section--page-width color-scheme-1" 4477> 4478 4479 <div 4480 class=" 4481 footer-content 4482 spacing-style 4483 4484 4485 " 4486 style=" 4487 --padding-block-start: max(20px, calc(var(--spacing-scale) * 30px));--padding-block-end: max(20px, calc(var(--spacing-scale) * 30px)); 4488 --footer-gap: 20px; 4489 --grid-columns: 1; 4490 --last-row-count: 1; 4491 --tablet-last-row-count: 1; 4492 " 4493 > 4494 4495 4496 4497<div 4498 class=" 4499 group-block 4500 group-block--height-fit 4501 group-block--width-fill 4502 border-style 4503 spacing-style 4504 size-style 4505 4506 4507 " 4508 style=" 4509 --border-width: 1px; --border-style: none; --border-color: 4510rgb(var(--color-border-rgb) / 1.0); --border-radius: 45110px; 4512 4513 --padding-block-start: 0px;--padding-block-end: 0px;--padding-inline-start: 0px;--padding-inline-end: 0px; 4514 --size-style-width: 100%;--size-style-height: fit;--size-style-width-mobile: 100%; --size-style-width-mobile-min: 5rem; 4515 4516 " 4517 4518 data-testid="group-block" 4519><div class="group-block__media-wrapper"> 4520 4521 4522 4523 </div> 4524 4525 <div 4526 class=" 4527 group-block-content 4528 4529 layout-panel-flex 4530 layout-panel-flex--column 4531 mobile-column 4532 " 4533 style="--flex-direction: column; --flex-wrap: nowrap; --flex-wrap-mobile: wrap; 4534 4535--gap: 6px; 4536 4537--horizontal-alignment: flex-start; --vertical-alignment: center; 4538--vertical-alignment-mobile: center; 4539" 4540 > 4541 4542</div> 4543</div> 4544 4545 4546 4547 4548 4549 4550 </div> 4551</div> 4552 4553 4554 4555 4556</footer><div id="shopify-section-sections--20135224246494__footer_utilities_jLGE8U" class="shopify-section shopify-section-group-footer-group footer-utilities"> 4557 4558<div class="section-background color-scheme-1"></div> 4559<div 4560 class="section section--page-width color-scheme-1" 4561 4562> 4563 <div 4564 class="utilities spacing-style" 4565 style="--padding-block-start: 20px;--padding-block-end: max(20px, calc(var(--spacing-scale) * 48px)); --border-width: 0px; --gap: 24px;" 4566 data-testid="footer-utilities" 4567 > 4568 4569 4570<div 4571 class=" 4572 footer-utilities__group-copyright 4573 custom-typography 4574 footer-utilities__text 4575 custom-font-size 4576 " 4577 style=" 4578--color: ;--font-size: 0.75rem; --font-weight: ;--font-family: ; --text-transform: none; --text-wrap: ; --line-height: var(--line-height--body-); --letter-spacing: var(--letter-spacing--body-);" 4579 4580> 4581 <span class="footer-utilities__text"> 4582 © 2026 4583 <a href="/" title="">Five.12 Foundation</a>- Founded in 2013. Five.12 Foundation is a 501(c)3 organization</span> 4584</div> 4585 4586 4587 4588 4589 <anchored-popover-component 4590 class="footer-utilities__policy-list footer-utilities__text" 4591 data-hover-triggered="true" 4592 > 4593 <button 4594 class="policy-list-trigger button-unstyled"
4595 popovertarget="terms-policies-popover" 4596 popovertargetaction="toggle" 4597 ref="trigger" 4598 style=" 4599--color: ;--font-size: 0.75rem; --font-weight: ;--font-family: ; --text-transform: none; --text-wrap: ; --line-height: var(--line-height--body-); --letter-spacing: var(--letter-spacing--body-);" 4600 4601 > 4602 Terms and Policies 4603 </button> 4604 <div 4605 class="terms-policies-popover color-scheme-1" 4606 id="terms-policies-popover" 4607 popover="auto" 4608 ref="popover" 4609 > 4610 <ul 4611 class=" 4612 policy_list list-unstyled 4613 custom-typography 4614 custom-font-size 4615 " 4616 ><li> 4617 <a 4618 href="/policies/privacy-policy" 4619 class="footer-utilities__text" 4620 >Privacy policy</a> 4621 </li></ul> 4622 </div> 4623 </anchored-popover-component> 4624 4625 4626 4627 4628 4629 4630 4631<div 4632 class="social-icons__wrapper footer-utilities__icons" 4633 4634> 4635 4636 4637 4638 4639 4640 4641 4642 4643 4644 4645 4646 4647 4648 4649 4650 4651 4652 4653 4654 4655 4656 4657 4658 4659 4660 4661 4662 4663 4664 4665 4666 4667 4668 4669 4670 4671 4672 4673 4674 4675 4676 4677 4678 4679 4680 4681 4682 4683 4684 4685 4686 4687 4688 4689 4690 4691 4692 4693 4694 4695 4696 4697 4698 4699 4700 4701 4702 4703 4704 4705 4706 4707 4708 4709 4710 4711 4712 4713</div> 4714 4715 4716 4717 4718 4719 </div> 4720</div> 4721 4722 4723 4724 4725</div> 4726<!-- END sections: footer-group --> 4727 4728
4728<script 4729 src="//five12.org/cdn/shop/t/1/assets/dialog.js?v=122984339961420548111764799996" 4730 type="module" 4731></script>
4731 4732 4733<dialog-component 4734 id="search-modal" 4735 class="search-modal" 4736 4737> 4738 <dialog 4739 ref="dialog" 4740 on:click="/closeDialogOnClickOutside" 4741 on:keydown="/closeDialogOnEscapePress" 4742 class="search-modal__content dialog-modal" 4743 scroll-lock 4744 aria-labelledby="search-modal-heading" 4745 > 4746 <h2 4747 id="search-modal-heading" 4748 class="visually-hidden" 4749 > 4750 Search 4751 </h2> 4752
4752<script 4753 src="//five12.org/cdn/shop/t/1/assets/predictive-search.js?v=53445493388242646041764799996" 4754 type="module" 4755 fetchpriority="low" 4756></script>
4756 4757 4758<predictive-search-component 4759 class="predictive-search color-scheme-1" 4760 style="--product-corner-radius: 0px; --card-corner-radius: 4px;" 4761 data-section-id="predictive-search" 4762 data-testid="search-component--modal" 4763 role="search" 4764 aria-label="Search" 4765> 4766 <form 4767 action="/search" 4768 method="get" 4769 role="search" 4770 class="predictive-search-form" 4771 ref="form" 4772 on:keydown="/onSearchKeyDown" 4773 > 4774 <div 4775 class="predictive-search-form__header" 4776 > 4777 <div class="predictive-search-form__header-inner"> 4778 <label 4779 for="cmdk-input" 4780 class="visually-hidden" 4781 >Search</label> 4782 <input 4783 class="search-input" 4784 id="cmdk-input" 4785 type="search" 4786 name="q" 4787 role="combobox" 4788 aria-expanded="false" 4789 aria-owns="predictive-search-results" 4790 aria-controls="predictive-search-results" 4791 aria-haspopup="listbox" 4792 aria-autocomplete="list" 4793 autocomplete="off" 4794 placeholder="Search" 4795 ref="searchInput" 4796 on:input="/search" 4797 on:keydown="/onSearchKeyDown" 4798 > 4799 <input 4800 name="options[prefix]" 4801 type="hidden" 4802 value="last" 4803 > 4804 <span class="svg-wrapper predictive-search__icon"> 4805 <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 20 20" fill="none"><circle cx="9" cy="9" r="4.75" stroke="currentColor" stroke-width="var(--icon-stroke-width)"/><path stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="var(--icon-stroke-width)" d="m12.5 12.5 3.25 3.25"/></svg> 4806 4807 </span> 4808 <button 4809 type="button" 4810 class="button-unstyled predictive-search__reset-button" 4811 ref="resetButton" 4812 hidden 4813 on:click="/resetSearch" 4814 > 4815 Clear 4816 </button> 4817 </div> 4818 <button 4819 type="button" 4820 class="button predictive-search__close-modal-button" 4821 aria-label="Close dialog" 4822 on:click="dialog-component/closeDialog" 4823 ref="closeModalButton" 4824 > 4825 <span class="svg-wrapper"> 4826 <svg width="14" height="14" viewBox="0 0 14 14" fill="none" xmlns="http://www.w3.org/2000/svg"> 4827 <path d="M12 2L2 12" stroke="currentColor" stroke-width="var(--icon-stroke-width)" stroke-linecap="round" stroke-linejoin="round"/> 4828 <path d="M12 12L2 2" stroke="currentColor" stroke-width="var(--icon-stroke-width)" stroke-linecap="round" stroke-linejoin="round"/> 4829</svg> 4830 4831 </span> 4832 </button> 4833 </div> 4834 4835 <div class="predictive-search-form__content-wrapper"> 4836 <div 4837 class="predictive-search-form__content" 4838 tabindex="-1" 4839 ref="predictiveSearchResults" 4840 on:click="/handleModalClick" 4841 > 4842 4843 4844<div 4845 id="predictive-search-results" 4846 class="predictive-search-dropdown" 4847 role="listbox" 4848 aria-expanded="true" 4849 style="--color-shadow: rgb(var(--color-foreground-rgb) / 0.1);" 4850> 4851 4852</div> 4853 4854 </div> 4855 4856 <div class="predictive-search-form__footer"> 4857 <button 4858 class="button button-primary predictive-search__search-button" 4859 ref="viewAllButton" 4860 > 4861 View all 4862 </button> 4863 </div> 4864 </div> 4865 </form> 4866</predictive-search-component> 4867 4868 4869 4870 </dialog> 4871</dialog-component> 4872 4873 4874 4875 4876 4877 <quick-add-dialog id="quick-add-dialog"> 4878 <dialog 4879 class="quick-add-modal dialog-modal color-scheme-1" 4880 ref="dialog" 4881 scroll-lock 4882 > 4883 <button 4884 ref="closeButton" 4885 on:click="/closeDialog" 4886 class="button button-unstyled close-button quick-add-modal__close" 4887 aria-label="Close dialog" 4888 ><svg width="14" height="14" viewBox="0 0 14 14" fill="none" xmlns="http://www.w3.org/2000/svg"> 4889 <path d="M12 2L2 12" stroke="currentColor" stroke-width="var(--icon-stroke-width)" stroke-linecap="round" stroke-linejoin="round"/> 4890 <path d="M12 12L2 2" stroke="currentColor" stroke-width="var(--icon-stroke-width)" stroke-linecap="round" stroke-linejoin="round"/> 4891</svg> 4892</button> 4893 <div 4894 id="quick-add-modal-content" 4895 class="quick-add-modal__content" 4896 ></div> 4897 </dialog> 4898</quick-add-dialog> 4899 4900 4901 4902 4903 <div id="shopify-block-ASVEwS2NGdjJHeGllR__4430426176203950762" class="shopify-block shopify-app-block">
4903<script> 4904 4905 4906 window.kaktusAppData = { 4907 customerId: null, 4908 customerTags: ''.split(',') || [] 4909 } 4910</script>
vendor: 1 bytes, line 4910
4910
4911<script async src="https://noti.bestfreecdn.com/storage/js/noti-77130858718.js?ver=1791155868&shop=77130858718"></script>
4911 4912 4913</div>
4913<script src="https://cdn.shopify.com/storefront/standard-actions.js" type="module" data-source-attribution="shopify.standard_actions"></script>
4913 4914</body> 4915</html>
Line numbers count LF bytes from the start of the resource, as the search results do. Vendor segments are library code the classifier recognised; they are stored but not indexed. Bytes are shown as Latin1 characters, one per byte.