cssAudio - Activefile-genericCSS - ActiveGeneric - ActiveHTML - ActiveImage - ActiveJS - ActiveSVG - ActiveText - Activefile-genericVideo - ActiveLovehtmlicon-new-collectionicon-personicon-teamlog-outoctocatpop-outspinnerstartv

Pen Settings

CSS Base

Vendor Prefixing

Add External Stylesheets/Pens

Any URL's added here will be added as <link>s in order, and before the CSS in the editor. If you link to another Pen, it will include the CSS from that Pen. If the preprocessor matches, it will attempt to combine them before processing.

Quick-add: + add another resource

Add External Scripts/Pens

Any URL's added here will be added as <script>s in order, and run before the JavaScript in the editor. You can use the URL of any other Pen and it will include the JavaScript from that Pen.

Quick-add: + add another resource

Code Indentation

     

Save Automatically?

If active, Pens will autosave every 30 seconds after being saved once.

Auto-Updating Preview

If enabled, the preview panel updates automatically as you code. If disabled, use the "Run" button to update.

            
              <div class="grid-container grid-container--outer">
  <div class="flex-container play-header">
    <div class="logo">
      <img src="https://s3-us-west-2.amazonaws.com/s.cdpn.io/122932/googplay.png" alt="Google Play">
    </div>
    <div class="flex-container play-header-search">
      <input type="text" class="search-bar" placeholder="Search">
      <button class="search-button"></button>
    </div>
    <div class="inline-helper"></div>
    <div class="flex-container play-store-icons">
      <div class="inline-helper"></div>
      <div class="play-store-icon">
        <!-- Apps Icon -->
        <svg xmlns="http://www.w3.org/2000/svg" fill="#757575" height="24" viewBox="0 0 24 24" width="24">
          <path d="M4 8h4V4H4v4zm6 12h4v-4h-4v4zm-6 0h4v-4H4v4zm0-6h4v-4H4v4zm6 0h4v-4h-4v4zm6-10v4h4V4h-4zm-6 4h4V4h-4v4zm6 6h4v-4h-4v4zm0 6h4v-4h-4v4z"/>
          <path d="M0 0h24v24H0z" fill="none"/>
        </svg>
      </div>
      <div class="play-store-icon">
        <!-- Alert Icon -->
        <svg xmlns="http://www.w3.org/2000/svg" fill="#757575" height="24" viewBox="0 0 24 24" width="24">
          <path d="M12 22c1.1 0 2-.9 2-2h-4c0 1.1.89 2 2 2zm6-6v-5c0-3.07-1.64-5.64-4.5-6.32V4c0-.83-.67-1.5-1.5-1.5s-1.5.67-1.5 1.5v.68C7.63 5.36 6 7.92 6 11v5l-2 2v1h16v-1l-2-2z"/>
        </svg>
      </div>
      <div class="play-store-icon play-store-icon--avatar">T</div>
    </div>
  </div>
  <div class="sticky flex-container android-tag">
    <svg xmlns="http://www.w3.org/2000/svg" fill="#FFF" height="24" viewBox="0 0 24 24" width="24">
        <path d="M0 0h24v24H0z" fill="none"/>
        <path d="M6 18c0 .55.45 1 1 1h1v3.5c0 .83.67 1.5 1.5 1.5s1.5-.67 1.5-1.5V19h2v3.5c0 .83.67 1.5 1.5 1.5s1.5-.67 1.5-1.5V19h1c.55 0 1-.45 1-1V8H6v10zM3.5 8C2.67 8 2 8.67 2 9.5v7c0 .83.67 1.5 1.5 1.5S5 17.33 5 16.5v-7C5 8.67 4.33 8 3.5 8zm17 0c-.83 0-1.5.67-1.5 1.5v7c0 .83.67 1.5 1.5 1.5s1.5-.67 1.5-1.5v-7c0-.83-.67-1.5-1.5-1.5zm-4.97-5.84l1.3-1.3c.2-.2.2-.51 0-.71-.2-.2-.51-.2-.71 0l-1.48 1.48C13.85 1.23 12.95 1 12 1c-.96 0-1.86.23-2.66.63L7.85.15c-.2-.2-.51-.2-.71 0-.2.2-.2.51 0 .71l1.31 1.31C6.97 3.26 6 5.01 6 7h12c0-1.99-.97-3.75-2.47-4.84zM10 5H9V4h1v1zm5 0h-1V4h1v1z"/>
    </svg>
    apps
  </div
  ><div class="sticky flex-container apps-header">
    <div class="apps-header-item header-link flex-container categories-dropdown">Categories <svg xmlns="http://www.w3.org/2000/svg" fill="#757575" height="24" viewBox="0 0 24 24" width="24">
    <path d="M7.41 7.84L12 12.42l4.59-4.58L18 9.25l-6 6-6-6z"/>
    <path d="M0-.75h24v24H0z" fill="none"/>
</svg></div>
    <div class="header-divider"></div>
    <div class="apps-header-item header-link">Home</div>
    <div class="apps-header-item header-link">Top Charts</div>
    <div class="apps-header-item header-link">New Releases</div>
    <div class="apps-header-item flex-container app-actions">
      <button class="app-action app-action--questions">
        <svg xmlns="http://www.w3.org/2000/svg" fill="#333" height="24" viewBox="0 0 24 24" width="24">
            <path d="M0 0h24v24H0z" fill="none"/>
            <path d="M19 2H5c-1.11 0-2 .9-2 2v14c0 1.1.89 2 2 2h4l3 3 3-3h4c1.1 0 2-.9 2-2V4c0-1.1-.9-2-2-2zm-6 16h-2v-2h2v2zm2.07-7.75l-.9.92C13.45 11.9 13 12.5 13 14h-2v-.5c0-1.1.45-2.1 1.17-2.83l1.24-1.26c.37-.36.59-.86.59-1.41 0-1.1-.9-2-2-2s-2 .9-2 2H8c0-2.21 1.79-4 4-4s4 1.79 4 4c0 .88-.36 1.68-.93 2.25z"/>
        </svg>
      </button>
      <button class="app-action app-action--settings">
        <svg xmlns="http://www.w3.org/2000/svg" fill="#333" height="24" viewBox="0 0 24 24" width="24">
            <path d="M0 0h24v24H0z" fill="none"/>
            <path d="M19.43 12.98c.04-.32.07-.64.07-.98s-.03-.66-.07-.98l2.11-1.65c.19-.15.24-.42.12-.64l-2-3.46c-.12-.22-.39-.3-.61-.22l-2.49 1c-.52-.4-1.08-.73-1.69-.98l-.38-2.65C14.46 2.18 14.25 2 14 2h-4c-.25 0-.46.18-.49.42l-.38 2.65c-.61.25-1.17.59-1.69.98l-2.49-1c-.23-.09-.49 0-.61.22l-2 3.46c-.13.22-.07.49.12.64l2.11 1.65c-.04.32-.07.65-.07.98s.03.66.07.98l-2.11 1.65c-.19.15-.24.42-.12.64l2 3.46c.12.22.39.3.61.22l2.49-1c.52.4 1.08.73 1.69.98l.38 2.65c.03.24.24.42.49.42h4c.25 0 .46-.18.49-.42l.38-2.65c.61-.25 1.17-.59 1.69-.98l2.49 1c.23.09.49 0 .61-.22l2-3.46c.12-.22.07-.49-.12-.64l-2.11-1.65zM12 15.5c-1.93 0-3.5-1.57-3.5-3.5s1.57-3.5 3.5-3.5 3.5 1.57 3.5 3.5-1.57 3.5-3.5 3.5z"/>
        </svg>
      </button>
    </div>
  </div>
  
  <div class="sticky flex-container apps-header apps-header--small">
    <div>
      <svg xmlns="http://www.w3.org/2000/svg" fill="#757575" height="24" viewBox="0 0 24 24" width="24">
          <path d="M0 0h24v24H0z" fill="none"/>
          <path d="M3 18h18v-2H3v2zm0-5h18v-2H3v2zm0-7v2h18V6H3z"/>
      </svg>
    </div>
    <div>
      <div class="logo logo--small">
        <img src="https://s3-us-west-2.amazonaws.com/s.cdpn.io/122932/googplay.png" alt="Google Play">
      </div>
    </div>
    <div>
      <svg xmlns="http://www.w3.org/2000/svg" fill="#000000" height="24" viewBox="0 0 24 24" width="24">
          <path d="M15.5 14h-.79l-.28-.27C15.41 12.59 16 11.11 16 9.5 16 5.91 13.09 3 9.5 3S3 5.91 3 9.5 5.91 16 9.5 16c1.61 0 3.09-.59 4.23-1.57l.27.28v.79l5 4.99L20.49 19l-4.99-5zm-6 0C7.01 14 5 11.99 5 9.5S7.01 5 9.5 5 14 7.01 14 9.5 11.99 14 9.5 14z"/>
          <path d="M0 0h24v24H0z" fill="none"/>
      </svg>
    </div>
  </div>
  <div class="sidebar-wrapper">
    <div class="sticky grid-container sidebar">
      <div class="sidebar-arrow">
        <svg xmlns="http://www.w3.org/2000/svg" fill="#757575" height="24" viewBox="0 0 24 24" width="24">
            <path d="M15.41 7.41L14 6l-6 6 6 6 1.41-1.41L10.83 12z"/>
            <path d="M0 0h24v24H0z" fill="none"/>
        </svg>
      </div>
      <div class="flex-container flex-container--vertical sidebar-top-links">
        <div class="sidebar-top-link sidebar-primary">My apps</div>
        <div class="sidebar-top-link sidebar-primary selected">Shop</div>
        <div class="sidebar-divider"></div>
        <div class="sidebar-top-link sidebar-secondary">Games</div>
        <div class="sidebar-top-link sidebar-secondary">Family</div>
        <div class="sidebar-top-link sidebar-secondary">Editor's Choice</div>
      </div>
      <div class="flex-container flex-container--vertical sidebar-bottom-links">
        <div class="sidebar-bottom-link">Account</div>
        <div class="sidebar-bottom-link">Redeem</div>
        <div class="sidebar-bottom-link">Buy gift card</div>
        <div class="sidebar-bottom-link">My wishlist</div>
        <div class="sidebar-bottom-link">My Play activity</div>
        <div class="sidebar-bottom-link">Parent Guide</div>
      </div>
    </div>
  </div>
  <div class="grid-container app-grid">
    <h1 class="apps-title">Top Free CSS Grid Apps</h1>
    <div class="app">
      <div class="app-image">
        <img src="https://s3-us-west-2.amazonaws.com/s.cdpn.io/122932/fb.png" alt="bitmoji logo">
      </div>
      <div class="app-content">
        <div class="app-title">Messenger – Text and Video Chat for Free</div>
        <div class="app-publisher">Facebook</div>
        <div class="app-rating app-rating--4"></div>
        <div class="app-price">FREE</div>
      </div>
    </div>
    <div class="app">
	<div class="app-image">
		<img src="https://lh3.googleusercontent.com/HHtNhRHpPcuB0xDO7FIr-AOvipUW6_ozqG9_7SBFH3C8R2vg_iaqHKiQMOUcs5LAbCKU=w170"  />
	</div>
	<div class="app-content">
		<div class="app-title">My Fancy App</div>
		<div class="app-publisher">Great Developer</div>
		<div class="app-rating app-rating--4"></div>
		<div class="app-price">FREE</div>
	</div>
