static/css/legacy/main.css

/* @group General styles */
/*
Harmonise v1.3
Resets styles then adds basic typographical styling.
Use as a starting point upon which to build more CSS.
By Clearleft.com
*/

/* @group Reset */

/* Based on http://meyerweb.com/eric/tools/css/reset/ */
/* v1.0 | 20080212 */

html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, font, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td {
    margin: 0;
    padding: 0;
    border: 0;
    font-size: 100%;
    vertical-align: baseline;
    background: transparent;
}

ul {
    list-style: none;
}
blockquote, q {
    quotes: none;
}
blockquote:before, blockquote:after,
q:before, q:after {
    content: '';
    content: none;
}

/* tables may still need 'cellspacing="0"' in the markup */
table {
    border-collapse: collapse;
    border-spacing: 0;
}

/* @end */

body {
    margin: 0 auto;
    color:#444444;
    font-size:13px;
    line-height:1.538em; /* Baseline grid of 20px */
    position: relative;
    min-width: 780px;
}

body.about {
    background-image: none;
    margin: 1em 0 0;
}

body.policy header {
    margin-left: 0;
}

body.about .section {
    overflow: hidden;
}
/* for pages without a header or footer */
body.min {
    background-image: none;
    padding-top: 3em;
    padding-bottom: 2em;
}

strong {
    font-weight: bold;
}

a:link,
button.link span {
    color: #3d6db5;
    text-decoration: none;
}
a:visited {
    color: #003595;
    text-decoration: none;
}
a:hover,
a:focus,
a:active,
button.link:hover span,
button.link:focus span,
button.link:active span {
    color: #003595;
    text-decoration: underline;
}

/* @group Font families */

body,
#title,
.item h3,
.section-teaser .addon-view h3 {
    font-family: "helvetica neue", arial, helvetica, sans-serif;
    font-style: normal;
}

h2,
h3,
#title em,
.highlight h2,
.highlight h3,
.stats strong,
h4.step {
    font-family: georgia, serif;
    font-style: italic;
}

pre, code, kbd, tt, samp, tt {
    font-family: "andale mono", monospace;
}

/* @end */

/* @group Headings */

/* size headings using classic scale of 16, 18, 24, 36 */

h1 {
    font-size: 2.571em /* 36px */;
    line-height:1em /* 36px */;
    margin-top:0.1667em /* 6px */;
    margin-bottom:0.5833em /* 21px */;
}
h2 {
    font-size:2.154em /* 28px */;
    font-weight:normal;
    line-height:1em /* 28px */;
    margin-top:0.5em /* 42px */;
    margin-bottom:0.5em /* 14px */;
    color:#C63717;
}
h3 {
    color:#011234;
    font-size:1.385em /* 18px */;
    font-weight:normal;
    line-height:1.111em /* 20px */;
    margin-top:1.556em /* 28px */;
    margin-bottom:0.778em /* 14px */;
}
h4 {
    color:#223355;
    font-size:1em /* 13px */;
}
h5, h6 {
    font-size:1em /* 13px */;
}

/* @end */

/* @group Lists */

.prose ul,
ul.xoxo,
ul.xoxo ul {
/* unordered lists more often DON'T require bullets except in extended bits of writing. Where bullets are required apply the .prose class to a container, or apply directly with .xoxo */
    list-style-type: square;
    margin-left: 1.5em; /* 21px */
}

.html-rtl .prose ul,
.html-rtl ul.xoxo,
.html-rtl ul.xoxo ul {
/* unordered lists more often DON'T require bullets except in extended bits of writing. Where bullets are required apply the .prose class to a container, or apply directly with .xoxo */
    list-style-type: square;
    margin-left: 0em;
    margin-right: 1.5em; /* 21px */
}

.prose ul li,
ul.xoxo li,
ul.xoxo ul li {
    margin-bottom: 0.5em;
}

ol {    /* ordered lists usually DO require (numbered) bullets */
    list-style-type: decimal;
    margin-left: 2em; /* 26px */
}

.html-rtl ol {
    margin-left: 0;
    margin-right: 2em;
}

dt {
    font-weight: bold;
    margin-top: 1.5em; /* 19.5px */
}

ul ul, ol ol, ol ul, ul ol {
    margin-bottom: 0;
}

/* @end */

/* @group Blockquotes */

blockquote {
    font-style: italic;
    margin:0  1.5em  1.5em 1.5em; /* 19.5px */
}

p+p+blockquote {
    margin-top: 1.5em /* 19.5px */;
}

blockquote cite, blockquote em {
    font-style: normal;
}

/* @end */

/* @group Other styling */

p, ul, ol, dl, address, table, pre, form, fieldset {
    font-size: 1em /* 14px */;
    margin-bottom: 1.5em; /* 21px */
}

address {
    font-style: normal;
}

ins {
    text-decoration: underline;
}

del {
    text-decoration: line-through;
}

/* @end */


/* @end */

/* @group Helper styles */

/* @group Forms */

/* @group Containers */

form .container {
    margin-bottom: 1.5em; /* 19.5px */
}


/* @group Fieldsets */

fieldset {
    border: 1px solid #ccc;
    padding: 0 1.5em 1em 1.5em; /* 0 19.5px 13px 19.5px */
}

legend {
    font-weight: bold;
}

form fieldset .container {
    margin-top: 1em; /* 13px */
    margin-bottom:0;
    position: relative;
}

/* @end */

/* @end */

/* @group Labels */

label {
    font-weight: bold;
    cursor: pointer;
}

.meta-label {
    font-weight: bold;
    margin-bottom: 0;
}

.multi-container label,
.radio-container label,
.checkbox-container label {
    font-weight: normal;
}

.radio-container label,
.checkbox-container label {
    display: block;
}

.compact label {
    display: inline;
}

/* @end */

/* @group Meta */

form .help {
    display: block;
    color: #777;
    font-style: normal;
    font-size: 0.923em; /* 12px */
}

/* @end */

/* @group Form controls */

input, textarea, select, button {
    font-family: inherit;
    font-size: 1em;
    line-height: inherit;
}

button {
    overflow: visible;
    cursor: pointer;
}

textarea,
input[type='text'],
input[type='password'],
select {
    border-width: 1px;
    border-style: solid;
    border-top-color: #999;
    border-left-color: #999;
    border-bottom-color: #ccc;
    border-right-color: #ccc;
    padding: 0 1px 1px 1px;
}

input.short {
    width: 4em;
}

input.medium, textarea.medium {
    width: 12em;
}

input.long, textarea.long {
    width: 30em;
}

textarea {
    width: 100%;
    -moz-box-sizing: border-box;
    display: block;
}

.button-container input {
    font-weight: bold;
}

.button-container input.cancel {
    font-weight: normal;
}

button.link {
    background-image: none;
    border: 0;
    padding: 0;
    background-color: #fff;
    font-weight: normal;
    cursor: pointer;
    width: auto;
    overflow: visible;
    text-shadow: none;
    -moz-user-select: text;
}

/* accessibility feature, resize check and radio inputs */
.radio-container input,
.checkbox-container input {
    width: 1em;
    height: 1em;
}

/* @end */

/* @end */

/* @group Stars */

.stars {
    text-indent:-5000px;
    background-image: url(../../img/icons/stars.png);
    background-position: 0 50%;
    background-repeat: no-repeat;
    margin-right: 0.5em;
    width: 63px;
    display: block;
    float: left;
}
.stars-4 {
    background-position: -13px 50%;
}
.stars-3 {
    background-position: -26px 50%;
}
.stars-2 {
    background-position: -39px 50%;
}
.stars-1 {
    background-position: -52px 50%;
}
.stars-0 {
    background-position: -65px 50%;
}

/* @end */

/* @end */

/* @group indicators */

.downloads {
    color: #390;
    clear: both;
}

