.description{ font-size: .8em; }
.credits{ font-size: .9em; color: black; clear: left; }
.credits.photo:before{ content: 'Photo '; }
.credits.graphic:before{ content: 'Graphic '; }
.credits.render:before{ content: 'Render'; }
.ballast{ margin-top: 500px; color: #999; line-height: 20px; }
.ballast a{ color: #999; text-decoration: none; }
.ballast a:hover{ text-decoration: underline; }
pre{ display: inline-block; background: #222; color: #e0c589; font-size: 15px; font-family: 'Lucida Sans Typewriter', 'Lucida Console', Monaco, 'Bitstream Vera Sans Mono', monospace; padding: 20px 40px 20px 0; margin: 0; border-radius: 0 23px 23px; }
pre a{ color: #89bdff; }
pre strong{ color: #65b042; font-weight: normal; }
pre strong a{ color: #fff; }
pre em{ color: #bd89ff; font-style: normal; }
pre em em{ font-weight: bold; }
.examples{ padding: 0; }
.examples > li{ display: block; float: left; list-style-type: none; margin: 0 12px 12px 0; width: 200px; height: 150px; position: relative; }
.examples > li a{ position: absolute; top: 0; left: 0; right: 0; bottom: 0; text-decoration: none; font-size: .9em; }
.examples > li label{ display: block; position: absolute; top: 0; left: 0; right: 0; padding: 3px 12px; color: #fff; background: #222; }
.examples > li a > strong{ display: block; position: absolute; bottom: 0; right: 0; padding: 1px 5px; color: #fff; background: #bd0000; font-size: .8em; }
.examples > li .icon{ display: block; position: absolute; top: 0; left: 0; right: 0; bottom: 0; background: #fff no-repeat center; }
.examples > li ul{ display: none; position: absolute; top: 6px; left: 6px; right: 6px; bottom: 6px; padding: 12px 36px; }
.examples > li ul:before{ content: 'Features:'; font-weight: bold; color: #000; padding-bottom: 6px; display: block; }
.examples > li a:hover ul{ display: block; background: #fff; opacity: .9; }
.examples > li a:hover label{ display: none; }
#image-reel{display: block;padding: 2px; border: 1px solid #ccc; float:right;}