/* Example 1: Default wrapper class */
.imageCaption {
 border:1px solid #ccc;
 text-align:center;
 padding:5px;
 background-color:#ebebeb;
 float:left;
 margin:0 10px 5px 0;
}
/* Example 2: wrapperClass: 'captioned' */
.captioned {
 border-top:2px solid #425287;
 border-right:2px solid #425287;
 border-bottom:2px solid #c0caed;
 border-left:2px solid #c0caed;
 padding:10px;
 float:right;
 background-color:#cfdafe;
 font:italic 12px Georgia, "Times New Roman", Times, serif;
 color:#036;
}
.captioned img {
 border-top:2px solid #425287;
 border-right:2px solid #425287;
 border-bottom:1px solid #c0caed;
 border-left:1px solid #c0caed;
}
.captioned span { margin-top:10px; }
/* Example 3: captionBefore */
.captionBefore {
 border-top:2px solid #c7b299;
 border-bottom:5px solid #c7b299;
 font:bold 12px/12px Arial, Helvetica, sans-serif;
 float:left;
 margin:5px;
 letter-spacing:1px;
 padding:10px;
 background-color: #e5ddd3;
 text-align:center;
}
.captionBefore span { margin-bottom:5px; }
/* Page Styles */
* {
 margin:0;
 padding:0;
}
body {
 font:normal 12px/18px Verdana, Geneva, sans-serif;
 color:#333;
}
p { margin:5px 0 10px 0; }
h1 {
 font:bold 30px Georgia, "Times New Roman", Times, serif;
 letter-spacing:-2px;
 color:#333;
 margin:10px 0 10px 0;
}
h2, h3 {
 font-size: 18px;
 margin:10px 0 10px 0;
}
h2 { margin-top:30px; }
h3 { font-size:14px; }
#demo-container {
 width:640px;
 margin:0 auto;
}
pre {
 background-color:#ebebeb;
 font:12px "Courier New", Courier, monospace;
 padding:10px;
 border-top:1px solid #ccc;
 margin:10px 0 10px 0;
}
pre strong { color: #c93; }