body {
color: #333;
font-family: arial, sans-serif;
font-size: 10px;
line-height: 180%;
background: #fff url(../images/background.png) repeat-x;
}

a {
color: #0056CA;
text-decoration: none;
}

a:visited {
color: #0056CA;
}

a:hover {
text-decoration: underline;
}

strong {
font-weight: bold;
background-color: #ffc;
}

.clear-fix {
clear: both;
}

/* Layout
   =========================== */

#wrap{
margin: 0 auto;
text-align: left;
width: 760px;
}

#content {
margin-left: 5px;
}

.content-sidebar #content {
float: left;
width: 520px;
}

.content-toc #content {
float: left;
width: 560px;
}

#sidebar {
padding-top: 38px;
float: right;
width: 220px;
}

.content-toc #sidebar {
width: 180px;
}

.subscribe {
margin-left: 10px;
}

/* Header
   =========================== */

#header {
padding: 1em 0 0 0;
position: relative;
}

#header h1 {
  font-size: 22px;
}

#header h2.description {
margin-left: 40px;
margin-top: 4px;
line-height: 100%;
color: #666;
}

#header #latest-release {
position: absolute;
right: 5px;
bottom: 5px;
color: #999;
font: normal 140% arial;
text-transform: lowercase;
}

#header #latest-release small {
font-size: 80%;
}

#header #latest-release a {
font: bold 100% verdana;
text-transform: uppercase;
}

/* Search
   =========================== */

#header #search {
position: absolute;
top: 15px;
right: 0px;
}

#header #search input {
border: solid 1px #ccc;
padding: 2px;
font: normal 160% arial;
color: #333;
width: 175px;
}

#header #search input.example {
color: #aaa;
}

#content #search-results li {
font: bold 120% arial;
margin-bottom: 3px;
padding-left: 5px;
background: none;
}

#search-results li small {
font: normal 80% arial;
color: #888;
}

/* Navigation
   =========================== */

#nav {
margin: 10px 0 5px 0;
background: url(../images/nav-border.gif) bottom left repeat-x;
}

#nav li {
float: left;
margin-right: 0;
margin-left:5px;
}

#nav li a:visited {
color: #0056CA;
}

#nav li a {
padding: 5px 8px;
display: block;
font: bold 120% arial;
background-color: #eee;
border: solid 1px #ddd;
border-bottom: solid 1px #ccc;
}

#nav li a:hover {
text-decoration: none;
background-color: #ffa;
}

#nav li a.selected {
border: solid 1px #ccc;
border-bottom: solid 1px #fff;
text-decoration: none;
color: #666;
cursor: default;
background-color: #fff;
}

#nav li a.selected:hover {
background-color: #fff;
}

/* Sidebar
   =========================== */

#sidebar {
font-size: 110%;
line-height: 120%;
font-weight: bold;
}

#sidebar h4 {
margin: 5px 0 2px 0;
font: bold 100% arial;
color: #999;
border-bottom: dotted 1px #ccc;
}

#sidebar ol {
margin-left: 30px;
list-style: lower-roman;
}

#sidebar ol li{
padding: 2px 0;
}

#sidebar ul.other-sources li{
padding: 2px 3px 2px 30px;
background: url(../images/bullet_red.png) 8px 50% no-repeat;
}

#sidebar #demo-link {
display: block;
margin: 0 auto 10px auto;
width: 218px;
height: 90px;
text-indent: -4000px;
background: url(../images/demo-teaser-grey.png) 0 0 no-repeat;
}

#sidebar #demo-link:hover {
background: url(../images/demo-teaser-color.png) 0 0 no-repeat;
}

/* Sidebar :: Actions
   =========================== */

#sidebar ul#actions {
margin: 10px 0;
}

#sidebar ul#actions li {
margin: 0;
margin-bottom: 3px;
background: transparent;
}

#sidebar ul#actions li a {
display: block;
padding: 1px 1px 1px 24px;
font: bold 120% arial;

background-position: 3px 50%;
background-repeat: no-repeat;
}

#sidebar ul#actions li a:hover {
text-decoration: none;
background-color: #ffa;
}

#sidebar ul#actions li a small {
display: block;
padding-left: 1px;
margin-top: -1px;
font: normal 80% arial;
}

.subscribe a {
background-image: url(/assets/2007/5/9/feed.png);
}

.donate a {
background: url(/assets/2007/5/9/money.png);
}

.plugins a {
background: url(/assets/2007/5/9/ruby.png);
}

.whos-using a {
background: url(/assets/2007/5/9/user_suit.png);
}

/* Content :: Headers
   =========================== */

#content h2 {
font: bold 180% arial;
margin-bottom: 10px;
}

#content h2,
#content h2 a {
color: #ccad00;
}

#content h3 {
font: bold 140% arial;
margin: 15px 0 10px 0;
color: #ccad00;
}