.subscribe,
.addons,
.collections,
.subscribers,
.category,
.tags,
.digg,
.delicious,
.facebook,
.friendfeed,
.myspace,
.twitter,
.share-networks .email,
.share-email .emailerror p {
    background-image: url(../../img/icons/icons.png);
    background-repeat: no-repeat;
    padding-left: 20px;
}

.subscribe {
    background-position: 0 2px;
}

.addons {
    background-position: 0 -200px;
    padding-bottom: 7px;
}
.collections {
    background-position: 0 -300px;
}
.subscribers {
    background-position: 0 -400px;
    padding-bottom: 7px;
}
.category {
    background-position: 0 -503px;
}
.tags {
    background-position: 0 -600px;
}
.digg {
    background-position: 0 -890px;
}
.delicious {
    background-position: 0 -990px;
}
.facebook {
    background-position: 0 -1090px;
}
.friendfeed {
    background-position: 0 -1190px;
}
.myspace {
    background-position: 0 -1290px;
}
.twitter {
    background-position: 0 -1492px;
}
.share-networks .email {
    background-position: 0 -1689px;
}
.share-email .emailerror p {
    background-position: 0 -1798px;
}

span.new {
    padding: 0.2em 0.5em;
    background-color: #305083;
    color: white;
    -moz-border-radius: 8px;
    -webkit-border-radius: 8px;
    border-radius: 8px;
    background-repeat: repeat-x;
    background-position: bottom left;
    border:  1px solid #021437;
    text-transform: uppercase;
    font-size: 0.611em;
}

h3 .secondary a:link, h3 .secondary a:active, h3 .secondary a:visited, h3 .secondary a:hover, h3 .secondary a:focus {
    vertical-align: middle;
}

/* @end */

/* @group hReviews */

.review-detail {
    border-bottom: 1px dotted #e0effd;
    padding: 0.5em 0 1em 0;
    margin-bottom: 0.5em;
}

.review-detail p {
    margin-bottom: 0;
}

.review-detail:last-child {
    border-bottom: none;
}

/* @end */

/* @group More Info */

.more-info,
.more-info:link,
.more-info:visited,
.more-info:hover,
.more-info:focus,
.more-info:active {
    font-weight: bold;
    float: right;
    background-image: url(../../img/icons/arrows.gif);
    background-repeat: no-repeat;
    background-position:right -153px;
    padding-right: 1em;
    color: #3d6db5;
}

.more-info:hover,
.more-info:focus,
.more-info:active {
    background-position:right -203px;
    color: #003595;
}

.html-rtl .more-info.n,
.more-info.n {
    float: none;
}

/* @end */

/* @group Generic Image Styles */

.pull-left {
    margin-right: 1em;
    float: left;
}
.html-rtl .pull-left {
    margin-right: auto;
    margin-left: 1em;
    float: right;
}
.pull-right {
    margin-left: 1em;
    float: right;
}
.html-rtl .pull-right {
    margin-left: auto;
    margin-right: 1em;
    float: left;
}
.teaser-img {
    text-align: center;
    display: block;
}
img.icon {
    background-color: #fff;
    -webkit-border-radius: 4px;
    -moz-border-radius: 4px;
    border-radius: 4px;
    padding: 4px;
}

h5 img.icon,
h2 img.icon {
    float: left;
    margin-right: 10px;
}
h2 img.icon {
    position: relative;
    top: -0.2em;
}
img.avatar {
    border: 3px solid #FFFFFF;
}

.screenshot.thumbnail {
    border: 3px solid #C9E8F3;
    float: left;
    margin-right: 1em;
    margin-bottom: 1em;
    height: 150px;
    width: 200px;
}

.screenshot.thumbnail img {
    display: block;
    max-height: 150px;
    max-width: 200px;
}

img.scale {
    width: 100%;
}

/* @end */

/* @group Buttons */

a:link.button,
a:visited.button,
a:hover.button,
a:focus.button,
a:active.button,
button,input[type=submit],input[type=button] {
    font-family:helvetica, arial, sans-serif;
    text-decoration:none;
    white-space:nowrap;
}

a:link.button,
a:visited.button,
a:hover.button,
a:focus.button,
a:active.button {
    padding: 0.15em 0.5em;
}

.button.disabled,
button.disabled,
button:disabled,
input[type=submit].disabled,
input[type=submit]:disabled {
  background-image: url(../../img/bg/button-gray.jpg);
  background-color: #ccc;
  border-color: #aaa;
  text-shadow:-1px -1px 1px #999;
  color: #eee;
}

a:link.button img,
a:visited.button img,
a:hover.button img,
a:focus.button img,
a:active.button img,
button img {
    vertical-align:middle;
    padding:0;
    margin:0;
    border-left:none;
    border-top:none;
    border-bottom:none;
    border-right:1px solid #3399FF;
    margin:0 0.6em 0.25em 0;
    padding:0.1em 0.5em 0.1em 0;
}

a:link.auxillary,
a:visited.auxillary,
a:hover.auxillary,
a:focus.auxillary,
a:active.auxillary,
button.auxillary {
    font-size:0.923em;
    padding:0.15em 1em 0.1em 0.7em;
}

a:link.prominent,
a:visited.prominent,
a:hover.prominent,
a:focus.prominent,
a:active.prominent,
button.prominent {
    font-size:1.2em;
    -moz-border-radius: 13px;
    -webkit-border-radius: 11px;
    border-radius: 13px;
}

a:link.significant,
a:visited.significant,
a:hover.significant,
a:focus.significant,
a:active.significant,
button.significant {
    font-size:1.2em;
    -moz-border-radius: 16px;
    -webkit-border-radius: 14px;
    border-radius: 16px;
    font-weight: bold;
    padding:0.4em 0.8em 0.3em 0.5em;
    line-height: 2em;
}

a:link.significant img,
a:visited.significant img,
a:hover.significant img,
a:focus.significant img,
a:active.significant img,
button.significant img {
    /* padding:0 0.4em 0.2em 0.2em; */
    /* margin-right: 0.4em; */
        margin-bottom:0.4em;
    margin-right:0.6em;
    padding:0.4em 0.6em 0.2em 0.2em;
}

a:link.button.neutral,
a:visited.button.neutral,
a:hover.button.neutral,
a:focus.button.neutral,
a:active.button.neutral,
button.neutral {
    background-color:#E5A365;
    background-image: url(../../img/bg/button-orange.jpg);
    border:1px solid #CB7E42;
    text-shadow:-1px -1px 1px #BF6524;
}

a:link.button.neutral img,
a:visited.button.neutral img,
a:hover.button.neutral img,
a:focus.button.neutral img,
a:active.button.neutral img,
button.neutral img {
    border-right:1px solid #DD7711;
}

a:link.button.positive,
a:visited.button.positive,
a:hover.button.positive,
a:focus.button.positive,
a:active.button.positive,
button.positive {
    background-color:#8CC553;
    background-image: url(../../img/bg/button-green.jpg);
    border: 1px solid #488F03;
    text-shadow:-1px -1px 1px #7BAB29;
}

a:link.button.positive img,
a:visited.button.positive img,
a:hover.button.positive img,
a:focus.button.positive img,
a:active.button.positive img,
button.positive img {
    border-right:1px solid #55AA00;
}

a:link.negative,
a:visited.negative,
a:hover.negative,
a:focus.negative,
a:active.negative,
button.negative {
    background-color:#EC7F82;
    background-image: url(../../img/bg/button-red.jpg);
    border: 1px solid #CF2F1E;
    text-shadow: -1px -1px 1px #CF2F1E;
}

a:link.negative img,
a:visited.negative img,
a:hover.negative img,
a:focus.negative img,
a:active.negative img,
button.negative img {
    border-right:1px solid #E54C4F;
}