</div>
<div class="app">
	<div class="app-image">
		<img src="https://lh3.googleusercontent.com/UrY7BAZ-XfXGpfkeWg0zCCeo-7ras4DCoRalC_WXXWTK9q5b0Iw7B0YQMsVxZaNB7DM=w170"  />
	</div>
	<div class="app-content">
		<div class="app-title">My Fancy App</div>
		<div class="app-publisher">Great Developer</div>
		<div class="app-rating app-rating--1"></div>
		<div class="app-price">FREE</div>
	</div>
</div>
<div class="app">
	<div class="app-image">
		<img src="https://lh5.ggpht.com/0VYAvZLR9YhosF-thqm8xl8EWsCfrEY_uk2og2f59K8IOx5TfPsXjFVwxaHVnUbuEjc=w170"  />
	</div>
	<div class="app-content">
		<div class="app-title">My Fancy App</div>
		<div class="app-publisher">Great Developer</div>
		<div class="app-rating app-rating--4"></div>
		<div class="app-price">FREE</div>
	</div>
</div>
<div class="app">
	<div class="app-image">
		<img src="https://lh3.googleusercontent.com/VgApWOljUS_6OKp80OV--HjqsECnd95s0gpzslLJ277G-tYZH6X6ZF8KnQy_fjvvChA=w170"  />
	</div>
	<div class="app-content">
		<div class="app-title">My Fancy App</div>
		<div class="app-publisher">Great Developer</div>
		<div class="app-rating app-rating--3"></div>
		<div class="app-price">FREE</div>
	</div>
</div>
<div class="app">
	<div class="app-image">
		<img src="https://lh3.googleusercontent.com/2JPRbBcHwelRTO-y25hyKGejNLf0UPAw_apJtyuu7PXSBk0n8iKUvlG0CihfebSPLQ=w170"  />
	</div>
	<div class="app-content">
		<div class="app-title">My Fancy App</div>
		<div class="app-publisher">Great Developer</div>
		<div class="app-rating app-rating--2"></div>
		<div class="app-price">FREE</div>
	</div>
</div>
<div class="app">
	<div class="app-image">
		<img src="https://lh3.googleusercontent.com/A-hQknkTsGW5rzEMxHoNB_9S36LNYeRbY5dhi0ngYWBoO0XfahBmR-CKnD6S2J4Lnm0=w170"  />
	</div>
	<div class="app-content">
		<div class="app-title">My Fancy App</div>
		<div class="app-publisher">Great Developer</div>
		<div class="app-rating app-rating--1"></div>
		<div class="app-price">FREE</div>
	</div>
</div>
<div class="app">
	<div class="app-image">
		<img src="https://lh3.googleusercontent.com/rh7taPUTvdu4MgYYDkT1HCnrFayxpBIHP8iIFWn0XfkwZx4ln449itD8GcJzAnE0_aM=w170"  />
	</div>
	<div class="app-content">
		<div class="app-title">My Fancy App</div>
		<div class="app-publisher">Great Developer</div>
		<div class="app-rating app-rating--4"></div>
		<div class="app-price">FREE</div>
	</div>
</div>
<div class="app">
	<div class="app-image">
		<img src="https://lh3.googleusercontent.com/aYbdIM1abwyVSUZLDKoE0CDZGRhlkpsaPOg9tNnBktUQYsXflwknnOn2Ge1Yr7rImGk=w170"  />
	</div>
	<div class="app-content">
		<div class="app-title">My Fancy App</div>
		<div class="app-publisher">Great Developer</div>
		<div class="app-rating app-rating--4"></div>
		<div class="app-price">FREE</div>
	</div>
</div>
<div class="app">
	<div class="app-image">
		<img src="https://lh3.googleusercontent.com/_gpQ5T1jLbbpyoaDHgYoJV_seHudPYAqfYe7me5MApKMYUuY91E_h6y3Jy_Cxe8OO8E=w170"  />
	</div>
	<div class="app-content">
		<div class="app-title">My Fancy App</div>
		<div class="app-publisher">Great Developer</div>
		<div class="app-rating app-rating--4"></div>
		<div class="app-price">FREE</div>
	</div>
</div>
<div class="app">
	<div class="app-image">
		<img src="https://lh3.googleusercontent.com/22lkNB4CGzd1lCQgpXdG8EVE8X6aTvcEWqx1-TVfUZP9PSUkyvjiT1i3NXYA9Vbz0cQ=w170"  />
	</div>
	<div class="app-content">
		<div class="app-title">My Fancy App</div>
		<div class="app-publisher">Great Developer</div>
		<div class="app-rating app-rating--4"></div>
		<div class="app-price">FREE</div>
	</div>
</div>
<div class="app">
	<div class="app-image">
		<img src="https://lh3.googleusercontent.com/ZSxEdf1-sxs0x0gDJ27SW9agHCuk_huklGKNh36vG1NqpFmXXHmZrF9zRJ207xVizA=w170"  />
	</div>
	<div class="app-content">
		<div class="app-title">My Fancy App</div>
		<div class="app-publisher">Great Developer</div>
		<div class="app-rating app-rating--4"></div>
		<div class="app-price">FREE</div>
	</div>
</div>
<div class="app">
	<div class="app-image">
		<img src="https://lh3.googleusercontent.com/jcbqFma-5e91cY9MlEasA-fvCRJK493MxphrqbBd8oS74FtYg00IXeOAn0ahsLprxIA=w170"  />
	</div>
	<div class="app-content">
		<div class="app-title">My Fancy App</div>
		<div class="app-publisher">Great Developer</div>
		<div class="app-rating app-rating--4"></div>
		<div class="app-price">FREE</div>
	</div>
</div>
<div class="app">
	<div class="app-image">
		<img src="https://lh3.googleusercontent.com/SrULGsyndXJk6Gs4Lmv34sOlMDAroy1bzPPr9X1U5oVdv5TAAJX4JkYPO_wQAdP7TBA=w170"  />
	</div>
	<div class="app-content">
		<div class="app-title">My Fancy App</div>
		<div class="app-publisher">Great Developer</div>
		<div class="app-rating app-rating--4"></div>
		<div class="app-price">FREE</div>
	</div>
</div>
<div class="app">
	<div class="app-image">
		<img src="https://lh3.ggpht.com/7JPOKRuanUwnX42dJ9H-PscC-sRkK43GQGRoklxusB4FKBPJEOJY3c7ZhQbcsXol-v8=w170"  />
	</div>
	<div class="app-content">
		<div class="app-title">My Fancy App</div>
		<div class="app-publisher">Great Developer</div>
		<div class="app-rating app-rating--4"></div>
		<div class="app-price">FREE</div>
	</div>
</div>
<div class="app">
	<div class="app-image">
		<img src="https://lh6.ggpht.com/mp86vbELnqLi2FzvhiKdPX31_oiTRLNyeK8x4IIrbF5eD1D5RdnVwjQP0hwMNR_JdA=w170"  />
	</div>
	<div class="app-content">
		<div class="app-title">My Fancy App</div>
		<div class="app-publisher">Great Developer</div>
		<div class="app-rating app-rating--4"></div>
		<div class="app-price">FREE</div>
	</div>
</div>
<div class="app">
	<div class="app-image">
		<img src="https://lh3.googleusercontent.com/Bn9ewy-3qnHQ_NWJLTxGChA4R9C9MmBKLxF_PePdF13rX0tPHYRV_BsjDhJKm1IN29c=w170"  />
	</div>
	<div class="app-content">
		<div class="app-title">My Fancy App</div>
		<div class="app-publisher">Great Developer</div>
		<div class="app-rating app-rating--4"></div>
		<div class="app-price">FREE</div>
	</div>
</div>
<div class="app">
	<div class="app-image">
		<img src="https://lh3.googleusercontent.com/ZZPdzvlpK9r_Df9C3M7j1rNRi7hhHRvPhlklJ3lfi5jk86Jd1s0Y5wcQ1QgbVaAP5Q=w170"  />
	</div>
	<div class="app-content">
		<div class="app-title">My Fancy App</div>
		<div class="app-publisher">Great Developer</div>
		<div class="app-rating app-rating--4"></div>
		<div class="app-price">FREE</div>
	</div>
</div>
<div class="app">
	<div class="app-image">
		<img src="https://lh3.googleusercontent.com/32GbAQWrubLZX4mVPClpLN0fRbAd3ru5BefccDAj7nKD8vz-_NzJ1ph_4WMYNefp3A=w170"  />
	</div>
	<div class="app-content">
		<div class="app-title">My Fancy App</div>
		<div class="app-publisher">Great Developer</div>
		<div class="app-rating app-rating--4"></div>
		<div class="app-price">FREE</div>
	</div>
</div>
<div class="app">
	<div class="app-image">
		<img src="https://lh3.googleusercontent.com/Pzhl8z9sJAQk8e1ZiL_XnX3WZPEminhbw5I0S5nrqmTtzdbzb1TCydGZJ9FoUmlD_WjO=w170"  />
	</div>
	<div class="app-content">
		<div class="app-title">My Fancy App</div>
		<div class="app-publisher">Great Developer</div>
		<div class="app-rating app-rating--4"></div>
		<div class="app-price">FREE</div>
	</div>
</div>
<div class="app">
	<div class="app-image">
		<img src="https://lh3.ggpht.com/oGR9I1X9No3SfFEXrq655tETtVVzI3jIphhmEVPGPEVuM5gfwh8lOGWHQFf6gjSTvw=w170"  />
	</div>
	<div class="app-content">
		<div class="app-title">My Fancy App</div>
		<div class="app-publisher">Great Developer</div>
		<div class="app-rating app-rating--4"></div>
		<div class="app-price">FREE</div>
	</div>
