aowow/static/css/global.css

.nowrap {
    white-space: nowrap;
    overflow: visible;
}

.wsa-tbl {
    border-spacing:0
}

.wsa-tbl th {
    border-bottom:2px solid #333;
    color:#fff;
    font-size:15px;
    padding:0 0 3px 0;
    text-align:left
}

.wsa-tbl td {
    padding:0 5px 0 0
}

.wsa-tbl td:last-child {
    padding:0
}

.wsa-list {
    color:#ccc
}

.wsa-list td {
    vertical-align:text-top
}

.wsa-list td {
    padding-right:25px
}

.wsa-list td.nopad {
    padding-right:0
}

.wsa-list tr {
    line-height:20px
}

.wsa-list .checkmark {
    padding:0;
    width:18px
}

.wsa-check {
    background:url(../images/ui/check2.png) no-repeat 0 -11px;
    height:20px;
    width:15px
}

.wsa-earned {
    color:#777
}

.wsa-earned .wsa-check {
    background-position:-15px -11px
}

.wsa-earned .wsa-count {
    background-color:#aaa;
    color:#242424
}

/* Generic - Sprites */
.vote-column .upvote, .vote-column .downvote, .reply-upvote, .reply-downvote, .reply-detach, .reply-delete, .reply-report, .reply-edit {
    background: url(../images/ui/sprite3.png);
    text-indent: -10000px;
    cursor: pointer;
}

.vote-column {
    width: 60px;
    vertical-align: top;
}

.main-body {
    vertical-align: top;
}

.vote-column .upvote, .vote-column .downvote {
    margin: 5px auto;
    width: 30px;
    height: 16px;
}

.vote-column .upvote {
    margin-top: 10px !important;
    opacity:.6;
}

.vote-column .upvote:hover {
    opacity:1;
}

.vote-column .upvote[data-hasvoted=true] {
    background-position: 0 -16px;
    opacity:1;
}

.vote-column .downvote {
    background-position: 0 -48px;
    opacity:.6;
}

.vote-column .downvote:hover {
    opacity:1;
}

.vote-column .downvote[data-hasvoted=true] {
    background-position: 0 -32px;
    opacity:1;
}

.vote-column .rating, .vote-column .rating-up, .vote-column .rating-down {
    color: #A8A8A8;
    font-size: 18px;
    margin: 3px 0;
    text-align: center;
    font-weight: bold;
}

.vote-column .rating-up {
    color: Green;
}

.vote-column .rating-down {
    color: #bb5b26;
}

.vote-column .rating-separator {
    border-top: 1px solid silver;
    width: 20px;
    margin: 0 auto;
}

.vote-column .rating {
    cursor: pointer;
}

.comment-controls {
    text-align: right;
    color: #DDDDDD;
    font-size: 11px;
}

.comment-controls span, .comment-controls span a {
    padding-left: 3px;
}

.comment-header .comment-author {
    font-style: normal;
}

.comment-header .comment-author a {
    font-weight: bold;
}

.comment-header .comment-author a.q0 {
    color: #bbbbbb !important;
    font-weight: normal;
    text-decoration: none;
}

.comment-header .comment-author a.q0:hover {
    text-decoration: underline;
}

.comment-replies-control {
    margin-top: 10px;
    font-size: 12px;
    color: white;
    cursor: pointer;
    float: left;
    background: #444;
    border: 1px solid #555;
    padding: 4px 8px;
    border-radius: 5px;
    text-transform: capitalize;
}

.comment-replies-control:hover {
    background-color: #555;
}

.comment-sticky {
    display: block;
    background-color: green;
    border-radius: 5px;
    cursor: help;
    font-family: Verdana;
    font-size: 10px;
    font-weight: bold;
    margin-left: 5px;
    margin-right: 5px;
    margin-top: 10px;
    text-align: center;
}

.comment-replies {
    margin-top: 10px;
    border-top: 1px dotted #646464;
}

.comment-replies form .ajax-loader {
    display: block;
    margin-left: 13px;
    margin-top: 10px;
    display: none;
}

.comment-replies textarea {
    width: 100%;
}

.comment-replies form input {
    display: block;
    margin-left: 10px;
    margin-top: 5px;
}

.comment-replies td {
    vertical-align: top;
}

.comment-replies .q11 {
    color: #AA8968 !important;
}

.comment-reply-row {
    border-bottom: 1px dotted #454545;
}

.reply-controls {
    width: 12px;
    padding-top: 10px;
    white-space: nowrap;
}

.reply-text {
    padding: 6px;
    overflow:auto;
    word-wrap:break-word;
}

.reply-rating {
    font-size: 10px;
    width: 100%;
    text-align: center;
}