a:link.button.cool,
a:visited.button.cool,
a:hover.button.cool,
a:focus.button.cool,
a:active.button.cool,
button.cool {
    background-color: #8D96A7;
    background-image: url(../../img/bg/button-dark-blue.jpg);
    border: 1px solid #22334f;
    text-shadow:-1px -1px 1px #7C869A;
}

a:link.button.cool img,
a:visited.button.cool img,
a:hover.button.cool img,
a:focus.button.cool img,
a:active.button.cool img,
button.cool img {
    border-right:1px solid #18243B;
}

a:link.button[disabled=disabled],
a:visited.button[disabled=disabled],
a:hover.button[disabled=disabled],
a:focus.button[disabled=disabled],
a:active.button[disabled=disabled],
button[disabled=disabled],
input[type=submit][disabled=disabled] {
    opacity: 0.5;
    cursor: default;
}

/* @end */

/* @group Add To Favourites */

button.add-to-fav {
    margin: 0;
    padding: 0.5em 0 0.2em 19px;
    background: none;
    background-image: url(../../img/icons/fav-off.gif);
    background-position: left center;
    background-repeat: no-repeat;
    -moz-border-radius: 0;
    border:none;
    color: #3d6db5;
    cursor:pointer;
    text-shadow:none;
    white-space: normal;
    font-size: 0.923em;
    font-weight: bold;
}

button.add-to-fav.fav {
    color: #CC0000;
    background-image: url(../../img/icons/fav-on.gif);
}

form button.add-to-fav:hover,
form button.add-to-fav:focus {
    color: black;
}

form button.add-to-fav.loading-fav,
form button.add-to-fav.loading-fav:hover,
form button.add-to-fav.loading-fav:focus,
form button.add-to-fav.loading-fav:active {
    color: #A4A5A5;
    background-image: url(../../img/icons/orange-loading.gif);
}

/*.favorite {
    background-image: url(../../img/icons/icons.png);
    background-repeat: no-repeat;
    background-position: 0 -700px;
    padding-left: 20px;
    padding-bottom: 7px;
    cursor: pointer;
}
.favorite-loading {
    background-image: url(../../img/icons/orange-loading.gif);
    background-position: 0 0;
}

.favorite-added {
    background-image: url(../../img/icons/icons.png);
    background-position: 0 -800px;
    color: #D11F1F;
} */

form.favorite {
    margin: 0;
}

/* @end */

.privacy-policy {
    margin-left: 1em;
    margin-top: 0.5em;
}
.policy-statement {
    margin-bottom: 1em;
    max-height: 300px;
    overflow: auto;
    padding:2px 5px;
    background-color: #fff;
    border: 1px solid #5875A0;
    color:#666666;
}

.prose {
    margin: 1em;
}
.primary.prose {
    margin: 0;
}

.accessibility-only {
    display:block;
    float:left;
    height:1px;
    overflow:hidden;
    text-indent:-5000px;
    width:1px;
}

/* @end */

/* @group Page structure */

.section {
    width: 90%;
    overflow: hidden;
    padding: 0 2%;
    margin: 0 auto;
    max-width: 90em;
    min-width: 960px;
    position: relative;
    min-height: 768px; /* arbitrary high number to force the footer down */
}

/* @group Header */

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

/* @group Title */

#title {
    font-size: 3.231em; /* 42px */
    color: #223355;
    font-weight: bold;
    margin-top: 1.2em;
    margin-bottom: 0.4em;
    line-height: 0.8;
}

#title a:link,
#title a:visited,
#title a:hover,
#title a:focus,
#title a:active {
    color: #223355;
    text-decoration: none;
    background: none;
}

#title em {
    color: #445577;
    font-weight: normal;
    font-style: italic;
}

#title img {
    vertical-align: middle;
    position: relative;
    top: -0.1em;
}

/* @end */

/* @group Stats */

.stats {
    font-size: 1em;
    padding: 0;
    margin: -28px 0 0 80px;
}

.stats li:last-child {
    border-bottom: none;
}

.stats strong, .stats span {
    padding: 0.1em 0.2em;
}

.stats strong {
    color: #333;
    font-size: 1.3em;
    font-style: italic;
    font-weight: normal;
}

/* @end */

/* @group Layout constructs */

.primary {
    width: 73.47%;
    float: right;
    clear: right;
    display: inline;
}
.secondary {
    width: 24.49%;
    float: left;
    clear: both;
    display: inline;
}

.primary .primary {
    width: 63.889%;
    float: left;
    clear: none;
}

.primary .secondary {
    margin-bottom: 2em;
    width: 33.333%;
    float: right;
    clear: none;
}

/* @group Inverse layout */

.inverse .primary {
    float: left;
    clear: left;
}
.inverse .secondary {
    float: right;
    clear: right;
}
.inverse .primary .primary {
    float: left;
    clear: none;
}
.section .inverse .primary {
    float: right;
    clear: none;
}
.inverse .primary .secondary {
    float: right;
    clear: none;
}
.section .inverse .secondary  {
    float: left;
    clear: none;
}

/* @end */

.column-wrapper {
    overflow: hidden;
}

.column {
    float: left;
    width: 32%;
    display: inline;
    margin-left: 2%;
}

.first {
    margin-left: 0;
}

/* @end */


/* @end */

/* @group Page Components */

.secondary fieldset {
    border: none;
    padding: 0;
}

.secondary select#add-to-collection {
    width: 100%;
    margin: 0.5em 0;
}

.secondary li a:link,
.secondary li a:visited,
.secondary li a:hover,
.secondary li a:focus,
.secondary li a:active {
    font-weight: bold;
}

/* @group Featured */

.featured {
    border: 4px solid #e0effd;
    background-color: #e0effd;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    border-radius: 5px;
    margin-bottom: 2em;
    clear: both;
}
.featured-inner {
    background-color: #fff;
    border: 1px solid #2E5186;
    -webkit-border-radius: 3px;
    -moz-border-radius: 3px;
    border-radius: 3px;
}

/* @end */

/* @group Article */

.article {
    background-color: #fff;
    border: 1px solid #C9E8F3;
    -webkit-border-radius: 3px;
    -moz-border-radius: 3px;
    border-radius: 3px;
    padding: 1em;
    overflow: hidden;
}
.secondary .article {
    margin-bottom: 1em;
}

.article h4 {
    clear: both;
    margin-bottom: 0.3em;
}

.article img .screenshot {
    margin-top: 1em;
    margin-right: 2em;
}

.article a:link,
.article a:visited,
.article a:hover,
.article a:focus,
.article a:active {
    font-weight: bold;
}

.article ul.further-navigation {
    border-top: none;
    padding-top: 0;
    margin-bottom: 0;
}

.article.userinput {
    overflow: visible;
}

/* @end */

/* @group Notification */

.notification {
    background-color: #FFFFFF;
    border: 1px solid #e0effd;
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    border-radius: 5px;
    padding: 1em;
    color: #444444;
    margin-bottom: 2em;
    position: relative;
}

.notification .button-wrapper > * {
    vertical-align: top;
}

.notification h3 {
    font-style: italic;
    font-weight: normal;
    line-height: 1.5em;
    color: #223355;
    margin-top: 0;
}

.about .notification h3 {
    display: inline;
}

.notification .continue {
    margin: 0 1em 0 1em;
}

.html-rtl .notification .continue {
    margin:0 1em 0 0.5em;
}

.notification .continue a:link,
.notification .continue a:visited,
.notification .continue a:hover,
.notification .continue a:focus,
.notification .continue a:active {
    font-size: 1.5em;
}

.notification .suggestion {
    float: right;
    text-align: right;
}

.about .notification .suggestion {
    float: none;
}

.about .notification .aux {
    width: auto;
    float: right;
    margin: -0.6em 0 0 0;
}

.about .notification .aux .button-wrapper {
    margin-bottom: 0;
    overflow: visible;
}

