---
import "./GridStyles.css";
---

<div class="cards">
    <div
        class="text-[white] h-[314.89px] p-8 bg-[color:var(--blue-charcoal)] transition-[0.3s] m-[0.5em] rounded-[5px] border-2 border-solid border-transparent hover:border-[color:var(--aquamarine)] hover:transition-[0.1s] hover:rounded-[5px] hover:border-2 hover:border-solid flex justify-center flex-col"
    >
        <h5
            class="text-[calc(15px_+_(29_-_15)_*_((100vw_-_300px)_/_(1600_-_300)))] text-[color:var(--white)] font-normal not-italic max-w-[300] leading-8;"
        >
            Web3 Universal Storage
        </h5><br /><h6
            class="text-[calc(15px_+_(19_-_15)_*_((100vw_-_300px)_/_(1600_-_300)))] text-[color:var(--cloud)] font-thin not-italic max-w-[300];"
        >
            Get access to a universal network drive, powered by the Web3/dWeb
            cloud. Enjoy portability to any device or platform you wish.
        </h6>
    </div>
    <div
        class="text-[white] h-[314.89px] p-8 bg-[color:var(--blue-charcoal)] transition-[0.3s] m-[0.5em] rounded-[5px] border-2 border-solid border-transparent hover:border-[color:var(--aquamarine)] hover:transition-[0.1s] hover:rounded-[5px] hover:border-2 hover:border-solid flex justify-center flex-col"
    >
        <h5
            class="text-[calc(15px_+_(29_-_15)_*_((100vw_-_300px)_/_(1600_-_300)))] text-[color:var(--white)] font-normal not-italic max-w-[300] leading-8;"
        >
            Web3 Gateway
        </h5><br /><h6
            class="text-[calc(15px_+_(19_-_15)_*_((100vw_-_300px)_/_(1600_-_300)))] text-[color:var(--cloud)] font-thin not-italic max-w-[300];"
        >
            Install the Lume Web3 Extension and have a 1-click gateway into the
            Web3 internet on Opera, Vivaldi, Edge, and Firefox.
        </h6>
    </div>
    <div
        class="text-[white] h-[314.89px] p-8 bg-[color:var(--blue-charcoal)] transition-[0.3s] m-[0.5em] rounded-[5px] border-2 border-solid border-transparent hover:border-[color:var(--aquamarine)] hover:transition-[0.1s] hover:rounded-[5px] hover:border-2 hover:border-solid flex justify-center flex-col"
    >
        <h5
            class="text-[calc(15px_+_(29_-_15)_*_((100vw_-_300px)_/_(1600_-_300)))] text-[color:var(--white)] font-normal not-italic max-w-[300] leading-8;"
        >
            Build Your Site,<br />Censorship Free
        </h5><br /><h6
            class="text-[calc(15px_+_(19_-_15)_*_((100vw_-_300px)_/_(1600_-_300)))] text-[color:var(--cloud)] font-thin not-italic max-w-[300];"
        >
            Combining Lume and Skynet technologies, you can build a website just
            like you are on the Web2 internet.
        </h6>
    </div>
    <div
        class="text-[white] h-[314.89px] p-8 bg-[color:var(--blue-charcoal)] transition-[0.3s] m-[0.5em] rounded-[5px] border-2 border-solid border-transparent hover:border-[color:var(--aquamarine)] hover:transition-[0.1s] hover:rounded-[5px] hover:border-2 hover:border-solid flex justify-center flex-col"
    >
        <h5
            class="text-[calc(15px_+_(29_-_15)_*_((100vw_-_300px)_/_(1600_-_300)))] text-[color:var(--white)] font-normal not-italic max-w-[300] leading-8;"
        >
            Web3 Universal Storage
        </h5><br /><h6
            class="text-[calc(15px_+_(19_-_15)_*_((100vw_-_300px)_/_(1600_-_300)))] text-[color:var(--cloud)] font-thin not-italic max-w-[300];"
        >
            Get access to a universal network drive, powered by the Web3/dWeb
            cloud. Enjoy portability to any device or platform you wish.
        </h6>
    </div>
    <div
        class="text-[white] h-[314.89px] p-8 bg-[color:var(--blue-charcoal)] transition-[0.3s] m-[0.5em] rounded-[5px] border-2 border-solid border-transparent hover:border-[color:var(--aquamarine)] hover:transition-[0.1s] hover:rounded-[5px] hover:border-2 hover:border-solid flex justify-center flex-col"
    >
        <h5
            class="text-[calc(15px_+_(29_-_15)_*_((100vw_-_300px)_/_(1600_-_300)))] text-[color:var(--white)] font-normal not-italic max-w-[300] leading-8;"
        >
            Web3 Gateway
        </h5><br /><h6
            class="text-[calc(15px_+_(19_-_15)_*_((100vw_-_300px)_/_(1600_-_300)))] text-[color:var(--cloud)] font-thin not-italic max-w-[300];"
        >
            Install the Lume Web3 Extension and have a 1-click gateway into the
            Web3 internet on Opera, Vivaldi, Edge, and Firefox.
        </h6>
    </div>
    <div
        class="text-[white] h-[314.89px] p-8 bg-[color:var(--blue-charcoal)] transition-[0.3s] m-[0.5em] rounded-[5px] border-2 border-solid border-transparent hover:border-[color:var(--aquamarine)] hover:transition-[0.1s] hover:rounded-[5px] hover:border-2 hover:border-solid flex justify-center flex-col"
    >
        <h5
            class="text-[calc(15px_+_(29_-_15)_*_((100vw_-_300px)_/_(1600_-_300)))] text-[color:var(--white)] font-normal not-italic max-w-[300] leading-8;"
        >
            Build Your Site,<br />Censorship Free
        </h5><br /><h6
            class="text-[calc(15px_+_(19_-_15)_*_((100vw_-_300px)_/_(1600_-_300)))] text-[color:var(--cloud)] font-thin not-italic max-w-[300];"
        >
            Combining Lume and Skynet technologies, you can build a website just
            like you are on the Web2 internet.
        </h6>
    </div>
</div>