</div>
<div class="app">
	<div class="app-image">
		<img src="https://lh3.googleusercontent.com/tPRS-yq2VwSxzzMGCAEmfSZriJT5lyIvZizjkDuUbaKZXYRL6sdWXoEXWjSYCfdQNzA=w170"  />
	</div>
	<div class="app-content">
		<div class="app-title">My Fancy App</div>
		<div class="app-publisher">Great Developer</div>
		<div class="app-rating app-rating--4"></div>
		<div class="app-price">FREE</div>
	</div>
</div>
<div class="app">
	<div class="app-image">
		<img src="https://lh3.googleusercontent.com/5sinG5_U9rajYjXRZ57nKDQsGTJG0jEG2zByNa9TndlX2Yu1MbfCtyoI2oMdRvQtxBA=w170"  />
	</div>
	<div class="app-content">
		<div class="app-title">My Fancy App</div>
		<div class="app-publisher">Great Developer</div>
		<div class="app-rating app-rating--4"></div>
		<div class="app-price">FREE</div>
	</div>
</div>
<div class="app">
	<div class="app-image">
		<img src="https://lh3.googleusercontent.com/upxGGpdmUTxvEKa80rywfA7N7naeoc1pJBdyRwOYSnyVVziB-LeH19HYLCf-LR_l-cA=w170"  />
	</div>
	<div class="app-content">
		<div class="app-title">My Fancy App</div>
		<div class="app-publisher">Great Developer</div>
		<div class="app-rating app-rating--4"></div>
		<div class="app-price">FREE</div>
	</div>
</div>
<div class="app">
	<div class="app-image">
		<img src="https://lh3.googleusercontent.com/ga69OwM-GgvoGADxuVOsErvkkYiufnxKooq2qJkYbVHB76cpgSPEI_r_CBfus0Abiw=w170"  />
	</div>
	<div class="app-content">
		<div class="app-title">My Fancy App</div>
		<div class="app-publisher">Great Developer</div>
		<div class="app-rating app-rating--4"></div>
		<div class="app-price">FREE</div>
	</div>
</div>
<div class="app">
	<div class="app-image">
		<img src="https://lh3.googleusercontent.com/3ZKfMRp_QrdN-LzsZTbXdXBH-LS1iykSg9ikNq_8T2ppc92ltNbFxS-tORxw2-6kGA=w170"  />
	</div>
	<div class="app-content">
		<div class="app-title">My Fancy App</div>
		<div class="app-publisher">Great Developer</div>
		<div class="app-rating app-rating--4"></div>
		<div class="app-price">FREE</div>
	</div>
</div>
<div class="app">
	<div class="app-image">
		<img src="https://lh3.googleusercontent.com/huQl-vb9T8vS3iW8ktsPZdz5qSdNZXF7XIu--BfbHaG1YQWZlFYBx0FRSKHFYLfAUSnY=w170"  />
	</div>
	<div class="app-content">
		<div class="app-title">My Fancy App</div>
		<div class="app-publisher">Great Developer</div>
		<div class="app-rating app-rating--4"></div>
		<div class="app-price">FREE</div>
	</div>
</div>
<div class="app">
	<div class="app-image">
		<img src="https://lh3.googleusercontent.com/rUOk030BXykFpC1cFt1TVa1UmH04HfnQN7cu4piK3QN4W4tbcabdc6xt3M6L0EdUTAM=w170"  />
	</div>
	<div class="app-content">
		<div class="app-title">My Fancy App</div>
		<div class="app-publisher">Great Developer</div>
		<div class="app-rating app-rating--4"></div>
		<div class="app-price">FREE</div>
	</div>
</div>
<div class="app">
	<div class="app-image">
		<img src="https://lh3.googleusercontent.com/LMur2GFr0ftI2YkKlf-SIqjdncQ3T1hm1AdJBFUXOKDQUrQY2m89pS9bpDoQdOQrHB4=w170"  />
	</div>
	<div class="app-content">
		<div class="app-title">My Fancy App</div>
		<div class="app-publisher">Great Developer</div>
		<div class="app-rating app-rating--4"></div>
		<div class="app-price">FREE</div>
	</div>
</div>
<div class="app">
	<div class="app-image">
		<img src="https://lh3.googleusercontent.com/UFJL7ni5i_F8V9Em0yymU4_x8uWhpKqDiA13Zo3ybgPJa48ujJjNfHLbvKr-3_MXzjLa=w170"  />
	</div>
	<div class="app-content">
		<div class="app-title">My Fancy App</div>
		<div class="app-publisher">Great Developer</div>
		<div class="app-rating app-rating--4"></div>
		<div class="app-price">FREE</div>
	</div>
</div>
<div class="app">
	<div class="app-image">
		<img src="https://lh3.googleusercontent.com/Xif15Q5CSMnJxXReyKd4CRrYKx-yg1OZ4cMCP-qnCeDmMq2c4KojlUpH7duDJ77ke4A=w170"  />
	</div>
	<div class="app-content">
		<div class="app-title">My Fancy App</div>
		<div class="app-publisher">Great Developer</div>
		<div class="app-rating app-rating--4"></div>
		<div class="app-price">FREE</div>
	</div>
</div>
<div class="app">
	<div class="app-image">
		<img src="https://lh3.googleusercontent.com/xQstr2meyqzRJwWAE_bLztQ3S-s-N9qJoURF2iiVAOXLM-d61uzwfaLa9BIxLmReTA=w170"  />
	</div>
	<div class="app-content">
		<div class="app-title">My Fancy App</div>
		<div class="app-publisher">Great Developer</div>
		<div class="app-rating app-rating--4"></div>
		<div class="app-price">FREE</div>
	</div>
</div>
<div class="app">
	<div class="app-image">
		<img src="https://lh4.ggpht.com/-wROmWQVYTcjs3G6H0lYkBK2nPGYsY75Ik2IXTmOO2Oo0SMgbDtnF0eqz-BRR1hRQg=w170"  />
	</div>
	<div class="app-content">
		<div class="app-title">My Fancy App</div>
		<div class="app-publisher">Great Developer</div>
		<div class="app-rating app-rating--4"></div>
		<div class="app-price">FREE</div>
	</div>
</div>
<div class="app">
	<div class="app-image">
		<img src="https://lh3.googleusercontent.com/ZrNeuKthBirZN7rrXPN1JmUbaG8ICy3kZSHt-WgSnREsJzo2txzCzjIoChlevMIQEA=w170"  />
	</div>
	<div class="app-content">
		<div class="app-title">My Fancy App</div>
		<div class="app-publisher">Great Developer</div>
		<div class="app-rating app-rating--4"></div>
		<div class="app-price">FREE</div>
	</div>
</div>
<div class="app">
	<div class="app-image">
		<img src="https://lh3.googleusercontent.com/LgFpJ86c0EZTN4-AEpEpr4DJzJL0EsO4-KX_PgK6z5oycrzZjUefV0jo2mhUwOmYHGk=w170"  />
	</div>
	<div class="app-content">
		<div class="app-title">My Fancy App</div>
		<div class="app-publisher">Great Developer</div>
		<div class="app-rating app-rating--4"></div>
		<div class="app-price">FREE</div>
	</div>
</div>
<div class="app">
	<div class="app-image">
		<img src="https://lh3.googleusercontent.com/5SBmg41TMxJFNQDr8uZuP9ScRSzr9oCGsa8Rax97M_cWrHPdaZEuRTis3fLkgAdVSUA=w170"  />
	</div>
	<div class="app-content">
		<div class="app-title">My Fancy App</div>
		<div class="app-publisher">Great Developer</div>
		<div class="app-rating app-rating--4"></div>
		<div class="app-price">FREE</div>
	</div>
</div>
<div class="app">
	<div class="app-image">
		<img src="https://lh3.googleusercontent.com/QD8edWY61-h-zawVqzX8HQR8p7_bXr6GB9fFMzUGE69lrcXl1GYsrdFefecvPJg1My2M=w170"  />
	</div>
	<div class="app-content">
		<div class="app-title">My Fancy App</div>
		<div class="app-publisher">Great Developer</div>
		<div class="app-rating app-rating--4"></div>
		<div class="app-price">FREE</div>
	</div>
</div>
<div class="app">
	<div class="app-image">
		<img src="https://lh5.ggpht.com/pfbO5nTj-IpXWNXyij7XYe-yYRYerCneItVEqJbEejq1JoKR8XVZrzxKimpfRJ-ePvh1=w170"  />
	</div>
	<div class="app-content">
		<div class="app-title">My Fancy App</div>
		<div class="app-publisher">Great Developer</div>
		<div class="app-rating app-rating--4"></div>
		<div class="app-price">FREE</div>
	</div>
</div>
<div class="app">
	<div class="app-image">
		<img src="https://lh3.googleusercontent.com/itH1qW6L08b2isVv18oBZpDKiWcFbAOJi10TFcHiH0aZImomoqPV5v_km0AzDXZwSjg=w170"  />
	</div>
	<div class="app-content">
		<div class="app-title">My Fancy App</div>
		<div class="app-publisher">Great Developer</div>
		<div class="app-rating app-rating--4"></div>
		<div class="app-price">FREE</div>
	</div>
</div>
<div class="app">
	<div class="app-image">
		<img src="https://lh3.googleusercontent.com/VoL90VTkTSvHNRUxQHZugBNqMYAyPF-a-aJrpu0_QoYY1nUmD0uTz_5GXp-Q413RYG8=w170"  />
	</div>
	<div class="app-content">
		<div class="app-title">My Fancy App</div>
		<div class="app-publisher">Great Developer</div>
		<div class="app-rating app-rating--4"></div>
		<div class="app-price">FREE</div>
	</div>
</div>
<div class="app">
	<div class="app-image">
		<img src="https://lh3.googleusercontent.com/U88JU4wTlQMVxefAL-DtadxuIu7gTTV_DJwuikhtNiY8dokof7pV7eFpCo15OVg8G20=w170"  />
	</div>
	<div class="app-content">
		<div class="app-title">My Fancy App</div>
		<div class="app-publisher">Great Developer</div>
		<div class="app-rating app-rating--4"></div>
		<div class="app-price">FREE</div>
	</div>
</div>
<div class="app">
	<div class="app-image">
		<img src="https://lh3.googleusercontent.com/stlBGKS482zWajOTk82IXFZhr22hk_NQewNOAJ0IeptPO73qfNesCyfNwW1-xwBiwv0=w170"  />
	</div>
	<div class="app-content">
		<div class="app-title">My Fancy App</div>
		<div class="app-publisher">Great Developer</div>
		<div class="app-rating app-rating--4"></div>
		<div class="app-price">FREE</div>
	</div>
</div>
<div class="app">
	<div class="app-image">
		<img src="https://lh3.googleusercontent.com/ZwkhZQkwDp8zN6s3HqIYjRMBio3hQhSZczBga6XGnp_DseFgBF6R4XCco49MpdFTdUVz=w170"  />
	</div>
	<div class="app-content">
		<div class="app-title">My Fancy App</div>
		<div class="app-publisher">Great Developer</div>
		<div class="app-rating app-rating--4"></div>
		<div class="app-price">FREE</div>
	</div>