.html-rtl .notification .suggestion {
    float: left;
    text-align: left;
}

.html-rtl .notification .button {
    unicode-bidi: embed;
}

.notification .suggestion p {
    margin: 0;
    color: #666666;
    font-weight: bold;
}
.notification .suggestion {
    margin: 0;
    color: #666666;
    font-weight: bold;
}
.notification .aux {
    overflow: hidden;
    width: 100%;
}

/* Install button inside a notification, such as on meet-the-devloper pages. */
.notification .aux .install-container {
    float: left;
    margin: 0.5em;
}

.toggle-help,
.toggle-info .close  {
    display: block;
}

.toggle-info .close {
    font-size: 0.769em;
    position: absolute;
    top: 1em;
    right: 0.5em;
}

.notification .toggle-info {
    color: #666666;
    font-size:1.385em;
    line-height: 1.375em;
    position: relative;
    display: none;
}

.notification .toggle-info p {
    margin-bottom: 0;
    margin-top: 1em;
}

.dropdown {
    background-color: white;
    border: 1px solid #2E5186;
    -moz-border-radius:5px;
    -webkit-border-radius:5px;
    border-radius:5px;
}

#contribute-box {
    display: none;
    width: 480px;
    margin-left: -240px;
    padding: 16px;
    background-color: #fff;
    color: #444;
    -moz-box-shadow: 0 0 15px rgba(0,0,0,.5);
    -webkit-box-shadow: 0 0 15px rgba(0,0,0,.5);
    box-shadow: 0 0 15px rgba(0,0,0,.5);
    -moz-border-radius: 10px;
    -webkit-border-radius: 10px;
    border-radius: 10px;
}
#contribute-box h2 {
    margin-top: 0;
}
#contribute-box form {
    margin-bottom: 0;
}
#contribute-box p,
#contribute-box h4,
#contribute-box ul {
    font-size: 16px;
}
#contribute-box .support {
    font-size: 13px;
}
#contribute-box h4 {
    margin-bottom: .5em;
}
#contribute-box h4.comment {
    display: inline;
}
#contribute-box li {
    line-height: 180%;
}
#contribute-box label {
    font-weight: normal;
}
#contribute-box input[type=text] {
    width: 4em;
    padding:0 1px 1px 1px;
}
#contribute-box textarea {
    width: 100%;
    height: 6em;
    margin-bottom: 0.4em;
    padding:0 1px 1px 1px;
}
#contribute-box span {
    margin-left: 2em;
}
#contribute-box .commentlen {
    margin: 0;
    float: right;
}
.contrib-overlay {
    background-color: transparent;
}

.notification .toggle-info {
    clear: both;
    font-weight: normal;
    position: absolute;
    right: 0;
    font-size: 1em;
    clear:both;
    width: 24.3%;
    background-image: url(../../img/icons/pointer.gif);
    background-repeat: no-repeat;
    background-position: 95% 4px;
    padding-top: 10px;
}

.primary .notification .toggle-info {
    width: 33.2%;
    z-index: 1;
}
.primary .object-lead .toggle-info {
    width: 100%;
}

.notification .toggle-info p {
    margin-top: 0;
    padding: 1em;
}

/* @end */

/* @group Highlights */

.highlight {
    background-color: #e0effd;
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    border-radius: 5px;
    padding: 1em;
    color: #444444;
    overflow: hidden;
    margin-bottom: 1em;
}

.highlight h2,
.highlight h3 {
    margin-top: 0;
    color: #011234;
    font-size: 1.385em;
    font-weight: normal;
}

.highlight h4 {
    margin-bottom:1em;
}

.highlight p {
    margin-bottom: 0;
    margin-top: 1em;
}

.highlight img.avatar {
    float: right;
    margin-left: 1em;
    margin-bottom: 1em;
}

.highlight .more-info {
    float: left;
}

.highlight a.button {
    margin-top: 0.5em;
}

.highlight .further-navigation {
    border-top: 1px dotted #A5C9D5;
    margin-bottom: 0;
}

.highlight .further-navigation .more-info {
    float: right;
}

.highlight.warning {
    /* @button-red-dark in impala/lib */
    background-color: #bc2b1a;;
    color: #fff;
}

/* @end */

/* @group Top search and cat bar */

/* @group Categories list */

.categories {
    background-color: #e0effd;
    color: #444444;
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    border-radius: 5px;
    width: 24.49%;
    float: left;
    margin-bottom: 1em;
}

.categories h3 a:link,
.categories h3 a:visited,
.categories h3 a:hover,
.categories h3 a:focus,
.categories h3 a:active {
    color: white;
    text-decoration: none;
}

/* putting back the focus outline */
.categories h3 a:focus {
    outline: 1px dotted white;
}

.secondary .categories {
    width: 100%;
    float: none;
}

.categories h2,
.categories h3 {
    margin: 0;
    padding: 0.79em 0.8em; /* 10px 13px*/
    background-color: #305083;
    color: white;
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    border-radius: 5px;
    font-size: 1.231em;
    background-repeat: repeat-x;
    background-position: bottom left;
    font-weight: normal;
}


.categories ul {
    padding: 1em 0.5em 1em 1em;
    margin: 0;
    font-weight: bold;
}

.categories ul ul {
    padding: 0 0 1em 0;
    margin: 0;
    font-weight: bold;
}

.categories ul ul li {
    margin: 0.2em;
}

.categories ul li:first-child ul {
    border-bottom: 1px dotted #94BFCE;
    margin-bottom: 0.8em;
    padding-bottom: 0.8em;
}

.teaser-items {
    margin: 0;
    padding: 0;
    list-style-type: none;
}

.teaser-items li {
    margin: 0;
    padding: 0;
}

.teaser-items .item .install {
    padding-bottom: 2px;
}

.teaser-items .item .install strong {
    margin: 4px 0 0 0;
}

/* Hide version/platform warnings in the teaser box. */
.teaser-items .install-shell .extra {
    display: none;
}

/* @group Next and previous icons */

.slideshow-controls {
    margin: 0;
}

.section-teaser .prev,
.section-teaser .next {
    display: block;
    position: absolute;
    overflow: hidden;
    cursor: pointer;
    text-decoration: none;
    text-indent: -5000px;
    bottom: 1.6em;
    left: 8px;
    width: 27px;
    height: 27px;
    background-image: url(../../img/icons/arrows-scroller.png);
    background-position: 0 0;
    background-repeat: no-repeat;
}

.section-teaser .next {
    left: auto;
    right: 8px;
    background-position: 0 -150px;
}

.section-teaser .active.prev {
    background-position: 0 -50px;
}

.section-teaser .active.next {
    background-position: 0 -200px;
}

.section-teaser .active.prev:focus,
.section-teaser .active.prev:hover {
    background-position: 0 -100px;
}

.section-teaser .active.next:focus,
.section-teaser .active.next:hover {
    background-position: 0 -250px;
}

/* @end */

/* @group Slideshow Window with Javascript */

.section-teaser .window {
    direction: ltr;
}

.section-teaser .window ol.teaser-items {
    margin: 0;
    padding: 0;
    height: 250px;
    max-height: 250px;
    position: relative;
    left: 0;
    direction: ltr;
}

.section-teaser .window ol.teaser-items li {
    margin: 0;
    padding: 1px 0 0 0;
}

.section-teaser .window .more-info {
    background-position:right -155px;
}

.teaser-items li:not(:first-child) {
    display: none;
}

/* @end */

/* @group Teaser internals */

.section-teaser .column-wrapper {
    margin: 0 1em;
}

.section-teaser h2 {
    margin-left: 0.619em;
    margin-right: 0.619em;
    font-size: 1.615em;
    line-height: 0.952em;
	padding-top:1px;
}

.section-teaser .column {
    border-left: 1px dotted #A4CFDE;
    text-align: center;
    width: 31.5%;
}

