diff --git a/css/styles.css b/css/styles.css new file mode 100644 index 0000000..e74f91d --- /dev/null +++ b/css/styles.css @@ -0,0 +1,98 @@ +/* Base */ +html { scroll-behavior: smooth; } +body { line-height: 1.6; } + +/* Accessibility */ +.skip-link { + position: absolute; + left: -999px; + top: 0; + background: #000; + color: #fff; + padding: 8px 12px; + z-index: 1000; +} +.skip-link:focus { left: 8px; } + +/* Branding */ +.logo { height: 48px; width: auto; } + +/* Hero */ +.hero { + position: relative; + min-height: 70vh; + color: #fff; + background-image: url('../img/Hero.png'); + background-size: cover; + background-position: center; +} +.hero__overlay { + position: absolute; + inset: 0; + background: linear-gradient(180deg, rgba(0,0,0,0.45), rgba(0,0,0,0.55)); +} +.hero .container { position: relative; z-index: 1; } + +/* Parallax spacer */ +.parallax-bg { + background-image: url('../img/parallax_bg.png'); + background-attachment: fixed; + background-position: center center; + background-repeat: no-repeat; + background-size: cover; /* scale to full width while covering height */ +} +.parallax-header { min-height: 72px; } +.parallax-footer { min-height: 200px; } +.spacer { height: 200px; } + +/* Footer */ +.footer-bg { background-color: rgba(9,10,46,0.0); position: relative; } + +/* Header & Footer overlays for contrast */ +.parallax-header::before, +.parallax-footer::before { + content: ""; + position: absolute; + inset: 0; + background: rgba(0,0,0,0.5); /* stronger for readability */ + pointer-events: none; +} +.parallax-header, .parallax-footer { position: relative; } +.parallax-header .navbar-brand, .parallax-header #navbarNav { position: relative; z-index: 1; } + +/* Muted background for text sections */ +.bg-soft { background-color: #f2f4f8; } + +/* Nav link button style (semi-transparent white) */ +.btn-nav { + color: #0d1b2a !important; + background: rgba(255,255,255,0.85); + border: 1px solid rgba(255,255,255,0.9); + border-radius: 999px; + padding: 6px 14px; + transition: background .2s ease, color .2s ease, box-shadow .2s ease; +} +.home-link { color: #fff !important; opacity: 0.9; } +.home-link:hover, .home-link:focus { color: #fff !important; opacity: 1; text-decoration: underline; } +.navbar-nav { gap: 8px; } +.navbar-nav .nav-item + .nav-item { margin-left: 8px; } +.btn-nav:hover, .btn-nav:focus { + color: #000 !important; + background: #ffffff; + box-shadow: 0 0.25rem 0.75rem rgba(0,0,0,0.15); + text-decoration: none; +} +.navbar-dark .navbar-toggler { + border-color: rgba(255,255,255,0.6); +} +.navbar-dark .navbar-toggler-icon { + background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 30'%3e%3cpath stroke='rgba(255, 255, 255, 0.9)' stroke-linecap='round' stroke-miterlimit='10' stroke-width='2' d='M4 7h22M4 15h22M4 23h22'/%3e%3c/svg%3e"); +} + +/* Responsive tweaks */ +@media (max-width: 767.98px) { + .hero { min-height: 60vh; } + .logo { height: 40px; } + /* Disable fixed background on mobile for performance */ + .parallax-bg { background-attachment: scroll; } +} diff --git a/img/Hero.png b/img/Hero.png index 7120e6b..6c9e2b2 100644 Binary files a/img/Hero.png and b/img/Hero.png differ diff --git a/img/Logo_DALLE.png b/img/Logo_DALLE.png deleted file mode 100644 index 7d9867d..0000000 Binary files a/img/Logo_DALLE.png and /dev/null differ diff --git a/img/Logo_w_text.png b/img/Logo_w_text.png new file mode 100644 index 0000000..962a06a Binary files /dev/null and b/img/Logo_w_text.png differ diff --git a/img/parallax_bg.png b/img/parallax_bg.png new file mode 100644 index 0000000..09a5bef Binary files /dev/null and b/img/parallax_bg.png differ diff --git a/img/parallaxbg_catspencilscomputers.webp b/img/parallaxbg_catspencilscomputers.webp deleted file mode 100644 index c74b8b7..0000000 Binary files a/img/parallaxbg_catspencilscomputers.webp and /dev/null differ diff --git a/index.html b/index.html index 14166f9..de11ce2 100644 --- a/index.html +++ b/index.html @@ -2,182 +2,223 @@ - + Such Software LLC - - - - + + + + + + + + + + + + + + + + + + + + + - + + + -
- - + - -
-
-

Such Software LLC

-
-
+
+ +
+
+
+

Sell your art online.
No upfront costs.

+

We design, host, and run your storefront.
You pay only when you sell.

+
+ Get your free site + See how it works +
+
+
- -
-
-
-
-

Welcome to Such Software

-

Your partner in art and technology.

+ + + + +
+
+
+
+

Services

+

Everything you need to sell originals, prints, merch, and digital work.

+
-
-
-
-
-
-
-
-

-
-
-
-
-
-
-
-
-

About Us

-

- At Such Software, we are committed to bridging the gap between art and technology. - Our journey began with a vision to empower artists in the digital era, offering them unique platforms to showcase and sell their creations. - As a technology-driven company, we specialize in designing and hosting bespoke websites tailored to the needs of artists. - Our team, a blend of tech enthusiasts and art aficionados, understands the nuances of the art world and the digital landscape. -

-

- We believe in nurturing creativity by providing artists with state-of-the-art digital tools, freeing them to focus on what they do best: creating mesmerizing art. - Our commitment extends beyond just offering services; we aim to be partners in the artistic journey of each of our clients, fostering a community where art and technology coexist in harmony. -

-
-
-
-
-
-
-
-
-

-
-
-
-
-
-
-
-
-

Our Services

-

- Such Software offers a comprehensive suite of services designed specifically for artists looking to make their mark in the digital world. - We provide expert website design services, creating visually stunning and user-friendly sites that reflect each artist's unique style and brand. - Our hosting solutions are not only reliable but also free, removing financial barriers and making it easier for artists to maintain an online presence. -

-

- We cater to a diverse range of artistic needs, supporting the sale of original artworks, merchandise through drop shipping, and digital collectibles. - Understanding the importance of seamless transactions, we integrate multiple payment options including credit cards, PayPal, and various cryptocurrencies. - Our business model is artist-friendly, as we only take a commission on sales, ensuring that artists reap the maximum benefits from their work. - At Such Software, we don’t just offer services; we provide a platform for artists to thrive in the digital age. -

-
-
-
-
-
-
-
-
-

Contact Us

-
-
- - Telegram - +
+
+
+
+

Custom artist sites

+
    +
  • Branded storefront, your style
    • +
  • Mobile-first, fast, accessible
    • +
+
-
- - Twitter - +
+
+
+
+

Hosting included

+
    +
  • Secure, reliable hosting
    • +
  • No monthly fees
    • +
+
-
- - Email - +
+
+
+
+

Sales & fulfillment

+
    +
  • Originals, prints, and merch
    • +
  • Dropshipping supported
    • +
+
+
+
+
+
+
+

Payments & digital

+
    +
  • Cards, PayPal, and crypto
    • +
  • Optional digital collectibles
    • +
+
-
-
-
+ - -
-
-
-
-
-
- Logo -

© 2023 Such Software LLC

-
-
+ +
+
+
+
+

About

+

+ We bridge art and technology so creators can focus on creating. Such Software designs and hosts modern artist storefronts—commission-only, no monthly fees. We handle the web stack; you keep making great work. +

+
+
+ + + + + +
+
+
+
+

Contact

+

Let’s get your art online this week. Typical response within 24 hours.

+
+
+ + Telegram + +
+
+ + X / Twitter + +
+
+ + Email + +
+
+ +
+ + + + + +
+
+ + +
+
+ + +
+
+
+ + +
+ +
+
+
+
+
+
+ + + - - - - - + +