</div>
<div class="app">
	<div class="app-image">
		<img src="https://lh3.googleusercontent.com/CuHDdBcYeHvIfDFQLz19aaDbjl4n5A1Yzf2R6c-Z62O8omSojaWOkTEnLucrcswtoAM=w170"  />
	</div>
	<div class="app-content">
		<div class="app-title">My Fancy App</div>
		<div class="app-publisher">Great Developer</div>
		<div class="app-rating app-rating--4"></div>
		<div class="app-price">FREE</div>
	</div>
</div>
<div class="app">
	<div class="app-image">
		<img src="https://lh3.googleusercontent.com/CKSXipKvL5c5ayOLSrYzIbmehr185dm0anSA3cmhjEvG_LuEyatH7GnROX_nilNPBT_M=w170"  />
	</div>
	<div class="app-content">
		<div class="app-title">My Fancy App</div>
		<div class="app-publisher">Great Developer</div>
		<div class="app-rating app-rating--4"></div>
		<div class="app-price">FREE</div>
	</div>
</div>
<div class="app">
	<div class="app-image">
		<img src="https://lh3.googleusercontent.com/-dj_kq-qW4vA1QwZtVg5T0r6v2HnAZ6Nm0KCQ1KllbTSrMWYx7YJArQkTwjJdBh6tzTH=w170"  />
	</div>
	<div class="app-content">
		<div class="app-title">My Fancy App</div>
		<div class="app-publisher">Great Developer</div>
		<div class="app-rating app-rating--4"></div>
		<div class="app-price">FREE</div>
	</div>
</div>
<div class="app">
	<div class="app-image">
		<img src="https://lh3.googleusercontent.com/00APBMVQh3yraN704gKCeM63KzeQ-zHUi5wK6E9TjRQ26McyqYBt-zy__4i8GXDAfeys=w170"  />
	</div>
	<div class="app-content">
		<div class="app-title">My Fancy App</div>
		<div class="app-publisher">Great Developer</div>
		<div class="app-rating app-rating--4"></div>
		<div class="app-price">FREE</div>
	</div>
</div>
<div class="app">
	<div class="app-image">
		<img src="https://lh3.googleusercontent.com/neZegeFu1aeeNWRhQathcu2XjkVlh4aMdZGOHudaPC_Q4PlQSFL-bC48Cc4ZPD5jTQ=w170"  />
	</div>
	<div class="app-content">
		<div class="app-title">My Fancy App</div>
		<div class="app-publisher">Great Developer</div>
		<div class="app-rating app-rating--4"></div>
		<div class="app-price">FREE</div>
	</div>
</div>
<div class="app">
	<div class="app-image">
		<img src="https://lh6.ggpht.com/GLRF_RG3DzUK7Bc4pPXW4PVuhADiVZeZX2wZpQ86NAz7KLIz-qaEq1rSZd9n4XTzbw=w170"  />
	</div>
	<div class="app-content">
		<div class="app-title">My Fancy App</div>
		<div class="app-publisher">Great Developer</div>
		<div class="app-rating app-rating--4"></div>
		<div class="app-price">FREE</div>
	</div>
</div>
<div class="app">
	<div class="app-image">
		<img src="https://lh4.ggpht.com/nrNrI-mpolozU8SGzXEyZDRZvd2lsujq-2fbAhPT5ZK_H5P29rk4DNINhZCiJx9c8so0=w170"  />
	</div>
	<div class="app-content">
		<div class="app-title">My Fancy App</div>
		<div class="app-publisher">Great Developer</div>
		<div class="app-rating app-rating--4"></div>
		<div class="app-price">FREE</div>
	</div>
</div>
<div class="app">
	<div class="app-image">
		<img src="https://lh3.googleusercontent.com/k1vNtKXtkYmzT1YqEoJBF9-y8oiv7kCp3ldiwxgyNBlWCTgkUjElZCTG9S_8ClcFAN8R=w170"  />
	</div>
	<div class="app-content">
		<div class="app-title">My Fancy App</div>
		<div class="app-publisher">Great Developer</div>
		<div class="app-rating app-rating--4"></div>
		<div class="app-price">FREE</div>
	</div>
</div>
<div class="app">
	<div class="app-image">
		<img src="https://lh3.googleusercontent.com/iRWmu9Vus6pbTsRjoSAPJxR48qOemSkwdSBTuOJXNmIW9gbv7Sbx84g9Ff_a3JH79cA=w170"  />
	</div>
	<div class="app-content">
		<div class="app-title">My Fancy App</div>
		<div class="app-publisher">Great Developer</div>
		<div class="app-rating app-rating--4"></div>
		<div class="app-price">FREE</div>
	</div>
</div>
<div class="app">
	<div class="app-image">
		<img src="https://lh3.googleusercontent.com/7hQ4bWJ2YN_7JxBem2acga0gLfkPom19rRDWlRzCd04tWV7WvGz89tp2jVuRJ3kqO_A=w170"  />
	</div>
	<div class="app-content">
		<div class="app-title">My Fancy App</div>
		<div class="app-publisher">Great Developer</div>
		<div class="app-rating app-rating--4"></div>
		<div class="app-price">FREE</div>
	</div>
</div>
<div class="app">
	<div class="app-image">
		<img src="https://lh3.googleusercontent.com/h7AHTzxaCZTFC8T_hbyJCKGU8h1UBziw0ID5DT7e1Q0aXE6iYFx3EIIcCe6W9fZlIA=w170"  />
	</div>
	<div class="app-content">
		<div class="app-title">My Fancy App</div>
		<div class="app-publisher">Great Developer</div>
		<div class="app-rating app-rating--4"></div>
		<div class="app-price">FREE</div>
	</div>
</div>
<div class="app">
	<div class="app-image">
		<img src="https://lh3.googleusercontent.com/ch0-Ji3rOthazcpKuBYDTynHbK7KAcMnI1mfvY1kvmt9mTv-06SGiXhTjSMyxSTPvvs=w170"  />
	</div>
	<div class="app-content">
		<div class="app-title">My Fancy App</div>
		<div class="app-publisher">Great Developer</div>
		<div class="app-rating app-rating--4"></div>
		<div class="app-price">FREE</div>
	</div>
</div>
<div class="app">
	<div class="app-image">
		<img src="https://lh3.ggpht.com/j6aNgkpGRXp9PEinADFoSkyfup46-6Rb83bS41lfQC_Tc2qg96zQ_aqZcyiaV3M-Ai4=w170"  />
	</div>
	<div class="app-content">
		<div class="app-title">My Fancy App</div>
		<div class="app-publisher">Great Developer</div>
		<div class="app-rating app-rating--4"></div>
		<div class="app-price">FREE</div>
	</div>
</div>
<div class="app">
	<div class="app-image">
		<img src="https://lh3.googleusercontent.com/ngoSHMY_GyAMns5lQf39DIHDh9fH9v-w94-ToWElvAv6la-X-lu4B3rIDbWLWJ0tGdph=w170"  />
	</div>
	<div class="app-content">
		<div class="app-title">My Fancy App</div>
		<div class="app-publisher">Great Developer</div>
		<div class="app-rating app-rating--4"></div>
		<div class="app-price">FREE</div>
	</div>
</div>
<div class="app">
	<div class="app-image">
		<img src="https://lh3.googleusercontent.com/i6O3r58jEFQ3EtpwLczvCx9isCElLB9zGbBoRUKlRAGzorkuI9dbFc1Q4Rk4Me_MaaQ=w170"  />
	</div>
	<div class="app-content">
		<div class="app-title">My Fancy App</div>
		<div class="app-publisher">Great Developer</div>
		<div class="app-rating app-rating--4"></div>
		<div class="app-price">FREE</div>
	</div>
</div>
<div class="app">
	<div class="app-image">
		<img src="https://lh3.googleusercontent.com/ElcttJM3EB7z4rz9rWFfA-AmhxzaMGH4jUsOeYQnRwLn6JA5zaFJ1x22ly2SPmh6jJ8=w170"  />
	</div>
	<div class="app-content">
		<div class="app-title">My Fancy App</div>
		<div class="app-publisher">Great Developer</div>
		<div class="app-rating app-rating--4"></div>
		<div class="app-price">FREE</div>
	</div>
</div>
<div class="app">
	<div class="app-image">
		<img src="https://lh3.googleusercontent.com/EhIjbN-_7eOO6XbcXAosX7elY-9CRxCOm5J6rLZ3pQGF7Yev6Av2kFdbxMH_RV2Hhnc=w170"  />
	</div>
	<div class="app-content">
		<div class="app-title">My Fancy App</div>
		<div class="app-publisher">Great Developer</div>
		<div class="app-rating app-rating--4"></div>
		<div class="app-price">FREE</div>
	</div>
</div>
<div class="app">
	<div class="app-image">
		<img src="https://lh3.googleusercontent.com/jWBBqrENpBVVCcMOekDOhhn-Zv_nAhWTysQK7zvANbyNd4UDodNlqoPpDE_XRCIpazdf=w170"  />
	</div>
	<div class="app-content">
		<div class="app-title">My Fancy App</div>
		<div class="app-publisher">Great Developer</div>
		<div class="app-rating app-rating--4"></div>
		<div class="app-price">FREE</div>
	</div>
</div>
<div class="app">
	<div class="app-image">
		<img src="https://lh3.googleusercontent.com/gprPZjj6uvk-lgzmgZmHPiZfyK_GVZe2oK0gKPO9hfGzVpz8KJLeKj4d2e3jOCR0Iq96=w170"  />
	</div>
	<div class="app-content">
		<div class="app-title">My Fancy App</div>
		<div class="app-publisher">Great Developer</div>
		<div class="app-rating app-rating--4"></div>
		<div class="app-price">FREE</div>
	</div>
</div>
<div class="app">
	<div class="app-image">
		<img src="https://lh5.ggpht.com/81M05pEyFiOqKt8CashUoz66iJAhL-3PHHbAil108QkU9sKeVZBuZaNJiV7b0gZ2GFU=w170"  />
	</div>
	<div class="app-content">
		<div class="app-title">My Fancy App</div>
		<div class="app-publisher">Great Developer</div>
		<div class="app-rating app-rating--4"></div>
		<div class="app-price">FREE</div>
	</div>
