index.html

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="utf-8">
  <meta name="viewport"
     content="width=device-width, initial-scale=1, user-scalable=yes">

  <link rel="stylesheet" href="https://unpkg.com/98.css" />
  <link href="../static/css/style.css" type="text/css" rel="stylesheet">
    <title>Apple.io</title>
</head>
<body>
<span class="floating-header window sticky" id="stickyHeader">
  <div class="header-content">
    <button class="header-button" id="hamburger">=</button>
    <div class="window" id="apple">
      <a class="no-underline" href="/">🍎</a>
    </div>
    <button class="header-button" id="bag">🛍</button>
  </div>
</span>
<div class="grid-container">
  <div class="item full-element" id="covid-19-support">
    <br><br>
    <h3>
      Shop online for fast, free, no-contact delivery.<br>
      Call us at 1-800-MY-APPLE or visit <a href="https://support.apple.com/">support</a>.
    </h3>
  </div>
  <div class="item full-element">
    <div id="iphone-se-promo">
        <h2>iPhone SE</h2>
        <h3>Lots to love. Less to spend.<br>Starting at $399.</h3>
        <h5>From $9.54/mo. or $299 with trade-in.<sup>1</sup></h5>
        <h5 class="note">Available 4.24.</h5>
        <h3>
          <a href="https://www.apple.com/iphone-se/">
            Learn more ><span class="full-element-link"></span>
          </a>
          &nbsp;&nbsp;&nbsp;
          <a class="supplementary-link" href="https://www.apple.com/us/shop/goto/buy_iphone/iphone_se">Pre-order ></a></h3>
        <div class="showcase-img">
          <img src="" alt="iphone-se-jet-black-face-down"/>
        </div>
    </div>
  </div>
  <div class="item full-element">
    <div id="iphone-11-promo">
      <h2>iPhone 11</h2>
      <h3>Just the right amount of everything.</h3>
      <h5 class="note">From $18.70/mo. or $499 with trade-in.<sup>1</sup></h5>
      <h3>
        <a href="https://apple.com/iphone-11/">Learn more ><span class="full-element-link"></span></a>
        &nbsp;&nbsp;&nbsp;
        <a class="supplementary-link" href="https://www.apple.com/us/shop/goto/buy_iphone/iphone_11">Buy ></a></h3>
      <div class="showcase-img">
        <img src="" alt="iphone-11-alternating-display"/>
      </div>
    </div>
  </div>
  <div class="item full-element">
    <div id="apple-tv-beastie-boys-story-promo">
      <img src="" alt="apple-tv-beastie-boys-story-showcase"/><br>
      <a href="https://tv.apple.com/movie/umc.cmc.6d0mrskjsusw2jd2d228p88c2?itscg=10000&itsct=atv-0-apl_hp-pmo_wch-apl-bbs-200124"><span class="full-element-link"></span></a>
      <h3>
        <a  href="">Watch Now <img src="" alt="play-icon-in-circle"/></a>
      </h3>
    </div>
  </div>
  <div class="item half-element">
    <div id="iphone-11-pro-promo">
      <h2>iPhone 11 Pro</h2>
      <h3>Pro cameras. Pro display.<br>Pro performance.</h3>
      <h5 class="note">From $28.29/mo. or $679 with trade-in.<sup>1</sup></h5>
      <h3>
        <a href="https://www.apple.com/iphone-11-pro/">Learn more ><span class="full-element-link"></span></a>
        <a class="supplementary-link" href="https://www.apple.com/us/shop/goto/buy_iphone/iphone_11_pro">Buy ></a></h3>
      <div class="showcase-img">
        <img src="" alt="iphone-11-pro-showcase"/>
      </div>
    </div>
  </div>
  <div class="item half-element">
    <div id="covid-19-psa-promo">
      <div class="showcase-img">
        <img src="" alt="apple-cdc"/>
      </div>
      <h2>Evaluate COVID-19<br>symptoms and<br>understand next<br>steps.</h2>
      <h3>
        <a href="https://www.apple.com/covid19/">Get started now ><span class="full-element-link"></span></a><br>
        <a class="supplementary-link" href="https://www.apple.com/105/media/us/home/2020/61d216dc-2bbb-4e02-8199-dd7ba1212b42/films/social-distancing/social-distancing-tpl-cc-us-2020_1280x720h.mp4">Watch the PSA <img src="" alt="play-icon-in-circle"></a>
      </h3>
    </div>
  </div>
  <div class="item half-element">
    <div id="watch-series-5-promo">
      <div class="showcase-img">
        <img src="" alt="watch-series-5-logo"/>
      </div>
      <h3>With the Always-On Retina display.<br>You've never seen a watch like this.</h3>
      <h3>
        <a href="https://www.apple.com/apple-watch-series-5/">Learn more ><span class="full-element-link"></span></a>
        <a class="supplementary-link" href="https://www.apple.com/us/shop/goto/apple_watch">Buy ></a></h3>
      <div class="showcase-img">
        <img src="" alt="watch-series-5-showcase"/>
      </div>
    </div>
  </div>
  <div class="item half-element">
    <div id="mothers-day-promo">
      <h2>Gifts for Mom</h2>
      <h3>
        <a href="https://www.apple.com/us/shop/goto/gifts">Shop ><span class="full-element-link"></span></a>
      </h3>
      <div class="showcase-img">
        <img src="" alt="mothers-day-showcase"/>
      </div>
    </div>
  </div>
  <div class="item"></div>
  <div class="item">
    <div class="window">
      <div class="title-bar">
        <div class="title-bar-text">
          A friendly greeting
        </div>
      </div>
      <div class="window-body">
        <p>Hello!</p>
        <div class="window-options">
          <button>OK</button>
          <button>Cancel</button>
        </div>
      </div>
    </div>
  </div>
</div>
<div class="footer">
  <div id="footnotes">
    <p>1. Trade In: Trade‑in values vary. iPhone 11 and iPhone 11 Pro promotional pricing is after trade‑in of iPhone 8 Plus and iPhone X in good condition. iPhone SE promotional pricing is after trade-in of iPhone 8 in good condition. Additional trade‑in values require purchase of a new iPhone, subject to availability and limits. Must be at least 18. Apple or its trade-in partners reserve the right to refuse or limit any Trade In transaction for any reason. In‑store trade‑in requires presentation of a valid, government-issued photo ID (local law may require saving this information). Sales tax may be assessed on full value of new iPhone. Additional terms from Apple or Apple’s trade-in partners may apply. Monthly pricing: Available to qualified customers and requires 0% APR, 24-month installment loan with Citizens One or Apple Card Monthly Installments and iPhone activation with AT&T, Sprint, T-Mobile, or Verizon. Taxes and shipping not included. Additional Apple Card Monthly Installments terms are in the Customer Agreement. Additional iPhone Payments terms are here.<br></p>
    <p>2. Subscription required.<br></p>
    <p>Apple TV+ is $4.99/month after free trial. One subscription per Family Sharing group. Offer good for 3 months after eligible device activation. Plan automatically renews until cancelled. Restrictions and other terms apply.<br></p>
    <p>The COVID‑19 site and app were developed in partnership with CDC. They are not meant as an endorsement of any Apple products.<br></p>
  </div>
</div>
</body>
</html>