style.css

/* --------------------------------------------------------------

   reset.css
   * Resets default browser CSS.

-------------------------------------------------------------- */

button::-moz-focus-inner, input[type="text"]::-moz-focus-inner, input[type="submit"]::-moz-focus-inner, input[type="reset"]::-moz-focus-inner {
    margin-top: -1px !important;
}

hr {
    border: 0px none;
    border-top: 1px solid #e9e9e9;
}

html {
    margin:0;
    padding:0;
    border:0;
    overflow-y: scroll;
}

body, div, span, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, code,
del, dfn, em, img, q, dl, dt, dd, ol, ul, li, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, dialog, figure, footer, header,
hgroup, nav, section {
  margin: 0;
  padding: 0;
  border: 0;
  font-size: 100%;
  font: inherit;
  vertical-align: baseline;
}

/* This helps to make newer HTML5 elements behave like DIVs in older browers */
article, aside, details, figcaption, figure, dialog,
footer, header, hgroup, menu, nav, section {
    display:block;
}

pre, .diff-header, .diff-ul li {
    font-family: Consolas, 'Bitstream Vera Sans Mono', 'Courier New', Courier, monospace;
}

/* Line-height should always be unitless! */
body {
  line-height: 1.5;
  background: white;
}

/* Tables still need 'cellspacing="0"' in the markup. */
table {
    border-collapse: separate;
    border-spacing: 0;
}
/* float:none prevents the span-x classes from breaking table-cell display */
caption, th, td {
    text-align: left;
    font-weight: normal;
    float:none !important;
}
table, th, td {
    vertical-align: middle;
}

/* Remove possible quote marks (") from <q>, <blockquote>. */
blockquote:before, blockquote:after, q:before, q:after { content: ''; }
blockquote, q { quotes: "" ""; }

/* Remove annoying border on linked images. */
a img { border: none; }

/* Remember to define your own focus styles! */
:focus { outline: 0; }

button, body {
font-family: Arial,Helvetica,sans-serif;
}

body {
margin: 0px;
padding: 0px;
font-size: 0.8em;
}

legend { padding: 5px; font-size: 1.1em; font-weight: bold }

fieldset { border: 1px solid #E9E9E9; }

label span {
    display: inline-block;
    width: 125px;
    text-overflow: ellipsis;
    white-space: nowrap;
}

label span img {
    padding: 2px;
    padding-right: 5px;
    float: left;
}

label input[type="text"], label select {
    width: 200px;
}

a {
    color: #36C;
    text-decoration: none;
}

a:hover {
    color: #36C;
    text-decoration: underline;
}

.ds {
border-bottom: 1px solid #E7E7E7;
border-right: 1px solid #E7E7E7;
display: inline-block;
}
.header {
height: 31px;
border-bottom: 1px solid #e9e9e9;
margin-bottom: 20px;
background: -webkit-gradient(linear,0% 0%,0% 100%,from(rgb(255,255,255)),to(rgb(245,245,245)));
background: -moz-linear-gradient(rgb(255,255,255),rgb(245,245,245));
}

.header .settings {
    float: right;
    height: 20px;
    margin-left: 8px;
    padding-top: 6px;
    padding-bottom: 4px;
    border-left: 1px solid #e7e7e7;
}

.header .spacer, .header a {
    font-size: 1em;
    border-top-color: #BAD3EA;
    border-top-width: 2px;
    border-top-style: solid;
    color: #36C;
    display: block;
    float: left;
    padding: 5px 9px;
}

.header .spacer {
    float: none;
    height: 2px;
}

.header a:hover {
    background: -webkit-gradient(linear,0% 0%,0% 100%,from(#DAF3FF),to(#CAE3FA));
    background: -moz-linear-gradient(#DAF3FF,#CAE3FA);
    text-decoration: none;
}

.header strong a {
    border-top-color: #36C;
    color: #000;
}

.home input[type="text"] {
    outline: none;
border-color: #CCCCCC #999999 #999999 #CCCCCC;
border-style: solid;
border-width: 1px;
font-size: 18px;
font-family: arial, sans-serif;
margin: 0px;
height: 28px;
padding: 0px;
padding-left: 5px;
vertical-align: top;
}

button.g-button,a.g-button,input[type=submit].g-button {
margin: 0px;
border: solid 1px rgb(153,153,153);
background: -webkit-gradient(linear,0% 0%,0% 100%,from(rgb(255,255,255)),to(rgb(221,221,221)));
background: -moz-linear-gradient(#fff,rgb(221,221,221));
color: #333;
text-decoration: none;
cursor: pointer;
display: inline-block;
text-align: center;
vertical-align: middle;
font-size: 1.2em;
text-shadow: 0px 1px 1px #fff;
height: 30px;
}

a.g-button {
    padding: 2px 6px 3px;
    height: 23px;
}

.home .ds input[type=submit] {
    border-left: 0px;
}

input.g-button:hover, button.g-button:hover, a.g-button:hover {
    background: -webkit-gradient(linear,0% 0%,0% 100%,from(rgb(248,248,248)),to(rgb(221,221,221)));
    background: -moz-linear-gradient(rgb(248,248,248),rgb(221,221,221));
}

input.g-button:active, button.g-button:active, a.g-button:active {
    background: -webkit-gradient(linear,0% 0%,0% 100%,from(rgb(204,204,204)),to(rgb(221,221,221)));
    background: -moz-linear-gradient(rgb(204,204,204),rgb(221,221,221));
}

.footer {
    text-align: center;
    clear: both;
}

.footer td {
    padding: 10px;
}

.search-results, .pod, .content {
    margin-left: 175px;
    border-left: 1px solid #e9e9e9;
    padding-left: 15px
}

.search-group {
    padding: 5px;
    padding-left: 10px;
}

.search-bar, .account-bar {
    width: 165px;
    float: left;
}

.search-bar .search-type {
    font-size: 1.1em
}

.search-bar .search-tag li {
    margin: 2px;
    margin-bottom: 10px;
    margin-top: 10px;
}

.search-bar .search-tag a {
    padding: 4px 6px;
    -webkit-border-radius: 10px 10px;
    border: solid 1px rgb(153, 153, 153);
    background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(rgb(255, 255, 255)), to(rgb(221, 221, 221)));
    color: #333;
    text-decoration: none;
    cursor: pointer;
    text-align: left;
    display: inline;
    text-shadow: 0px 1px 1px rgba(255,255,255,1);
    line-height: 1;
}

#author-results ul  {
    display: inline-block;
    margin: 10px 0;
}

#author-results li {
    float: left;
    width: 100px;
    padding: 5px 5px 5px 45px;
    margin-right: 10px;
    border: 1px solid white;
    overflow: hidden;
    height: 50px;
}

#author-results li:hover {
    border: 1px solid #eee;
    -webkit-border-radius: 3px 3px;
    -moz-border-radius: 3px 3px;
    -moz-box-shadow: 3px 3px 5px #eee;
    -webkit-box-shadow: 3px 3px 5px #eee;
    box-shadow: 3px 3px 5px #eee;
}

#author-results a {
    display:    block;
}