</div>
<div class="app">
	<div class="app-image">
		<img src="https://lh3.googleusercontent.com/iqBW6_pWJvv0i0ap7wat6TtWpr7Slyd6vU73E3Wtnr12ohR9qogOfSvD5unVIvdpens=w170"  />
	</div>
	<div class="app-content">
		<div class="app-title">My Fancy App</div>
		<div class="app-publisher">Great Developer</div>
		<div class="app-rating app-rating--4"></div>
		<div class="app-price">FREE</div>
	</div>
</div>
<div class="app">
	<div class="app-image">
		<img src="https://lh3.googleusercontent.com/yPtxiCYbMfMD5C8tfly7HfcyYidy1po8XmIEJCUtXb-Rs3lYKHCA1ABATbwgLckQAw=w170"  />
	</div>
	<div class="app-content">
		<div class="app-title">My Fancy App</div>
		<div class="app-publisher">Great Developer</div>
		<div class="app-rating app-rating--4"></div>
		<div class="app-price">FREE</div>
	</div>
</div>
<div class="app">
	<div class="app-image">
		<img src="https://lh3.googleusercontent.com/CSOQQrprvW0fn000Vo0P1NC1NWyQh4pKyL7ErjYC5vzJ_sHM8VjxtF6M9VUfRwWCvQM=w170"  />
	</div>
	<div class="app-content">
		<div class="app-title">My Fancy App</div>
		<div class="app-publisher">Great Developer</div>
		<div class="app-rating app-rating--4"></div>
		<div class="app-price">FREE</div>
	</div>
</div>
<div class="app">
	<div class="app-image">
		<img src="https://lh3.googleusercontent.com/s0xHGaQCikNaasjJHLYGBQSsKzq-foY-umKzjHwlnA8__jHBldPILVw6ycfRPzBY2Dil=w170"  />
	</div>
	<div class="app-content">
		<div class="app-title">My Fancy App</div>
		<div class="app-publisher">Great Developer</div>
		<div class="app-rating app-rating--4"></div>
		<div class="app-price">FREE</div>
	</div>
</div>
<div class="app">
	<div class="app-image">
		<img src="https://lh3.googleusercontent.com/9KA6P-cbEzQ9hL-zJnZIJGHxscepYq7v6f3mH5lAA3HjV0idsTUP3Nmb6p4KnM1QhGyU=w170"  />
	</div>
	<div class="app-content">
		<div class="app-title">My Fancy App</div>
		<div class="app-publisher">Great Developer</div>
		<div class="app-rating app-rating--4"></div>
		<div class="app-price">FREE</div>
	</div>
</div>
<div class="app">
	<div class="app-image">
		<img src="https://lh3.googleusercontent.com/14_Tce0JmfM_yD8WY21XIi-FQeh3KXiCUZ2SD1LI96nEtqIi25KJdzz8CvAP-vGMI9gD=w170"  />
	</div>
	<div class="app-content">
		<div class="app-title">My Fancy App</div>
		<div class="app-publisher">Great Developer</div>
		<div class="app-rating app-rating--4"></div>
		<div class="app-price">FREE</div>
	</div>
</div>
<div class="app">
	<div class="app-image">
		<img src="https://lh3.googleusercontent.com/QjY6gVl9rzZtHd9SVLLeDpCJKX6b-Fl0tO5zXyf-JF1yo27ZCI1DDhcbLcA-NF1PJIo=w170"  />
	</div>
	<div class="app-content">
		<div class="app-title">My Fancy App</div>
		<div class="app-publisher">Great Developer</div>
		<div class="app-rating app-rating--4"></div>
		<div class="app-price">FREE</div>
	</div>
</div>
<div class="app">
	<div class="app-image">
		<img src="https://lh3.googleusercontent.com/5Wpd_Na7ufDcgBfW9ct1K_4QCdb6X2nFJfL-Z0uB9hheGMGMH7MHwjO1L6oll41uAUk=w170"  />
	</div>
	<div class="app-content">
		<div class="app-title">My Fancy App</div>
		<div class="app-publisher">Great Developer</div>
		<div class="app-rating app-rating--4"></div>
		<div class="app-price">FREE</div>
	</div>
</div>
<div class="app">
	<div class="app-image">
		<img src="https://lh3.googleusercontent.com/i1etqz4QPGWF7Y9L2_zHbAjxANixgoi2Fm0Eg8VBJqNbjNWerPqS3_PZj-hZPoi9Q_c=w170"  />
	</div>
	<div class="app-content">
		<div class="app-title">My Fancy App</div>
		<div class="app-publisher">Great Developer</div>
		<div class="app-rating app-rating--4"></div>
		<div class="app-price">FREE</div>
	</div>
</div>
<div class="app">
	<div class="app-image">
		<img src="https://lh3.googleusercontent.com/szocIxEuvbNDcuqhPoKmNZfS8cXwkYiR3UDTpbbFxr87i6D88VGW_p9ChDdAsHf2gfk=w170"  />
	</div>
	<div class="app-content">
		<div class="app-title">My Fancy App</div>
		<div class="app-publisher">Great Developer</div>
		<div class="app-rating app-rating--4"></div>
		<div class="app-price">FREE</div>
	</div>
</div>
<div class="app">
	<div class="app-image">
		<img src="https://lh3.googleusercontent.com/TFpOsoMvZL-9UF-3q6ihYj_XwHA2etyBCUbMVmGFzfLnjO0RWUhoOGFNoCWoBF528cQ=w170"  />
	</div>
	<div class="app-content">
		<div class="app-title">My Fancy App</div>
		<div class="app-publisher">Great Developer</div>
		<div class="app-rating app-rating--4"></div>
		<div class="app-price">FREE</div>
	</div>
</div>
<div class="app">
	<div class="app-image">
		<img src="https://lh3.googleusercontent.com/RCtM94gOfz0hkYisChS6R1oyaQV1XHXS47BuX81Ai-h-k_ly5Jiuc3s5IZHRtdJH04o=w170"  />
	</div>
	<div class="app-content">
		<div class="app-title">My Fancy App</div>
		<div class="app-publisher">Great Developer</div>
		<div class="app-rating app-rating--4"></div>
		<div class="app-price">FREE</div>
	</div>
</div>
<div class="app">
	<div class="app-image">
		<img src="https://lh3.googleusercontent.com/vY6CcG84EiozSiZwM1v1_UFEeOK2ADXlHWVV-vgl0qkF-dNcpTr-Mme7YpTPc0YtHoU=w170"  />
	</div>
	<div class="app-content">
		<div class="app-title">My Fancy App</div>
		<div class="app-publisher">Great Developer</div>
		<div class="app-rating app-rating--4"></div>
		<div class="app-price">FREE</div>
	</div>
</div>
<div class="app">
	<div class="app-image">
		<img src="https://lh3.googleusercontent.com/7tyRlc-92hpCOpY-Y-j7_POgjlV-H5M-bX7MMHzl_AoJBP2NrO76k7LDOUY0U3uUgg=w170"  />
	</div>
	<div class="app-content">
		<div class="app-title">My Fancy App</div>
		<div class="app-publisher">Great Developer</div>
		<div class="app-rating app-rating--4"></div>
		<div class="app-price">FREE</div>
	</div>
</div>
<div class="app">
	<div class="app-image">
		<img src="https://lh3.googleusercontent.com/qq7iKZU8JWRwYYoAYtLGmSvk7Wq3ZVeELVbeq7_jwD7-LRXKiJQfc8j8lvHhjCXJP-k=w170"  />
	</div>
	<div class="app-content">
		<div class="app-title">My Fancy App</div>
		<div class="app-publisher">Great Developer</div>
		<div class="app-rating app-rating--4"></div>
		<div class="app-price">FREE</div>
	</div>
</div>
<div class="app">
	<div class="app-image">
		<img src="https://lh3.googleusercontent.com/iegfQl3DU16FbD8mxajV4Akp_RSZdE729UU3hn_qRZZ3UPfxgYTwWUZrFDFLnn1tYg9Z=w170"  />
	</div>
	<div class="app-content">
		<div class="app-title">My Fancy App</div>
		<div class="app-publisher">Great Developer</div>
		<div class="app-rating app-rating--4"></div>
		<div class="app-price">FREE</div>
	</div>
</div>
<div class="app">
	<div class="app-image">
		<img src="https://lh3.googleusercontent.com/B9zmFmCdZ7L4o30HMVWwqPm_zisFoJzWwryEReuPN_puDSRmJ6K92ptZdGDiO8FOoEFu=w170"  />
	</div>
	<div class="app-content">
		<div class="app-title">My Fancy App</div>
		<div class="app-publisher">Great Developer</div>
		<div class="app-rating app-rating--4"></div>
		<div class="app-price">FREE</div>
	</div>
</div>
<div class="app">
	<div class="app-image">
		<img src="https://lh3.googleusercontent.com/aaLUn-Ev1VLp1WqadTT6fWtqanrnNCqQOoh6NHIyGcrfPthaYnlB02YgX_JscxidUN8=w170"  />
	</div>
	<div class="app-content">
		<div class="app-title">My Fancy App</div>
		<div class="app-publisher">Great Developer</div>
		<div class="app-rating app-rating--4"></div>
		<div class="app-price">FREE</div>
	</div>
</div>
<div class="app">
	<div class="app-image">
		<img src="https://lh3.googleusercontent.com/w0RF_J1dlfGR8dIyv1BJH6kmauvX6R-PsG87iWfi9Me9t0VIETK6KclXXlKhmZP5ECAo=w170"  />
	</div>
	<div class="app-content">
		<div class="app-title">My Fancy App</div>
		<div class="app-publisher">Great Developer</div>
		<div class="app-rating app-rating--4"></div>
		<div class="app-price">FREE</div>
	</div>
</div>
<div class="app">
	<div class="app-image">
		<img src="https://lh3.googleusercontent.com/-M679h76FAjLJI6sv9VYUGKLXK7jdG1_95XRV8DJslC1e3_2QAesO7H7jDtDYEObTc3w=w170"  />
	</div>
	<div class="app-content">
		<div class="app-title">My Fancy App</div>
		<div class="app-publisher">Great Developer</div>
		<div class="app-rating app-rating--4"></div>
		<div class="app-price">FREE</div>
	</div>
</div>
<div class="app">
	<div class="app-image">
		<img src="https://lh3.googleusercontent.com/_4zBNFjA8S9yjNB_ONwqBvxTvyXYdC7Nh1jYZ2x6YEcldBr2fyijdjM2J5EoVdTpnkA=w170"  />
	</div>
	<div class="app-content">
		<div class="app-title">My Fancy App</div>
		<div class="app-publisher">Great Developer</div>
		<div class="app-rating app-rating--4"></div>
		<div class="app-price">FREE</div>
	</div>
