@import 'reset.css';

a {
    color: #92a11d;
}

.clear {
    clear: both;
}

body {
    background: url('/media/images/bg-tile.gif') top center;
    font-family: Arial, Verdana, Tahoma, Sans-Serif;
    font-size: 80%;
    text-align: center;
}

#outer {
    width: 813px;
    margin: 0 auto;
    background: url('/media/images/body-tile.png') top center repeat-y;
    text-align: center;
    padding: 0;
    border-width: 0;
}

#inner {
    text-align: center;
}


#footer {
    width: 813px;
    _width: 777px;
    margin: 0 auto;
    background: url('/media/images/footer.png') top center no-repeat;
    margin-bottom: 30px;
    text-align: left;
    border: 0;
}

#footer span {
    padding: 18px;
    display: block;
    font-size: 80%;
    float: left;
}

#header {
    height: 78px;
    background: #fff url('/media/images/header.png') top center no-repeat;
    width: 780px;
    margin: 0 auto;
    top: 0;
    position: absolute;

}

#nav {
    float: right;
    height: 29px;
    margin-right: 25px;
}

#nav li {
    float: right;
    height: 100%;
    padding: 0;
    background: url('/media/images/nav-sprite.png') 0 0 no-repeat;
}

#nav li a {
    display: block;
    width: 100%;
    height: 100%;
}

#nav li a span {
    display: none;
}

#nav #tophosts { width: 79px; background-position: -100px 0; }
#nav #directory { width: 103px; background-position: -254px 0; }
#nav #faq { width: 48px; background-position: -358px 0; }
#nav #submit { width: 102px; }
#nav #about { width: 75px; background-position: -181px 0; }

#nav .active {
    padding-bottom: 2px;
    border-bottom: 2px solid #ff9c00;
    margin-left: 2px;
}

#content {
    width: 778px;
    background: url('/media/images/content-sprite.png') -778px repeat-y;
    margin: 0 auto;
    padding-top: 78px;
    text-align: left;
}

#content-top {
    height: 12px;
    background: url('/media/images/content-sprite.png') 0 0 no-repeat;
}

#content-bottom {
    height: 12px;
    background: url('/media/images/content-sprite.png') -1556px 0 no-repeat;
}

#content-inner {
    float: left;
    width: 740px;
    font-size: 100%;
    padding: 0 10px 0 20px;
}

#sidebar {
    margin-top: 30px;
    border-top: 1px solid #bbb;
    padding: 10px 0;
}

#sidebar div {
    float: left;
    width: 30%;
}

#email_form div {
    width: 100%;
}

#recent_articles {
    width: 100% !important;
}

#recent_articles div {
    width: 30%;
    height: 250px;
    clear: right;
}

h1, h2, h3, h4, h5 {
    color: #aec023;
    font-size: 170%;
    padding: 7px 0 10px 0;
}

h1 { line-height: 24px; }
h2 { font-size: 150%; line-height: 24px; }
h3 { font-size: 135% }
h4 { font-size: 120% }
h5 { font-size: 105% }

.host h1 {
    float: left;
    font-size: 250%;
    padding: 12px 0;
}

#sidebar h3 {
    background: url('/media/images/dots.png') bottom left repeat-x;
    padding-top: 30px;
}


#sidebar ul, #sidebar div {
    font-size: 95%;
    padding: 5px 10px;
}

#sidebar div {
    padding-bottom: 15px;
}

#sidebar div ul {
    margin-bottom: 0px !important;
}

#sidebar ul li {
    padding: 4px 0;
    list-style-type: square;
    list-style-image: url('/media/images/sidebar_bullet.png');
    margin: 2px 0 0 25px;
    color: #777;
}


#sidebar ul li a {
    color: #222;
    line-height: 18px;
}

#top_hosts li {
    list-style-type: decimal !important;
    list-style-image: none !important;
}

#top_hosts li span {
    font-size: 85%;
}


p {
    line-height: 18px;
    margin-bottom: 18px;
}

.visit {
    font-size: 110%;
    line-height: 23px;
}

.comments {
    margin-top: 30px;
    padding-top: 20px;
    border-top: 1px solid #ddd;
}

.comments h3 {
    font-size: 135%;
}
.comments .icon {
    background: url('/media/images/icon-sprite.png') 4px 3px no-repeat;
    display: block;
    width: 30px;
    height: 19px;
    font-size: 1%;
    float: left;
}

.arrow-point {
    background: #fff url('/media/images/icon-sprite.png') 0 -44px no-repeat;
    display: block;
    height: 16px;
    width: 20px;
    padding: 0 2px;
    float: left;
}


.stars {
    background: url('/media/images/star-sprite.png') 0 0 no-repeat;
    width: 60px;
    height: 13px;
    display: block !important;
}

