A Pen by matthew jackson.

index.jade

.main
  header
    h1 Lucida 
    h2 Sans aut Grande
    
    span Thursday 22nd May 2014 
    
  
  
  p Lorem ipsum dolor sit amet, consectetur adipisicing elit. Ut veritatis quis autem aspernatur similique mollitia aliquam eaque. Dolorum quidem. Lorem ipsum dolor sit amet, consectetur adipisicing elit. 
  
  blockquote 
    p There are now about as many different varieties of letters as there are different kinds of fools
    
  p Accusamus excepturi quaerat ea deserunt rerum consequatur perferendis facilis commodi eum sint?
  
  p Cumque excepturi facere maiores reprehenderit dolorum velit ut deserunt consectetur molestiae voluptas quidem vitae quibusdam quia dolores id enim voluptatem qui voluptatibus. 
  
  br
  
  cite This web thing was set in Lucida

style.scss

body { 
  font: 14px/1.7 Lucida Sans Unicode, Lucida Grande, sans-serif;
  background-color: #F14C7B ;
  color: #FFF;
  text-rendering: optimizeLegibility; 
  border-top: 16px solid #912D2D;
}
.main {
  width: 320px;
  margin: 40px auto 40px 100px;
}
header {
  padding-bottom: 12px;
  margin-bottom: 12px;
  border-bottom: 1px solid #FFF;
}
h1, h2 {
  font-weight: normal;
  display: table-cell;
  vertical-align: baseline;
  line-height: 1;
    text-transform: uppercase;

}
h1 {
  font-size: 32px;
  letter-spacing: 2px;
  font-weight: 200;
}
h2 {
  letter-spacing: 2px;
  text-indent: 12px;
  font-size: 16px;

  color: #912D2D;
}
p {
  margin: 0;
}
p + p {
 text-indent: 28px;
}
blockquote {
    font-size: 18px;
    padding: 12px 0;
  margin: 12px 0;
  border: solid #912D2D;
  border-width: 1px 0;
  }
span {
  display: block;
  text-transform: uppercase;
  font-style: normal;
  font-size: 10px;
  letter-spacing: 2px;
  padding: 12px 0 0;
}
cite {
  color: #912D2D;
}

Web-Safe-Fonts-#2.markdown

Web Safe Fonts #2

Lucida

A Pen by matthew jackson on CodePen.

License.