</div>
<div class="app">
	<div class="app-image">
		<img src="https://lh3.googleusercontent.com/7uRfJe2KkpKxZuMvY4OjhIq-TJrMeHgWYQt0H7LHZl4WNDAYjI6FFrLSsLhj2g8cqKr5=w170"  />
	</div>
	<div class="app-content">
		<div class="app-title">My Fancy App</div>
		<div class="app-publisher">Great Developer</div>
		<div class="app-rating app-rating--4"></div>
		<div class="app-price">FREE</div>
	</div>
</div>
<div class="app">
	<div class="app-image">
		<img src="https://lh3.googleusercontent.com/uvWZ3llxHIv8R63c-MAqF8HfRg6KQ9e270wh981bmSDaeBbfRpnvl4FJMSYsKxJDZAY=w170"  />
	</div>
	<div class="app-content">
		<div class="app-title">My Fancy App</div>
		<div class="app-publisher">Great Developer</div>
		<div class="app-rating app-rating--4"></div>
		<div class="app-price">FREE</div>
	</div>
</div>
<div class="app">
	<div class="app-image">
		<img src="https://lh3.googleusercontent.com/Yfps1k5jfeCC6j3ahm1s6dyUrSHusfk_1WDSTRjSNpZA49iYSKd_uljgs9UScBXgISOX=w170"  />
	</div>
	<div class="app-content">
		<div class="app-title">My Fancy App</div>
		<div class="app-publisher">Great Developer</div>
		<div class="app-rating app-rating--4"></div>
		<div class="app-price">FREE</div>
	</div>
</div>
<div class="app">
	<div class="app-image">
		<img src="https://lh3.googleusercontent.com/KHrIYcMRNo4dVP2kOgL2U5z-Qs13Coy_9cUapWhstWBZkjiJfgwPzW0iNVW8sY8vEnQ=w170"  />
	</div>
	<div class="app-content">
		<div class="app-title">My Fancy App</div>
		<div class="app-publisher">Great Developer</div>
		<div class="app-rating app-rating--4"></div>
		<div class="app-price">FREE</div>
	</div>
</div>
<div class="app">
	<div class="app-image">
		<img src="https://lh3.googleusercontent.com/sW6LJmrdK2en4vv9B8ny-HVa2901pTz7MgYvxSlrumY1ftxEZtVu1S9atLqR2OkXTnI=w170"  />
	</div>
	<div class="app-content">
		<div class="app-title">My Fancy App</div>
		<div class="app-publisher">Great Developer</div>
		<div class="app-rating app-rating--4"></div>
		<div class="app-price">FREE</div>
	</div>
</div>
<div class="app">
	<div class="app-image">
		<img src="https://lh3.googleusercontent.com/jj2z8DZ-Z5rV-Y4IY0ZklkuPjCchjeeisflFD0dU_zlJNpbUJkDTQpAMlc5rwutKFSU=w170"  />
	</div>
	<div class="app-content">
		<div class="app-title">My Fancy App</div>
		<div class="app-publisher">Great Developer</div>
		<div class="app-rating app-rating--4"></div>
		<div class="app-price">FREE</div>
	</div>
</div>
<div class="app">
	<div class="app-image">
		<img src="https://lh3.googleusercontent.com/NmWh7Jnm_VxC-SOfT3VhqmnGlc4sMWLJh9SDfBL1hRx7PG2WA0yS8VY7Mhi1m7P7UQ=w170"  />
	</div>
	<div class="app-content">
		<div class="app-title">My Fancy App</div>
		<div class="app-publisher">Great Developer</div>
		<div class="app-rating app-rating--4"></div>
		<div class="app-price">FREE</div>
	</div>
</div>
<div class="app">
	<div class="app-image">
		<img src="https://lh3.googleusercontent.com/BQnvuZR500pg2ulvv3FBmRI93ODz3AjNfbz92hCieuJLvmbGY36AKhETMTTfTDgpPQI=w170"  />
	</div>
	<div class="app-content">
		<div class="app-title">My Fancy App</div>
		<div class="app-publisher">Great Developer</div>
		<div class="app-rating app-rating--4"></div>
		<div class="app-price">FREE</div>
	</div>
</div>
<div class="app">
	<div class="app-image">
		<img src="https://lh3.googleusercontent.com/EIX5pscg5l1Quvsz17LKk6W5oCSIxOfukBAUmbGR4Uvs1uKDYvbNr0XYE7hqpI3KHQ=w170"  />
	</div>
	<div class="app-content">
		<div class="app-title">My Fancy App</div>
		<div class="app-publisher">Great Developer</div>
		<div class="app-rating app-rating--4"></div>
		<div class="app-price">FREE</div>
	</div>
</div>
<div class="app">
	<div class="app-image">
		<img src="https://lh3.googleusercontent.com/J41hsV2swVteoeB8pDhqbQR3H83NrEBFv2q_kYdq1xp9vsI1Gz9A9pzjcwX_JrZpPGsa=w170"  />
	</div>
	<div class="app-content">
		<div class="app-title">My Fancy App</div>
		<div class="app-publisher">Great Developer</div>
		<div class="app-rating app-rating--4"></div>
		<div class="app-price">FREE</div>
	</div>
</div>
<div class="app">
	<div class="app-image">
		<img src="https://lh3.googleusercontent.com/lTfegIdK9hyApdZfYASLCxH4QDV_lya7Xgf-zSHL0XF6x3D0KfyK6LDX863FvlCZzFU=w170"  />
	</div>
	<div class="app-content">
		<div class="app-title">My Fancy App</div>
		<div class="app-publisher">Great Developer</div>
		<div class="app-rating app-rating--4"></div>
		<div class="app-price">FREE</div>
	</div>
</div>
<div class="app">
	<div class="app-image">
		<img src="https://lh3.googleusercontent.com/NjfJVcXryyqXkYWyv9RbXquLxvsbZO_mKZiHgqWUqx8Gr9wqd7dr8ekzXXs_MxygYQ=w170"  />
	</div>
	<div class="app-content">
		<div class="app-title">My Fancy App</div>
		<div class="app-publisher">Great Developer</div>
		<div class="app-rating app-rating--4"></div>
		<div class="app-price">FREE</div>
	</div>
</div>
<div class="app">
	<div class="app-image">
		<img src="https://lh5.ggpht.com/tq3WqEUxtRyBn-d_0t3j6WKNHuJDrmLq-FE3GAYrsAMQFIaS7FIgRLfzzql2SvfvLqto=w170"  />
	</div>
	<div class="app-content">
		<div class="app-title">My Fancy App</div>
		<div class="app-publisher">Great Developer</div>
		<div class="app-rating app-rating--4"></div>
		<div class="app-price">FREE</div>
	</div>
</div>
<div class="app">
	<div class="app-image">
		<img src="https://lh3.googleusercontent.com/ZI5ciG-k3gNSz1irE6iEoE8e1F4bL1cn--XkXFV6znDP-ud62AKFk4Gj11sMcdeN-qVu=w170"  />
	</div>
	<div class="app-content">
		<div class="app-title">My Fancy App</div>
		<div class="app-publisher">Great Developer</div>
		<div class="app-rating app-rating--4"></div>
		<div class="app-price">FREE</div>
	</div>
</div>
<div class="app">
	<div class="app-image">
		<img src="https://lh3.googleusercontent.com/21pq9fW3lxeVkQyBQBfuva0cBObSdDYirabkbl5fyGL06nukMnX7_HuegDK-clNGiRs=w170"  />
	</div>
	<div class="app-content">
		<div class="app-title">My Fancy App</div>
		<div class="app-publisher">Great Developer</div>
		<div class="app-rating app-rating--4"></div>
		<div class="app-price">FREE</div>
	</div>
</div>
<div class="app">
	<div class="app-image">
		<img src="https://lh3.googleusercontent.com/-E-jAfuwURMbYgvRhS8xLL8p280U9ueeC-IDrJOFmxGZpBJCWOY4jTbOKK1DZkPIFAUu=w170"  />
	</div>
	<div class="app-content">
		<div class="app-title">My Fancy App</div>
		<div class="app-publisher">Great Developer</div>
		<div class="app-rating app-rating--4"></div>
		<div class="app-price">FREE</div>
	</div>
</div>
<div class="app">
	<div class="app-image">
		<img src="https://lh3.ggpht.com/GZXkzHxbRYGnehTg0ehjslPj4ummxV-oQklcE1Ba7hmq4zvBKfy2bR7zWEMOWqlcK6k=w170"  />
	</div>
	<div class="app-content">
		<div class="app-title">My Fancy App</div>
		<div class="app-publisher">Great Developer</div>
		<div class="app-rating app-rating--4"></div>
		<div class="app-price">FREE</div>
	</div>
</div>
<div class="app">
	<div class="app-image">
		<img src="https://lh3.googleusercontent.com/Of-AumxrOfLu6_0dznLnxEZMeL1jfJLajW7FAe5JH5GE_g_biEsWdGbaRpRuiQZpDpc=w170"  />
	</div>
	<div class="app-content">
		<div class="app-title">My Fancy App</div>
		<div class="app-publisher">Great Developer</div>
		<div class="app-rating app-rating--4"></div>
		<div class="app-price">FREE</div>
	</div>
</div>
<div class="app">
	<div class="app-image">
		<img src="https://lh3.ggpht.com/e3oZddUHSC6EcnxC80rl_6HbY94sM63dn6KrEXJ-C4GIUN-t1XM0uYA_WUwyhbIHmVMH=w170"  />
	</div>
	<div class="app-content">
		<div class="app-title">My Fancy App</div>
		<div class="app-publisher">Great Developer</div>
		<div class="app-rating app-rating--4"></div>
		<div class="app-price">FREE</div>
	</div>
</div>
<div class="app">
	<div class="app-image">
		<img src="https://lh3.googleusercontent.com/2gptGiZeD2gEBSZmCUHMIdBsFwyDqlKFMYCI11STvzeCKG-5THTUmANhQvGxce2md5kg=w170"  />
	</div>
	<div class="app-content">
		<div class="app-title">My Fancy App</div>
		<div class="app-publisher">Great Developer</div>
		<div class="app-rating app-rating--4"></div>
		<div class="app-price">FREE</div>
	</div>
</div>
<div class="app">
	<div class="app-image">
		<img src="https://lh3.googleusercontent.com/rFMFBuepALK9nEDjfomGoEkJQYu2XsweJXnEufJlmHk2kP8jxKRMOkFhWGAaS5KRAeI=w170"  />
	</div>
	<div class="app-content">
		<div class="app-title">My Fancy App</div>
		<div class="app-publisher">Great Developer</div>
		<div class="app-rating app-rating--4"></div>
		<div class="app-price">FREE</div>
	</div>