.stars span {
    display: none;
}

.stars05 { background-position: 0 -12px; }
.stars1 { background-position: 0 -26px; }
.stars15 { background-position: 0 -39px; }
.stars2 { background-position: 0 -53px; }
.stars25 { background-position: 0 -67px; }
.stars3 { background-position: 0 -81px; }
.stars35 { background-position: 0 -94px; }
.stars4 { background-position: 0 -108px; }
.stars45 { background-position: 0 -122px; }
.stars5 { background-position: 0 -135px; }


.big_stars {
    background: url('/media/images/big_stars.png') 0 0 no-repeat;
    width: 225px;
    height: 46px;
    display: block !important;
}

.big_stars05 { background-position: 0 -46px; }
.big_stars1 { background-position: 0 -96px; }
.big_stars15 { background-position: 0 -147px; }
.big_stars2 { background-position: 0 -195px; }
.big_stars25 { background-position: 0 -247px; }
.big_stars3 { background-position: 0 -297px; }
.big_stars35 { background-position: 0 -350px; }
.big_stars4 { background-position: 0 -396px; }
.big_stars45 { background-position: 0 -446px; }
.big_stars5 { background-position: 0 -496px; }

.comment {
    background: url('/media/images/comment-sprite.png') 0 0 no-repeat;
    width: 514px;
    margin: 20px 0;
    display: block;
    border: 1px solid #fff;
}

.comments ul li .text {
    margin: 0;
    padding: 20px;
    margin-left: 20px;
    line-height: 19px;
}

.comments .meta {
    padding: 20px 20px 0 20px;
    margin-left: 20px;
    font-style: italic;
}

.comments ul li .comment-bottom {
    background: url('/media/images/comment-sprite.png') 0 -2866px no-repeat;
    display: block;
    height: 14px;
    font-size: 1%;

}

.comments .positive {
    background-position: -514px 0;
}
.comments .positive .comment-bottom {
    background-position: -514px -2866px;
}

.comments .neutral {
    background-position: -1028px 0;
}
.comments .neutral .comment-bottom {
    background-position: -1028px -2866px;
}

.comments .negative {
    background-position: -1542px 0;
}
.comments .negative .comment-bottom {
    background-position: -1542px -2866px;
}

#purchase {
    padding: 5px 0;
    font-size: 180%;
    line-height: 22px;
}

.ratings {
    margin-left: 35px;
    padding: 0 7px;
    font-size: 85%;
    background: #fff;
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
}

.ratings tr, .ratings th, .ratings td {
    display: inline;
    float: left;
    padding: 4px 3px;
}

.ratings th {
    padding-top: 5px;
}
.ratings tr {
    padding: 4px 12px;
}

.author .name {
    color: #000;
    font-size: 130%;
}

.author .name a {
    color: #92a11d;
}

.author {
    color: #aaa;
    line-height: 20px;
    float: left;
}

.tools {
    font-size: 80%;
    float: right;
    color: #999;
    display: none;
}

.tools a {
    color: inherit;
}

.rating {
    margin: 0;
}

.comment-form {
    font-size: 90%;
}

.comment-form table th, .comment-form table td {
    padding: 5px 0;
}

.comment-form table th {
    width: 6%;
    vertical-align: middle !important;
}

.comment-form table td {
    width: 35%;
    vertical-align: middle !important;
}

.comment-form .rating {
    margin: 0;
}

.comment-form .textarea {
    vertical-align: top !important;
}

.comment-form .optional {
    color: grey;
}


.comment-form small {
    color: grey;
    font-size: 80%;
}

.leaderboard {
    width: 100%;
    border: 1px solid #ccc;
    background: #fafafa;
}

.leaderboard th {
    color: #444;
    background-color: #eaeaea;
    text-align: center;
    padding: 8px 3px;
}

.leaderboard .featured {
    background-color: #bbb;
}

.leaderboard th.host {
    text-align: left;
}

.leaderboard td {
    color: #222;
    vertical-align: middle;
    padding: 18px 8px;
    border-bottom: 1px solid white;
    border-right: 1px solid white;
}

.leaderboard td span {
    display: block;
    color: grey;
}

.leaderboard td.rank {
    color: grey;
    font-size: 100%;
    font-weight: normal;
}

.leaderboard td.percentage {
    font-weight: bold;
    text-align: center;
    font-size: 180%;
    color: #111;
}

.leaderboard td.percentage span {
    font-size: 50%;
    padding: 6px 0;
    display: block;
    white-space: nowrap;
}

.leaderboard td.percentage span {
    font-weight: normal;
}

.leaderboard td.bigname {
    font-size: 120%;
}

