index.html

<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>Bitcoin Scholarship</title>
    <link rel="stylesheet" href="./style.css" />
    <link rel="stylesheet" href="./output.css" />
    <link rel="shortcut icon" href="./favicon.ico" />
    <meta name="description" content="100% of college tuition covered to encourage the brightest minds to contribute to bitcoin open source development">
    <meta property="og:title" content="The Bitcoin Scholarship">
    <meta property="og:description" content="100% of college tuition covered to encourage the brightest minds to contribute to bitcoin open source development">
    <meta property="og:url" content="https://bitcoinscholarship.xyz">
    <meta property="og:image" content="https://bitcoinscholarship.xyz/logo_sq.jpg?v0">
    <meta name="twitter:card" content="summary_large_image">
    <meta name="twitter:image" content="https://bitcoinscholarship.xyz/logo_landscape.jpg?v0">
    <script async src="https://visits.bitcoindevs.xyz/script.js" data-website-id="7af1b261-bbe9-4af6-a0f0-b036dd073c50"></script>
  </head>
  <body>
    <main class="flex flex-col items-center justify-center text-center">
      <div class="flex flex-col items-center justify-center text-center h-screen max-h-screen gap-4 p-4">
        <section class="flex flex-col flex-2 items-center h-screen justify-center text-center gap-4">
          <h1 class="text-4xl sm:text-4xl md:text-7xl font-bold">The Bitcoin Scholarship</h1>
          <p class="text-center text-gray-500 dark:text-gray-500 text-base md:text-xl max-w-[600px] font-normal mb-2">
            100% of college tuition covered to encourage the brightest minds to contribute to bitcoin open source development.
          </p>
          <p class="text-center text-gray-500 dark:text-gray-500 text-base md:text-xl max-w-[600px] font-normal mb-2">
            Deadline to apply is July 30, 2025.
          </p>
          <a
            href="https://chaincode.applytojob.com/apply/HRQsnVOVkt/2025-Bitcoin-Scholarship"
            target="_blank"
            class="custom-border bg-black text-white w-fit p-3 px-6 rounded-md text-sm md:text-base hover:border-2 hover:bg-transparent hover:border-black hover:text-black transition-colors"
          >
            Apply
          </a>
        </section>
        <section class="flex w-full items-center justify-center pb-20">
          <a class="border-[1.5px] border-[#2d2d2d] animate-bounce p-2 backdrop-blur-0 rounded-[50%] bg-[#f6f4f4]" href="/#faq">
            <svg width="28" height="28" viewBox="0 0 28 28" fill="none" xmlns="http://www.w3.org/2000/svg">
              <path
                d="M15.1658 18.8686L21.4238 12.6106L23.0735 14.2603L13.9991 23.3346L4.9248 14.2603L6.57447 12.6106L12.8325 18.8686V4.66797H15.1658V18.8686Z"
                fill="#000"
              />
            </svg>
          </a>
        </section>
      </div>

      <div class="px-2 py-20 md:py-24 flex flex-col items-center justify-center max-w-screen-lg md:max-h-screen min-h-screen" id="faq">
        <h2 class="text-2xl sm:text-3xl md:text-4xl font-bold mb-8">Frequently Asked Questions</h2>
        <section class="border-2 border-gray-500 rounded-2xl w-full flex flex-col items-start justify-start gap-6 p-6 md:py-8">
          <div class="flex flex-col items-start gap-1">
            <h4 class="text-lg leading-[130%] font-semibold md:text-2xl text-start">I am not yet in college, am I eligible to apply?</h4>
            <p class="text-gray-500 dark:text-gray-500 text-base md:text-lg font-normal text-start">
              The scholarship is open to students from high school seniors up to rising college juniors.
            </p>
          </div>

          <div class="flex flex-col items-start gap-1">
            <h4 class="text-lg leading-[130%] font-semibold md:text-2xl text-start">What does the scholarship exactly cover?</h4>
            <p class="text-gray-500 dark:text-gray-500 text-base md:text-lg font-normal text-start">
              The scholarship covers 100% of the tuition for the recipient at any university worldwide. This payment is made directly to the academic
              institution. Room and board expenses are not included in the scholarship.
            </p>
          </div>

          <div class="flex flex-col items-start gap-1">
            <h4 class="text-lg leading-[130%] font-semibold md:text-2xl text-start">When is the scholarship announced?</h4>
            <p class="text-gray-500 dark:text-gray-500 text-base md:text-lg font-normal text-start">We will notify recipients by September 30.</p>
          </div>

          <div class="flex flex-col items-start gap-1">
            <h4 class="text-lg leading-[130%] font-semibold md:text-2xl text-start">Are there any work requirements to receive the scholarship?</h4>
            <p class="text-gray-500 dark:text-gray-500 text-base md:text-lg font-normal text-start">
              Recipients are required to work full-time on Bitcoin open source projects during the summer preceding the academic year for which the
              scholarship is awarded. Additional stipends may be provided as necessary based on location.
            </p>
          </div>

          <div class="flex flex-col items-start gap-1">
            <h4 class="text-lg leading-[130%] font-semibold md:text-2xl text-start">What if I attend a non-US university? Am I still eligible?</h4>
            <p class="text-gray-500 dark:text-gray-500 text-base md:text-lg font-normal text-start">Absolutely!</p>
          </div>

          <div class="flex flex-col items-start gap-1">
            <h4 class="text-lg leading-[130%] font-semibold md:text-2xl text-start">How many years is a scholarship for?</h4>
            <p class="text-gray-500 dark:text-gray-500 text-base md:text-lg font-normal text-start">
              Scholarships are for one-year, but can be renewed up to three additional years for an undergraduate university program based on
              continued involvement in bitcoin open source development.
            </p>
          </div>
        </section>
      </div>
    </main>
  </body>
</html>