#t-introduction .column {
    height:220px;
}

.section-teaser .column p,
.section-teaser .column h3 {
    margin-left: 1em;
}

.section-teaser .first {
    border-left: none;
}

.section-teaser .addon-view {
    background-position: bottom right;
    background-repeat: no-repeat;
}

.section-teaser .addon-view .lead {
    clear: both;
    margin-left: 1em;
    margin-right: 1em;
}

.section-teaser .addon-view .more-info {
    float: none;
}

.section-teaser .addon-view .column {
    border:none;
    text-align: left;
    width: 25%;
}

.section-teaser .addon-view .column-inner {
    padding: 1em 0 1em 55px;
    position: relative;
}

.section-teaser .addon-view .icon {
    position: absolute;
    top: 1em;
    left: 10px;
}

.section-teaser .addon-view h3 {
    margin-top: 0;
    font-weight: bold;
    font-size: 1em;
    line-height: 1.25em;
}

.section-teaser .addon-view p,
.section-teaser .addon-view h3 {
    margin-left: 0;
    margin-right: 0;
    line-height: 1.23em;
}

div.section-teaser .column .button {
    white-space: nowrap;
    margin: 0;
    margin-right: 1%;
    margin-left: 0.7%;
}

/* @group Pagination */

ol.pagination {
    width: 50%;
    margin-bottom: 2em;
    margin-left: 0;
    float: left;
    line-height: 2em;
}
.listing-footer ol.pagination {
    margin-bottom: 0;
}
ol.pagination li {
    display: inline;
    list-style: none;
}
ol.pagination li a {
    padding: 0.3em 0.7em;
    font-weight: bold;
}
ol.pagination span {
    font-weight: bold;
    padding: 0.3em 0.7em;
}
ol.pagination a[rel~="prev"],
ol.pagination span.prev  {
    background-image: url(../../img/icons/arrows.gif);
    background-repeat: no-repeat;
    background-position: 5px -420px;
    color: #3d6db5;
    padding-right:0.7em;
    padding-left: 15px;
}
ol.pagination a[rel~="next"],
ol.pagination span.next {
    background-image: url(../../img/icons/arrows.gif);
    background-repeat: no-repeat;
    background-position: 95% -340px;
    color: #3d6db5;
    padding-left:0.7em;
    padding-right: 15px;
}
ol.pagination span.prev {
    color: #666;
    background-position: 5px -540px;
}
ol.pagination span.next {
    color: #666;
    background-position: 92% -500px;
}
ol.pagination li.selected a:link,
ol.pagination li.selected a:visited,
ol.pagination li.selected a:hover,
ol.pagination li.selected a:focus,
ol.pagination li.selected a:active {
    -webkit-border-radius: 3px;
    -moz-border-radius: 3px;
    border-radius: 3px;
    background-color: #223355;
    color: white;
}
ol.pagination li a:hover,
ol.pagination li a:focus,
ol.pagination li a:active {
    background-color: #BDDDE8;
    /*color: #223355;*/
    -webkit-border-radius: 3px;
    -moz-border-radius: 3px;
    border-radius: 3px;
    text-decoration: none;
}

/* @end */

/* @group Share This */

#sharing-popup {
    padding: 0;
}

.share-arrow {
    background-image: url(../../img/icons/pointer.gif) no-repeat 30px top;
    padding-top: 7px;
    display: none;
}

#sharing-popup div.share-content {
    -moz-border-radius:5px;
    -webkit-border-radius:5px;
    border-radius:5px;
    margin: 0;
}

.share-networks ul {
    padding: 0 0 0 0.8em;
    display: table;
    -moz-box-sizing: border-box;
    margin: 0;
    width:100%;
}

.html-rtl .share-networks ul {
    padding: 0 0.8em 0 0;
}

.share-networks li {
    margin-bottom:0.5em;
    display:table-row;
}

.share-networks li:hover span.share-link {
    background-image:url(../../img/icons/share-arrow-sprite.png);
    background-repeat:no-repeat;
    background-position: right 8px;
}

.html-rtl .share-networks li:hover span.share-link {
    background-position: 0 -42px;
}

.share-networks li span {
    display:table-cell;
    padding-top:8px;
    padding-right:15px;
    padding-left:20px;
}

.html-rtl .share-networks li span {
    padding-right:20px;
    padding-left:15px;
}

.no-email .share-networks li.email {
    display: none; /* shown with js */
}

.share-email {
    padding: .8em;
    display: none;
}
.share-email label {
    display: block;
}
.share-email .container {
    margin-bottom: .5em;
}
.share-email .container input,
.share-email .container textarea {
    -moz-box-sizing:border-box;
    display:block;
    width:100%;
}
.share-email .container textarea {
    min-height: 6em;
}
.share-email .container.buttons {
    margin-bottom: 0;
    text-align: right;
}
.share-email .container.buttons button {
    margin-left: .5em;
}
.html-rtl .share-email .container.buttons button {
    padding-left: 0;
    padding-right: .5em;
}
.share-email .emailerror p {
    font-weight: bold;
    max-width: 25em;
}
.share-email .share-email-success {
    display: none;
    background: #DAF1FA; /* IE */
    background: rgba(218, 241, 250, 0.8);
    font-size: 180%;
    font-weight: bold;
    text-align: center;
    position: absolute;
    height: 100%;
    width: 100%;
    left: 0;
    top: 0;
}
.share-email .share-email-success p {
    padding-top: 50%;
    margin-top: -3.5em;
}

/* @end */

/* @group Top Shared Addons */

.top-shared-addons h3 {
    margin-bottom:0.5em;
}

.top-shared-addons h3 span {
    font-size:0.7em;
}

.top-shared-addons ol {
    margin-bottom:0;
}

/* @end */

/* @group Addon list */

.secondary-item-list {
    background-color: #fff;
    border: 1px solid #C9E8F3;
    -webkit-border-radius: 3px;
    -moz-border-radius: 3px;
    border-radius: 3px;
    padding: 1em;
    overflow: hidden;
}
.secondary-item-list ul {
    margin: 0.5em 0 0 0;
    padding: 0;
}

.secondary-item-list ul li {
    margin: 0;
    padding: 0;
}

.secondary-item-list ul li a {
    margin: 0 0 0.8em 0;
    padding: 0 0 0 25px;
    display: block;
    line-height: 1.25;
}

.secondary-item-list.n h4 a {
    color: inherit;
}
/* @end */

/* @group Feedback Form */

form.addon-feedback {
    width: 50%;
    float: left;
    margin-right: 1.5em;
    margin-top: 1em;
}

form.addon-feedback textarea {
    width: 80%;
    background-color: #E3F3F9;
    float: right;
    min-height:140px;
}
form.addon-feedback select {
    background-color: #E3F3F9;
    margin-left: 1%;
}
form.addon-feedback label {
    float: left;
    clear: both;
    width: 18%;
    margin-bottom: 1em;
}

form.addon-feedback button {
    display: block;
    margin-top: 1em;
    clear: both;
}

form.addon-feedback div.container {
    clear: both;
    margin-bottom: 0.5em;
    overflow: hidden;
}

/* @end */

/* @group Listing */

.listing {
    margin-bottom: 1em;
}

/* @group Listing - Header */

