@charset "utf-8";

/* CMS component styles used across support site project */
#left { width: 670px; }
#right { width: 235px; }
.breaking-news h3.blog-title { font-size: 28px; font-weight: bold; margin-bottom: 5px; color: #393939; }
.community-share-breaking-news { padding: 20px 0; border-top: 1px solid #AAAAAA; padding-bottom: 10px; margin-bottom: 12px; margin-top: 50px; }
.header-image img { border-radius: 6px; margin: 25px 0 10px; }
.sidebar-content .articles-list { font-size: 14px; }
.breaking-news #article-content { padding-bottom: 0; }
.breaking-news #article-comments #page-comments { border: 0; padding-top: 0; }
.breaking-news #article-related-content { width: 170px; }
.breaking-news .article-column { width: 840px; }
.breaking-news .article-column-in-game { width: 726px; }
#news-updates { padding: 0 0 20px; word-wrap: break-word; }
#news-updates a:hover,
#news-updates a:focus { color: #014663; }
#news-updates .article-wrapper .article-thumb .thumb-frame { display: block; height: 132px; width: 152px; }
#news-updates .article-wrapper .article-thumb a { height: 132px; width: 152px; }
#news-updates .article-wrapper .article-content .header-2 { font-size: 24px; letter-spacing: -0.08em; }
#news-updates .article-wrapper .article-content .header-2 .article-title .article-status { font-size: 20px; color: #4a4a4a; }
#news-updates .article-wrapper .article-content .header-2 .article-title .article-headline { font-weight: bold; }
#news-updates .article-wrapper .article-content .edit-article { font-size: 13px; font-weight: bold; margin-left: 10px; padding-top: 1px; }
#news-updates .article-summary { width: auto; float: left; padding: 10px 0 0 14px; position: relative; }
#news-updates .article-description { width: 486px; font-size: 13px; }
.article-content { padding: 30px; background-color: #E8E7E6; width: 655px; }
#news-updates .article-wrapper { background: url("../images/layout/category-shadow.png") no-repeat scroll 0 0 transparent; margin-top: -20px; padding: 25px 0 30px; }
#news-updates .header .headline { font-size: 30px; font-weight: bold; position: relative; top: -5px; }
#news-updates #category-banner { margin-bottom: 35px; }
#news-updates .article-meta { font-size: 13px; margin: 5px 0 0; color: #8D8D8D; }
#news-updates .article-wrapper .comments-link { background: url("../images/icons/comment-icon.png") no-repeat scroll 0 3px transparent; padding-left: 17px; margin-left: 8px; }
#news-updates .article-wrapper .comments-link:hover,
#news-updates .article-wrapper .comments-link:active { background-position: 0 -57px; }
#news-updates .article-thumb {  display: block; border-radius: 6px 6px 6px 6px; height: 130px; margin: 24px 20px 0 0; width: 135px; float: left; background-position: center center; background-repeat: no-repeat; background-size: auto; }
#news-updates .article-content .more { background: url("../images/icons/more-arrow.png") no-repeat scroll 100% 2px transparent; padding-right: 10px; display: inline-block; line-height: 15px; }
#news-updates .article-content .more:hover,
#news-updates .article-content .more:active { background-position: 100% -37px; }
#news-updates .article-meta a:hover,
#news-updates .article-meta a:focus { color: #014663; }
#article-content .table-center { background-color: #D2D1CF; border-radius: 4px 4px 4px 4px; margin-top: 30px; }
#article-content .poll-wrapper { background-color: #d2d1cf; border-radius: 4px 4px 4px 4px; margin-top: 30px; overflow: auto; }
#article-content #poll-container { border: none; background-color: #E8E7E6; margin: 20px 20px 70px; border-radius: 4px 4px 4px 4px; }
#article-content #poll-container .poll-interior { border-radius: 0; padding: 12px 20px 15px; }
#article-content #poll-container header-2 { color: #000000; font-size: 15px; }
#article-content #poll-container.results-only .results { font-weight: bold; color: #000000; }
#article-content #poll-container .results .result-container { background-color: #c0c0c0; padding: 0; border-radius: 3px 3px 3px 3px; }
#article-content #poll-container .results .result span { font-weight: normal; color: #FFFFFF; margin: 0; line-height: 18px; }
#article-content #poll-container .results .result { background-color: #0078A7; border-radius: 3px 3px 3px 3px; height: 18px; }
#article-content #poll-container .results .max .result { background-color: #459900; border-radius: 3px 3px 3px 3px; line-height: 18px; }
#article-content #poll-container .poll-actions a span { cursor: pointer; display: block; font-size: 13px; line-height: 34px; padding-left: 20px; padding-right: 20px; }
#article-content #poll-container .poll-actions a { width: auto; }
#article-content #poll-container .poll-actions { bottom: -46px; position: absolute; right: -5px; z-index: 2; }
#article-content #poll-container .poll-stats { font-weight: bold; color: #000000; bottom: -40px; display: block; left: 0; padding-right: 200px; position: relative; z-index: 1; }
#article-content .v-btn, #article-content .r-btn { padding: 2px 4px; }
#article-content .v-btn span,
#article-content .r-btn span { color: #fff; height: 32px; line-height: 32px; background: url("../images/buttons/default.gif") 50% 0 repeat-x; }
#article-content .v-btn.button-em span,
#article-content .r-btn.button-em span { background: url("../images/buttons/emphasis.gif") 50% 0 repeat-x; }
#article-content .v-btn > span,
#article-content .r-btn > span { -moz-box-shadow: #444 0 0 5px; -webkit-box-shadow: #444 0 0 5px; box-shadow: #444 0 0 5px; }
#article-content .v-btn span,
#article-content .r-btn span { -moz-border-radius: 4px; -webkit-border-radius: 4px; border-radius: 4px; }
#article-content .v-btn.disabled,
#article-content .r-btn.disabled,
#article-content .v-btn[disabled],
#article-content .r-btn[disabled] { cursor: not-allowed; }
#article-content .v-btn.processing,
#article-content .r-btn.processing { cursor: progress; }
#article-content .v-btn.disabled span,
#article-content .r-btn.disabled span,
#article-content .v-btn.processing span,
#article-content .r-btn.processing span,
#article-content .v-btn[disabled] span,
#article-content .r-btn[disabled] span { -moz-box-shadow: none; -webkit-box-shadow: none; box-shadow: none; }
#article-content .v-btn.hover span,
#article-content .r-btn.hover span,
#article-content .v-btn:hover span,
#article-content .r-btn:hover span,
#article-content .v-btn:focus span,
#article-content .r-btn:focus span { background-position: 50% -32px; }
#article-content .v-btn.disabled span,
#article-content .r-btn.disabled span { cursor: default; background: #bdbcb9; }
#article-content .v-btn.processing span,
#article-content .r-btn.processing span { cursor: default; background-position: 50% -64px; color: transparent; }
#article-content .detail { padding-bottom: 30px; }
.breaking-news #article-content ul,
.breaking-news #article-content ol,
.breaking-news #article-content dl { padding-left: 2em; }
.breaking-news #article-content ol { list-style: decimal; }
.breaking-news #article-content ul { list-style: disc; padding-left: 2em; }
#sidebar-related-articles { margin-bottom: 50px; }
.blog-inner { margin-top: 40px; }
.sidebar-bot { min-height: 200px; position: relative; }
.sidebar-loading { padding: 75px 25px; width: 150px; color: #4A4A4A; text-align: center; position: absolute; top: 0; left: 0; background: url("../images/loaders/loader-dark.gif") 50% 75% no-repeat; }
.breaking-news #article-feedback { height: 20px; margin-bottom: 50px; }
.blog-inner #article-content img { border: none; box-shadow: none; }
.ui-context .context .context-links a { background-image: url("../images/icons/context.gif"); background-repeat: no-repeat; }
.ui-context .context .context-links .icon-posts { background-position: 0 -30px; }

.rate-post-wrapper { position: absolute; right: 5px; top: 1px; white-space:nowrap; padding: 8px 8px 8px 0; }
.rate-post-wrapper .rate-option { width: 30px; height: 36px; display: block; float: right; visibility: hidden; }
.rate-post-wrapper a.rate-up,
.rate-post-wrapper a.rate-down { background-image: url("../images/layout/cms/icon_rating.png"); display: block; width: 36px; height: 36px;
}
.rate-post-wrapper .rate-option.rate-up { background-position: -41px 0; }
.rate-post-wrapper .rate-option .rate-down { background-position: 0 0; }
.rate-post-wrapper .rate-option.rate-up:hover { background-position: -41px -36px; }
.rate-post-wrapper .rate-option .rate-down:hover { background-position: 0 -36px; }
.rate-post-wrapper.upvoted .rate-option.rate-up { background-position: -41px -72px; }
.rate-post-wrapper.downvoted .rate-option .rate-down { background-position: 0 -72px; }
.rate-post-wrapper .keep-shown { visibility: visible; }
.rate-post-wrapper .rate-option span { display: none; }

#comments .rate-post-wrapper .downvote-menu { position: absolute; top: 10px; right: -20px; }
#comments .rate-post-wrapper .downvote-menu .report-comment a { background: url("../images/layout/cms/alert_icon.png") no-repeat scroll 6px 0 transparent; line-height: 20px; }
#comments .rate-post-wrapper .downvote-menu a { padding: 1px 10px 2px 36px; display:block; font-size: 12px; line-height: 12px; }

.rate-post-wrapper .dropdown-wrapper,
.rate-post-wrapper .ui-dropdown { min-width: 100px; white-space: nowrap; }
.rate-post-wrapper .ratedown { width: 35px; }

.comment-actions .reply-link { text-transform: none; }
.ui-context .context .context-links .icon-ignore { background-position: 0 -60px; }
.no-results { background-color: #E5E4E3; font-size: 14px; padding: 30px; text-align: center; font-style: italic;  }
#poll-container .vote input { position: relative; top: -2px; vertical-align: middle; }
#report-post table { background-color: #E8E7E6; }

/* comment styles */
#comments { background-position: 50% 0; background-repeat: no-repeat; clear: both; font-family: Verdana,Geneva,sans-serif; margin-top: 20px; padding: 20px 0 65px;
}
#comments { border-radius: 5px 5px 5px 5px; font-size: 11px; line-height: 24px; margin-bottom: 12px; position: relative;
}
#comments .comment-tile { padding-bottom: 5px; }
#comments .user,
#comments .comment-head { font: bold 12px/15px Arial,Helvetica; }
#comments .context-link { background: url("../images/icons/flyout-arrows.png") no-repeat scroll 100% 4px transparent; padding-right: 14px; font-size: 13px; }
#comments .employee-icon { margin-top: 0; }
#comments .user .bnet-username .context-link { color: #010200 !important; }
#comments .user .time a { color: #545454; font-weight: normal; }
#comments .comment-blizzard .comment-body { color: #00658F; }
#comments .comment-blizzard .user img { position: relative; top: -2px; }
#comments .comment-blizzard .avatar-outer { border: 1px solid #00658F;}
#comments .comment-blizzard .character-info .bnet-username .context-link { background-position: 100% -33px; color: #00658F !important; }
#comments .mvp .content { color: #6D994A; }
.noCharacter { text-align: center; }
#news-updates .blog-paging { width: 685px; padding: 0 15px 15px; }
#forum-content .section-header { color: #000000; text-align: center; }
#cms-account-status .ui-button { margin-top: 30px; }
.karma-feedback { border: 0 none; margin: 0; padding: 0; text-align: right; margin-right: 11px; }
#comments .avatar-outer { border-radius: 3px 3px 3px 3px; box-shadow: 0 1px 3px #777777; display: block; }
#comments .avatar-outer a { display: block; }
#comments .comments-form .avatar-outer { background-color: black; border-color: #574320 #59411C #463419 #3A2912; border-left: 1px solid #3A2912; border-radius: 2px 2px 2px 2px; border-right: 1px solid #59411C; border-style: solid; border-width: 1px; padding: 1px; width: 55px; height: 55px; }
#comments .comments-form .avatar-outer, .icon-portrait { background: none no-repeat scroll 50% 50% transparent; display: inline-block; font-size: 1px; overflow: hidden; }
#comments .comments-form .avatar-outer, .icon-portrait { box-shadow: 0 0 5px #000000; }
#comments .comments-form .avatar-outer img { width: 55px; height: 55px; }
#comments .comment-tile .comment-foot { margin-top: 5px; }
#comments .button-mod span { display: block; height: 25px; }
#comments .comment-foot .ui-button span { font-size: 11px; color: #0072A3; text-transform: none; }
#comments .comments-throttler { font-size: 14px; }
#comments .throttle-time { font-size: 14px; color: #4A4A4A; }

.edit-icon { background: url("../../static/local-common/images/cms/edit-icon.gif") 5px -1px no-repeat; padding-left: 23px; font-size: 13px !important; }

/* social networking buttons */
.like-wrapper { max-width: 530px; }

/* Social media buttons ( currently only RSS ) */
#sidebar-social-media .sidebar-content .social-media li { width:31px; height:31px; float:left; margin-right:10px}
#sidebar-social-media .sidebar-content .social-media a { width: 31px; height: 31px; display: block; background: url(../images/icons/social.png) no-repeat 0 0; margin-bottom: 16px; border-radius: 4px; }
.sidebar-module .sidebar-title .header-3 { margin-top: 16px; margin-bottom: 10px;}
#sidebar-social-media .sidebar-content .social-media .facebook a { background-position:-31px 0 }
#sidebar-social-media .sidebar-content .social-media .facebook a:hover { background-position:-31px -31px }
#sidebar-social-media .sidebar-content .social-media .youtube a { background-position:-93px 0 }
#sidebar-social-media .sidebar-content .social-media .youtube a:hover { background-position:-93px -31px }
#sidebar-social-media .sidebar-content .social-media .twitter a { background-position:-62px 0; width:31px }
#sidebar-social-media .sidebar-content .social-media .twitter a:hover { background-position:-62px -31px; width:31px }
#sidebar-social-media .sidebar-content .social-media .reddit a { background-position:-372px 0 }
#sidebar-social-media .sidebar-content .social-media .reddit a:hover { background-position:-372px -31px }
#sidebar-social-media .sidebar-content .social-media .atom-feed a { background-position:0 0 }
#sidebar-social-media .sidebar-content .social-media .atom-feed a:hover { background-position:0 -31px }
#sidebar-social-media .sidebar-content .social-media .plurk a { background-position:-155px 0 }
#sidebar-social-media .sidebar-content .social-media .plurk a:hover { background-position:-155px -31px }
#sidebar-social-media .sidebar-content .social-media .sina a { background-position:-186px 0 }
#sidebar-social-media .sidebar-content .social-media .sina a:hover { background-position:-186px -31px }
#sidebar-social-media .sidebar-content .social-media .me2day a { background-position:-124px 0 }
#sidebar-social-media .sidebar-content .social-media .me2day a:hover { background-position:-124px -31px }
#sidebar-social-media .sidebar-content .social-media .kaixin a { background-position:-217px 0 }
#sidebar-social-media .sidebar-content .social-media .kaixin a:hover { background-position:-217px -31px }
#sidebar-social-media .sidebar-content .social-media .vk a { background-position:-279px 0 }
#sidebar-social-media .sidebar-content .social-media .vk a:hover { background-position:-279px -31px }
#sidebar-social-media .sidebar-content .social-media .tencent a { background-position:-341px 0 }
#sidebar-social-media .sidebar-content .social-media .tencent a:hover { background-position:-341px -31px }
#sidebar-social-media .sidebar-content .social-media .wechat a { background-position:-310px 0 }
#sidebar-social-media .sidebar-content .social-media .wechat a:hover { background-position:-310px -31px }