The Lifty Div

A simple chunk of code for a CSS ribbon effect, and a little something to lift your div off the background.

HTML

<div class="section">
  <div class="ribbon-wrapper">
    <div class="ribbon-front">
    </div>
    <div class="ribbon-edge-topleft"></div> 
    <div class="ribbon-edge-topright"></div> 
    <div class="ribbon-edge-bottomleft"></div> 
    <div class="ribbon-edge-bottomright"></div> 
    <div class="ribbon-back-left"></div> 
    <div class="ribbon-back-right"></div> 
  </div>
  <div class="info">
      <div class="authored">
      <div class="person"><a href="#">Tony Montemorano</a></div>
    </div>
  </div>
  <br class="clear">
  </div>
</div>
<div class="page-shadow">&nbsp;</div>

CSS

html,body {height:100%;min-height:100%;}
body {
  margin:30px;
  height:100%;
  padding:0;
  font-family:Arial, Helvetica, sans-serif;
  
}

.clear {clear:both;}
.hidden {display:none;}

a {color:#0095CC;text-decoration:none;}
a:hover {color:#00ADEE;}
p, ul, figure, h1, h2, h3 {margin:0;padding:0;}


@media screen {
@font-face {
  font-family: 'Droid Serif';
  font-style: normal;
  font-weight: normal;
  src: local('Droid Serif'), local('DroidSerif'), url('http://themes.googleusercontent.com/static/fonts/droidserif/v2/0AKsP294HTD-nvJgucYTaIbN6UDyHWBl620a-IRfuBk.woff') format('woff');
}
@font-face {
  font-family: 'Droid Sans Mono';
  font-style: normal;
  font-weight: normal;
  src: local('Droid Sans Mono'), local('DroidSansMono'), url('http://themes.googleusercontent.com/static/fonts/droidsansmono/v3/ns-m2xQYezAtqh7ai59hJUYuTAAIFFn5GTWtryCmBQ4.woff') format('woff');
}
}

.section {
  background-color:#fff;
  border-radius: 10px 10px 0 0;
  width:842px;
  padding:20px;
  margin:0 auto;
}
.section h1 {
  font-size:2em;
  font-weight:normal;
  line-height:45px;
  
  margin:0;
  padding:0;
  font-family: 'Droid Serif', sans-serif;
}
.section h2 {
  font-size:0.85em;
  text-shadow:0 0 1px #bbb;
  letter-spacing:-1px;
  margin:-7px 0 0 7px;
  padding:0;
  font-weight:normal;
  font-family: 'Droid Sans Mono', sans-serif;
}
.section p {padding:10px 0 0 10px;font-size:0.7em;line-height:1.4em;font-family: 'Droid Sans Mono', sans-serif;}
.section .info {
  background: rgb(255,255,255);
  background:...