.leaderboard h2 {
    font-size: 120%;
    font-weight: inherit;
}


.even {
    background-color: #eee;
}

.odd {
}

.hidden {
    display: none;
}

.errorlist {
    color: red !important;
    padding: 7px 0 0 5px !important;
}

.errors, .success {
    padding: 5px;
    margin: 10px 0;
    font-weight: bold;
    border: 1px solid grey;
    background-color: #eeecb6;
}

.errors li, .success li {
    padding: 3px 0;
}

.error {
    color: red !important;
    border-color: red !important;
}

.success {
    color: green !important;
    border-color: green !important;
}

.rank {
    font-size: 240%;
    font-weight: bold;
    text-align: center;
    color: #616b13;
    padding: 3px;
    margin: 11px 0;
}

.logo {
    padding: 3px;
    border: 1px solid #ddd;
    margin-bottom: 15px;
    display: block;
    width: 225px;
    float: right;
}

.small_logo {
    width: 150px;
}

.rank span {
    font-size: 35% !important;
    font-weight: normal !important;
}

#breadcrumbs {
    position: absolute;
    bottom: 8px;
    right: 15px;
}

.dots {
    background: url('/media/images/dots.png') left bottom repeat-x;
}

.desc {
    line-height: 19px;
}

.nodots {
    background-image: none !important;
}

#logo {
    position: absolute;
    top: 9px;
    left: 28px;
    width: 236px;
    height: 60px;
}

#logo span {
    display: none !important;
    font-size: 1%;
}

.category {
    padding: 15px;
}
.category h3 {
    float: left;
    margin: 0 0 10px;
    padding: 0;
    line-height: 18px;
}


.category span {
    padding: 4px 6px;
    display: block;
    float: left;
    color: #666;
    font-size: 80%;
}


#footer ul {
    float: right;
    padding: 18px;
    display: block;
    font-size: 80%;
}

#footer ul li {
    display: inline;
    float: left;
    padding: 0 7px;
    border-right: 1px solid #ccc;
}

.noborder {
    border-width: 0px !important;
}

.strong {
    font-weight: bold !important;
}

.nav-text {
    position: absolute;
    right: 35px;
    bottom: 7px;
    padding: 5px 5px 5px 33px;
}

#twitter {
    background: url('/media/images/icons/twitter.png') top left no-repeat;
}

ul.normal, ul.normal li ul, ol.normal, ol.normal li ol {
    padding: 5px 0 10px 35px;
}

ul.normal li {
    padding: 5px 0;
    list-style: square;
}

ol.normal li {
    padding: 5px 0;
    list-style: decimal;
}


.nomargin {
    margin: 0 !important;
}

.entry {
    background: url('/media/images/dots.png') bottom left repeat-x;
    padding-bottom: 15px;
    margin-bottom: 15px;
}

.entry ul, .entry ol {
    margin-left: 25px;
}

.entry ul li, .entry ol li {
    padding: 6px 0;
}

.entry ul {
    list-style-type: square;
}

.entry ol {
    list-style-type: decimal;
}

.more {
    display: none;
}

.v { display: none; }
.genetify_disabled { display: none !important; } 
.genetify_enabled { display: block !important; } 

#plug {
    line-height: 19px;
}

#django {
    display: block;
    padding: 15px;
    float: right;
}

hr {
    background: url('/media/images/dots.png') top left repeat-x;
    padding: 1px;
    margin: 20px 0;
    border: 0px;
}

.see_more {
    font-size: 170%;
    text-align: left !important;
}

.footnote {
    font-size: 90%;
    color: #666 !important;
    text-align: left !important;
}

.matrix {
    width: 100%;
}

.matrix th {
    font-weight: bold;
    background-color: #bbb;
}

.matrix th, .matrix td {
    padding: 15px 5px;
    text-align: center;
    vertical-align: middle;
}

.matrix td, .matrix th {
    border: 1px solid white;
}
.matrix td span {
    font-size: 85%;
    color: #222;
}

.matrix td.name {
    background-color: #ccc;
    font-weight: bold;
}

.matrix td.name a img {
    border: 0;
    width: 100px;
}

.matrix .rank {
    font-size: 90%;
    color: #999;
    font-weight: normal;
    background-color: #eee;
}