.listing-header {
    border-bottom: 1px solid #A5BFCE;
    -webkit-border-top-right-radius: 3px;
    -webkit-border-top-left-radius: 3px;
    -moz-border-radius: 3px 3px 0 0;
    border-radius: 3px 3px 0 0;
    padding: 0.1em 0 0.1em 0.25em;
    line-height: 2.5em;
}
.listing-header ul {
    margin-bottom: 0;
    float: left;
}
.listing-header form {
    margin-bottom: 0;
}
.listing-header li {
    line-height: 2.5;
    display: inline;
    margin: 0 0;
}
.listing-header li a {
    color: #223355;
    font-weight: bold;
    text-decoration: none;
    border: 1px solid transparent;
    -webkit-border-radius: 3px;
    -moz-border-radius: 3px;
    border-radius: 3px;
    padding: 0.3em 0.6em;
    white-space: nowrap;
}
.listing-header li a:hover,
.listing-header li a:focus {
    background-color: #BBDCE8;
}
.categories li.selected,
.categories li.selected a,
.listing-header li.selected a:link,
.listing-header li.selected a:visited,
.listing-header li.selected a:hover,
.listing-header li.selected a:focus,
.listing-header li.selected a:active {
    color: #fff;
    background-color: #294087;
}

.listing-header .num-results {
    float: left;
}

.html-rtl .listing-header .num-results {
    float: right;
}

/* @group Item sort form */

.item-sort {
    text-align:right;
    white-space:nowrap;
    float: right;
}



/* @end */

/* @end */

/* @group Listing - Footer */

.listing-footer {
    background-color: #FFFFFF;
    background-repeat: repeat-x;
    background-position: left top;
    border-top: 1px solid #A5BFCE;
    -webkit-border-bottom-right-radius: 3px;
    -webkit-border-bottom-left-radius: 3px;
    -moz-border-radius: 0 0 3px 3px;
    border-radius: 0 0 3px 3px;
    margin-top: -1px;
    position: relative;
    z-index: 10;
    overflow: hidden;
    padding:0.3em 1em 0.5em;
}
.listing-footer a {
    font-weight: bold;
}
.listing-footer .subscribe,
.listing-footer .pagination {
    float: left;
}

ol.pagination + .num-results {
    float: right;
    line-height: 2em;
}

.html-rtl ol.pagination + .num-results {
    float: left;
}

.listing-footer .subscribe {
    margin-top: 0.3em;
}

.listing-footer .more-info {
    margin-top: 0.3em;
}


/* @end */

/* @group Items */

.item {
    margin: 1.2em 0;
    padding-top:1px;
}
.item blockquote,
.version blockquote {
    font-style: normal;
    margin: 0;
    margin-bottom: 0.5em;
}

/* @group Headings */

.item h5 {
    font-size: 1.167em; /* 14px */
    margin-top: 0.5em;
    margin-bottom: 0.2em;
}
.item h3,
.item h4 {
    font-size: 1.385em; /* 18px */
    font-weight: bold;
    line-height: 1em;
    margin-top: 0;
    margin-bottom: 0.778em;
    overflow: hidden;
}
.item h3 span,
.item h4 span {
    font-size: 0.667em; /* 13px */
    font-weight: normal;
    display:block;
}
.item h5 span,
.version h5 span {
    font-size: 0.857em;
    font-weight:normal;
    white-space: nowrap;
}

/* @end */

/* @group Item information */

.item .meta {
    font-size: 0.923em; /* 12px */
    border-top: 1px dotted #e0effd;
    padding-top: 0.3em;
}
.item .meta .addons {
    margin-right: 1em;
}
.html-rtl .item .meta .addons {
    margin-right: auto;
    margin-left: 1em;
}

.item .downloads {
    margin-left: 1em;
}
.html-rtl .item .downloads {
    margin-left: auto;
    margin-right: 1em;
}


.item .updated {
    margin-left: 1em;
    white-space: nowrap;
}
.html-rtl .item .updated {
    margin-left: auto;
    margin-right: 1em;
}

/* @group Item info (aligned Right) */

.item-info {
    float: right;
    width: 15em;
    padding-left:2%;
    margin-left: 2%;
}

.item .item-info {
    border-left: 1px dotted #B4DFEE;
    /*margin-bottom: -50em;
    padding-bottom: 50em;*/
}
.item-info ul {
    list-style-type: none;
}

/* @end */

/* @group Install Information */

.item .install {
    float: right;
    text-align: center;
    -webkit-border-radius: 11px;
    -moz-border-radius: 11px;
    border-radius: 11px;
    padding: 2px 3px 3px 3px;
    margin-left: 0.5em;
}

.item .unavailable {
    border: 1px solid #D2E7EE;
    padding: 0.3em;
    width: 10em;
    background-color: #FFFFFF;
    color: #666666;
}

.recommended .install {
    background-color: #efe;
    border: 1px solid #2a2;
}

.experimental .install{
    background-color: #fee;
    border: 1px solid #f66;
}

.item .install strong {
    display: block;
    font-weight: normal;
    font-size: 0.85em;
    line-height: 1em;
    color: #000;
    text-shadow: #FFFFFF 1px 1px 1px;
    clear: left;
    margin: 1px 0 0 0;
}

/* @end */



/* @end */

/* @group Listing and separated items */
.separated-listing h3 {
    float: left;
    margin-top: 0;
}

.html-rtl .separated-listing h3 {
    float: right;
}

.separated-listing form.item-sort {
    float: right;
    margin-top: -0.2em;
}

.html-rtl .separated-listing form.item-sort {
    float: left;
}

.separated-listing .item img.icon {
    overflow: hidden;
}

.separated-listing .item .item-info {
    border-left: 1px dashed #b4dfee;
    margin-bottom: 2em;
}

.separated-listing .item .item-info p {
    margin: 0;
}

.separated-listing .item .downloads {
    margin: 0;
}

.separated-listing blockquote {
    margin-right: 11em;
    clear: left;
    overflow-x:hidden;
}

.separated-listing .item h4 {
    float: left;
}

.html-rtl .separated-listing .item h4 {
    float: right;
}

.separated-listing .item-info p:first-child {
    margin-bottom: 3px;
}

.table-listing .item,
.blocks .item,
.listing .item,
.separated-listing .item {
    padding: 1em 1em 1em 52px;
    position: relative;
    background-color: #FFFFFF;
    clear: both;
    background-repeat: repeat-x;
    background-position: left bottom;
}

.table-listing .item,
.blocks .item,
.separated-listing .item {
    border: 1px solid #C9E8F3;
    margin: 0 0 1em 0;
    -moz-border-radius:8px;
    -webkit-border-radius: 8px;
    border-radius:8px;
}

.listing .item {
    border-bottom: 1px solid #D6E9F0;
    margin: 0 0 0 0;
}

.listing .item img.icon,
.separated-listing .item img.icon {
    position: absolute;
    top: 0.5em;
    left: 7px;
}

.blocks .item {
    padding: 1em;
    height: 24.7%;
    width: 90%;
    min-width: 315px;

    clear: none;
    float: left;

    -moz-border-radius:6px;
    -webkit-border-radius: 6px;
    border-radius:6px;
}

.html-rtl .blocks .item {
    float: right;
    clear: none;
}

.blocks .item .description {
    padding-top: 0;
    margin-bottom: 0.5em;
}

/* Float every other block right for a nice grid if we have space. */
@media all and (min-width: 1055px) {
    .blocks .item {
        width: 45%;
    }

    .blocks .item:nth-child(even) {
        float: right;
    }

    .html-rtl .blocks .item:nth-child(even) {
        float: left;
    }
}

.table-listing .item {
    display: table;
    padding-left: 2em;
    width: 90%;
    -moz-border-radius:6px;
    -webkit-border-radius: 6px;
    border-radius:6px;
}

.table-listing .item-info {
    display: table-cell;
    float: none;
}

.table-listing .main-info {
    display: table-cell;
    padding-right: 1em;
}


/* @group Item variations */

.listing .recommended,
.separated-listing .recommended {
    background-image: url(../../img/bg/listing-item-yellow.png);
    border-color: #fc9;
}
.recommended .meta {
    border-color: #fc9;
}

.listing .experimental,
.separated-listing .experimental {
    background-image: url(../../img/bg/listing-item-red.png);
    border-color: #fcc;
}
.experimental .meta {
    border-color: #fcc;
}

/* @end */