#author-results a:hover {
    text-decoration: none;
}

#author-results img {
    width: 30px;
    height: 30px;
    margin-left: -40px;
    float: left;
}



button.favorite, a.favorite {
    padding: 1px 3px;
    margin-left: 10px;
    font-size: 0.9em;
    background-color: #fff;
    opacity: 0.5;
    -webkit-border-radius: 3px 3px;
    -moz-border-radius: 3px 3px;
    border: solid 1px #666;
    color: #333;
    text-decoration: none;
    display: inline-block;
    line-height: 1;
    text-align: right;
    min-width: 25px;
    position: relative;
    top: -1px;
}

button.favorite {
    min-width: 35px;
    cursor: pointer;
}

button.favorite.highlight, a.favorite.highlight {
    background-color: #fca216;
    background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#ffc874), to(#fca216));
    background: -moz-linear-gradient(#ffc874,#fca216);
    color: #fff;
    text-shadow: 0px 1px 1px #333;
    border-color: #d39534;
    opacity: 1
}

button.favorite:hover, button.favorite.active, a.favorite.active, a.favorite:hover {
    background-color: #36C;
    background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#69F), to(#36C));
    background: -moz-linear-gradient(#69F,#36C);
    color: #fff;
    text-shadow: 0px 1px 1px #333;
    border-color: #36C;
    opacity: 1
}

.search-bar .search-tag a span {
    float: right;
    visibility: hidden;
}

.search-bar .search-tag a:hover span {
    visibility: visible
}

.user-profiles > a {
    text-decoration: none;
}

.account-bar a {
    display: block;
    padding: 6px;
    font-size: 1.2em;
}

.account-bar a:hover {
    text-decoration: none;
    background-color: #f9f9f9;

}

.account-bar a.active {
    background-color: #f9f9f9;
    color: #000;
    font-weight: bold;
}

.account-settings label {
    display: block;
    margin-bottom: 10px;
    font-size: 1.1em
}

.account-settings a.g-button {
    width: 80px
}

.account-settings td {
    padding: 5px;
}

.account-settings .valid {
    background-color: #900;
    padding: 5px;
    float: right;
    font-size: 1.2em;
    color: #fff;
    font-weight: bold;
    display: none;
}

.account-settings .invalid {
    display: inline-block;
}

.account-author-profiles {
    width: 155px;
}

.icon {
    padding-left: 24px;
    background-repeat: no-repeat;
    background-position: 0px 3px;
}

.icon-module {
    background-image: url(/static/icons/package.png);
}

.icon-dist {
    background-image: url(/static/icons/box.png);
}

.icon-user {
    background-image: url(/static/icons/user.png);
}

.icon-server {
    background-image: url(/static/icons/server.png);
}

.pod html, .pod body, .pod dl, .pod dt, .pod dd, .pod h1, .pod h2, .pod h3, .pod h4, .pod h5, .pod h6, .pod pre, .pod form, .pod fieldset, .pod input, .pod p, .pod blockquote, .pod th, .pod td
{
    margin: 5px;
    padding: 5px;
}

.pod code {
    font-family: monospace
}

#permalink {
    margin: 5px;
    padding: 5px;
    float: right;
}

.pod ol {
    list-style: decimal;
    margin-left:40px;

}

.pod ul {
    list-style: disc;
    padding-left: 20px;
}

.pod pre {
    margin-left: 20px;
}


.pod h1, .pod h2, .pod h3, .pod h4, .recent-date {
    background: transparent;
    color: #36c;
    font-weight: bold;
}

.pod h1 {
    font-size: 1.5em;
}

.recent-date {
    display: block;
    text-align: right;
    font-size: 1.1em;
}

.pod h2 {
    font-size: 1.3em;
}

.pod h3, .pod h4 {
    font-size: 1.1em;
}

.pod p, .pod dt {
    font-size: 1.1em;
}

.pod dt {
    font-weight: bold;
}

.pod img     {
    vertical-align: top;
}

.pod .toc A  {
    text-decoration: none;
}

.pod .toc LI {
    line-height: 1.2em;
    list-style-type: none;
}

ul#index, #index ul { list-style-type: none; }

.syntaxhighlighter, .pod pre {
    border: 1px solid #e9e9e9;
    width: auto !important;
    overflow-y: hidden !important;
    background-color: #f3f3f3;
    padding: 10px;
}

.nogutter, .pod pre {
    padding-left: 10px;
}

.search-results img,
.author-img {
    overflow:hidden;
    width: 130px;
    height: 130px;
    border-radius: 8px;
    margin-bottom: 5px;
    -webkit-box-shadow: 2px 2px 5px #999;
    text-align: left;
}

#content {
    padding: 10px;
}