#content h3 small {
font: bold 60% arial;
text-transform: uppercase;
}

#content h4 {
color: #888;
font: bold 100% arial;
text-transform: uppercase;
margin: 10px 0;
}

#content h5 {
color: #f00;
}

/* Content
   =========================== */

#content {
font-size: 120%;
padding: 10px 0;
}

#content p {
margin-bottom: 10px;
color: #333;
}

#content ul {
margin-bottom: 10px;
}

#content ul li {
padding-left: 18px;
background: url(../images/bullet_red.png) 0 0 no-repeat;
}

#content .entry {
margin-bottom: 30px;
}

#content .entry h2 {
margin-bottom: 0px;
}

#content .entry h4.byline {
margin-top: 0;
margin-bottom: 10px;
line-height: 100%;
text-transform: uppercase;
font-size: 80%;
color: #888;
}

#content .entry h4.byline strong {
background-color: transparent;
margin-left: 5px;
}

#content .entry .meta {
margin-top: 5px;
}

#content .entry .comments-link {
font: bold 80% verdana;
text-transform: uppercase;
}

#content table th {
font: bold 80% arial;
text-transform: uppercase;
border-bottom: dotted 1px #ccc;
padding: 2px 4px;
}

#content table td {
vertical-align: top;

border-bottom: dotted 1px #ccc;
padding: 2px 4px;
}

/* Content :: Team
   =========================== */

#team {
margin-left: 10px;
margin-top: -10px;
padding-bottom: 20px;
}

#team li {
clear: both;
padding-top: 20px;
width: 100%;
}

#team li img {
border: solid 2px #ccc;
float: left;
}

#team li p {
float: left;
margin-top: 15px;
margin-left: 25px;
width: 500px;
font-size: 120%;
}

/* Blog :: Comments
   =========================== */

#content .comments .byline {
color: #888;
font: normal 110% arial;
border-bottom: dotted 1px #ccc;
text-transform: uppercase;
}

.comments .byline cite {
color: #666;
font-weight: bold;
margin-right: 2px;

font-size: 110%;
text-transform: none;
}

#content .comments p  {
margin-bottom: 5px;
}

.comments ol li {
padding: 10px;
}

.comments ol li.alt {
background-color: #eee;
}

.comments form {
margin-left: 5px;
}

.comments form label {
margin-left: 5px;
text-transform: uppercase;
color: #999;
}

.comments textarea,
.comments p input {
padding: 2px;
border: solid 1px #ccc;
}

.comments textarea{
width: 35em;
}

.comments p input {
width: 250px;
}

.comments textarea:focus,
.comments input:focus{
background-color: #ffc;
}

.comments input#submit {
font: bold 120% arial;
padding: 2px 5px;
}

/* Code
   =========================== */

code{
font-size: 100%;
line-height: 140%;
background-color: #ddd;
}

pre{
background: #333;
color: #fffed8;
border: 1px inset #aaa;
overflow:auto;
padding: 3px 5px;
margin: 5px 0;
font-size: 100%;
}

pre code {
background-color: transparent;
}

/* Code :: Ruby
   =========================== */

span.comment{
  font-style: italic;
  color: #98C1DC;
}
span.keywords{
  font-weight: bold;
  color:#cda869;
}
span.string{
  color:#8f9d6a !important;
}
span.brackets{
  color:#efe900;
}
span.symbol{
  color:#CF6A4C;
}
span.instance{
  color:#7587a6;
}
span.constants{
  color:#cf6a4c;
}
span.method{
  color:#f8f097;
}

/* Footer
   =========================== */

#footer {
clear: both;
width: 760px;
padding: 5px 0;
margin: 5px auto;
}

#footer p  {
color: #888;
padding: 2px 5px;
border-top: solid 1px #ccc;
}

.active-scaffold textarea {
height: 400px;
width: 500px;
font-family: Arial, sans-serif;
font-size: 12px;
padding: 1px;
border: solid 1px #1F7F00;
}

#footer #theme {
float: right;
margin: 5px;
}

#footer #activescaffold-link {
display: block;
text-indent: -4000px;
width: 116px;
height: 12px;
background: url(../images/active_scaffold_sm.png) 0 0 no-repeat;
}

#footer #minielements-link {
display: block;
text-indent: -4000px;
width: 116px;
height: 12px;
background: url(../images/minielements-badge.png) 0 0 no-repeat;
}

/* Purge Data */
#purge-data-wrapper {
width: 580px;
margin: 10px 10px 5px 30px;
}

#purge-data td {
padding: 0px 0px 0px 10px;
font-size: 11px;
font-family: Verdana;
line-height: 11px;
}

#purge-data td input {
padding: 1px;
font-weight: bold;
font-size: 14px;
font-family: Arial;
}