.q12 {
    color: #BD5F00 !important;
}

.reply-rating-fair {
    color: #008200;
}

.reply-rating-good {
    color: #1EC000;
}

.reply-rating-great {
    color: #1EFF00;
}

.comment-reply-author {
    color: #888888;
    white-space: nowrap;
    font-size: 11px;
}

.comment-reply-author a.when, .comment-reply-author a.when:hover {
    color: #888888;
    white-space: nowrap;
    text-decoration: none;
}

.comment-reply-author a.when:hover {
    text-decoration: underline;
}

.comment-reply-author-label {
    color: #fff;
    font-weight: bold;
}

.comment-blue b {
    color: White !important;
}

.reply-detach, .reply-delete, .reply-report, .reply-edit {
    display: inline-block;
    height: 13px;
    width: 13px;
    line-height: 12px;
    opacity: 0.35;
    visibility: hidden;
}

.reply-upvote {
    background-position:-43px 0;
}

.reply-downvote {
    background-position:-43px -18px;
}

.reply-upvote, .reply-downvote {
    width: 13px;
    height: 6px;
    cursor: default;
    margin: 0 auto;
    opacity: 0.7;
}

.reply-detach {
    background-position: -30px -13px;
}

.reply-delete {
    background-position: -30px 0;
}

.reply-report {
    background-position: -30px -39px;
    height: 10px;
    width: 11px;
}

.reply-edit {
    height: 14px;
    width: 13px;
    background-position: -30px -25px;
    position: relative;
    top: -1px;
}

.reply-upvote[data-hasvoted=true] {
    background-position:-43px -6px;
}

.reply-downvote[data-hasvoted=true] {
    background-position:-43px -12px;
}

.reply-detach[data-hover=true], .reply-delete[data-hover=true], .reply-report[data-hover=true], .reply-edit[data-hover=true] {
    visibility: visible;
}

.reply-upvote[data-canvote=true]:hover, .reply-upvote[data-hasvoted=true], .reply-downvote[data-canvote=true]:hover, .reply-downvote[data-hasvoted=true], .reply-detach:hover, .reply-delete:hover, .reply-report:hover, .reply-edit:hover {
    opacity: 1;
}

.reply-upvote[data-canvote=true], .reply-downvote[data-canvote=true] {
    cursor: pointer;
}

.dragged {
    z-index: 1000 !important;
    opacity: 0.35;
    filter: alpha(opacity=35);
}

.dragged .iconsmall, .dragged .iconmedium {
    float: left;
}

.stars {display:block;font-size:13px;margin:0 auto;white-space:normal;overflow:hidden;position:relative}
.infobox .stars {margin:0}
.stars.rated {padding-right:14px}
.stars.max-5 {width:66px}
.stars.max-10 {width:131px}
.stars b {background:url(../images/ui/stars-ondark.png) 0 -96px no-repeat;float:right;height:16px;line-height:16px}
.stars.ratable span {cursor:pointer}
.stars.ratable span:hover b, .stars.rated b {background-position:0 -32px} /* maybe remove 3rd? */
.stars i {padding:0 0 0 18px}
.stars i i {margin-left:-5px;padding:0;visibility:hidden}
.stars.ratable span:hover b, .stars.ratable span:hover b.half {background-position:0 -96px !important}
.stars.ratable span b:hover, .stars.ratable span b.half:hover {background-position:0 -32px !important}
.stars .clear {background:url(../images/ui/gray-x.png);display:block;height:10px;;position:absolute;right:0;top:4px;width:9px}
.stars .clear:hover {background-position:bottom}
.stars .info {clear:both;font-size:11px}
.stars.rated .info {margin-right:-14px}

.stars-1 b {background-position:0 0}
.stars-1 b b {background-position:0 -96px !important}
.stars-2 b {background-position:0 0}
.stars-2 b b b {background-position:0 -96px !important}
.stars-3 b {background-position:0 0}
.stars-3 b b b b {background-position:0 -96px !important}
.stars-4 b {background-position:0 0}
.stars-4 b b b b b {background-position:0 -96px !important}
.stars-5 b {background-position:0 0}
.stars-5 b b b b b b {background-position:0 -96px !important}
.stars-6 b {background-position:0 0}
.stars-6 b b b b b b b {background-position:0 -96px !important}
.stars-7 b {background-position:0 0}
.stars-7 b b b b b b b b {background-position:0 -96px !important}
.stars-8 b {background-position:0 0}
.stars-8 b b b b b b b b b {background-position:0 -96px !important}
.stars-9 b {background-position:0 0}
.stars-9 b b b b b b b b b b {background-position:0 -96px !important}
.stars-10 b {background-position:0 0}
.stars-10 b b b b b b b b b b b {background-position:0 -96px !important}
.stars b.half {background-position:0 -16px !important}
.stars.rated b.half {background-position:0 -48px !important}

