JSFiddle - React, Tailwind, and code Playground

by Red GR

HTML

<!DOCTYPE html>
<html>
    
    <head>
        <meta charset="utf-8">
        <title>Red G.Rick | Designer</title>
        <link rel="stylesheet" href="css/normalize.css">
        <link rel="stylesheet" type="text/css" href="new.css">
    </head>
    
    <body>
        <header> <a href="index.html" id="logo">
        <h1>Red's Place</h1>
        <h2>Designer</h2>
      </a>
        <nav>
          <ul>
           <li> <a href="index.html" class="selected">Portfolio</a>
           </li>
           <li> <a href="about.html">About</a>
           </li>
           <li> <a href="contact.html">Contact</a>
           </li>
          </ul>
          <ol></ol>
            </nav>
        </header>
        <section>
          <ul>
            <li> <a href="img/numbers-01.jpg">
           <img src="img/numbers-01.jpg" alt="">
           <p>Experimentation with color and texture</p>
          </a>

            <li> <a href="img/numbers-02.jpg">
           <img src="img/numbers-02.jpg" alt="">
           <p>Playing with blends in photoshop</p>
          </a> 
            <li> <a href="img/numbers-06.jpg">
           <img src="img/numbers-06.jpg" alt="">
           <p>trying to create 80's styles of glow</p>
          </a> 
            <li> <a href="img/numbers-09.jpg">
            <img src="img/numbers-09.jpg" alt="">
            <p>Drips created using Photoshop brushes</p>
          </a>

            <li> <a href="img/numbers-12.jpg">
           <img src="img/numbers-12.jpg" alt="">
           <p>Creating shapes using repetition</p>
          </a> 
          </li>
           </ul>
        </section>
        <footer> <a href="http://twitter.com/nickrp"><img src="img/twitter-wrap.png" alt="Twitter Logo"></a>
 <a href="https://myspace.com/berbarkhan"><img src="img/myspace.jpeg" alt="Myspace Logo"></a>

            <p>&copy; 2014 Red G.Rick</p>
        </footer>
    </body>

</html>

CSS

a {
  text-decoration: none;
}

#wrapper {
  max-width: 940px;
  margin: 0 auto;
}

#logo {
  text-align: center;
  margin: 0;
}


a {
  color: #6ab47b
}

header {
  background: #6ab47b;
  border-color: #599a68
}

h1, h2 {
  color: #fff;
}

nav {
  background: #599a68;
}

nav a, nav a:visited {
  color: #fff;
}

nav a.selected, nav a:hover {
  color:#32673f
}

body {
  background-color: #fff;
  color: #999;
}

h1 {
  font-family: ‘Changa One’, sans-serif;
  font-size: 1.75em;
  font-weight: normal;