/* @end */

/* @end */

/* @end */

/* @group Object Lead */

.object-lead {
    padding: 1em;
    margin: 0;
    background-repeat: repeat-x;
    background-position: left bottom;
    position: relative;
}

.object-lead img.avatar {
    border: 3px solid #e0effd;
    float: left;
    margin-right: 1em;
}

.object-lead form {
    margin:0;
}

.object-lead h3 {
    margin-top: 0;
}

.object-lead .meta {
    float: right;
    width: 18em;
    padding-left: 2%;
    margin: 2em 2% 0 0;
    margin-left: 1em;
    border-left: 1px dotted #B4DFEE;
}

.html-rtl .object-lead .meta {
    float: left;
    padding-left: auto;
    padding-right: 2%;
    margin-left: 2%;
    margin-right: 1em;
    border-left: none;
    border-right: 1px dotted #B4DFEE;
}

.object-lead .object-info p {
    margin: 0;
}

.object-lead .user-role {
    position: absolute;
    top: 1em;
    right:0;
    background-image:url(../../img/icons/developer.png);
    background-position: left center;
    background-repeat: no-repeat;
    padding: 0.3em 1.18em 0.3em 35px;
    text-transform: uppercase;
    font-size: 0.846em;
}

.object-lead .notification {
    background-color: #e0effd;
    border: none;
    margin-top: 2em;
    margin-bottom: 1em;
    clear: left;
}

.aux .button-wrapper,
.object-lead .button-wrapper {
    float: left;
    margin-top:0.5em;
    overflow: hidden;
}

.html-rtl .aux .button-wrapper,
.html-rtl .object-lead .button-wrapper {
    float: right;
}

/* @group Object Content */

.object-content {
    margin-left: 220px;
}

.object-lead table,
.object-lead tbody {
    border-top: none;
    border-bottom: none;
}

.object-lead table {
    width: 100%;
    margin-top: 1em;
}

.object-lead table tr th {
    width: 20%;
}

.object-lead table tr td,
.object-lead table tr th {
    border-top: 1px dotted #A5C9D5;
    border-bottom: none;
}

.object-lead table tr:first-child td,
.object-lead table tr:first-child th {
    border-top: none;
}

/* @end */



/* @end */

/* @group Person Info table */

table.person-info th,
table.person-info td {
    display: block;
}

table.person-info td {
    border-top:none;
    margin: 0;
    padding: 0.1em 0 0.3em 0;
}

table.person-info th {
    border-top:1px dotted #A5C9D5;
    margin: 0;
    padding: 0.3em 0 0 0;
}

table.person-info tr:first-child th {
    border-top: none;
}

table.person-info tbody {
    border-top:none;
}

table.person-info {
    border-bottom:none;
}

table.person-info a:link,
table.person-info a:visited,
table.person-info a:hover,
table.person-info a:focus,
table.person-info a:active {
    font-weight: bold;
}

/* @end */

/* @group Collection Columns */


.article-wrapper {
    margin-bottom: 1em;
    clear: both;
}

.article-wrapper .article {
    padding-bottom: 0;
}

.article-wrapper h3 {
    margin-top: 0;
}

/* @end */

/* @group Further Navigation */

ul.further-navigation {
    border-top: 1px dotted #B4DFEE;
    padding-top: 1em;
    margin-top: 1.5em;
}

ul.further-navigation li {
    display: inline;
    padding-right: 1em;
}

ul.further-navigation li a {
    font-weight: bold;
}

/* @end */

/* @end */

/* @group Overrides */

/* @group RL languages */



/* class on the html element in order to work with arabic etc */

.html-rtl {
    text-align: right;
    direction: rtl;
}

.html-rtl .primary {
    float: left;
    clear: left;
}
.html-rtl .secondary {
    float: right;
    clear: right;
}
.html-rtl .primary .primary {
    float: right;
    clear: none;
}
.html-rtl .primary .secondary {
    float: left;
    clear: none;
}

/* @group Helper Styles */

/* @group Generic Image Styles */



/* @end */

/* @group More Info */

.html-rtl .more-info {
    float: left;
}
.html-rtl .more-info,
.html-rtl .more-info:link,
.html-rtl .more-info:visited,
.html-rtl .more-info:hover,
.html-rtl .more-info:focus,
.html-rtl .more-info:active {
background-position:left -253px;
padding-right:0;
padding-left: 1em;
}

.html-rtl .more-info:hover,
.html-rtl .more-info:focus,
.html-rtl .more-info:active {
background-position:left -303px;
}
.html-rtl .item a.show-expanded {
    float: left;
}

.html-rtl .highlight .further-navigation .more-info {
    float: left;
}

.html-rtl .section-teaser .window .more-info {
    background-position:left -155px;
}

.html-rtl .section-teaser .addon-view .more-info {
    float: none;
}

/* @end */

/* @group Icon Indicators */

.html-rtl .subscribe {
    background-position: right 2px;
    padding: 0 20px 0 0;
}

.html-rtl .addons {
    background-position: right -200px;
    padding: 0 20px 7px 0;
}
.html-rtl .collections {
    background-position: right -300px;
    padding: 0 20px 0 0;
}
.html-rtl .subscribers {
    background-position: right -400px;
    padding: 0 20px 7px 0;
}
.html-rtl .category {
    background-position: right -500px;
    padding: 0 20px 0 0;
}
.html-rtl .tags {
    background-position: right -600px;
    padding: 0 20px 0 0;
}
.html-rtl .digg {
    background-position: right -890px;
    padding: 0 20px 0 0;
}
.html-rtl .delicious {
    background-position: right -990px;
    padding: 0 20px 0 0;
}
.html-rtl .facebook {
    background-position: right -1090px;
    padding: 0 20px 0 0;
}
.html-rtl .friendfeed {
    background-position: right -1190px;
    padding: 0 20px 0 0;
}
.html-rtl .myspace {
    background-position: right -1290px;
    padding: 0 20px 0 0;
}
.html-rtl .twitter {
    background-position: right -1492px;
    padding: 0 20px 0 0;
}

.html-rtl li.subscribe,
.html-rtl li.share,
.html-rtl li.addons,
.html-rtl li.collections,
.html-rtl li.subscribers,
.html-rtl li.category,
.html-rtl li.tags,
.html-rtl li.digg,
.html-rtl li.delicious,
.html-rtl li.facebook,
.html-rtl li.friendfeed,
.html-rtl li.myspace,
.html-rtl a.subscribe,
.html-rtl a.addons,
.html-rtl a.collections,
.html-rtl a.subscribers,
.html-rtl a.category,
.html-rtl a.tags,
.html-rtl a.digg,
.html-rtl a.delicious,
.html-rtl a.facebook,
.html-rtl a.friendfeed,
.html-rtl a.myspace,
.html-rtl a.twitter {
    padding-right:20px;
    text-align: right;
}

.html-rtl .stars {
    text-indent:-5000px;
}

/* @end */

/* @end */

/* @group Inverse layout */

.html-rtl .inverse .primary {
    float: right;
    clear: right;
}
.html-rtl .inverse .secondary {
    float: left;
    clear: left;
}
.html-rtl .inverse .primary .primary {
    float: right;
    clear: none;
}
.html-rtl .section .inverse .primary {
    float: left;
    clear: none;
}
.html-rtl .inverse .primary .secondary {
    float: left;
    clear: none;
}
.html-rtl .section .inverse .secondary  {
    float: right;
    clear: none;
}


/* @end */

/* @group Stats */

.html-rtl .stats {
    text-align: right;
    float: right;
    margin: -46px 80px 0 0;
}

.html-rtl .stats li {
    overflow: hidden;
}

.html-rtl .stats strong {
    margin-left: 0.5em;
}

.html-rtl .stats span {
    text-align: right;
}

/* @end */