ul {
    list-style-type: none;
}

.comment {
    color: #999;
    font-size: 0.8em;
}

.box-right {
    float: right;
    clear: right;
    width: 160px;
    padding-left: 10px;
    overflow: auto;

}

a.ellipsis {
    width: 160px;
}

.ellipsis {
    white-space: nowrap;
    display: block;
    overflow: hidden;
}

code { font-family: monospace; }

.olControlAttribution {
    bottom: 0em !important;
}

.pager {
    padding-top: 20px;
    text-align: center;
    font-size: 14px;
}

.pager a, .pager strong {
    padding-left: 6px;
}

.pager a strong {
    padding-left: 0px;
}

.search-bar input[type="text"], .search-bar select  {
    width: 160px;
}

body div.qtip div.content {
    padding: 0;
    margin: 0;
    height: auto; min-height: auto;
    width: auto; min-width: auto;
}

.ui-tooltip, .qtip {
    font-size: 12px;
    max-width: 800px;
}

.ui-tooltip-content {
    padding: 0;
}

div.qtip-github table {
    width: 100%;
}

div.qtip-github table td, div.qtip-github table th {
    padding: 3px;
    border: 1px solid #F1F1F1;
}

div.qtip-github table th {
    padding-right: 8px;
    white-space: nowrap;
    background-color: #F9F9F9;
}

.release-table {
    table-layout:fixed;
    width: 100%;
}

.release-table td, .release-table th {
    padding: 2px;
}

.release-table th {
    text-align: left;
    font-weight: bold;
}

.release-table .name {
    width: 266px;
}

.release-table .date {
    width: 100px;
    font-size: 1em;
}

.release-table td.date {
    text-align: right;
}

.release-table .abstract, .release-table .date {
    text-overflow: ellipsis;
    overflow: hidden;
    white-space: nowrap;
}

.release-table .odd {
    background-color: #f9f9f9;
}

.search-results .description {
    color: #999;
    max-height:3em;
    overflow:hidden;
}

.rating-00, .rating-05, .rating-10, .rating-15, .rating-20, .rating-25, .rating-30, .rating-35, .rating-40, .rating-45, .rating-50 {
    width: 67px;
    height: 12px;
    display: inline-block;
    background: url(/static/images/stars-sprite-white.png);
    vertical-align: bottom;
    margin-bottom: 4px;
}

.rating-05 {
    background-position: 0px -19px;
}
.rating-10 {
    background-position: 0px -38px;
}
.rating-15 {
    background-position: 0px -57px;
}
.rating-20 {
    background-position: 0px -76px;
}
.rating-25 {
    background-position: 0px -95px;
}
.rating-30 {
    background-position: 0px -114px;
}
.rating-35 {
    background-position: 0px -133px;
}
.rating-40 {
    background-position: 0px -152px;
}
.rating-45 {
    background-position: 0px -171px;
}
.rating-50 {
    background-position: 0px -190px;
}