pagerunners tips n' tricks snippets page one

.button {
  background-color: #123456;
  border: none;
  color: white;
  padding: 10px 25px;
  text-align: center;
  text-decoration: none;
  font-size: 18px;
}

@media only screen and (max-width: 600px) {
  .columns {
    width: 100%;
  }
}
</style>
</head>
<body>

<h2 style="text-align:center">Responsive Island Country Tables</h2>
<p style="text-align:center">A subtle and cool effect to amaze your friends and enemies...</p>

<div class="columns">
  <ul class="Country">
    <li class="header"  style="background-color:#660000">Aruba</li>
    <li class="grey">Location: 12 30 N, 69 58 W</li>
    <li>Climate: Tropical Marine</li>
    <li>Population: 125,063</li>
    <li>Capital: Oranjestad</li>
    <li>Industries: Tourism, Banking</li>
    <li class="grey"><a href="index.htm" class="button">Home</a></li>
  </ul>
</div>

<div class="columns">
  <ul class="Country">
    <li class="header" style="background-color:#9999FF">Antigua</li>
    <li class="grey">Geography: total : 443 sq km</li>
    <li>Climate: Tropical Marine</li>
    <li>Population: 102,634</li>
    <li>Capital: Saint John's</li>
    <li>Industries: Economic overview: dual island-tourism, construction</li>
    <li class="grey"><a href="index.htm" class="button">Home</a></li>
  </ul>
</div>

<div class="columns">
  <ul class="Country">
    <li class="header">Anguilla</li>
    <li class="grey">Geography: 91 sq km </li>
    <li>Climate: Tropical Marine</li>
    <li>Population: 19,416</li>
    <li>Capital: The Valley</li>
    <li>Industries: small, tourism-dependent</li>
    <li class="grey"><a href="index.htm" class="button">Home</a></li>
  </ul>
</div>

</body>
</html>

</figure>

Try a Google Search of Your Site (or: in this case, pagerunners.us)

Imagework Examples:

	waterdrops on the leaf tops

	depth of field (& alot of hair)

	(alien) cast shadow