</div>
<div class="app">
	<div class="app-image">
		<img src="https://lh3.googleusercontent.com/I1EhmRMKCccwWLIbKN4VSOC9QsqC4sZG_mVwMZ0Q4-ygFXCeFwWKcjEc2TcuTZjGVr0=w170"  />
	</div>
	<div class="app-content">
		<div class="app-title">My Fancy App</div>
		<div class="app-publisher">Great Developer</div>
		<div class="app-rating app-rating--4"></div>
		<div class="app-price">FREE</div>
	</div>
</div>
<div class="app">
	<div class="app-image">
		<img src="https://lh3.googleusercontent.com/jGROat7ETmUq1PEgtpb4r5bvuxv1cZgi9v9ejICu34-yMTFUzT0B00V-WfRVdJJcqA=w170"  />
	</div>
	<div class="app-content">
		<div class="app-title">My Fancy App</div>
		<div class="app-publisher">Great Developer</div>
		<div class="app-rating app-rating--4"></div>
		<div class="app-price">FREE</div>
	</div>
</div>
<div class="app">
	<div class="app-image">
		<img src="https://lh3.googleusercontent.com/QfAEt_ya6-n8w_TD9-PsghFC2DMSO7fLGNZB4cQ3RtbBbHFkXJE_gxOc3l32-j6LXg=w170"  />
	</div>
	<div class="app-content">
		<div class="app-title">My Fancy App</div>
		<div class="app-publisher">Great Developer</div>
		<div class="app-rating app-rating--4"></div>
		<div class="app-price">FREE</div>
	</div>
</div>
<div class="app">
	<div class="app-image">
		<img src="https://lh3.ggpht.com/fZ2SopPwR0s919VzW3xWYYpNkLRDiEN4RV9-cQg0ZzS5auuSeYV_Sflmg8ynz_PFKFg=w170"  />
	</div>
	<div class="app-content">
		<div class="app-title">My Fancy App</div>
		<div class="app-publisher">Great Developer</div>
		<div class="app-rating app-rating--4"></div>
		<div class="app-price">FREE</div>
	</div>
</div>
<div class="app">
	<div class="app-image">
		<img src="https://lh5.ggpht.com/sf4vsF7wWXsyeJnj-K9HuVr6QjPaimJdmhVTju66mt22khIoSp99oIa-93xxggsm-8c=w170"  />
	</div>
	<div class="app-content">
		<div class="app-title">My Fancy App</div>
		<div class="app-publisher">Great Developer</div>
		<div class="app-rating app-rating--4"></div>
		<div class="app-price">FREE</div>
	</div>
</div>
<div class="app">
	<div class="app-image">
		<img src="https://lh3.googleusercontent.com/nvsp5ZTEZgkwU38QZuQDQCx1lgsnQ_KIlxZ8BV-AfEUTBISbNbijjpWfhdRBApCMWtE=w170"  />
	</div>
	<div class="app-content">
		<div class="app-title">My Fancy App</div>
		<div class="app-publisher">Great Developer</div>
		<div class="app-rating app-rating--4"></div>
		<div class="app-price">FREE</div>
	</div>
</div>
<div class="app">
	<div class="app-image">
		<img src="https://lh3.googleusercontent.com/AEUm_nsufnYaRVkZ4opiyGVWqbcbo7PF1fWxQvxGSaA5G4kN5s80oxf16pwkP6aOHV8=w170"  />
	</div>
	<div class="app-content">
		<div class="app-title">My Fancy App</div>
		<div class="app-publisher">Great Developer</div>
		<div class="app-rating app-rating--4"></div>
		<div class="app-price">FREE</div>
	</div>
</div>
<div class="app">
	<div class="app-image">
		<img src="https://lh3.googleusercontent.com/fRBXUbxuSI_DCi5WSTPZcIpiE_Dalb3ZrQ_g0dz6_wAYaql8w1Ni4swjd_U9lnbA7Fg=w170"  />
	</div>
	<div class="app-content">
		<div class="app-title">My Fancy App</div>
		<div class="app-publisher">Great Developer</div>
		<div class="app-rating app-rating--4"></div>
		<div class="app-price">FREE</div>
	</div>
</div>
<div class="app">
	<div class="app-image">
		<img src="https://lh3.googleusercontent.com/XzGswZCKeR_FGaH_C-UwY6InLkeLWFa0IhHq6qzUQqOVbbzGb_f4IycN9-4zf2QCoA=w170"  />
	</div>
	<div class="app-content">
		<div class="app-title">My Fancy App</div>
		<div class="app-publisher">Great Developer</div>
		<div class="app-rating app-rating--4"></div>
		<div class="app-price">FREE</div>
	</div>
</div>
<div class="app">
	<div class="app-image">
		<img src="https://lh3.googleusercontent.com/XqlNc3W0zhyfBbtjXLMGb5ZJZ4Dy0cpNcGMWNNw3j2WFmAO_aSilGEArCWX3bIWXCCCL=w170"  />
	</div>
	<div class="app-content">
		<div class="app-title">My Fancy App</div>
		<div class="app-publisher">Great Developer</div>
		<div class="app-rating app-rating--4"></div>
		<div class="app-price">FREE</div>
	</div>
</div>
<div class="app">
	<div class="app-image">
		<img src="https://lh3.googleusercontent.com/zAo86LOPuVVaBLrPobBGyDRBILIBmOVYSvHugr-86h-Ns_V-cWJnRHKQfyX-nV2JCSg=w170"  />
	</div>
	<div class="app-content">
		<div class="app-title">My Fancy App</div>
		<div class="app-publisher">Great Developer</div>
		<div class="app-rating app-rating--4"></div>
		<div class="app-price">FREE</div>
	</div>
</div>
<div class="app">
	<div class="app-image">
		<img src="https://lh3.googleusercontent.com/S0p-qRJO5f4T-gaHLctER08TybE7PDCO64N8JC2CTwmxMTxSrzRB5rbGD-Ud98qbxus=w170"  />
	</div>
	<div class="app-content">
		<div class="app-title">My Fancy App</div>
		<div class="app-publisher">Great Developer</div>
		<div class="app-rating app-rating--4"></div>
		<div class="app-price">FREE</div>
	</div>
</div>
<div class="app">
	<div class="app-image">
		<img src="https://lh3.googleusercontent.com/H_sOIa2wAK3Kc8un3af_clcNJuTA5zDzjY4v0H3wvuUYIOtcdcOnTRqIcz8ehijl7FE=w170"  />
	</div>
	<div class="app-content">
		<div class="app-title">My Fancy App</div>
		<div class="app-publisher">Great Developer</div>
		<div class="app-rating app-rating--4"></div>
		<div class="app-price">FREE</div>
	</div>
</div>
<div class="app">
	<div class="app-image">
		<img src="https://lh3.googleusercontent.com/KNO5fvTDrQ2UfsqNl--wBz_SbmYbMOW2LddGTx7o-xXDEZdtlsV6eU8PeCKXby_WA6P2=w170"  />
	</div>
	<div class="app-content">
		<div class="app-title">My Fancy App</div>
		<div class="app-publisher">Great Developer</div>
		<div class="app-rating app-rating--4"></div>
		<div class="app-price">FREE</div>
	</div>
</div>
<div class="app">
	<div class="app-image">
		<img src="https://lh3.googleusercontent.com/q4_5RvXellkof4rK0Z09TYansoIHa7HjvPu82ZJVAt0OoYCeHv76BomWAaE3prVRQi4=w170"  />
	<div class="app">
	<div class="app-content">
		<div class="app-title">My Fancy App</div>
		<div class="app-publisher">Great Developer</div>
		<div class="app-rating app-rating--4"></div>
		<div class="app-price">FREE</div>
	</div>
</div>
	</div>
	<div class="app-image">
		</div>
		<div class="app-content">
			<div class="app-title">My Fancy App</div>
			<div class="app-publisher">Great Developer</div>
			<div class="app-rating app-rating--4"></div>
			<div class="app-price">FREE</div>
		</div>
	</div>
            
          
!
            
              $d-apps-header: 48px;
$d-sidebar-width: 200px;
$d-play-header: 60px;
$d-sidebar-spacing: 50px;
$d-search-bar-height: 30px;
$d-icon: 32px;
$d-sidebar-top-half: 288px;
$d-star-size: 14px;
$d-app-card-width: 160px;
$d-app-card-height: 245px;

$d-medium-dp: 770px;
$d-small-dp: 620px;
$d-xlarge-dp: 1100px;
$d-large-dp: 930px;

$c-background: #EEE;
$c-sidebar-bg: rgba(245,245,245,0.95);
$c-android: #689F38;
$c-text: rgb(115, 115, 115);
$c-ui-search: #4486F8;

$f-regular: "Roboto",UILanguageFont,Arial,sans-serif;

/***************************************/
/** Set up Flexbox and Grid Fallbacks **/
/***************************************/

// No support for flexbox or grid.
.grid-container {
  display: inline-block;
  
  & > * {
    display: inline-block;
    vertical-align: middle;
  }
}

// It supports flexbox, fallback on that.
@supports(display: flex) {
  .grid-container {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-around;
  }
}

// Unfortunately CSS Grid in Edge is still super weird.
@supports((display: grid) and (not(-ms-ime-align: auto))) {
  .grid-container {
    display: grid;
    grid-template-rows: $d-play-header $d-apps-header 1fr;
    grid-template-columns: $d-sidebar-width 1fr;
  }
}

// No support for flexbox.
.flex-container {
  display: inline-block;
  
  & > * {
    display: inline-block;
    vertical-align: middle;
  }
}

.flex-container--vertical {
  & > * {
    display: block;
    width: 100%;
  }
}

// It supports flexbox, all is well.
@supports(display: flex) {
  .flex-container {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-around;
  }
  
  .flex-container--vertical {
    flex-direction: column;
  }
}

/*****************/
/** Play Header **/
/*****************/

.play-header {
  grid-area: 1 / 1 / span 1 / span 2;
  align-items: center;
  width: 100%;
  height: $d-play-header;
  justify-content: flex-start;
  
  @media screen and (max-width: $d-small-dp) {
    display: none;
  }
}

.logo {
  height: 39px;
  margin: 0 30px;
}

.logo--small {
  height: 25px;
}

.logo img {
  height: 100%;
}

.play-header-search {
  flex: 1;
  justify-content: flex-start;
  flex-wrap: nowrap;
  white-space: nowrap;
}

.search-bar {
  width: 100%;
  max-width: 590px;
  padding: 0;
  height: $d-search-bar-height;
  border: 1px solid #cdcdcd;
  box-sizing: border-box;
  font: 16px arial,sans-serif;
  padding-left: 8px;
  &:focus {
    outline: 1px solid $c-ui-search;
  }
}