/* Matrix Stuff */
.rank99 { background-color: #006600; }
.rank96 { background-color: #097400; }
.rank93 { background-color: #138200; }
.rank90 { background-color: #1C9000; }
.rank87 { background-color: #259E00; }
.rank84 { background-color: #38B900; }
.rank81 { background-color: #41C700; }
.rank78 { background-color: #4AD500; }
.rank75 { background-color: #53E300; }
.rank72 { background-color: #5DF100; }
.rank69 { background-color: #66FF00; }
.rank66 { background-color: #74F100; }
.rank63 { background-color: #82E300; }
.rank60 { background-color: #90D500; }
.rank57 { background-color: #9EC700; }
.rank54 { background-color: #ACB900; }
.rank51 { background-color: #B9AC00; }
.rank48 { background-color: #C79E00; }
.rank45 { background-color: #D59000; }
.rank42 { background-color: #E38200; }
.rank39 { background-color: #F17400; }
.rank36 { background-color: #FF6600; }
.rank33 { background-color: #FF5D00; }
.rank30 { background-color: #FF5300; }
.rank27 { background-color: #FF4A00; }
.rank24 { background-color: #FF4100; }
.rank21 { background-color: #FF3800; }
.rank18 { background-color: #FF2E00; }
.rank15 { background-color: #FF2500; }
.rank12 { background-color: #FF1C00; }
.rank9 { background-color: #FF1300; }
.rank6 { background-color: #FF0900; }
.rank3 { background-color: #FF0000; }
.rank0 { background-color: #ddd; }

.other {
    text-align: center;
}

.other a {
    white-space: nowrap;
    color: #333;
}

.other a.visit {
    white-space: normal;
    font-weight: bold;
}

.other span {
    color: grey;
    display: block;
    padding: 7px 0;
}

.price {
    font-weight: bold;
    font-size: 110%;
}

#host_image {
    float: right;
}


.hide {
    display: none;
}

#info {
    float: left;
    width: 225px;
}

#info .featured {
    font-weight: bold;
}

#info th {
    font-weight: bold;
    background-color: #e3e3e3;
    font-size: 110%;
    -moz-border-radius: 3px 3px 0 0;
    -webkit-border-radius: 3px 3px 0 0;
}

#info th, #info td {
    padding: 8px;
}

#info tr {
    background-color: #f9f9f9;
}

#info td {
    font-size: 95%;
    padding-left: 15px;
    padding-right: 15px;
}

#info .footnote {
    background-color: #ddd !important;
    -moz-border-radius: 0 0 3px 3px;
    -webkit-border-radius: 0 0 3px 3px;
}

#info .footnote a {
    font-size: 80%;
    color: #333;
}

#main {
    float: left;
    margin-left: 20px;
    font-size: 120%;
    width: 490px;
}

#summaries li {
    font-weight: bold;
    padding: 7px;
    background-color: #e3e3e3;
    -moz-border-radius: 3px;
}

#summaries ul {
    padding: 4px 0;
}

#summaries ul li {
    font-weight: normal;
    list-style-type: square;
    margin-left: 5px;
    list-style-position: inside;
    background-color: #fff !important;
}

#quotes {
    margin-top: 15px;
    padding-top: 15px;
    border-top: 1px solid #dedede;
    width: 100%;
}

#quotes li {
    display: block;
    width: 43%;
    float: left;
    text-align: center;
}

#quotes li:first-child {
    padding-right: 60px;
}

#quotes li span {
    display: inline;
    font-size: 110%;
    line-height: 29px;
    margin: 5px 0;
}

#quotes li span.quote_author {
    font-size: 90%;
    white-space: nowrap;
    float: right;
}

#header_visit {
    display: block;
    float: left;
    clear: left;
    color: #333;
}

#under_main {
    border: 1px solid #777;
    width: 100%;
    display: block;
    padding: 30px 0;
    text-align: center;
    font-size: 250%;
    margin: 40px 0 0 0;
    color: #212121;
    background: url('/media/images/visit_bg.png') 0 0 repeat-x;
}

#under_main:hover {
    border-color: #333;
    color: black;
}

#see_more_blog {
    text-align: right;
    font-weight: bold;
}

#commitment {
    width: 90% !important;
}

#features, #recent_reviews, #tags, #leads {
    width: 100% !important;
}

#features div, #recent_reviews, #tags div, #leads div {
    width: 100% !important;
}

#features div ul li, #recent_reviews ul li, #tags div ul li {
    float: left;
    display: block;
    width: 25% !important;
}

#tags div {
    width: 95% !important;
}
#tags div ul li {
    padding: 0 !important;
    margin: 0 !important;
}

#tags {
    font-size: 85% !important;
}

#recent_reviews ul li {
    height: 175px;
    width: 28% !important;
    font-size: 100%;
    color: black;
    font-weight: bold;
}

#recent_reviews ul li p {
    font-weight: normal !important;
    color: #333 !important;
}


#leads table {
    width: 100%;
}

#leads td, #leads th {
    padding: 5px;
}

#leads table th {
    width: 75px;
}

#leads .errorlist {
    color: red !important;
    list-style-type: none !important;
}