.guide-sticky {
    background: url(../images/icons/sticky.gif) left center no-repeat;
    padding-left: 21px;
}

.guide-new {
    background: url(../images/icons/new.png) left center no-repeat;
    padding-left: 21px;
}

/* aowow - clips in the list marker
.infobox .guide-sticky {
    position: relative;
    left: -6px;
}
*/

#guiderating {
    display: block;
    margin: 0 auto;
    width: 80px;
}

.iconlist-col {
    float: left;
    width: 31%;
    margin-right: 2%;
}

.iconlist {
    border-collapse: collapse;
    margin-top: 4px;
}

.iconlist ul {
    list-style-type: none;
    margin: 0 !important;
    padding: 0 !important;
}

.iconlist th {
    padding: 0 !important;
}

.iconlist ul li {
    list-style-position: inside;
    list-style-type: square;
    padding-left: 13px !important;
}

.iconlist td {
    padding: 4px 0 6px 0;
}

.iconlist var {
    font-size: 1px !important;
}

.iconlist .iconsmall {
    margin-right: 4px !important;
}

.iconlist a.disclosure-on, .iconlist a.disclosure-off {
    font-weight: normal;
    text-decoration: underline;
}

.iconlist .iconlist ul li {
    padding-left: 10px !important;
}

.iconlist .iconlist th, .iconlist .iconlist td {
    font-size: 11px !important;
}

.iconlist-col table th li {
    list-style-position: outside;
    padding: 0 !important;
    margin-left: 20px !important;
}

.line {
    position: absolute;
    display: block;
    cursor: default;
}

.line var {
    width: 100%;
    height: 2px;
    margin: -2px 0 0 2px;
    display: block;
    background: #FFFFFF;
    border: 1px solid #181818;
    border-left: none;
    border-right: none;
    transform-origin: 0 0;
    box-shadow: 0px 0px 3px black;
}

.line.flipped {
    transform: scaleY(-1);
}