.html-rtl .stars {
    float: right;
    margin-left: 0.5em;
    margin-right: 0;
}

.html-rtl h5 img.icon,
.html-rtl h2 img.icon {
    float: right;
    margin-right:0;
    margin-left: 10px;
}

/* @end */

/* @group Components */

/* @group Further Navigation */

.html-rtl ul.further-navigation li {
    padding-right: 0;
    padding-left: 1em;
}

/* @end */

/* @group Star Select Replacement */

.html-rtl .selectReplacement {
    float: right;
}

/* @end */

/* @group Steps */

.html-rtl h4.step {
    left: auto;
    right: 0;
}

.html-rtl ol.numbered li {
    padding-left:0;
    padding-right:50px;
}

/* @end */

/* @group Privacy Policy */

.html-rtl .privacy-policy {
    display: block;
}

/* @end */

/* @group Homepage teaser */

.html-rtl .section-teaser .slideshow-controls {
    direction: rtl;
}


/* @end */

/* @group Tables */

.html-rtl table tr td,
.html-rtl table tr th {
    text-align: right;
}

/* @end */

/* @group Pagination */

.html-rtl ol.pagination {
    float: right;
}

.html-rtl ol.pagination li {
    float: right;
}

.html-rtl ol.pagination span.next,
.html-rtl ol.pagination a[rel~="next"] {
    background-position:left -420px;
    padding-left: 1em;
    padding-right: 0.4em;
}

.html-rtl ol.pagination span.prev,
.html-rtl ol.pagination a[rel~="prev"] {
    background-position:right -340px;
    padding-right: 1em;
    padding-left: 0.4em;
}

.html-rtl ol.pagination span.prev {
    background-position: 92% -500px;
}
.html-rtl ol.pagination span.next {
    background-position: 5px -540px;
}

/* @end */

/* @group SearchForm */

.html-rtl .search-form {
    float: left;
}

.html-rtl .secondary .search-form {
    float: none;
}

.html-rtl .search-form .subsidiary .container {
    float: right;
}

.html-rtl .search-form .important .application select,
.html-rtl .search-form .important .application input {
    margin: 0;
}

.html-rtl .search-form .basic input {
    background-position:right center;
    margin-right: 1.4%;
    margin-left: 0;
}

.html-rtl .search-form .basic label,
.html-rtl .search-form .basic select,
.html-rtl .search-form .basic input,
.html-rtl .search-form .basic button {
    float: right;
}

.html-rtl .search-form .basic button {
    left: 1.4%;
    right: auto;
}

.html-rtl .search-form .important .application label,
.html-rtl .search-form .subsidiary label {
    float: right;
}

.html-rtl form.addon-feedback label {
    float: right;
}

.html-rtl form.addon-feedback textarea {
    float: left;
}

/* @end */

/* @group Share This */

.html-rtl .share-networks {
    background-position:160px top;
    clear:both;
}

.html-rtl .share-this {
    clear: right;
    float: right;
}


/* @end */

/* @group Feedback Form */

.html-rtl form.addon-feedback {
    float: right;
    margin-right: 0;
    margin-left: 1.5em;
}

/* @end */

/* @group Meta */


.html-rtl .meta .subscribers {
    background-position: right -400px;
    float: left;
}

.html-rtl .meta .addons {
    background-position: right -200px;
    float: left;

}

/* @end */



/* @group Buttons */

.html-rtl a:link.button img,
.html-rtl a:visited.button img,
.html-rtl a:hover.button img,
.html-rtl a:focus.button img,
.html-rtl a:active.button img,
.html-rtl button img {
    border-right:none;
    border-left:1px solid #3399FF;
    margin-right:0;
    margin-left: 0.7em;
    padding-right:0.2em;
    padding-left: 0.4em;
}

.html-rtl a:link.negative img,
.html-rtl a:visited.negative img,
.html-rtl a:hover.negative img,
.html-rtl a:focus.negative img,
.html-rtl a:active.negative img,
.html-rtl button.negative img {
    border-right:none;
    border-left:1px solid #E54C4F;
}

.html-rtl a:link.button.positive img,
.html-rtl a:visited.button.positive img,
.html-rtl a:hover.button.positive img,
.html-rtl a:focus.button.positive img,
.html-rtl a:active.button.positive img,
.html-rtl button.positive img {
    border-right:none;
    border-left:1px solid #55AA00;
}

.html-rtl a:link.button.neutral img,
.html-rtl a:visited.button.neutral img,
.html-rtl a:hover.button.neutral img,
.html-rtl a:focus.button.neutral img,
.html-rtl a:active.button.neutral img,
.html-rtl button.neutral img {
    border-right:none;
    border-left:1px solid #DD7711;
}

.html-rtl .search-form button img {
    border-left: none;
}

.html-rtl button.add-to-fav {
    background-position: right;
    float: right;
    padding:0.5em 19px 0.2em 0px;
}

/* @end */

/* @group Listing */

/* @group Listing - Header */

.html-rtl .listing-header .item-sort  {
    float: left;
}

.html-rtl .listing-header ul {
    float: right;
}

/* @end */



/* @group Listing - Footer */

.html-rtl .listing-footer .subscribe {
    float: right;
    margin-left: 1em;
}

.html-rtl .listing-footer .subscribe,
.html-rtl .pagination {
    float: right;
}

/* @end */

/* @group Listing items */

.html-rtl .listing .item,
.html-rtl .separated-listing .item {
    padding:1em 52px 1em 1em;
    clear: both;
}

.html-rtl .item .install {
    float: left;
    margin-left: 0;
    margin-right: 0.5em;
}
.html-rtl .item img.icon {
    left: auto;
    right: 7px;
}

.html-rtl .item .downloads {
    margin-left: 0;
    margin-right: 1em;
}

.html-rtl .item-info {
    float: left;
    border-left:none;
    border-right:1px dotted #B4DFEE;
    margin-left:0;
    margin-left:2%;
    padding-left: 0;
    padding-right:2%;
    margin-right: 2%;
}

.html-rtl .item-info ul {
    text-align: right;
}

.html-rtl .item .thumbnail {
    float: right;
    margin-left:1em;
    margin-right:0;
}

.html-rtl .screenshot.thumbnail {
    float: right;
    margin-right: 0;
    margin-left: 1em;
}

.html-rtl .separated-listing blockquote {
    margin-right:0;
    margin-left:11em;
}

/* @end */
/* @end */

/* @group Object Lead */

.html-rtl .object-lead .user-role {
    background-position:right center;
    left:160px;
    right: inherit;
    padding:0.3em 35px 0.3em 1.18em;
}

.html-rtl .object-content {
    margin-right:0;
    margin-left:220px;
}

/* @end */



/* @end */
/* @end */

/* @group Different Applications  */

.firefox h2 {
    color: #C63717;
}

.mobile #header #title strong,
.developer-hub #header #title strong,
.android #header #title strong,
.firefox #header #title strong {
    color: #D64203;
}

.firefox #aux-nav .change li.firefox {
    display: none;
}

.thunderbird h2,
.thunderbird #header #title strong {
    color: #105399;
}
.thunderbird #aux-nav .change li.thunderbird {
    display: none;
}

.sunbird h2,
.sunbird #header #title strong {
    color: #007940;
}
.sunbird #aux-nav .change li.sunbird {
    display: none;
}

.seamonkey h2,
.seamonkey #header #title strong {
    color: #1408E5;
}
.seamonkey #aux-nav .change li.seamonkey {
    display: none;
}

.android #aux-nav .change li.android {
    display: none;
}


/* @end */

/* @end */

/* Developer page */

.vcard .secondary {
    margin: 1em 0 0 1em;
}

.teaser-items .vcard .photo-large {
    height: 150px;
    width: 150px;
}

/* We hide the <button> for these forms and
 * use js to submit when they change.
 * */
form.go button {
    display: none;
}