.search-button {
  outline: none;
  border: none;
  color: white;
  height: $d-search-bar-height;
  width: 60px;
  margin-left: -1px;
  border-top-right-radius: 2px;
  border-bottom-right-radius: 2px;
  
  background-image: url('https://s3-us-west-2.amazonaws.com/s.cdpn.io/122932/google-search-icon-white.png');
  background-size: 20px;
  background-color: $c-ui-search;
  background-repeat: no-repeat;
  background-position: center;
}

.play-store-icons {
  @media screen and (max-width: $d-xlarge-dp) {
    display: none;
  }
}

.play-store-icon{
  height: $d-icon;
  width: $d-icon;
  margin-left: 15px;
  text-align: center;
  line-height: $d-icon;
  svg {
    vertical-align: middle;
  }
}

.play-store-icon--avatar {
  background: lightblue;
  border-radius: 50%;
  color: white;
  margin-right: 30px;
}

/*****************/
/** Apps Header **/
/*****************/

.apps-header {
  grid-area: 2 / 2 / span 1 / span 2;
  background: white;
  box-shadow: 0 1px 0 rgba(0,0,0,0.05);
  align-items: center;
  flex-wrap: nowrap;
  z-index: 1;
  // For non css-grid, we need to know width and height.
  width: calc(100% - #{$d-sidebar-width});
  height: $d-apps-header;
  
  // We don't want any items to wrap in this row.
  & .flex-container {
    flex-wrap: nowrap;
  }
  
  // Sidebar is gone, need to adjust.
  @media screen and (max-width: $d-medium-dp) {
    grid-area: 2 / 1 / span 1 / span 2;
    width: 100%;
  }
  
  @media screen and (max-width: $d-small-dp) {
    display: none;
  }
}

.apps-header--small {
  display: none;
  justify-content: space-between;
  padding: 0 15px;
  @media screen and (max-width: $d-small-dp) {
    display: flex;
  }
}

.apps-header-item {
  line-height: $d-apps-header;
  height: 100%;
  white-space: nowrap;
}

.app-actions {
  flex: 1;
  justify-content: flex-end;
  align-items: center;
  margin-right: 30px;
}

.app-action{
  margin: 0 10px;
  height: 30px;
  outline: none;
  background: white;
  border: 1px solid #bababa;
  border-radius: 2px;
  padding: 0 7px;
  svg {
    height: 17px;
  }
}

.app-action--settings {
  padding: 0 14px;
}

.android-tag {
  grid-area: 2 / 1 / span 1 / span 1;
  background: $c-android;
  width: $d-sidebar-width;
  text-transform: capitalize;
  text-align: center;
  color: white;
  line-height: $d-apps-header;
  justify-content: flex-start;
  align-items: center;
  font-size: 18px;
  
  svg {
    margin: 0 20px;
  }
  
  @media screen and (max-width: $d-medium-dp) {
    display: none;
  }
}

.sticky {
  position: sticky;
  top: 0;
}

.header-link {
  padding: 0 14px;
  color: #737373;
  font-weight: 300;
  color: $c-text;
  font-size: 14px;
  &:hover {
    background: rgba(0,0,0,0.05);
    cursor: pointer;
  }
}

.categories-dropdown {
  margin-left: 38px;
  align-items: center;
}

.header-divider {
  height: 30px;
  background: #d6d6d6;
  width: 1px;
  margin: 5px;
}

/*************/
/** Sidebar **/
/*************/

.sidebar-wrapper {
  grid-area: 3 / 1 / span 1 / span 1;
  height: 100%;
  width: $d-sidebar-width;
  position: relative;
  vertical-align: top;
  @media screen and (max-width: $d-medium-dp) {
    display: none;
  }
}

.sidebar {
  top: $d-apps-header;
  background: green;
  height: 488px;
  width: 200px;
  background: $c-sidebar-bg;
  box-shadow: 0 1px 6px rgba(0,0,0,0.1);
  justify-content: flex-start;
  
  grid-template-columns: 24px 1fr;
  grid-template-rows: $d-sidebar-top-half 1fr;
}

.sidebar-arrow {
  grid-area: 1 / 1 / span 1 / span 1;
  background: red;
  height: $d-sidebar-top-half;
  background: white;
  
  svg {
    position: relative;
    top: 50%;
    transform: translateY(-50%)
  }
}

.sidebar-top-links {
  grid-area: 1 / 2 / span 1 / span 1;
  flex-direction: column;
  justify-content: flex-start;
  padding-top: 6px;
  vertical-align: top;
}

.sidebar-top-link {
  padding-left: 23px;
  box-sizing: border-box;
  &:hover {
    background: rgba(0,0,0,0.05);
    cursor: pointer;
  }
}

.sidebar-primary {
  padding-top: 8px;
  padding-bottom: 8px;
  font-size: 18px;
  
  &.selected {
    color: $c-android;
    font-weight: 300;
  }
}

.sidebar-secondary {
  padding-top: 6px;
  padding-bottom: 6px;
  font-size: 14px;
}

.sidebar-divider {
  height: 1px;
  background: rgba(0,0,0,0.1);
  margin: 14px 0;
  width: calc(100% - 14px);
}

.sidebar-bottom-links {
  grid-area: 2 / 1 / span 1 / span 2;
  border-top: 1px solid rgba(217,217,217,1);
  padding: 10px 0;
  background: $c-background;
  width: 100%;
}

.sidebar-bottom-link {
  padding-left: 20px;
  padding-top: 6px;
  padding-bottom: 6px;
  box-sizing: border-box;
  font-size: 14px;
  &:hover {
    background: rgba(0,0,0,0.05);
    cursor: pointer;
  }
}

/**************/
/** App Grid **/
/**************/

.app-grid {
  grid-area: 3 / 2 / span 1 / span 1;
  grid-template-columns: repeat(auto-fill, $d-app-card-width);
  grid-template-rows: 67px $d-app-card-height;
  grid-auto-rows: 245px;
  grid-gap: 10px;
  justify-content: flex-start;
  
  // 99% for when we use inline-block since we have whitespace between tags.
  width: calc(99% - #{$d-sidebar-width + $d-sidebar-spacing});
  padding-left: $d-sidebar-spacing;  
  
  @media screen and (max-width: $d-medium-dp) {
    grid-area: 3 / 1 / span 1 / span 2;
    justify-content: center;
    padding-left: 0;
    width: 100%;
    text-align: center;
  }
}

.apps-title {
  grid-column: -1 / 1;
  font-weight: 100;
  font-size: 28px;
  width: 100%;
}

.app {
  background: white;
  box-shadow: 0 2px 4px rgba(0,0,0,0.1);
  cursor: pointer;
  border-radius: 2px;
  overflow: hidden;
  font-size: 13px;
  position: relative;
  width: $d-app-card-width;
  height: $d-app-card-height;
  margin-left: 10px;
  margin-bottom: 10px;
  text-align: left;
  
  // Need to do this separately for image hover overlay.
  .app-image,
  .app-content {
    max-width: calc(100% - 20px);
    padding: 10px;
  }
  
  &:hover {
    .app-image:after {
      transition: opacity 0.3s;
      opacity: 1;
    } 
  }
}

.app-image {
  position: relative;
  cursor: pointer;
  text-align: center;
  
  &:after {
    transition: opacity 0.3s;
    content: '';
    height: 100%;
    width: 100%;
    position: absolute;
    top: 0;
    left: 0;
    background: rgba(0,0,0,0.4);
    opacity: 0;
  }
  
  img {
    max-width: 128px;
  }
}

.app-title {
  white-space: nowrap;
  overflow: hidden;
  position: relative;
  font-size: 16px;
  
  &:before {
    counter-increment: numapps;
    content: counter(numapps) '. '; 
  }
  
  &:after {
    content: '';
    position: absolute;
    width: 20%;
    height: 100%;
    top: 0;
    right: 0;
    background: linear-gradient(to right, rgba(255,255,255,0) 0%,rgba(255,255,255,1) 81%);
    display: block;
  }
}

.app-price {
  color: $c-android;
  text-transform: uppercase;
  position: absolute;
  right: 10px;
  bottom: 10px;
}

.app-rating {
  position: absolute;
  left: 10px;
  bottom: 10px;
  height: 16px;
  width: 5 * $d-star-size;
  // Light background stars.
  background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAA4AAAAOCAQAAAC1QeVaAAAAYElEQVR4AY3QQQeEIRCA4T13iqFDp04dYoh+2vv/7Y7YL4b66j1MPCn6fA+9438hiI0NKrpBhGGJQxKZSp/YbZdJCwvDVda1not7k/ZQm3SPw6qWTYcElDgPRZRw9X2HfsTTkjWVYOnFAAAAAElFTkSuQmCC);
  
  &:before {
    content:'';
    display: block;
    height: 16px;
    // Dark stars.
    background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAA4AAAAOCAQAAAC1QeVaAAAAY0lEQVR4AWP4jwcSloSB4oTiBCCFQ/JB8QN0SYS+/0CYgCZZXFDcUHyg+ANIEkgeAPIKEJILgIKocAHCWHTpBWh2Fl+AS10AipEgCRY+AIRAGk2y2ADoxwCwogAgy4Co4MMDAQ52uOmaLCe/AAAAAElFTkSuQmCC);
  }
}

// Change the width of the dark stars to get a rating.
@for $i from 1 through 5 {
  .app-rating--#{$i}::before { 
    width: $i * $d-star-size;
  }
}

.app-content {
  & > *:hover {
    text-decoration: underline;
  }
}

/************************************/
/** Extra CSS Grid Fallback Things **/
/************************************/

.inline-helper {
  // Used to vertically align all the inline items properly.
  // Inserted alongside inline items.
  height: 100%;
}

.play-store-icons,
.app-actions {
  float: right;
  height: 100%;
}

@supports(display: flex) {
  .play-store-icons,
  .app-actions {
    float: none;
    height: auto;
  }
}

// Again, CSS Grid in Edge is weird so lets not use it for now.
@supports((display: grid) and (not(-ms-ime-align: auto))) {
  .grid-container--outer {
    grid-template-rows: $d-play-header $d-apps-header 1fr;
    grid-template-columns: $d-sidebar-width 1fr;
    
    @media screen and (max-width: $d-small-dp) {
      grid-template-rows: 0 $d-apps-header 1fr;
    }
  }
  
  .apps-header,
  .app-grid {
    width: auto;
  }
}

html, body {
  margin: 0;
  background: $c-background;
  width: 100%;
}

body {
  counter-reset: numapps; 
}

h1, h2, h3, p, div, button, input {
  font-family: $f-regular;
}

@import url('https://fonts.googleapis.com/css?family=Roboto:100,300');
            
          
!
999px
Loading ..................

Console