.mapper .line   var { background: #C8B94C; }
.mapper .line-1 var { background: #73B85B; }
.mapper .line-2 var { background: #D7563C; }
.mapper .line-3 var { background: #47ACCD; }
.mapper .line-4 var { background: #C844D0; }

.message-box {
    position: absolute;
    z-index: 1000;
    cursor: pointer;
    border:2px solid #666;
    border-radius:5px;
    padding:15px 15px 10px 15px;
    background:url(../images/ui/blk.png) repeat;
}

.message-box .message {
    margin-bottom: 5px;
}

#noscript-bg {
    position: fixed;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    background-color: black;
    opacity: 0.8;
    filter: alpha(opacity=80);
    z-index: 9999;
}

#noscript-text {
    position: absolute;
    text-align: center;
    left: 0;
    width: 100%;
    top: 30%;
    font-size: 18px;
    line-height: 1.5em;
    z-index: 10000;
    padding-top: 70px;
    background: url(../images/logos/header.png) center top no-repeat;
}

#noscript-text b {
    font-size: 22px;
}

/*
CSS tweaks for Premium users
*/

/*
body.premium ...
*/

body.premium-logo .home-logo, body.premium-logo .home-logo a {
    background-image: url(../images/logos/special/premium/home.jpg) !important;
    width: 261px !important;
    height: 139px !important;
    margin: 0 auto 20px auto !important;
}

body.premium-logo .header-logo {
    background-image: url(../images/logos/special/premium/header.gif) !important;
    width: 179px !important;
    height: 96px !important;
    top: 5px !important;
}

.linklist .repcount {
    color: #666666;
    display: inline;
    font-size: 11px;
    margin: 0 0.8em 0 0;
}

.linklist .repcount a, .linklist .repcount a:hover {
    color: #0C9722;
    font-size: 11px;
    margin: 0;
}

.linklist a.votecount, .linklist a.votecount:hover {
    background: url(../images/ui/check3.png) no-repeat scroll left center transparent;
    color: #FFFFFF;
    font-size: 11px;
    margin: 0;
    padding-left: 15px;
}

.vote-comment .comment-body {
    border-left: 14px solid #111111;
    padding: 10px;
    color: #999999;
    margin-bottom: 5px;
}

.vote-comment {
    margin-bottom: 1em;
}

.vote-comment .votes-left {
    color: #AAAAAA;
    margin-bottom: 5px;
    font-size: 90%;
}

.vote-comment .vote-reason {
    margin-bottom: 5px;
}

div.screenshotviewer {
    padding: 10px 10px 0 10px;
    background-color: #303030;
}

div.screenshotviewer-screen {
    background-color: black;
    position: relative;
    text-align: center;
}

div.screenshotviewer-screen a {
    display: block;
    position: absolute;
    z-index: 100;
    top: 0;
    height: 100%;
}

a.screenshotviewer-prev {
    left: 0;
    width: 50%;
}

a.screenshotviewer-next {
    left: 50.5%;
    width: 50%;
}

a.screenshotviewer-cover {
    left: 0;
    width: 100%;
}

div.screenshotviewer-screen a span {
    display: none;
    position: absolute;
    top: 10%;
    padding: 10px;
    background-color: #303030;
}

div.screenshotviewer-screen a:hover span {
    display: inline-block;
}

a.screenshotviewer-prev span {
    left: 0;
}

a.screenshotviewer-next span {
    right: 0;
}

a.screenshotviewer-cover span {
    position: static !important;
    margin: 0 auto;
}

a.screenshotviewer-original {
    float: right;
    display: block;
    padding: 10px 0 10px 10px;
    margin-right: 10px;
}

a.screenshotviewer-close {
    float: right;
    display: block;
    padding: 10px 0 10px 10px;
}

div.screenshotviewer-from {
    padding-top: 10px;
    font-size: 11px;
    color: #cccccc;
}

div.screenshotviewer-from a {
    font-weight: bold;
}

div.screenshotviewer-caption {
    font-size: 11px;
    font-weight: bold;
    padding: 5px 0 10px 0;
}

.enhanced-textarea-expander {
    display:none;
}

.enhanced-textarea-wrapper {
    position:relative;
}

.enhanced-textarea-wrapper textarea,
.enhanced-textarea-wrapper .enhanced-textarea-expander {
    border:1px transparent solid;
    box-sizing:border-box;
    font:13px/1.4 "Open Sans",Arial,"Helvetica Neue",Helvetica,sans-serif;
    overflow-wrap:break-word;
    padding:5px 7px;
    white-space:pre-wrap;
    width:100% !important;
}

.enhanced-textarea-wrapper textarea,
.enhanced-textarea-wrapper textarea:hover {
    transition:150ms;
}

.enhanced-textarea-wrapper.enhanced-textarea-dynamic-sizing textarea {
    resize:none;
}

.enhanced-textarea-wrapper .enhanced-textarea-markup {
    overflow:hidden;
}

.enhanced-textarea-wrapper .enhanced-textarea-markup-segment {
    float:left;
}

.enhanced-textarea-wrapper .enhanced-textarea-markup-segment.menu-buttons {
    padding:0;
}

.enhanced-textarea-text-input[type="text"] {
    padding:5px 7px;
}

.enhanced-textarea-wrapper.enhanced-textarea-dark textarea,
.enhanced-textarea-text-input[type="text"],
.enhanced-textarea-text-input-dark[type="text"] {
    min-height:calc(1.4em + 12px);
}

.enhanced-textarea-wrapper.enhanced-textarea-dark textarea,
.enhanced-textarea-wrapper.enhanced-textarea-dark textarea:hover,
.enhanced-textarea-text-input[type="text"],
.enhanced-textarea-text-input[type="text"]:hover,
.enhanced-textarea-text-input-dark[type="text"],
.enhanced-textarea-text-input-dark[type="text"]:hover {
    background:#1c1c1c;
    border-color:#3b3b3b;
    color:#ddd;
    outline:0;
}

.enhanced-textarea-wrapper.enhanced-textarea-focus-changes textarea,
.enhanced-textarea-text-input[type="text"] {
    background:#1c1c1c;
    border-color:#3b3b3b;
    cursor:pointer;
    min-height:calc(1.4em + 12px);
}

.enhanced-textarea-wrapper.enhanced-textarea-focus-changes textarea.focus-visible,
.enhanced-textarea-text-input[type="text"].focus-visible {
    background:#181818;
    border-color:#444;
    box-shadow:0 0 0 1px #444;
    cursor:auto;
}

.options-menu-widget {
    cursor:default;
    padding-right: 13px;
    background: url(../images/Menu/arrow-down.gif) right center no-repeat;

}
.options-menu-widget.open {
    color:#fff;
}

.click-to-copy {
    cursor: pointer;
}

.fade-out {
    opacity: 0;
    pointer-events: none;
    transition: opacity 1s;
    transition-timing-function: ease-in;
}

.hidden-element {
    height: 0;
    left: 0;
    opacity: 0;
    padding: 0;
    pointer-events: none;
    position: fixed;
    top: 1px;
}