﻿/* Career tab background */
.body-top {
	background-image: url(../../images/layout/bgs/profile-hero.jpg);
}

.profile-body {
	background: url(../../images/profile/career-bg.jpg) 0 0 no-repeat;
}

/* Bigger header on career page */
.profile-head .header-2 {
	font-size: 46px;
}

.career-left {
	float: left;
	width: 600px;
}

.career-right {
	float: right;
	width: 300px;
	background: #161412;
}

.career-right-top {
	padding-top: 30px;
	background: url("../../images/profile/career-right.jpg") 0 0 no-repeat;
}

.career-right-bot {
	padding: 0 20px 0 20px;
	background: url("../../images/profile/career-right.jpg") -302px 100% no-repeat;
}

	.career-right-bot .last-updated {
		margin-top: 75px;
		margin-bottom: 0;
		width: 300px;
		white-space: nowrap;
		margin-left: -20px;
	}

.career-full {
	float: left;
	width: 900px;
}

/* Heroes */
.top-heroes .hero-portrait-wrapper {
	margin-bottom: 25px;
	position: relative;
	margin-right: 15px;
	display: block;
	float: left;
	width: 189px;
	height: 205px;
	padding: 10px 11px 0;
	background: url(../../images/profile/career-portraits.jpg) -336px 0 no-repeat;
	box-shadow: 0 0 7px #000;
	text-align: center;
}

	.top-heroes .hero-portrait-wrapper:hover {
		background-position: -526px 0;
	}

	.top-heroes .hero-portrait-wrapper.hardcore {
		background-position: -336px -205px;
	}

		.top-heroes .hero-portrait-wrapper.hardcore:hover {
			background-position: -526px -205px;
		}

	.top-heroes .hero-portrait-wrapper.empty,
	.top-heroes .hero-portrait-wrapper.empty:hover {
		background-position: -336px -410px;
	}

	.top-heroes .hero-portrait-wrapper .hero-portrait {
		display: block;
		width: 168px;
		height: 130px;
		background: url(../../images/profile/career-portraits.jpg) no-repeat;
	}

		.top-heroes .hero-portrait-wrapper .hero-portrait.barbarian-male {
			background-position: 0 0;
		}

		.top-heroes .hero-portrait-wrapper .hero-portrait.barbarian-female {
			background-position: -168px 0;
		}

		.top-heroes .hero-portrait-wrapper .hero-portrait.crusader-male {
			background-position: 0 -650px;
		}

		.top-heroes .hero-portrait-wrapper .hero-portrait.crusader-female {
			background-position: -168px -650px;
		}

		.top-heroes .hero-portrait-wrapper .hero-portrait.demon-hunter-male {
			background-position: 0 -130px;
		}

		.top-heroes .hero-portrait-wrapper .hero-portrait.demon-hunter-female {
			background-position: -168px -130px;
		}

		.top-heroes .hero-portrait-wrapper .hero-portrait.monk-male {
			background-position: 0 -260px;
		}

		.top-heroes .hero-portrait-wrapper .hero-portrait.monk-female {
			background-position: -168px -260px;
		}

		.top-heroes .hero-portrait-wrapper .hero-portrait.necromancer-male {
			background-position: 0 -780px;
		}

		.top-heroes .hero-portrait-wrapper .hero-portrait.necromancer-female {
			background-position: -168px -780px;
		}

		.top-heroes .hero-portrait-wrapper .hero-portrait.witch-doctor-male {
			background-position: 0 -390px;
		}

		.top-heroes .hero-portrait-wrapper .hero-portrait.witch-doctor-female {
			background-position: -168px -390px;
		}

		.top-heroes .hero-portrait-wrapper .hero-portrait.wizard-male {
			background-position: 0 -520px;
		}

		.top-heroes .hero-portrait-wrapper .hero-portrait.wizard-female {
			background-position: -168px -520px;
		}

	.top-heroes .hero-portrait-wrapper .name {
		position: relative;
		display: inline-block;
		text-align: center;
		height: 32px;
		font-size: 20px;
		line-height: 32px;
		max-width: 125px;
		overflow: hidden;
		text-overflow: ellipsis;
		white-space: nowrap;
	}

		.top-heroes .hero-portrait-wrapper .name:after {
			content: "";
			display: block;
			clear: both;
		}

	.top-heroes .hero-portrait-wrapper .large-seasonal-leaf {
		position: absolute;
		right: 14px;
		top: 143px;
	}

.zh-tw .top-heroes .hero-portrait-wrapper .name {
	font-size: 18px;
}

.ko-kr .top-heroes .hero-portrait-wrapper .name {
	font-size: 16px;
}

.top-heroes .hero-portrait-wrapper .level {
	display: block;
	text-align: center;
	position: absolute;
	right: 8px;
	bottom: 9px;
	color: #a99877;
	font-family: "Arial Black", Arial;
	font-weight: 900;
	font-size: 14px;
	width: 26px;
	height: 26px;
	line-height: 26px;
}

.top-heroes .hero-portrait-wrapper .skill-measure {
	display: block;
	text-align: center;
	color: #7b6d55;
	font-size: 12px;
	height: 22px;
	line-height: 22px;
	width: 143px;
}

.ko-kr .top-heroes .hero-portrait-wrapper .skill-measure {
	font-size: 11px;
	line-height: 25px;
	word-spacing: -0.1em;
}

.top-heroes .hero-portrait-wrapper:hover .name,
.top-heroes .hero-portrait-wrapper:hover .level,
.top-heroes .hero-portrait-wrapper:hover .skill-measure {
	color: #FFF;
}

/* Hero tables */
.list-table.hero-table ul {
	border-top: 1px solid #28241d;
	font-size: 12px;
	margin-bottom: 45px;
}

.list-table.hero-table li a {
	width: 600px;
	height: 34px;
	display: block;
}

.list-table.hero-table li .cell {
	padding: 5px;
	display: block;
	float: left;
	line-height: 23px;
	vertical-align: middle;
}

.list-table.hero-table li .col-measure {
	float: right;
	padding-right: 15px;
	color: #A99877;
}

.list-table.hero-table li .col-hero {
	width: 200px;
}

	.list-table.hero-table li .col-hero.seasonal {
		width: 185px;
	}

.list-table.hero-table li .small-seasonal-leaf {
	float: left;
	margin-top: 7px;
}

.list-table.hero-table li .col-class {
	color: #A99877;
}

.list-table.hero-table li a:hover {
	background-color: #171717;
}

.list-table.hero-table li .icon-frame {
	padding: 0;
	border-radius: 1px;
}

.list-table.hero-table li .col-hero .icon-portrait {
	display: block;
	float: left;
	margin-right: 8px;
}

/* Fallen Heroes */
.fallen-heroes .fallen-hero {
	display: block;
	float: left;
	margin-right: 8px;
	width: 113px;
	height: 154px;
	background-repeat: no-repeat;
	box-shadow: 0 0 7px #000;
	cursor: help;
}

	.fallen-heroes .fallen-hero:hover {
		background-position: 0 100%;
	}

	.fallen-heroes .fallen-hero .name {
		color: #cfb991;
		font-size: 12px;
		line-height: 21px;
		font-family: Arial;
		text-shadow: 1px 1px 3px #000;
		display: block;
		width: 113px;
		text-align: center;
		position: relative;
		top: 87px;
		overflow: hidden;
		text-overflow: ellipsis;
		white-space: nowrap;
	}

	.fallen-heroes .fallen-hero .time-played {
		color: #7b6d55;
		font-size: 11px;
		line-height: 16px;
		font-family: Arial;
		text-shadow: 1px 1px 3px #000;
		display: block;
		width: 113px;
		text-align: center;
		position: relative;
		top: 84px;
	}

	.fallen-heroes .fallen-hero .level {
		display: block;
		width: 113px;
		height: 40px;
		line-height: 40px;
		color: #b00000;
		font-family: "Arial Black", Arial;
		font-weight: 900;
		font-size: 14px;
		text-align: center;
		position: relative;
		top: 84px;
		background: url(../../images/profile/fallen-hero-level.png) no-repeat 50% 0;
	}

.ff .fallen-heroes .fallen-hero .level {
	padding-left: 1px;
	width: 112px;
}

.ie6 .fallen-heroes .fallen-hero .level {
	background-image: url(../../images/profile/fallen-hero-level.gif);
}

.fallen-heroes .fallen-hero.last-hero {
	margin-right: 0;
}

.fallen-heroes .fallen-hero.row-1 {
	margin-bottom: 18px;
}

.fallen-heroes .fallen-hero.barbarian-male {
	background-image: url(../../images/profile/fallen-heroes/barbarian-male.jpg);
}

.fallen-heroes .fallen-hero.barbarian-female {
	background-image: url(../../images/profile/fallen-heroes/barbarian-female.jpg);
}

.fallen-heroes .fallen-hero.crusader-male {
	background-image: url(../../images/profile/fallen-heroes/crusader-male.jpg);
}

.fallen-heroes .fallen-hero.crusader-female {
	background-image: url(../../images/profile/fallen-heroes/crusader-female.jpg);
}

.fallen-heroes .fallen-hero.demon-hunter-male {
	background-image: url(../../images/profile/fallen-heroes/demon-hunter-male.jpg);
}

.fallen-heroes .fallen-hero.demon-hunter-female {
	background-image: url(../../images/profile/fallen-heroes/demon-hunter-female.jpg);
}

.fallen-heroes .fallen-hero.necromancer-male {
	background-image: url(../../images/profile/fallen-heroes/necromancer-male.jpg);
}

.fallen-heroes .fallen-hero.necromancer-female {
	background-image: url(../../images/profile/fallen-heroes/necromancer-female.jpg);
}

.fallen-heroes .fallen-hero.monk-male {
	background-image: url(../../images/profile/fallen-heroes/monk-male.jpg);
}

.fallen-heroes .fallen-hero.monk-female {
	background-image: url(../../images/profile/fallen-heroes/monk-female.jpg);
}

.fallen-heroes .fallen-hero.witch-doctor-male {
	background-image: url(../../images/profile/fallen-heroes/witch-doctor-male.jpg);
}

.fallen-heroes .fallen-hero.witch-doctor-female {
	background-image: url(../../images/profile/fallen-heroes/witch-doctor-female.jpg);
}

.fallen-heroes .fallen-hero.wizard-male {
	background-image: url(../../images/profile/fallen-heroes/wizard-male.jpg);
}

.fallen-heroes .fallen-hero.wizard-female {
	background-image: url(../../images/profile/fallen-heroes/wizard-female.jpg);
}

/* artisans */
.artisans .artisan {
	display: block;
	float: left;
	padding: 8px 0 0 65px;
	width: 229px;
	height: 90px;
	background: url(../../images/profile/career-artisans.jpg) no-repeat;
}

	.artisans .artisan.jeweler-locked,
	.artisans .artisan.mystic-locked,
	.artisans .artisan.blacksmith-locked {
		background-position: -882px 0;
	}

	.artisans .artisan.blacksmith,
	.artisans .artisan.jeweler,
	.artisans .artisan.blacksmith-locked,
	.artisans .artisan.jeweler-locked {
		margin-right: 9px;
	}

	.artisans .artisan.jeweler {
		background-position: -294px 0;
	}

	.artisans .artisan.mystic {
		background-position: -588px 0;
	}

	.artisans .artisan .title {
		display: block;
		color: #ad835a;
		font-size: 18px;
		line-height: 1.5em;
		margin-top: 7px;
		margin-bottom: 1px;
	}

	.artisans .artisan .level {
		display: block;
		color: #a99877;
		font-size: 12px;
	}

		.artisans .artisan .level.hardcore {
			color: #b10000;
		}

		.artisans .artisan .level .value {
			font-weight: bold;
		}

/* Class Breakdown */
.class-breakdown .subheader-3 {
	border-bottom: 0;
}

.class-breakdown .bars {
	height: 73px;
	position: relative;
}

.class-breakdown .column {
	width: 42px;
	height: 73px;
	display: block;
	position: absolute;
	background: url(../../images/profile/time-played-by-class.jpg) no-repeat;
	box-shadow: 0 0 4px #1d1813;
	cursor: help;
	box-shadow: 0 0 5px rgba(0, 0, 0, 0.5);
}

	.class-breakdown .column .bar {
		width: 42px;
		display: block;
		position: absolute;
		bottom: 0;
		background: url(../../images/profile/time-played-by-class.jpg) no-repeat;
		border-top: 1px solid #000;
	}

		.class-breakdown .column .bar.full-bar {
			border-top: 0;
		}

.class-breakdown .column-name {
	position: absolute;
	left: 0;
	top: 80px;
	width: 42px;
	text-align: center;
	font-size: 11px;
	color: #7B6D55;
}

/* Class Breakdown - Vanilla */
.class-breakdown .column.barbarian {
	background-position: 0 0;
	left: 0;
}

	.class-breakdown .column.barbarian .bar {
		background-position: -210px 100%;
		border-color: #aa563d;
	}

	.class-breakdown .column.barbarian:hover .bar {
		background-position: -420px 100%;
	}

.class-breakdown .column.demon-hunter {
	background-position: -42px 0;
	left: 54px;
}

	.class-breakdown .column.demon-hunter .bar {
		background-position: -252px 100%;
		border-color: #905966;
	}

	.class-breakdown .column.demon-hunter:hover .bar {
		background-position: -462px 100%;
	}

.class-breakdown .column.monk {
	background-position: -84px 0;
	left: 108px;
}

	.class-breakdown .column.monk .bar {
		background-position: -294px 100%;
		border-color: #b16b36;
	}

	.class-breakdown .column.monk:hover .bar {
		background-position: -504px 100%;
	}

.class-breakdown .column.witch-doctor {
	background-position: -126px 0;
	left: 162px;
}

	.class-breakdown .column.witch-doctor .bar {
		background-position: -336px 100%;
		border-color: #5e6253;
	}

	.class-breakdown .column.witch-doctor:hover .bar {
		background-position: -546px 100%;
	}

.class-breakdown .column.wizard {
	background-position: -168px 0;
	left: 216px;
}

	.class-breakdown .column.wizard .bar {
		background-position: -378px 100%;
		border-color: #3b5578;
	}

	.class-breakdown .column.wizard:hover .bar {
		background-position: -588px 100%;
	}

/* Class Breakdown - RoS (x1) */
.class-breakdown.x1 .column,
.class-breakdown.x1 .column .bar {
	width: 35px;
	background: url(../../images/profile/time-played-by-class-x1.jpg) no-repeat;
}

	.class-breakdown.x1 .column.barbarian {
		background-position: 0 0;
		left: 0;
	}

		.class-breakdown.x1 .column.barbarian .bar {
			background-position: -210px 100%;
		}

		.class-breakdown.x1 .column.barbarian:hover .bar {
			background-position: -420px 100%;
		}

	.class-breakdown.x1 .column.demon-hunter {
		background-position: -35px 0;
		left: 90px;
	}

		.class-breakdown.x1 .column.demon-hunter .bar {
			background-position: -245px 100%;
		}

		.class-breakdown.x1 .column.demon-hunter:hover .bar {
			background-position: -455px 100%;
		}

	.class-breakdown.x1 .column.monk {
		background-position: -70px 0;
		left: 135px;
	}

		.class-breakdown.x1 .column.monk .bar {
			background-position: -280px 100%;
		}

		.class-breakdown.x1 .column.monk:hover .bar {
			background-position: -490px 100%;
		}

	.class-breakdown.x1 .column.witch-doctor {
		background-position: -105px 0;
		left: 180px;
	}

		.class-breakdown.x1 .column.witch-doctor .bar {
			background-position: -315px 100%;
		}

		.class-breakdown.x1 .column.witch-doctor:hover .bar {
			background-position: -525px 100%;
		}

	.class-breakdown.x1 .column.wizard {
		background-position: -140px 0;
		left: 225px;
	}

		.class-breakdown.x1 .column.wizard .bar {
			background-position: -350px 100%;
		}

		.class-breakdown.x1 .column.wizard:hover .bar {
			background-position: -560px 100%;
		}

	.class-breakdown.x1 .column.crusader {
		background-position: -175px 0;
		left: 45px;
	}

		.class-breakdown.x1 .column.crusader .bar {
			background-position: -385px 100%;
		}

		.class-breakdown.x1 .column.crusader:hover .bar {
			background-position: -595px 100%;
		}

/* Class Breakdown - Necromancer (p6) */
.class-breakdown.p6 .column,
.class-breakdown.p6 .column .bar {
	width: 35px;
	background: url(../../images/profile/time-played-by-class-p6.jpg) no-repeat;
}

.class-breakdown .column-name {
	width: 35px;
}

.class-breakdown.p6 .column.barbarian {
	background-position: 0 0;
	left: 0;
}

	.class-breakdown.p6 .column.barbarian .bar {
		background-position: -245px 100%;
	}

	.class-breakdown.p6 .column.barbarian:hover .bar {
		background-position: -490px 100%;
	}

.class-breakdown.p6 .column.crusader {
	background-position: -35px 0;
	left: 38px;
}

	.class-breakdown.p6 .column.crusader .bar {
		background-position: -280px 100%;
	}

	.class-breakdown.p6 .column.crusader:hover .bar {
		background-position: -525px 100%;
	}

.class-breakdown.p6 .column.demon-hunter {
	background-position: -70px 0;
	left: 76px;
}

	.class-breakdown.p6 .column.demon-hunter .bar {
		background-position: -315px 100%;
	}

	.class-breakdown.p6 .column.demon-hunter:hover .bar {
		background-position: -560px 100%;
	}

.class-breakdown.p6 .column.monk {
	background-position: -105px 0;
	left: 114px;
}

	.class-breakdown.p6 .column.monk .bar {
		background-position: -350px 100%;
	}

	.class-breakdown.p6 .column.monk:hover .bar {
		background-position: -595px 100%;
	}

.class-breakdown.p6 .column.necromancer {
	background-position: -140px 0;
	left: 152px;
}

	.class-breakdown.p6 .column.necromancer .bar {
		background-position: -385px 100%;
	}

	.class-breakdown.p6 .column.necromancer:hover .bar {
		background-position: -630px 100%;
	}

.class-breakdown.p6 .column.witch-doctor {
	background-position: -175px 0;
	left: 190px;
}

	.class-breakdown.p6 .column.witch-doctor .bar {
		background-position: -420px 100%;
	}

	.class-breakdown.p6 .column.witch-doctor:hover .bar {
		background-position: -665px 100%;
	}

.class-breakdown.p6 .column.wizard {
	background-position: -210px 0;
	left: 228px;
}

	.class-breakdown.p6 .column.wizard .bar {
		background-position: -455px 100%;
	}

	.class-breakdown.p6 .column.wizard:hover .bar {
		background-position: -700px 100%;
	}

/* Achievements */
.career-achievements {
}

	.career-achievements .total-achievements {
		height: 32px;
		line-height: 32px;
		font-family: "Arial Black", Arial;
		font-weight: 900;
		font-size: 24px;
	}

		.career-achievements .total-achievements .achievement-shield {
			background: url(../../images/profile/career.png) -104px -20px;
			display: block;
			float: left;
			width: 30px;
			height: 32px;
			margin-top: 4px;
			margin-left: -4px;
		}

		.career-achievements .total-achievements .percent {
			text-align: right;
			float: right;
			display: block;
			width: 50px;
			font-family: Arial;
			font-size: 11px;
			color: #7b6d55;
			margin-top: 4px;
		}

	.career-achievements .progress-bar {
		background: url(../../images/profile/career.png) -98px 0;
		width: 261px;
		height: 8px;
		margin-top: 8px;
	}

	.career-achievements .progress-bar-fill {
		background: url(../../images/profile/career.png) -98px -8px;
		width: 60%;
		height: 8px;
		overflow: hidden;
	}

.ie6 .career-achievements .total-achievements .achievement-shield,
.ie6 .career-achievements .progress-bar,
.ie6 .career-achievements .progress-bar-fill {
	background-image: url(../../images/profile/career.gif);
}

/* Kills */
.career-kills {
	border-bottom: 1px solid #38291d;
	margin: 10px 0 20px;
	border-top: 1px solid #38291d;
	padding-top: 20px;
}
	/*.career-kills { border-top:1px solid #38291d; border-bottom:1px solid #38291d; padding:29px 0 15px; margin:25px 0 29px }*/
	.career-kills .kill-section {
		padding-bottom: 10px;
	}

		.career-kills .kill-section .num-kills {
			font-family: "Arial Black", Arial;
			font-weight: 900;
			font-size: 18px;
			display: block;
			float: left;
			width: 180px;
			margin-top: 5px;
		}

		.career-kills .kill-section .label {
			color: #7b6d55;
			font-size: 11px;
			text-transform: uppercase;
			display: block;
			width: 180px;
			float: left;
			margin-top: -2px;
		}

		.career-kills .kill-section .icon {
			display: block;
			float: left;
			background: url(../../images/profile/career.png) no-repeat;
			height: 64px;
		}

		.career-kills .kill-section.lifetime .icon {
			background-position: 0 0;
			width: 44px;
			margin-left: 6px;
			margin-right: 22px;
		}

		.career-kills .kill-section.elite .icon {
			background-position: -43px 0;
			width: 54px;
			margin-right: 18px;
		}

		.career-kills .kill-section.paragon .icon {
			background-position: -360px 0;
			width: 54px;
			margin-left: 0;
			margin-right: 18px;
		}

.ie6 .career-kills .kill-section .icon {
	background-image: url(../../images/profile/career.gif);
}

/* Progress Bar */
.progression .progression-bar .bar-label {
	width: 90px;
	float: left;
	height: 28px;
	line-height: 28px;
}

.progression .progression-bar .bar-wrapper {
	width: 510px;
	height: 28px;
	background: url(../../images/profile/progression.png) no-repeat;
	position: relative;
	left: 90px;
}

	.progression .progression-bar .bar-wrapper .bar-fill {
		position: absolute;
		height: 17px;
		top: 5px;
		background: url(../../images/profile/progression.png) no-repeat;
	}

	.progression .progression-bar .bar-wrapper .marker {
		display: block;
		position: absolute;
		top: 3px;
		width: 24px;
		height: 24px;
		background: url(../../images/profile/progression.png) no-repeat -544px -3px;
	}

		.progression .progression-bar .bar-wrapper .marker.normal {
			left: 0px;
		}

		.progression .progression-bar .bar-wrapper .marker.nightmare {
			left: 124px;
		}

		.progression .progression-bar .bar-wrapper .marker.hell {
			left: 248px;
		}

		.progression .progression-bar .bar-wrapper .marker.inferno {
			left: 372px;
		}

		.progression .progression-bar .bar-wrapper .marker:hover {
			background-position: -520px -3px;
		}

		.progression .progression-bar .bar-wrapper .marker.complete {
			background-position: -536px -55px;
		}

			.progression .progression-bar .bar-wrapper .marker.complete:hover {
				background-position: -513px -55px;
			}

.progression .progression-bar.hardcore-progression .bar-wrapper .marker.complete {
	background-position: -536px -29px;
}

	.progression .progression-bar.hardcore-progression .bar-wrapper .marker.complete:hover {
		background-position: -513px -29px;
	}

.progression .progression-bar.normal-progression .bar-wrapper .bar-fill {
	background-position: 0 -57px;
}

.progression .progression-bar.hardcore-progression .bar-wrapper .bar-fill {
	background-position: 0 -31px;
}

.progression .difficulty-labels {
	padding-left: 98px;
	position: relative;
	top: -2px;
}

	.progression .difficulty-labels .difficulty-label {
		width: 124px;
	}

		.progression .difficulty-labels .difficulty-label .label-marker {
			width: 123px;
			margin: 0 0 0 1px;
		}

.progression .progress-arrow-hitbox {
	margin-left: -2px;
}

	.progression .progress-arrow-hitbox .progress-arrow {
		background: url(../../images/profile/progression.png) no-repeat -560px -59px;
	}

	.progression .progress-arrow-hitbox:hover .progress-arrow {
		background-position: -576px -59px;
	}

.progression .progression-bar.hardcore-progression .progress-arrow-hitbox .progress-arrow {
	background-position: -560px -33px;
}

.progression .progression-bar.hardcore-progression .progress-arrow-hitbox:hover .progress-arrow {
	background-position: -576px -33px;
}

.ie6 .progression .progression-bar .bar-wrapper {
	background-image: url(../../images/profile/progression.gif);
}

	.ie6 .progression .progression-bar .bar-wrapper .bar-fill {
		background-image: url(../../images/profile/progression.gif);
	}

	.ie6 .progression .progression-bar .bar-wrapper .marker {
		background-image: url(../../images/profile/progression.gif);
	}

/* Boss Progression for RoS */
.progression .bosses {
	overflow: auto;
}

	.progression .bosses .boss {
		text-align: center;
		width: 120px;
		background: url(../../images/profile/bosses.png) no-repeat;
		float: left;
		padding-top: 135px;
	}

	.progression .bosses .boss0 {
		background-position: 0 0;
	}

	.progression .bosses .boss1 {
		background-position: -120px 0;
	}

	.progression .bosses .boss2 {
		background-position: -240px 0;
	}

	.progression .bosses .boss3 {
		background-position: -360px 0;
	}

	.progression .bosses .boss4 {
		background-position: -480px 0;
	}

	.progression .bosses .boss0killed {
		background-position: 0 -130px;
	}

	.progression .bosses .boss1killed {
		background-position: -120px -130px;
	}

	.progression .bosses .boss2killed {
		background-position: -240px -130px;
	}

	.progression .bosses .boss3killed {
		background-position: -360px -130px;
	}

	.progression .bosses .boss4killed {
		background-position: -480px -130px;
	}


html, body, div, span, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre,
em, img, strong, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td {
	margin: 0;
	padding: 0;
	border: 0;
	outline: 0
}

ol, ul {
	list-style-type: none;
}

table {
	border-collapse: collapse;
	border-spacing: 0;
}

:focus {
	outline: 0;
}

button::-moz-focus-inner {
	padding: 0;
	border: 0;
}

body, h1, h2, h3, h4, h5, h6, button, input, textarea, small, big {
	font-size: 100%
}

html {
	height: 100%;
	width: 100%
}

body.zh-tw {
	font-family: 微軟正黑, Microsoft JhengHei, Helvetica, Tahoma, 新明細體, PMingLiU, SimSun, sans-serif
}

body.zh-cn {
	font-family: 微软雅黑, Microsoft YaHei, Helvetica, Tahoma, StSun, 宋体, SimSun, sans-serif;
	font-size: 12px
}

	body.zh-cn * {
		text-transform: none !important;
		letter-spacing: 0 !important;
		font-family: 微软雅黑, Microsoft YaHei, Helvetica, Tahoma, StSun, 宋体, SimSun, sans-serif !important;
		font-style: normal !important
	}

body.ko-kr {
	font-family: Dotum, "돋움", Helvetica, AppleGothic, Sans-serif
}

body.th-th {
	font-family: Tahoma, Thonburi, Ayuthaya, Krungthep, sans-serif
}

a {
	outline: none;
	text-decoration: none;
}

.ie a span {
	cursor: pointer
}

p {
	margin: 0.5em 0;
}

textarea {
	overflow: auto;
}

.zh-tw b,
.zh-tw strong {
	font-weight: normal
}

/* utility */
.clear {
	clear: both;
	display: block;
	margin: 0;
	padding: 0;
}

.ie6 .clear {
	height: 0;
	line-height: 100%;
	overflow: hidden;
}

.clear-after:after {
	content: "";
	display: block;
	height: 0;
	clear: both;
	visibility: hidden;
}

.float-left {
	float: left;
}

.float-right {
	float: right;
}

.align-left {
	text-align: left;
}

.align-center {
	text-align: center;
}

.align-right {
	text-align: right;
}

.relative {
	position: relative;
}

.dynamic-center {
	margin: 0 auto;
}

.opacity0 {
	opacity: 0;
	position: absolute;
}

.ie .opacity0 {
	filter: alpha(opacity=0)
}

.ie .opacity50 {
	filter: alpha(opacity=50)
}

.opacity50 {
	opacity: .50;
}

.clickable {
	cursor: pointer;
}

.table-center {
	margin: auto;
}

.hide {
	display: none;
}

.img {
	vertical-align: bottom;
}

.row-hidden {
	display: none !important;
}

/* borders */
.border-2 {
	border-radius: 2px;
}

.border-3 {
	border-radius: 3px;
}

.border-4 {
	border-radius: 4px;
}

.border-5 {
	border-radius: 5px;
}

.border-6 {
	border-radius: 6px;
}

.border-7 {
	border-radius: 7px;
}

.border-8 {
	border-radius: 8px;
}

.border-9 {
	border-radius: 9px;
}

.border-10 {
	border-radius: 10px;
}

/* console */
.console {
	position: fixed;
	width: 100%;
	padding: 10px;
	top: 0;
	left: 0;
	background: rgba(0, 0, 0, .75);
	color: #fff;
	z-index: 10000;
	font-size: 12px;
}

	.console .console-pane {
		max-height: 500px;
		overflow: auto;
		padding-bottom: 5px;
	}

		.console .console-pane .indent {
			padding-left: 50px;
		}

	.console .console-input span {
		display: inline-block;
		margin-right: 5px;
		font-size: 12px;
	}

	.console .console-input input {
		display: inline-block;
		background: none;
		border: 0;
		padding: 0;
		width: 95%;
		color: #fff;
		font-size: 12px;
	}

	.console .color-red {
		color: #cc6666 !important;
	}

	.console .color-blue {
		color: #81a2be !important;
	}

	.console .color-green {
		color: #b5bd68 !important;
	}

	.console .color-yellow {
		color: #f0c674 !important;
	}

/* blackout */
#blackout {
	width: 100%;
	height: 100%;
	top: 0;
	left: 0;
	background: #000;
	opacity: .7;
	display: none;
	position: fixed;
	z-index: 9001;
}

.ie #blackout {
	position: absolute;
	filter: alpha(opacity=70)
}

#blackout.blackout-transparent {
	background: transparent;
}

#lightbox-anchor #flash-error {
	padding-top: 60px
}

.support-shim {
	display: block;
	z-index: -1;
}
/* wow factions */
.wow-faction-0, .wow-faction-0 a {
	color: #0078ff !important;
}
/* alliance */
.wow-faction-1, .wow-faction-1 a {
	color: #b30000 !important;
}
/* horde */

/* wow expansions */
.wow-exp-0, .wow-exp-0 a {
	color: #fff468 !important;
}
/* classic */
.wow-exp-1, .wow-exp-1 a {
	color: #aad372 !important;
}
/* the burning crusade */
.wow-exp-2, .wow-exp-2 a {
	color: #68ccef !important;
}
/* wrath of the lich king */
.wow-exp-3, .wow-exp-3 a {
	color: #ff7c0a !important;
}
/* cataclysm */

/* wow classes */
.wow-class-1, .wow-class-1 a {
	color: #c69b6d !important;
}
/* warrior */
.wow-class-2, .wow-class-2 a {
	color: #f48cba !important;
}
/* paladin */
.wow-class-3, .wow-class-3 a {
	color: #aad372 !important;
}
/* hunter */
.wow-class-4, .wow-class-4 a {
	color: #fff468 !important;
}
/* rogue */
.wow-class-5, .wow-class-5 a {
	color: #f0ebe0 !important;
}
/* priest */
.wow-class-6, .wow-class-6 a {
	color: #c41e3b !important;
}
/* death knight */
.wow-class-7, .wow-class-7 a {
	color: #2359ff !important;
}
/* shaman */
.wow-class-8, .wow-class-8 a {
	color: #68ccef !important;
}
/* mage */
.wow-class-9, .wow-class-9 a {
	color: #9382c9 !important;
}
/* warlock */
.wow-class-10, .wow-class-10 a {
	color: #00ffba !important;
}
/* monk */
.wow-class-11, .wow-class-11 a {
	color: #ff7c0a !important;
}
/* druid */

/* wow item quality */
.wow-item-0, .wow-item-0 a {
	color: #9d9d9d !important;
}
/* poor (gray) */
.wow-item-1, .wow-item-1 a {
	color: #ffffff !important;
}
/* common (white) */
.wow-item-2, .wow-item-2 a {
	color: #1eff00 !important;
}
/* uncommon (green) */
.wow-item-3, .wow-item-3 a {
	color: #0081ff !important;
}
/* rare (blue) */
.wow-item-4, .wow-item-4 a {
	color: #c600ff !important;
}
/* epic (purple) */
.wow-item-5, .wow-item-5 a {
	color: #ff8000 !important;
}
/* legendary (orange) */
.wow-item-6, .wow-item-6 a {
	color: #e5cc80 !important;
}
/* artifact (gold) */
.wow-item-7, .wow-item-7 a {
	color: #e5cc80 !important;
}
/* heirloom (gold) */

/* sc2 races */
.sc2-race-0, .sc2-race-0 a {
	color: green !important;
}
/* random */
.sc2-race-1, .sc2-race-1 a {
	color: red !important;
}
/* terran */
.sc2-race-2, .sc2-race-2 a {
	color: blue !important;
}
/* protoss */
.sc2-race-3, .sc2-race-3 a {
	color: purple !important;
}
/* zerg */

/* sc2 factions */
.sc2-exp-0, .sc2-exp-0 a {
	color: blue !important;
}
/* wings of liberty */
.sc2-exp-1, .sc2-exp-1 a {
	color: purple !important;
}
/* heart of the swarm */
.sc2-exp-2, .sc2-exp-2 a {
	color: green !important;
}
/* legacy of the void */

/* d3 classes */
.d3-class-barbarian, .d3-class-barbarian a {
	color: #be2903 !important;
}

.d3-class-demon-hunter, .d3-class-demon-hunter a {
	color: #80077b !important;
}

.d3-class-monk, .d3-class-monk a {
	color: #c08f03 !important;
}

.d3-class-witch-doctor, .d3-class-witch-doctor a {
	color: #08711e !important;
}

.d3-class-wizard, .d3-class-wizard a {
	color: #0559ae !important;
}

/* d3 colors */
.d3-color-blue, .d3-color-blue a {
	color: #6969ff !important;
}

.d3-color-gray, .d3-color-gray a {
	color: #909090 !important;
}

.d3-color-gold, .d3-color-gold a {
	color: #c7b377 !important;
}

.d3-color-green, .d3-color-green a {
	color: #00ff00 !important;
}

.d3-color-orange, .d3-color-orange a {
	color: #bf642f !important;
}

.d3-color-purple, .d3-color-purple a {
	color: #a335ee !important;
}

.d3-color-red, .d3-color-red a {
	color: #ff0000 !important;
}

.d3-color-white, .d3-color-white a {
	color: #fff !important;
}

.d3-color-yellow, .d3-color-yellow a {
	color: #ffff00 !important;
}
/* footer */
#footer {
	font: normal 12px "Lucida Sans Unicode", Arial, Helvetica, sans-serif;
	padding: 25px 0;
}

.zh-cn #footer {
	font-family: "微软雅黑", "Microsoft YaHei", Helvetica, Tahoma, "StSun", "宋体", "SimSun", sans-serif;
}

.zh-tw #footer {
	font-family: "微軟正黑", "Microsoft JhengHei", Helvetica, Tahoma, "新明細體", "PMingLiU", "SimSun", sans-serif;
}

.ko-kr #footer {
	font-family: "Dotum", "돋움", "Trebuchet MS", Arial, sans-serif;
}

#footer a {
	color: #697489;
}

	#footer a:hover {
		color: #dcdcdc;
	}

#footer h3,
#footer h3 a {
	color: #b2bac7;
	font-size: 13px;
	font-weight: normal;
	text-transform: uppercase;
}

#footer-promotions {
	float: right;
	padding-bottom: 20px;
	width: 302px;
}

	#footer-promotions a {
		color: #b2bac7;
	}

#sitemap h3 {
	background: url("../images/icons/footer.png") no-repeat;
	border-bottom: 2px solid #414a56;
	margin-bottom: 10px;
	padding-bottom: 10px;
	padding-left: 20px;
}

	#sitemap h3.bnet {
		background-position: 0 0;
	}

	#sitemap h3.games {
		background-position: 2px -50px;
	}

	#sitemap h3.classic {
		background-position: 0 -100px;
	}

	#sitemap h3.account {
		background-position: 2px -150px;
		padding-left: 23px;
	}

	#sitemap h3.support {
		background-position: 0 -200px;
		padding-left: 23px;
	}

	#sitemap h3.jobs {
		background-position: 0 -250px;
		padding-left: 23px;
	}

#sitemap .column {
	float: left;
	padding-bottom: 20px;
	width: 20%;
}

.ie7 #sitemap .column {
	width: 247px;
}

.ie6 #sitemap .column {
	width: 247px;
}

#sitemap .column ul a {
	display: block;
	margin: 2px 0;
}

.ie6 #sitemap .column ul a {
	display: block;
	width: 100%;
}

#sitemap.promotions .column {
	width: 170px;
}

.ie6 #sitemap h3 {
	background: url("../images/icons/footer.gif") no-repeat;
}

	.ie6 #sitemap h3.bnet {
		background-position: 0 0;
	}

	.ie6 #sitemap h3.games {
		background-position: 5px -50px;
	}

	.ie6 #sitemap h3.classic {
		background-position: 0 -100px;
	}

	.ie6 #sitemap h3.account {
		background-position: 5px -150px;
	}

	.ie6 #sitemap h3.support {
		background-position: 0 -200px;
	}

.ie6 #footer {
	zoom: 1;
}

#copyright {
	color: #2a2c2f;
	border-top: 1px solid #414a56;
	text-transform: uppercase;
	font-size: 10px;
	clear: both;
	padding: 10px 0;
}

.zh-cn #copyright img {
	vertical-align: bottom
}

.cjk #copyright {
	font-size: 12px
}

.ie6 #copyright {
	zoom: 1;
}

.ie7 #copyright {
	line-height: normal;
	padding: 5px;
}

#copyright a {
	margin-left: 15px;
	color: #b2bac7;
}

.de-de #copyright a {
	margin-left: 8px
}

.es-es #copyright a,
.es-mx #copyright a,
.fr-fr #copyright a {
	margin-left: 5px
}

.pl-pl #copyright a {
	margin-left: 6px
}

.pt-br #copyright a {
	margin-left: 7px
}

.ru-ru #copyright a {
	margin-left: 0px
}

.zh-cn #copyright a {
	margin-right: 15px;
	margin-left: 0
}

.ko-kr #copyright a {
	font-size: 11px;
	display: inline-block;
}

.zh-cn #copyright p {
	margin-bottom: 8px;
	margin-top: 0
}

.ko-kr #copyright .policies {
	font-weight: bold;
	color: #007ca5
}

#copyright .legal-links {
	display: block;
}

	#copyright .legal-links a {
		margin: 0 8px 0 0
	}

#legal {
	padding: 15px 0;
}

	#legal a {
		display: inline-block;
		vertical-align: top;
	}

	#legal #blizzard {
		float: left;
	}

	/* TODO Defect: These styles are specific to the game sites and should not be in the global Common CSS */
	#legal #legal-ratings {
		float: right;
		vertical-align: top;
	}

		#legal #legal-ratings img {
			vertical-align: top;
		}

		#legal #legal-ratings a {
			margin-left: 10px;
		}

#legal-ratings {
	width: 473px;
}

#legal #legal-ratings .product-rating a {
	display: inline;
	margin-left: 0;
}

#legal #legal-ratings.us .product-rating {
	width: 300px;
}

#legal #legal-ratings .product-rating {
	float: right;
}

#legal-ratings img {
	/* Responsive images (ensure images don't scale beyond their parents) */
	max-width: 100%; /* Part 1: Set a maximum relative to the parent */
	height: auto; /* Part 2: Scale the height according to the width, otherwise you get stretching */
	border: 0;
	vertical-align: middle;
}

.ie8 #legal-ratings img {
	width: auto; /* IE8 need help adjusting responsive images */
}
/* END TODO */

.ko-kr #legal-kr {
	padding-top: 12px;
	text-align: center;
	color: #9b9898;
	font-size: 11px;
	line-height: 14px;
	font-family: Dotum
}

	.ko-kr #legal-kr a {
		color: #3f8eea
	}

	.ko-kr #legal-kr .webfont-daum {
		margin-top: 5px;
		font-family: daumRegular
	}

#marketing-trackers, .marketing-cover {
	height: 1px;
	overflow: hidden;
	position: relative;
	width: 1px;
}

.marketing-cover {
	background-color: #000;
	left: 0;
	position: absolute;
	top: 0;
}

/* language switcher */
#international {
	display: none;
	border-bottom: 1px solid #414A56;
	padding: 25px 0 25px 25px;
	background: url("../images/layout/world-map.gif") 50% 50% no-repeat;
}

.ie #international {
	zoom: 1
}

#international h3 {
	margin: 0 0 10px 0;
	padding: 0;
}

#international .column {
	float: left;
	padding: 20px;
	width: 115px;
}

	#international .column a {
		display: block;
		padding: 3px 0;
	}

		#international .column a.selected {
			background: url("../images/icons/i18n-support.gif") 0 4px no-repeat;
			padding-left: 15px;
			margin-left: -15px;
			color: #fff;
		}

#change-language {
	float: right;
	background: url("../images/icons/arrows.gif") 100% -99px no-repeat;
	padding-right: 20px;
	margin-top: -2px
}

	#change-language.open {
		background-position: 100% 1px;
	}

	#change-language span {
		display: inline-block;
		background: url("../images/icons/map-small.gif") 0 50% no-repeat;
		padding: 2px 0 2px 35px
	}

/* embedded login */
#login-embedded {
	width: 400px;
	position: fixed;
	top: 50%;
	left: 50%;
	padding: 0;
	margin: -200px;
	z-index: 9005;
	height: 300px;
	background: #000;
	border-radius: 3px;
	-moz-box-shadow: #000 0 0 20px;
	box-shadow: #000 0 0 20px;
}

	#login-embedded object,
	#login-embedded iframe {
		width: 400px;
		margin: 0;
		padding: 0;
		border: none;
	}

#embedded-loader {
	width: 200px;
	height: 200px;
	position: fixed;
	top: 50%;
	left: 50%;
	margin: -100px;
	z-index: 9005;
	background: url("../images/loaders/uber-loading.gif") 50% 50% no-repeat;
}

/* bml */
.bml-toolbar button {
	width: 34px;
	height: 26px;
	padding: 0;
	text-indent: -9999px;
	border: none;
	background-repeat: no-repeat;
	margin: 0 2px 5px 0;
	cursor: pointer;
}

.ie .bml-toolbar button {
	position: relative;
	zoom: 1
}

.bml-toolbar .bml-bold:hover,
.bml-toolbar .bml-bold.on {
	background-position: -34px 0;
}

.bml-toolbar .bml-italics {
	background-position: 0 -26px;
}

	.bml-toolbar .bml-italics:hover,
	.bml-toolbar .bml-italics.on {
		background-position: -34px -26px;
	}

.bml-toolbar .bml-underline {
	background-position: 0 -52px;
}

	.bml-toolbar .bml-underline:hover,
	.bml-toolbar .bml-underline.on {
		background-position: -34px -52px;
	}

.bml-toolbar .bml-list {
	background-position: 0 -78px;
}

	.bml-toolbar .bml-list:hover,
	.bml-toolbar .bml-list.on {
		background-position: -34px -78px;
	}

.bml-toolbar .bml-listItem {
	background-position: 0 -208px;
}

	.bml-toolbar .bml-listItem:hover,
	.bml-toolbar .bml-listItem.on {
		background-position: -34px -208px;
	}

.bml-toolbar .bml-code {
	background-position: 0 -104px;
}

	.bml-toolbar .bml-code:hover,
	.bml-toolbar .bml-code.on {
		background-position: -34px -104px;
	}

.bml-toolbar .bml-quote {
	background-position: 0 -130px;
}

	.bml-toolbar .bml-quote:hover,
	.bml-toolbar .bml-quote.on {
		background-position: -34px -130px;
	}

.bml-toolbar .bml-unformat {
	background-position: 0 -156px;
}

	.bml-toolbar .bml-unformat:hover,
	.bml-toolbar .bml-unformat.on {
		background-position: -34px -156px;
	}

.bml-toolbar .bml-cleanup {
	background-position: 0 -182px;
}

	.bml-toolbar .bml-cleanup:hover,
	.bml-toolbar .bml-cleanup.on {
		background-position: -34px -182px;
	}

.bml-toolbar .bml-url {
	background-position: -69px 0;
}

	.bml-toolbar .bml-url:hover,
	.bml-toolbar .bml-url.on {
		background-position: -103px 0;
	}

.bml-editor {
	margin: 5px 0 7px;
	background: #fff;
	height: 200px;
	padding: 10px;
	-moz-border-radius: 5px;
	border-radius: 5px;
	cursor: text;
	-moz-box-shadow: 0 0 10px -3px #444444;
	box-shadow: 0 0 10px -3px #444444;
}

	.bml-editor iframe {
		width: 100%;
		height: 200px;
	}

/* misc */
.response-error {
	border: 1px solid #c90000 !important;
}
/*general input error style*/

/* Ads */
#sidebar-bnet-ads {
	margin: 0 0 25px 3px;
	font-size: 11px;
	line-height: normal;
}

	#sidebar-bnet-ads .sidebar-content {
		padding-top: 15px;
	}

	#sidebar-bnet-ads .desc {
		padding: 5px 0;
	}

	#sidebar-bnet-ads .subtitle {
		padding-top: 5px;
	}

/* error page */
.server-error #content .content-top {
	background: no-repeat;
}

#server-error {
	width: 375px;
	margin: 0 auto;
	padding-top: 150px;
	text-align: center;
	font-size: 18px;
	min-height: 900px;
}

	#server-error h2 {
		font-size: 125px;
	}

		#server-error h2.http {
			font-size: 85px;
		}

	#server-error h3 {
		font-size: 35px;
		margin-bottom: 50px;
	}

	#server-error em {
		font-size: 12px;
	}

	#server-error ul {
		font-size: 14px;
		text-align: left;
		list-style: disc;
		margin: 35px 0 0 35px;
	}

	#server-error sup {
		font-size: 9px;
	}

/* blizzcon bar */
.blizzcon-bar {
	width: 100%;
	height: 40px;
	margin-bottom: 1px;
	background: #002540 url("../images/layout/blizzcon/bar-bg.jpg") 50% 100% no-repeat;
	border-bottom: 1px solid #05517e;
	font-size: 13px;
	font-family: Arial, sans-serif;
	box-shadow: 0 0 1px 1px #000;
}

.blizzcon-bar-inner {
	width: 995px;
	margin: 0 auto;
	border-right: 3px solid #042e45;
	height: 40px;
}

.blizzcon-bar .cell {
	float: right;
	display: block;
	height: 40px;
	border-right: 1px solid #011323;
	border-left: 1px solid #011323;
	margin-right: -1px;
}

	.blizzcon-bar .cell:hover {
		background-color: rgba(255, 255, 255, 0.05);
	}

	.blizzcon-bar .cell span {
		display: block;
		float: left;
		height: 40px;
		line-height: 40px;
		padding: 0 15px;
		border-left: 2px solid #042e45;
	}

	.blizzcon-bar .cell.close {
		border-right: 0;
	}

		.blizzcon-bar .cell.close span {
			background: url("../images/layout/blizzcon/sprite.png") 8px -120px no-repeat;
			padding: 0 20px;
		}

		.blizzcon-bar .cell.close:hover span {
			background-position: 8px -280px;
		}

	.blizzcon-bar .cell.news {
		float: left;
		border-right: 0;
	}

		.blizzcon-bar .cell.news strong {
			padding-right: 10px;
		}

		.blizzcon-bar .cell.news span {
			background: url("../images/layout/blizzcon/sprite.png") 15px 1px no-repeat;
			padding-left: 80px;
		}

		.blizzcon-bar .cell.news:hover span {
			background-position: 15px -159px;
		}

	.blizzcon-bar .cell.buy span {
		background: url("../images/layout/blizzcon/sprite.png") 8px -39px no-repeat;
		padding-left: 60px;
	}

	.blizzcon-bar .cell.buy:hover span {
		background-position: 8px -199px;
	}

	.blizzcon-bar .cell.watch span {
		background: url("../images/layout/blizzcon/sprite.png") 7px -80px no-repeat;
		padding-left: 45px;
	}

	.blizzcon-bar .cell.watch:hover span {
		background-position: 7px -240px;
	}

.blizzcon-bar a {
	color: #7dfc20;
}

	.blizzcon-bar a:hover {
		color: #fff;
	}

.blizzcon-bar strong {
	color: #fff;
}

body.has-blizzcon-bar {
	background-position: 50% 42px !important;
}
/* service bar */
#service {
	float: right;
	position: absolute;
	right: 0;
	top: 0;
	z-index: 75;
}

.ie #service {
	z-index: 150;
}

.service-bar {
	display: inline-block;
	float: right;
	font-family: "Lucida Sans Unicode", "Lucida Grande", Arial, sans-serif;
	position: relative;
	text-align: right;
	-webkit-user-select: none;
	-moz-user-select: none;
	user-select: none;
	z-index: 75;
}

.ie .service-bar {
	z-index: 150;
	zoom: 1;
}

.zh-tw .service-bar,
.zh-cn .service-bar,
.ko-kr .service-bar,
.ko-kr .service-bar .service-link
.cjk .service-bar .service-link {
	font-size: 12px;
}

	.zh-tw .service-bar,
	.zh-tw .service-bar .dropdown-menu a {
		font-family: "微軟正黑", "Microsoft JhengHei", Helvetica, Tahoma, "新明細體", PMingLiU, SimSun, sans-serif;
	}

.zh-cn .service-bar {
	font-family: "微软雅黑", "Microsoft YaHei", Helvetica, Tahoma, StSun, "宋体", SimSun, sans-serif;
}

.ko-kr .service-bar {
	font-family: Dotum, "돋움", Helvetica, AppleGothic, sans-serif;
}

.service-bar .dropdown-menu {
	background-color: #c5c5c5;
	border-radius: 2px;
	border-top-right-radius: 0px;
	box-shadow: 0 3px 4px #1b1b1b;
	color: #000;
	display: none;
	line-height: normal;
	padding: 10px;
	position: absolute;
	right: 0;
	text-align: left;
	top: 33px;
	width: 150px;
}

	.service-bar .dropdown-menu a {
		border-radius: 2px;
		color: #000;
		display: block;
		padding: 5px;
	}

		.service-bar .dropdown-menu a:hover {
			background: #d6d6d6;
			color: #000;
			text-decoration: none;
		}

.service-bar .service-news.opened {
	padding: 0;
}

	.service-bar .service-news.opened a,
	.service-bar .service-news.opened a:hover,
	.service-bar .service-news.opened a:focus {
		background-color: #d37201;
		border-right-color: #d37201;
		height: 40px;
	}

.ie6 .service-bar .service-news a,
.ie6 .service-bar .service-news.opened a,
.ie6 .service-bar .service-news.opened a:hover,
.ie6 .service-bar .service-news.opened a:focus {
	background: url("../images/service-bar/background-msie.png") repeat-x -117px -160px;
	border-left: 0;
	border-right: 1px solid #33373b;
	display: block;
	height: 33px;
	width: 50px;
}

.service-cell {
	background: url("../images/service-bar/background.png") repeat-x 0 -200px;
	color: #8694a1;
	display: block;
	float: left;
	line-height: 32px;
	padding: 0 0 7px 0;
	position: relative;
}

	.service-cell a {
		color: #00b6ff;
		font-size: 11px;
		text-decoration: none;
	}

		.service-cell a:hover,
		.service-cell a:focus {
			color: #fff;
		}

		.service-cell a.active {
			background: #C5C5C5;
			color: #000;
		}

.service-home {
	background-position: 0 0;
	background-repeat: no-repeat;
}

	.service-home a {
		background: url("../images/service-bar/background.png") no-repeat 0 -40px;
		border-left: none;
		display: block;
		line-height: 33px;
		padding: 0 0 0 7px;
		text-indent: -9999px;
		width: 48px;
	}

		.service-home a:hover,
		.service-home a:focus {
			background-color: transparent;
			background-position: 0 -80px;
		}

	.service-home.service-maintenance a {
		background-position: 0 -120px;
	}

	.service-home.service-alert a {
		background-position: 0 -160px;
	}

.service-welcome {
	padding: 0 15px 7px 15px;
}

	.service-welcome .employee {
		background: url("../images/icons/employee.gif") no-repeat center center;
		display: inline-block;
		height: 32px;
		vertical-align: middle;
		width: 27px;
	}

.zh-cn .service-welcome .employee {
	background-image: url("../images/icons/employee-netease.gif");
}

.service-cell .service-link {
	border-left: 1px solid #33373B;
	display: block;
	font-size: 10px;
	line-height: 33px;
	padding: 0 1.5em;
	text-transform: uppercase;
}

	.service-cell .service-link:hover,
	.service-cell .service-link:focus {
		background-color: #343434;
	}

.ko-kr .service-cell .service-link {
	font-size: 11px !important;
}

.service-news a {
	background: url("../images/service-bar/background.png") repeat-x -117px -160px;
	border-left: 0;
	border-right: 1px solid #33373B;
	display: block;
	width: 50px;
}

.service-support-enhanced {
	background-position: 100% -241px;
}

.service-support a.service-link-dropdown {
	background: url("../images/service-bar/background.png") repeat-x 100% -240px;
	display: block;
	padding: 0 38px 0 1.5em;
}

.ie6 .service-support a.service-link-dropdown {
	background-image: url("../images/service-bar/background-msie.png");
}

.service-support a.service-link-dropdown:hover,
.service-support a.service-link-dropdown:focus {
	background-position: 100% -280px;
}

.service-support a.active,
.service-support a.active:hover,
.service-support a.active:focus {
	background: url("../images/service-bar/background.png") repeat-x 100% -320px;
	color: #fff;
}

.ie6 .service-support a.active,
.ie6 .service-support a.active:hover,
.ie6 .service-support a.active:focus {
	background: url("../images/service-bar/background-msie.png") repeat-x 100% -320px;
}

.service-explore {
	background-position: 100% 0;
	padding: 0 0 7px 0;
}

	.service-explore a.dropdown {
		background: url("../images/service-bar/background.png") repeat-x 100% -40px;
		color: #fff;
		display: block;
		line-height: 33px;
		padding: 0 40px 0 1.5em;
		text-transform: uppercase;
	}

.ie6 .service-explore a.dropdown {
	background-image: url("../images/service-bar/background-msie.png");
	float: left;
}

.service-explore a.dropdown:hover,
.service-explore a.dropdown:focus {
	background-position: 100% -80px;
}

.service-explore a.active,
.service-explore a.active:hover,
.service-explore a.active:focus {
	background-position: 100% -120px;
}

.ie6 .service-explore a.dropdown:link,
.ie6 .service-explore a.dropdown:visited {
	color: #fff;
}

.service-language a {
	background: url("../images/service-bar/map.png") 50% 6px no-repeat;
	height: 33px;
	padding: 0;
	width: 65px;
}

.ie6 .service-language a {
	background-image: url("../images/service-bar/map.gif");
}

.service-language a:hover {
	background-position: 50% -40px;
}

/* support tag */
.no-support-tickets {
	display: none;
}

.open-support-tickets {
	display: block;
	position: absolute;
	top: 8px;
	right: 11px;
	width: 17px;
	height: 16px;
	padding: 1px 1px 4px 1px;
	overflow: hidden;
	background: url("../images/service-bar/background.png") repeat-x -188px -168px;
	text-align: center;
	line-height: 16px;
	color: #722600;
}

.ie6 .open-support-tickets {
	background: url("../images/service-bar/background-msie.png") repeat-x -188px -168px;
}

.service-support a.active .open-support-tickets,
.service-support a.active:hover .open-support-tickets,
.service-support a.active:focus .open-support-tickets {
	color: #722600;
}

/* bnet app tooltip  */
#bnet-app-tooltip {
	position: absolute;
	z-index: 85;
	top: 33px;
	right: -412px;
	width: 460px;
	font-size: 12px;
}

	#bnet-app-tooltip a {
		text-indent: 0;
		width: auto;
		line-height: normal;
		background-image: none;
		padding: 0;
		display: inline;
	}

	#bnet-app-tooltip .tooltip-wrapper {
		box-shadow: 0 0 5px #000;
		margin-top: -1px;
		padding: 15px 0 15px 15px;
		line-height: normal;
		text-align: left;
		background: #343c46 url("../images/service-bar/bnet-app/tooltip-bg.jpg") right center no-repeat;
	}

	#bnet-app-tooltip .tooltip-arrow {
		position: relative;
		z-index: 5;
		height: 10px;
		width: 16px;
		margin-left: 17px;
		background: url("../images/service-bar/bnet-app/tooltip-arrow.gif") no-repeat;
	}

	#bnet-app-tooltip ul {
		margin: 10px 0 18px 22px;
		list-style-image: url('../images/service-bar/bnet-app/features-bullet-small.png');
	}

		#bnet-app-tooltip ul li {
			height: auto;
		}

	#bnet-app-tooltip .content {
		width: 210px;
	}

	#bnet-app-tooltip .title {
		font-size: 16px;
		display: block;
		font-weight: normal;
		color: #fff;
		padding-bottom: 4px;
	}

	#bnet-app-tooltip .sub-title {
		color: #b2bac7;
		text-transform: uppercase;
		font-size: 11px;
		font-weight: normal;
		letter-spacing: 0.1em;
	}

	#bnet-app-tooltip .more {
		display: block;
		margin-top: 15px;
	}

	#bnet-app-tooltip .button {
		display: inline-block;
		margin-right: 10px;
		color: #fff;
		text-transform: uppercase;
		padding: 8px 15px;
		border-radius: 3px;
		box-shadow: 0 0 2px 2px #363b41;
		background: #0081b4; /* Old browsers */
		background: -moz-linear-gradient(top, #0081b4 0%, #006a9b 100%); /* FF3.6+ */
		background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#0081b4), color-stop(100%,#006a9b)); /* Chrome,Safari4+ */
		background: -webkit-linear-gradient(top, #0081b4 0%,#006a9b 100%); /* Chrome10+,Safari5.1+ */
		background: -o-linear-gradient(top, #0081b4 0%,#006a9b 100%); /* Opera 11.10+ */
		background: -ms-linear-gradient(top, #0081b4 0%,#006a9b 100%); /* IE10+ */
		background: linear-gradient(top, #0081b4 0%,#006a9b 100%); /* W3C */
	}

		#bnet-app-tooltip .button:hover {
			background: #008dc5;
		}

	#bnet-app-tooltip .close {
		opacity: 0.2;
		margin: -9px 5px;
		display: inline-block;
		width: 16px;
		height: 16px;
		float: right;
		background: url("../images/icons/sprite.png") 0 -96px no-repeat;
	}

		#bnet-app-tooltip .close:hover {
			background-position: 0 -96px;
			opacity: 1;
		}

.ru-ru #bnet-app-tooltip .tooltip-wrapper {
	background-image: url("../images/service-bar/bnet-app/tooltip-bg_ru-ru.jpg");
}

.zh-tw #bnet-app-tooltip .tooltip-wrapper {
	background-image: url("../images/service-bar/bnet-app/tooltip-bg_zh-tw.jpg");
}

.fr-fr #bnet-app-tooltip .tooltip-wrapper {
	background-image: url("../images/service-bar/bnet-app/tooltip-bg_fr-fr.jpg");
}

.ko-kr #bnet-app-tooltip .tooltip-wrapper {
	background-image: url("../images/service-bar/bnet-app/tooltip-bg_ko-kr.jpg");
}

.zh-cn #bnet-app-tooltip .tooltip-wrapper {
	background-image: url("../images/service-bar/bnet-app/tooltip-bg_zh-cn.jpg");
}

.it-it #bnet-app-tooltip {
	width: 490px;
	right: -442px;
}

	.it-it #bnet-app-tooltip .content {
		width: 235px;
	}

/* auth menu */
.service-auth .service-link,
.service-auth .service-link.active {
	display: block;
	width: 20px;
	height: 33px;
	padding: 0 8px;
	background: url("../images/service-bar/auth/security-alert.png") 50% 50% no-repeat;
}

	.service-auth .service-link:hover,
	.service-auth .service-link:focus {
		background-color: #343434;
	}

	.service-auth .service-link.active {
		background-color: #343c46;
	}

.ie6 .service-auth .service-link,
.ie6 .service-auth .service-link.active {
	background-image: url("../images/service-bar/auth/security-alert-ie6.png");
}

	.ie6 .service-auth .service-link:hover,
	.ie6 .service-auth .service-link:focus {
		background: #343434 url("../images/service-bar/auth/security-alert-ie6.png") 50% 50% no-repeat;
	}

	.ie6 .service-auth .service-link.active {
		background: #343c46 url("../images/service-bar/auth/security-alert-ie6.png") 50% 50% no-repeat !important;
	}

.auth-menu {
	position: absolute;
	z-index: 85;
	top: 33px;
	right: -250px;
	width: 400px;
	padding: 15px;
	line-height: normal;
	text-align: left;
	background: #343c46 url("../images/service-bar/auth/authenticator.jpg") 100% 100% no-repeat;
	border-bottom-left-radius: 5px;
	border-bottom-right-radius: 5px;
	font-size: 12px;
	box-shadow: 0 5px 5px #000;
}

	.auth-menu ul {
		margin: 15px 0 15px 15px;
		list-style: square;
	}

		.auth-menu ul li {
			height: auto;
		}

	.auth-menu .auth-title {
		font-size: 15px;
		display: block;
		font-weight: normal;
		color: #fff;
		padding-bottom: 4px;
		border-bottom: 3px solid #2a5164;
	}

	.auth-menu .auth-more {
		display: block;
		margin-top: 15px;
	}

	.auth-menu .auth-button {
		display: inline-block;
		color: #fff;
		text-transform: uppercase;
		padding: 10px 15px;
		border-radius: 3px;
		box-shadow: 0 0 4px 2px #252b32;
		background: #0081b4; /* Old browsers */
		background: -moz-linear-gradient(top, #0081b4 0%, #006a9b 100%); /* FF3.6+ */
		background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#0081b4), color-stop(100%,#006a9b)); /* Chrome,Safari4+ */
		background: -webkit-linear-gradient(top, #0081b4 0%,#006a9b 100%); /* Chrome10+,Safari5.1+ */
		background: -o-linear-gradient(top, #0081b4 0%,#006a9b 100%); /* Opera 11.10+ */
		background: -ms-linear-gradient(top, #0081b4 0%,#006a9b 100%); /* IE10+ */
		background: linear-gradient(top, #0081b4 0%,#006a9b 100%); /* W3C */
	}

		.auth-menu .auth-button:hover {
			background: #008dc5;
		}

	.auth-menu .auth-close {
		display: inline-block;
		width: 16px;
		height: 16px;
		float: right;
		background: url("../images/icons/sprite.png") 0 -96px no-repeat;
	}

.ie6 .auth-menu .auth-close {
	background-image: url("../images/icons/sprite-msie.png");
}

/* support menu */
.support-menu {
	position: absolute;
	z-index: 85;
	top: 33px;
	right: 0;
	width: 295px;
	text-align: left;
}

.support-primary {
	line-height: 1.5;
	overflow: hidden;
	padding: 1em 13px 12px 15px;
	background: #343C46;
}

.support-secondary {
	display: none;
}

.support-caption {
	font-size: 16px;
	line-height: 1.333;
	color: #393939;
	letter-spacing: -1px;
	margin: 0 0 .5em 0;
	font-weight: bold;
	display: block;
	color: #E8EBF0;
	font-weight: normal;
	line-height: 1.333;
	margin: 0;
}

.support-nav {
	margin: 0;
	padding: 0;
}

	.support-nav li {
		list-style: none;
	}

	.support-nav a.support-category {
		display: block;
		color: #94989F;
		margin: 0 0 .5em 0;
		padding: 0 0 .75em 0;
		border-bottom: 3px solid #2A5164;
	}

		.support-nav a.support-category:hover,
		.support-nav a.support-category:focus,
		.support-nav a.support-category:active {
			border-color: #FFF;
			color: #FFF;
		}

.ticket-summary ul {
	margin: 0;
}

.ticket-summary li {
	font-size: 11px;
	padding: 4px 0;
}

	.ticket-summary li.view-all-tickets {
		border: 0;
		padding: 0;
		margin: 6px 0 0 0;
	}

	.ticket-summary li.first-ticket {
		border: none;
	}

	.ticket-summary li .ticket-open {
		color: #94989F;
	}

	.ticket-summary li .ticket-answered {
		color: #d68b14;
	}

	.ticket-summary li .ticket-resolved {
		color: #64c419;
	}

	.ticket-summary li .ticket-canceled {
		color: #94989F;
	}

	.ticket-summary li .ticket-info {
		color: #e25053;
	}

	.ticket-summary li a {
		color: #94989F;
		display: block;
		padding: 4px 4px 4px 36px;
		position: relative;
		-moz-border-radius: 2px;
		-webkit-border-radius: 2px;
		border-radius: 2px;
	}

		.ticket-summary li a:hover,
		.ticket-summary li a:focus,
		.ticket-summary li a:active,
		.ticket-summary li a:hover span,
		.ticket-summary li a:focus span,
		.ticket-summary li a:active span {
			color: #FFF;
			background: #212832;
		}

		.ticket-summary li a .ticket-datetime {
			color: #5f7481;
		}

	.ticket-summary li.view-all-tickets {
		border-top: 3px solid #2A5164;
	}

		.ticket-summary li.view-all-tickets a {
			padding: 4px;
			margin: 4px 0 0 0;
		}

	.ticket-summary li a .icon-ticket-status {
		background: url("../images/icons/sprite.png") -256px -128px;
		width: 32px;
		height: 32px;
		overflow: hidden;
		display: block;
		position: absolute;
		top: 2px;
		left: 0;
	}

	.ticket-summary li a:hover .icon-ticket-status,
	.ticket-summary li a:focus .icon-ticket-status,
	.ticket-summary li a:active .icon-ticket-status {
		background: url("../images/icons/sprite.png") -256px -160px;
	}

.ie6 .ticket-summary li a .icon-ticket-status {
	background: url("../images/icons/sprite-msie.png") -256px -128px;
	left: -32px;
}

.ie6 .ticket-summary li a:hover .icon-ticket-status,
.ie6 .ticket-summary li a:focus .icon-ticket-status,
.ie6 .ticket-summary li a:active .icon-ticket-status {
	background: url("../images/icons/sprite-msie.png") -256px -160px;
}

/* explore menu */
.explore-menu {
	background: #343C46;
	position: absolute;
	z-index: 85;
	top: 33px;
	right: 7px;
	width: 659px;
	text-align: left;
	border-radius: 3px;
	border-top-right-radius: 0;
	overflow: hidden;
}

.zh-tw .explore-menu {
	font-family: 微軟正黑, Microsoft JhengHei, Helvetica, Tahoma, 新明細體, PMingLiU, SimSun, sans-serif
}

.ie6 .explore-menu {
	right: -1px;
}

.explore-primary {
	line-height: 1.5;
	overflow: hidden;
	padding: 1.25em 16px 1em 16px;
}

.explore-menu .explore-caption {
	font-size: 16px;
	line-height: 1.333;
	color: #393939;
	letter-spacing: -1px;
	margin: 0 0 .5em 0;
	font-weight: bold;
	display: block;
	color: #B2BAC7;
	font-weight: normal;
	line-height: 1.333;
	margin: 0;
}

.ko-kr .explore-menu .explore-caption {
	font-weight: bold;
	letter-spacing: 0;
}

.explore-nav {
	margin: 0;
	padding: 0;
}

	.explore-nav li {
		list-style: none;
	}

.ko-kr .explore-nav li {
	line-height: 1.2em
}

.ko-kr .explore-nav .explore-caption {
	font-size: 12px;
	word-spacing: -0.1em
}

.explore-nav {
	width: 27%;
	float: left;
	margin-right: 2em;
}

	.explore-nav a {
		display: block;
		color: #94989F;
		margin: 0 0 .5em 0;
		padding: 0.5em 0 .75em 0;
		border-bottom: 3px solid #2A5164;
	}

.ko-kr .explore-nav a {
	font-size: 12px
}

.explore-nav a:hover,
.explore-nav a:focus,
.explore-nav a:active {
	border-color: #FFF;
	color: white;
}

	.explore-nav a:hover .explore-caption,
	.explore-nav a:focus .explore-caption,
	.explore-nav a:active .explore-caption {
		color: white;
	}

.explore-links {
	width: 30%;
	float: left;
}

	.explore-links ul {
		margin: 0;
		padding: 0;
	}

		.explore-links ul li {
			list-style: none;
		}

	.explore-links .explore-caption {
		margin: 0 0 .25em 0;
		padding: 0 4px;
		font-size: 14px;
		white-space: normal;
	}

	.explore-links a {
		margin: 0 0 .1em 0;
		color: #94989F;
		display: block;
		padding: 2px 4px;
		-moz-border-radius: 2px;
		border-radius: 2px;
	}

		.explore-links a:hover,
		.explore-links a:focus,
		.explore-links a:active {
			background: #212832;
		}

.ie6 .explore-links li,
.ie6 .explore-links a {
	height: 1%;
}

.explore-get-app {
	border: 1px solid #030303;
	box-shadow: 2px 2px 3px #21242A;
	float: right;
	display: block;
}

	.explore-get-app:hover .app-preview {
		background-position: 0 -145px;
	}

	.explore-get-app .app-preview {
		width: 232px;
		height: 139px;
		background: url("../images/service-bar/app-screen-explore-menu.png");
	}

	.explore-get-app .app-tagline {
		background-color: #1F242E;
		border: 1px solid #363B45;
		border-top: none;
		padding: .5em;
		text-align: center;
	}

@media only screen and (max-width: 60em) {
	.explore-get-app {
		display: none;
	}
}

.explore-secondary {
	margin: 0;
	line-height: 1.1;
	overflow: visible;
	padding: 0;
	height: 160px;
	background: #232A31;
}

	.explore-secondary li {
		list-style: none;
		width: 110px;
		float: left;
	}

	.explore-secondary .explore-game-heroes {
		width: 109px;
	}


	.explore-secondary .explore-caption {
		font-size: 15px;
		display: block;
		padding-bottom: 4px;
		text-align: center;
		white-space: normal;
	}

.ko-kr .explore-secondary .explore-caption {
	font-weight: normal;
	font-size: 12px;
	letter-spacing: 0;
	word-break: keep-all;
}

.zh-cn .explore-secondary .explore-caption {
	font-size: 12px;
}

.explore-secondary a {
	display: block;
	width: 110px;
	height: 158px;
	color: #94989F;
}

.explore-secondary .explore-game-heroes a {
	width: 109px;
}

.ko-kr .explore-secondary a {
	line-height: 1.2em
}

.explore-secondary a:hover .explore-caption {
	color: white;
}

.explore-secondary .explore-game-inner {
	display: block;
	padding: 110px 7px 0;
}

.explore-secondary .explore-game-inner {
	display: block;
	padding: 110px 0 0 0;
}

.explore-secondary span {
	display: block;
	padding-bottom: 4px;
	white-space: nowrap;
	overflow: hidden;
	font-size: 11px;
}

.explore-game {
	box-sizing: content-box;
}

	.explore-game a {
		height: 160px;
		position: relative;
		background: url("../images/service-bar/explore-menu.jpg?v=1") no-repeat -434px -190px;
	}

		.explore-game a:hover {
			background: url("../images/service-bar/explore-menu.jpg?v=1") no-repeat -434px -125px;
		}

.explore-game-sc2 a {
	background-position: -219px 0;
}

.explore-game-wow a {
	background-position: 0px 0;
}

.explore-game-d3 a {
	background-position: -109px 0;
}

.zh-cn .explore-game-d3 {
	margin-left: 0;
}

.explore-game-hs a {
	background-position: -439px 0;
}

.explore-game-heroes a {
	background-position: -329px 0;
}

.explore-game-overwatch a {
	background-position: -548px 0;
}

.explore-game-sc2 a:hover {
	background-position: -878px 0;
}

.explore-game-wow a:hover {
	background-position: -659px 0;
}

.explore-game-d3 a:hover {
	background-position: -768px 0;
}

.explore-game-hs a:hover {
	background-position: -1098px 0;
}

.explore-game-heroes a:hover {
	background-position: -988px 0;
}

.explore-game-overwatch a:hover {
	background-position: -1207px 0;
}

.service-cell > a.active {
	position: relative;
	z-index: 100;
}

.explore-secondary li {
	background: #232A31;
	border-left: 1px solid #343C46;
	margin-left: -1px;
}

	.explore-secondary li:first-child {
		border-left: 0;
		margin-left: 0;
	}

	.explore-secondary li:hover {
		background: #202730;
	}

/* warnings */
#warnings-wrapper {
	width: 100%;
	top: 33px;
	right: 0;
	position: absolute;
	z-index: 74;
}

.zh-tw #warnings-wrapper {
	width: 375px;
}

.ko-kr #warnings-wrapper {
	width: 450px
}

.ie7 #warnings-wrapper {
	margin: 0;
	float: right;
}

.ie6 #warnings-wrapper {
	margin: 0;
	float: right;
	width: 425px;
}

#warnings-wrapper .warning {
	color: #c4bdb0;
	margin: 0 7px 0 55px;
	box-shadow: 0 3px 4px #1d1d1d
}

.ie6 #warnings-wrapper .warning {
	margin: 0 9px 0 0;
	zoom: 1;
}

#warnings-wrapper .warning a {
	color: #ffd800
}

	#warnings-wrapper .warning a:hover {
		color: #fff;
	}

#warnings-wrapper .warning span {
	color: #fff
}

#warnings-wrapper .warning h3 {
	color: #fff;
}

#warnings-wrapper .warning p {
	margin: 10px 0 0 0;
}

#warnings-wrapper .warning .warning-inner {
	min-width: 380px;
	padding: 15px 10px 15px 15px;
}

#warnings-wrapper .warning .warning-inner2 {
	min-width: 380px;
	background: url("../images/icons/warning.png") 7px 11px no-repeat;
	padding: 15px 10px 10px 40px;
	position: relative;
}

.ie6 #warnings-wrapper .warning .warning-inner2 {
	padding: 10px 10px 10px 40px !important;
	background: url("../images/icons/warning.gif") 10px 7px no-repeat;
	zoom: 1;
}

.ie7 #warnings-wrapper .warning .warning-inner,
.ie7 #warnings-wrapper .warning .warning-inner2 {
	min-width: 200px;
}

#warnings-wrapper .warning .warning-close {
	margin: 4px 0 0 10px;
	display: block;
	position: absolute;
	top: 10px;
	right: 18px;
	width: 10px;
	height: 10px;
	overflow: hidden;
	background: url("../images/service-bar/close.gif");
}

#warnings-wrapper .warning.warning-orange {
	background: #efa800 url("../images/service-bar/bg-orange.gif") 0 0 repeat-x;
	color: #6F3900;
}

#warnings-wrapper .warning.warning-green {
	background: #4c7141 url("../images/service-bar/bg-green.gif") 0 0 repeat-x
}

#warnings-wrapper .warning.warning-red {
	background: #742E03 url("../images/service-bar/bg-red.gif") 0 0 repeat-x
}

#i18n-warning .warning-inner2 {
	background: url("../images/service-bar/globe.png") 12px 17px no-repeat;
}

.ie6 #i18n-warning .warning-inner2 {
	background: url("../images/service-bar/globe.gif") 12px 17px no-repeat;
}

	.ie6 #i18n-warning .warning-inner2 span {
		margin-left: 9px;
	}

#facebook-like {
	width: 250px;
	height: 20px;
	overflow: hidden
}

#google-plus-like {
	width: 90px;
	height: 20px;
	overflow: hidden
}

#qzone-like {
	width: 110px;
	height: 31px;
	overflow: hidden;
	border: none;
	margin: 0
}

#renren-like {
	width: 130px;
	height: 31px;
	overflow: hidden;
	border: none;
	margin: 0
}


.like-wrapper {
	max-width: 340px;
	float: left
}

.share-wrapper {
	width: auto;
	height: 20px;
	float: right;
}

	.share-wrapper .share-title {
		display: block;
		float: right;
		padding: 0 5px 0 0;
		height: 20px;
		line-height: 20px;
	}

.share-links {
	background-color: #fff;
	padding: 2px 1px 2px 2px;
	width: auto;
	height: 16px;
	display: block;
	float: right;
	border-radius: 3px;
}

	.share-links a {
		background: url('../images/icons/widget.png') no-repeat;
		width: 16px;
		height: 16px;
		display: block;
		float: right;
		margin: 0 1px 0 0
	}

		.share-links a:hover {
			opacity: 0.8
		}

	.share-links .facebook {
		background-position: 0 0
	}

	.share-links .twitter {
		background-position: 0 -16px
	}

	.share-links .mySpace {
		background-position: 0 -32px
	}

	.share-links .stumbleUpon {
		background-position: 0 -48px
	}

	.share-links .digg {
		background-position: 0 -64px
	}

	.share-links .me2day {
		background-position: 0 -80px
	}

	.share-links .c-log {
		background-position: 0 -96px
	}

	.share-links .minik {
		background-position: 0 -112px
	}

	.share-links .micro-163 {
		background-position: 0 -128px
	}

	.share-links .micro-sina {
		background-position: 0 -144px
	}

	.share-links .kaixin {
		background-position: 0 -160px
	}

	.share-links .renren {
		background-position: 0 -176px
	}

	.share-links .plurk {
		background-position: 0 -192px
	}

	.share-links .reddit {
		background-position: 0 -208px
	}

	.share-links .studivz {
		background-position: 0 -242px
	}

	.share-links .tuenti {
		background-position: 0 -224px
	}

	.share-links .nasza-klasa {
		background-position: 0 -272px
	}

	.share-links .vkontakte {
		background-position: 0 -288px
	}

	.share-links .odnoklassniki {
		background-position: 0 -304px
	}

	.share-links .micro-qq {
		background-position: 0 -320px
	}

	.share-links .qzone {
		background-position: 0 -336px
	}

	.share-links .connect-qq {
		background-position: 0 -352px
	}
/* feedback buttons */
#footer .common-feedback-buttons {
	float: left;
	width: 166px;
	padding: 5px 0 0 5px;
}

#footer #legal .common-feedback-buttons a {
	background-color: #252525;
	color: #b2bac7;
	font-size: 11px;
	border-radius: 4px;
	display: block;
	line-height: 1.5;
	padding: 5px 5px 5px 31px;
	margin-bottom: 7px;
	min-height: 16px;
}

#footer #legal .common-feedback-buttons .feedback-icon {
	display: block;
	background: url('../images/icons/feedback-buttons.gif') no-repeat 0 0;
	width: 20px;
	height: 17px;
	margin: 0 5px 3px -26px;
	float: left;
}

#footer #legal .common-feedback-buttons .error .feedback-icon {
	background-position: 0 -30px;
}

#footer #legal .common-feedback-buttons a:hover {
	background-color: #434343;
	color: #FFF;
}

#footer #legal .common-feedback-buttons .error {
	background-position: 5px -27px;
}


/* website feedback form */
#overlay.feedback-overlay {
	background: url('../images/layout/bg.jpg') no-repeat 50% 0;
	padding: 20px;
	border: 5px solid #525E67;
	border-radius: 3px;
	box-shadow: black 0 0 20px;
}

/* community site css is overly specific */
.ui-overlay.feedback-overlay {
	width: auto;
}

	.ui-overlay.feedback-overlay .overlay-top,
	.ui-overlay.feedback-overlay .overlay-middle,
	.ui-overlay.feedback-overlay .overlay-bottom {
		background: none;
	}

.feedback-overlay .overlay-close {
	background: url('../images/service-bar/close.gif') no-repeat 0 0;
	width: 10px;
	height: 10px;
	top: 10px;
	right: 10px;
}

.feedback-overlay .feedback-wrapper {
	margin: 0;
	padding-top: 45px;
	width: 466px;
	font-size: 13px;
	color: #86a2b6;
}

.feedback-overlay .feedback-wrapper {
	padding-top: 0;
}

.feedback-overlay .overlay-middle .feedback-wrapper h2 {
	margin-bottom: 20px;
	font-size: 24px;
	font-weight: bold;
	color: #fff;
	border-color: #fff;
}

.feedback-overlay .feedback-wrapper .signpost {
	font-size: 11px;
	font-style: italic;
}

.ko-kr .feedback-overlay .feedback-wrapper .signpost {
	font-style: normal;
}

.feedback-overlay .feedback-wrapper em {
	font-style: normal;
	color: #fff;
}

.feedback-overlay .feedback-wrapper form {
	margin: 20px 0;
	width: 466px;
}

.feedback-overlay .feedback-wrapper label {
	display: block;
	margin-top: 20px;
	width: 100%;
	font-size: 11px;
	text-transform: uppercase;
	color: #68727b;
	box-sizing: border-box;
	-moz-box-sizing: border-box;
}

.feedback-overlay .feedback-wrapper input {
	display: block;
	padding: 7px;
	border: 1px solid #fff;
	border-radius: 5px;
	width: 100%;
	box-sizing: border-box;
	-moz-box-sizing: border-box;
	font-size: 14px;
	/* http://www.colorzilla.com/gradient-editor/#e6e6e6+0,fefefe+100;Custom */
	background: #e6e6e6; /* Old browsers */
	background: -moz-linear-gradient(top, #e6e6e6 0%, #fefefe 100%); /* FF3.6+ */
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#e6e6e6), color-stop(100%,#fefefe)); /* Chrome,Safari4+ */
	background: -webkit-linear-gradient(top, #e6e6e6 0%,#fefefe 100%); /* Chrome10+,Safari5.1+ */
	background: -o-linear-gradient(top, #e6e6e6 0%,#fefefe 100%); /* Opera 11.10+ */
	background: -ms-linear-gradient(top, #e6e6e6 0%,#fefefe 100%); /* IE10+ */
	background: linear-gradient(to bottom, #e6e6e6 0%,#fefefe 100%); /* W3C */
}

	.feedback-overlay .feedback-wrapper input[disabled='disabled'] {
		background-color: transparent;
		padding: 0;
		border: none;
		color: #fff;
		font-size: 11px;
		box-sizing: border-box;
		-moz-box-sizing: border-box;
	}

.feedback-overlay .feedback-wrapper textarea {
	border: 1px solid #fff;
	border-radius: 5px;
	padding: 7px;
	width: 100%;
	box-sizing: border-box;
	-moz-box-sizing: border-box;
	font-family: sans-serif;
	font-size: 14px;
}

.feedback-overlay #feedback-body-char-count.error {
	color: #f00;
}

.feedback-overlay .feedback-wrapper .feedback-error {
	border-color: #f00;
}

.feedback-overlay .feedback-wrapper .feedback-error-msg {
	display: none;
	margin-bottom: 15px;
	color: #f00;
	font-size: 10px;
}

.ko-kr .feedback-overlay .feedback-wrapper .feedback-error-msg {
	font-size: 11px;
}

.feedback-overlay .feedback-wrapper .feedback-form-buttons {
	margin-top: 20px;
}

.feedback-overlay .feedback-wrapper #feedback-success,
.feedback-overlay .feedback-wrapper #feedback-fail {
	display: none;
}

.feedback-overlay .feedback-wrapper .feedback-button {
	/*
		Duplicate ui.button1 style without images
		http://www.colorzilla.com/gradient-editor/#0081b4+0,006a9b+100;Custom
	*/
	background: #0081b4; /* Old browsers */
	background: -moz-linear-gradient(top, #0081b4 0%, #006a9b 100%); /* FF3.6+ */
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#0081b4), color-stop(100%,#006a9b)); /* Chrome,Safari4+ */
	background: -webkit-linear-gradient(top, #0081b4 0%,#006a9b 100%); /* Chrome10+,Safari5.1+ */
	background: -o-linear-gradient(top, #0081b4 0%,#006a9b 100%); /* Opera 11.10+ */
	background: -ms-linear-gradient(top, #0081b4 0%,#006a9b 100%); /* IE10+ */
	background: linear-gradient(to bottom, #0081b4 0%,#006a9b 100%); /* W3C */

	border: 1px solid #111;
	border-radius: 5px;
	box-shadow: 0 0 4px 1px rgba(0, 0, 0, .05);
	color: #fff;
	cursor: pointer;
	display: inline-block;
	height: auto;
	overflow: visible;
	padding: 0;
	margin: 0;
	vertical-align: middle;
	outline: none;
}

	.feedback-overlay .feedback-wrapper .feedback-button:hover,
	.feedback-overlay .feedback-wrapper .feedback-button:focus {
		background: #009ee2;
	}

.feedback-overlay .feedback-wrapper .feedback-button-text {
	background: none;
	border: none;
	box-shadow: none;
	color: #0072A3;
	text-transform: none;
}

	.feedback-overlay .feedback-wrapper .feedback-button-text:hover,
	.feedback-overlay .feedback-wrapper .feedback-button-text:focus {
		color: #00c0ff;
	}

	.feedback-overlay .feedback-wrapper .feedback-button span,
	.feedback-overlay .feedback-wrapper .feedback-button-text span {
		font-size: 13px;
		text-transform: none;
		height: 32px;
		line-height: 32px;
	}

	.feedback-overlay .feedback-wrapper .feedback-button span,
	.feedback-overlay .feedback-wrapper .feedback-button-text span {
		padding: 0 0 0 25px;
	}

		.feedback-overlay .feedback-wrapper .feedback-button span span,
		.feedback-overlay .feedback-wrapper .feedback-button-text span span {
			padding: 0 25px 0 0;
		}

.feedback-overlay .feedback-wrapper #feedback-cancel {
	display: none;
}

.feedback-overlay .feedback-wrapper .feedback-counter {
	display: none;
	margin: 0;
	padding: 0;
	float: right;
	font-size: 10px;
}

.ko-kr .feedback-overlay .feedback-wrapper .feedback-counter {
	font-size: 11px;
}

/* wrapper */
.bnet-comments {
	padding: 0 20px
}

	.bnet-comments .comments-loading {
		padding: 100px;
		background: url("../images/loaders/uber-loading.gif") 50% 50% no-repeat;
	}

	.bnet-comments .comments-error-gate {
		text-align: center;
		padding: 15px;
		background: #000;
		border-radius: 5px;
	}

		.bnet-comments .comments-error-gate .ui-button-d2 {
			margin-top: 15px;
		}

		.bnet-comments .comments-error-gate p {
			margin: 0;
		}

	/* controls */
	.bnet-comments .comments-controls {
		margin: 15px 0;
	}

		.bnet-comments .comments-controls .ui-pagination {
			float: right;
		}

	/* shared */
	.bnet-comments .bnet-username {
		position: relative
	}

	/* list */
	.bnet-comments .comments-pages {
		margin: 15px 0;
	}

	.bnet-comments .comment-tile {
		padding: 15px 15px 15px 100px;
		min-height: 66px;
		position: relative;
		background: #000;
		border-radius: 5px;
	}

		.bnet-comments .comment-tile.comment-buried {
			padding-left: 15px !important;
			display: none;
			min-height: 15px;
		}

		.bnet-comments .comment-tile .karma {
			float: right;
		}

		.bnet-comments .comment-tile .bnet-avatar {
			position: absolute;
			top: 15px;
			left: 15px;
		}

			.bnet-comments .comment-tile .bnet-avatar .avatar-outer a {
				display: block;
				height: 64px;
				width: 64px;
				overflow: hidden
			}

		.bnet-comments .comment-tile .bnet-ratings {
			float: right;
		}

		.bnet-comments .comment-tile .comment-head {
			margin-bottom: 5px;
			color: #5F584D;
			display: inline-block;
			white-space: nowrap
		}

			.bnet-comments .comment-tile .comment-head .timestamp {
				font-size: 11px;
				margin-left: 10px;
			}

		.bnet-comments .comment-tile .comment-foot {
			margin-top: 8px;
			text-align: right;
		}

			.bnet-comments .comment-tile .comment-foot .timestamp {
				font-size: 11px;
			}

			.bnet-comments .comment-tile .comment-foot .ui-button-d2 {
				margin-left: 6px;
				visibility: hidden;
			}

		.bnet-comments .comment-tile .comment-options {
			float: right;
			font-size: 11px;
			display: none;
		}

		.bnet-comments .comment-tile:hover .comment-options,
		.bnet-comments .comment-tile.tile-hover .comment-options {
			display: block;
		}

		.bnet-comments .comment-tile:hover .comment-foot .ui-button-d2,
		.bnet-comments .comment-tile.tile-hover .comment-foot .ui-button-d2,
		.bnet-comments .comment-tile .comment-foot.visible .ui-button-d2,
		.bnet-comments .comment-tile:hover .karma .rate-btn,
		.bnet-comments .comment-tile.tile-hover .karma .rate-btn {
			visibility: visible;
		}

	.bnet-comments .comments-list > li {
		margin: 15px 0;
	}

	/* list - state */
	.bnet-comments .comment-buried .comment-tile {
		display: none;
	}

	.bnet-comments .comment-buried .comment-buried {
		display: block;
	}

	.bnet-comments .comment-body {
		word-wrap: break-word;
	}

	.bnet-comments .comment-blizzard .comment-body {
		color: #00B4FF;
	}

	.bnet-comments .comment-blizzard .comment-head .employee-icon {
		float: left;
		margin: 4px 5px 0 0
	}

	.bnet-comments .comment-mvp .comment-body {
		color: #81B558;
	}

	/* list - nested */
	.bnet-comments .nested-reply,
	.bnet-comments .comment-nested {
		padding-left: 100px;
	}

		.bnet-comments .comment-nested .comment-tile {
			padding-left: 65px;
			min-height: 34px;
		}

			.bnet-comments .comment-nested .comment-tile .bnet-avatar .avatar-outer {
				overflow: hidden
			}

				.bnet-comments .comment-nested .comment-tile .bnet-avatar .avatar-outer a {
					display: block
				}

				.bnet-comments .comment-nested .comment-tile .bnet-avatar .avatar-outer,
				.bnet-comments .comment-nested .comment-tile .bnet-avatar .avatar-outer a,
				.bnet-comments .comment-nested .comment-tile .bnet-avatar img {
					width: 32px;
					height: 32px;
				}

	/* pulling */
	.bnet-comments .comments-pull-link {
		padding: 5px;
		text-align: center;
		display: block;
		margin: 15px 0;
	}

	/* moderator */
	.bnet-comments .moderator-controls {
		float: right;
		border: 1px solid #222;
		background-color: #000;
		padding: 5px 10px;
		white-space: nowrap;
	}

		.bnet-comments .moderator-controls .control-label {
			display: block;
			float: left;
			height: 25px;
			line-height: 26px;
		}

		.bnet-comments .moderator-controls .ui-button-d2 {
			margin-left: 5px;
		}

	.bnet-comments .moderator-review {
		font-size: 12px;
		float: left;
		border: 1px solid #222;
		background-color: #000;
		padding: 5px;
		margin-right: 3px;
	}

	/* rating */
	/* TODO: fix this style - WIP */
	.bnet-comments .comment-rating {
		color: #F3E6D0;
		font-size: 17px;
		visibility: visible !important;
	}

	/* form */
	.bnet-comments .comments-form-wrapper {
		margin: 15px 0;
	}

	.bnet-comments .comments-form {
		padding: 15px 15px 15px 100px;
		background: #000;
		border-radius: 5px;
		position: relative;
	}

		.bnet-comments .comments-form .bnet-avatar {
			position: absolute;
			top: 15px;
			left: 15px;
		}

		.bnet-comments .comments-form .text-wrapper {
			margin-top: 10px;
		}

		.bnet-comments .comments-form .input-wrapper {
			margin-bottom: 15px;
		}

			.bnet-comments .comments-form .input-wrapper textarea {
				resize: none;
				width: 98%;
				height: 100px;
			}

		.bnet-comments .comments-form .comments-action {
			text-align: right;
		}

		.bnet-comments .comments-form .comments-error-form {
			float: left;
		}

			.bnet-comments .comments-form .comments-error-form li {
				color: red;
				display: none;
			}

		.bnet-comments .comments-form .comments-throttler {
			text-align: right;
			vertical-align: middle;
			display: none;
		}

			.bnet-comments .comments-form .comments-throttler .throttle-time {
				color: #fff;
				font-weight: normal;
				font-size: 18px;
				vertical-align: middle;
				position: relative;
				top: -2px;
			}

/* ie */
.ie6 .bnet-comments .comment-tile {
	zoom: 1;
	height: 66px;
	margin-bottom: 10px;
}

	.ie6 .bnet-comments .comment-tile.comment-buried {
		height: 15px;
	}

	.ie6 .bnet-comments .comment-tile .bnet-avatar {
		top: 15px;
		left: 15px;
		zoom: 1;
	}

	.ie6 .bnet-comments .comment-tile .karma {
		width: 200px;
	}

.ie6 .bnet-comments .comment-nested .comment-tile {
	height: 34px;
}

.ie6 .bnet-comments .comments-form {
	margin-bottom: 10px;
}

	.ie6 .bnet-comments .comments-form .bnet-avatar {
		top: 15px;
		left: -85px;
		zoom: 1;
	}

/* employee icon for "Blue" posts (Shared with forums) */
.employee-icon {
	background-image: url(../images/icons/employee.gif);
	background-repeat: no-repeat;
	display: block;
	width: 20px;
	height: 13px
}

	.employee-icon a {
		display: block;
		overflow: hidden;
		width: 20px;
		height: 13px
	}

.ui-breadcrumb {
	list-style: none;
	margin: 0;
	padding: 0;
	float: left
}

	.ui-breadcrumb li {
		float: left;
		margin-right: 5px
	}

.ie .ui-breadcrumb li a {
	display: inline-block;
}

.ui-button-group {
	display: inline-block;
}

	.ui-button-group .button-left,
	.ui-button-group .button-right,
	.ui-button-group .button-mid,
	.ui-button-group .button-solo {
		float: left;
		display: inline-block;
		margin-left: -1px;
		font-size: 11px;
		padding: 0 7px;
		height: 20px;
		line-height: 20px;
		z-index: 0;
	}

	.ui-button-group .button-left {
		border-top-left-radius: 5px;
		border-bottom-left-radius: 5px;
	}

	.ui-button-group .button-right {
		border-top-right-radius: 5px;
		border-bottom-right-radius: 5px;
	}

	.ui-button-group .button-solo {
		border-radius: 5px;
	}

	.ui-button-group a:hover {
		position: relative;
		z-index: 1;
	}

.ui-button-d2,
.ui-cancel {
	background: none;
	border: 0;
	cursor: pointer;
	display: inline-block;
	height: auto;
	overflow: visible;
	padding: 0;
	margin: 0;
	vertical-align: middle;
	outline: none;
	text-align: center;
	white-space: nowrap;
	cursor: pointer;
	box-shadow: none;
}

.ie .ui-button-d2,
.ie .ui-cancel {
	width: auto;
}

.ui-button-d2 span,
.ui-cancel span {
	outline: none;
	display: inline-block;
	background-repeat: no-repeat
}

.ui-button-d2 .button-left,
.ui-button-d2 .button-right {
	overflow: hidden
}

.ie7 .ui-button-d2 .button-left,
.ie7 .ui-button-d2 .button-right {
	overflow: visible
}

.ui-button-d2.disabled,
.ui-button-d2.disabled:hover,
.ui-button-d2.disabled.hover {
	cursor: default;
}

.ui-button-d2.processing,
.ui-button-d2.processing:hover,
.ui-button-d2.processing.hover {
	cursor: progress;
}

.button-mod {
	border: 1px solid #21619b;
	color: #95d4ef;
	border-radius: 3px;
	box-shadow: 0 0 5px #000;
	background: #11518b;
	height: 25px
}

	.button-mod span {
		height: 25px;
		line-height: 25px;
		font-size: 12px;
	}

	.button-mod .button-left {
		padding-left: 10px;
	}

	.button-mod .button-right {
		padding-right: 10px;
	}

	.button-mod.mod-button-active,
	.button-mod:hover {
		border-color: #3f7fb9;
		color: #fff;
		background: #4282bc;
	}

	.button-mod.disabled,
	.button-mod.disabled:hover {
		color: #afbdca;
		border-color: #8898a7;
		background: #6a7a89;
	}

	.button-mod.mod-icon .button-right:before {
		content: " ";
		display: inline-block;
		width: 15px;
		height: 15px;
		background: url(../images/layout/cms/cm_actions.gif) no-repeat;
		position: relative;
		top: 4px;
		margin-right: 3px
	}

	.button-mod.mod-move .button-right:before,
	.button-mod.mod-move.disabled:hover .button-right:before {
		background-position: 0 0
	}

	.button-mod.mod-move.mod-button-active .button-right:before,
	.button-mod.mod-move:hover .button-right:before {
		background-position: -15px 0
	}

	.button-mod.mod-unlock .button-right:before,
	.button-mod.mod-unlock.disabled:hover .button-right:before {
		background-position: 0 -15px
	}

	.button-mod.mod-unlock.mod-button-active .button-right:before,
	.button-mod.mod-unlock:hover .button-right:before {
		background-position: -15px -15px
	}

	.button-mod.mod-lock .button-right:before,
	.button-mod.mod-lock.disabled:hover .button-right:before {
		background-position: 0 -30px
	}

	.button-mod.mod-lock.mod-button-active .button-right:before,
	.button-mod.mod-lock:hover .button-right:before {
		background-position: -15px -30px
	}

	.button-mod.mod-delete .button-right:before,
	.button-mod.mod-delete.disabled:hover .button-right:before {
		background-position: 0 -45px
	}

	.button-mod.mod-delete.mod-button-active .button-right:before,
	.button-mod.mod-delete:hover .button-right:before {
		background-position: -15px -45px
	}

	.button-mod.mod-pin .button-right:before,
	.button-mod.mod-pin.disabled:hover .button-right:before {
		background-position: 0 -60px;
		height: 13px;
		top: 2px
	}

	.button-mod.mod-pin.mod-button-active .button-right:before,
	.button-mod.mod-pin:hover .button-right:before {
		background-position: -15px -60px
	}

	.button-mod.mod-unpin .button-right:before,
	.button-mod.mod-unpin.disabled:hover .button-right:before {
		background-position: 0 -75px;
		height: 13px;
		top: 2px
	}

	.button-mod.mod-unpin.mod-button-active .button-right:before,
	.button-mod.mod-unpin:hover .button-right:before {
		background-position: -15px -75px
	}

	.button-mod.mod-edit .button-right:before,
	.button-mod.mod-edit.disabled:hover .button-right:before {
		background-position: 0 -115px
	}

	.button-mod.mod-edit.mod-button-active .button-right:before,
	.button-mod.mod-edit:hover .button-right:before {
		background-position: -15px -115px
	}

	.button-mod.mod-freeze .button-right:before {
		background-position: 0 -130px
	}

	.button-mod.mod-freeze.mod-button-active .button-right:before,
	.button-mod.mod-freeze:hover .button-right:before {
		background-position: -15px -130px
	}

	.button-mod.mod-unfreeze .button-right:before {
		background-position: 0 -130px
	}

	.button-mod.mod-unfreeze.mod-button-active .button-right:before,
	.button-mod.mod-unfreeze:hover .button-right:before {
		background-position: -15px -130px
	}

.ui-context {
	display: none;
	overflow: hidden;
	position: absolute;
	left: 0;
	top: 15px;
	z-index: 9000;
	opacity: .98;
	width: 225px;
	background: #151616;
	border: 1px solid #262626;
	font: normal 12px "Arial", sans-serif;
	border-radius: 5px;
	box-shadow: #000 0 0 10px;
}

.ie6 .ui-context {
	zoom: 1
}

.ui-context a {
	color: #00B6FF;
	text-decoration: none;
}

	.ui-context a:hover {
		color: #fff;
	}

	.ui-context a.pinned {
		cursor: default;
	}

.ui-context .context {
	padding: 10px;
}

.ie6 .ui-context .context {
	zoom: 1;
}

.ui-context .context strong {
	color: #fff;
	font-size: 14px;
}

.cjk .ui-context .context strong {
	font-weight: normal
}

.ui-context .context span {
	color: #5d636b;
}

.ui-context .context .close {
	padding: 0;
	position: absolute;
	top: 10px;
	right: 10px;
	width: 11px;
	height: 11px;
	display: block;
	background: url("../images/context/icons.gif") no-repeat;
}

.ie6 .ui-context .context .close {
	zoom: 1;
	z-index: 101;
	float: right;
}

.ui-context .context .close:hover {
	background-position: 0 -26px;
}

.ui-context .context .context-user {
	padding-bottom: 10px;
}

.ui-context .context .context-battletag {
	margin-bottom: 5px;
	color: #00B6FF;
	padding: 1px 0 1px 20px;
	background: url("../images/icons/battletag.png") 0 50% no-repeat;
}

.ui-context .context .context-links {
	height: 30px;
}

	.ui-context .context .context-links a {
		display: block;
		line-height: 30px;
		float: left;
		padding-left: 30px;
		height: 30px;
		background: #292a2a;
		margin-right: 1px;
	}

.ie .ui-context .context .context-links a {
	zoom: 1
}

.ui-context .context .context-links a:hover {
	background-color: #525252;
}

.ui-context .context .context-links .link-first {
	border-top-left-radius: 3px;
	border-bottom-left-radius: 3px;
	padding-right: 10px;
}

.ui-context .context .context-links .link-last {
	border-top-right-radius: 3px;
	border-bottom-right-radius: 3px;
}

.ui-context .character-list {
	padding-top: 1px;
	color: #5b616a;
	overflow: hidden;
	background: url("../images/context/divider.gif") 50% 0 no-repeat;
}

	.ui-context .character-list.loading-chars {
		padding: 50px;
		background: url("../images/loaders/uber-loading.gif") 50% 50% no-repeat;
	}

	.ui-context .character-list .primary {
		padding-bottom: 2px;
	}

		.ui-context .character-list .primary .char {
			display: block;
			padding: 10px;
			opacity: .50;
			background: url("../images/context/divider.gif") 50% 100% no-repeat;
		}

.ie .ui-context .character-list .primary .char {
	filter: alpha(opacity=35);
	zoom: 1;
}

.ui-context .character-list .primary .char span {
	display: block;
}

.ui-context .character-list .primary .char .race,
.ui-context .character-list .primary .char .class,
.ui-context .character-list .primary .char .realm {
	text-transform: uppercase;
	color: #5b616a;
	font-size: 11px;
}

.ui-context .character-list .primary .char .name {
	font-size: 14px;
	color: #fff;
	font-weight: bold;
}

.cjk .ui-context .character-list .primary .char .name {
	font-weight: normal
}

.ui-context .character-list .primary .char .pin {
	margin-top: 17px;
	float: right;
	width: 16px;
	height: 16px;
	display: block;
	background: url("../images/context/icons.gif") 0 -52px no-repeat;
}

.ui-context .character-list .primary .char.pinned .pin {
	background-position: 0 -83px;
}

.ui-context .character-list .primary .char.pinned,
.ui-context .character-list .primary .char:hover {
	color: #fff;
	background-color: #080809;
	opacity: 1;
}

.ie .ui-context .character-list .primary .char.pinned,
.ie .ui-context .character-list .primary .char:hover {
	filter: alpha(opacity=100);
}

.ui-context .character-list .primary .char:last-child {
	margin: 0;
	background-image: none;
}

.ui-context .character-list .secondary .viewport {
	width: 185px;
	float: left;
	height: 265px;
	overflow: hidden;
	position: relative;
}

	.ui-context .character-list .secondary .viewport a {
		display: block;
		padding: 5px;
	}

		.ui-context .character-list .secondary .viewport a .icon-frame {
			vertical-align: middle;
		}

		.ui-context .character-list .secondary .viewport a:hover {
			background: #080809;
			border-radius: 5px;
		}

		.ui-context .character-list .secondary .viewport a.filtered {
			display: none;
		}

.ui-context .character-list .secondary .overview {
	position: absolute;
	left: 0;
	top: 0;
	width: 185px;
}

.ui-context .character-list .secondary .scrollbar {
	position: relative;
	float: right;
	width: 15px;
}

.ui-context .character-list .secondary .track {
	background: #080808;
	height: 100%;
	width: 13px;
	position: relative;
	padding: 1px;
	border-radius: 5px;
}

.ui-context .character-list .secondary .thumb {
	height: 20px;
	width: 13px;
	cursor: pointer;
	overflow: hidden;
	position: absolute;
	top: 0;
	background: #24292e;
	border-radius: 5px;
}

	.ui-context .character-list .secondary .thumb .end,
	.ui-context .character-list .secondary .disable {
		display: none;
	}

.ui-context .character-list .secondary .char-wrapper {
	padding: 10px;
	height: 265px;
	width: 205px;
}

.ui-context .no-results {
	text-align: center;
	padding: 15px;
}

.ui-context .char-wrapper {
	padding-bottom: 1px;
	clear: both;
	background: #0d0e10 url("../images/context/divider.gif") 50% 100% no-repeat;
	box-shadow: #000 0 0 5px inset;
}

.ui-context .filter {
	text-align: center;
}

	.ui-context .filter .input {
		margin-bottom: 5px;
	}

.ui-context .filter,
.ui-context .manage-chars {
	padding: 10px 10px 8px 10px;
	display: block;
	line-height: 125%;
}

	.ui-context .manage-chars span {
		color: #5b616a;
	}

.ui-context a.manage-chars:hover span {
	color: #aaa;
}

	.ui-context a.manage-chars:hover span.plus {
		background-position: 0 -265px;
	}

.ui-context .manage-chars .plus {
	width: 15px;
	height: 15px;
	display: block;
	float: right;
	margin: 15px 0 15px 10px;
	background: url("../images/context/icons.gif") 0 -114px no-repeat;
}

.context-link {
	background-position: 100% 4px;
	background-repeat: no-repeat;
	font-weight: bold;
	padding-right: 16px;
}

.cjk .context-link {
	font-weight: normal
}





.ui-dropdown {
	float: left;
	position: relative;
	width: 175px
}

	.ui-dropdown .dropdown-toggler {
		display: block;
		height: 30px;
		overflow: hidden;
		z-index: 20;
		padding-right: 30px;
	}

		.ui-dropdown .dropdown-toggler span {
			padding-left: 10px;
			height: 30px;
			line-height: 30px;
			display: block;
		}

	.ui-dropdown .dropdown-wrapper {
		clear: both;
		display: block;
		position: absolute;
		z-index: 20;
		top: 30px;
		right: 0;
		width: 150px
	}

.ie6 .ui-dropdown .dropdown-wrapper {
	right: -1px
}

.ui-dropdown .dropdown-wrapper ul {
	list-style: none;
	margin: 0;
	padding: 0
}

.ui-dropdown .dropdown-wrapper li.empty {
	padding: 5px;
}

.ui-filter {
	position: relative;
}

	.ui-filter .reset {
		cursor: pointer;
	}

	.ui-filter .reset,
	.ui-filter .view {
		display: block;
		position: absolute;
		top: 5px;
		right: 5px;
	}

	.ui-filter .input {
		color: #707070;
	}

		.ui-filter .input.active {
			color: #000;
		}

.chrome .ui-filter .reset,
.chrome .ui-filter .view {
	top: 7px;
}

.flyout-menu {
	z-index: 75;
	padding: 0;
	width: auto;
	position: absolute
}

	.flyout-menu ul {
		list-style: none;
		margin: 0;
		padding: 0;
		float: left;
	}

		.flyout-menu ul li {
			clear: both;
			position: relative;
		}

			.flyout-menu ul li a {
				display: block;
				padding: 5px;
				text-decoration: none;
			}

.ie6 .flyout-menu ul li a {
	display: inline-block;
}

.flyout-menu ul li .flyout-menu {
	top: -1px;
	display: none;
	z-index: 80;
}

.flyout-menu .header {
	padding: 5px;
	display: block;
}

.icon-16,
.icon-24,
.icon-32,
.icon-48,
.icon-64 {
	overflow: hidden;
	display: inline-block;
	vertical-align: top;
	text-indent: -9999px;
}

.icon-16 {
	width: 16px;
	height: 16px;
	background-image: url("../images/icons/sprite-16.png");
}

.icon-24 {
	width: 24px;
	height: 24px;
	background-image: url("../images/icons/sprite-24.png");
}

.icon-32 {
	width: 32px;
	height: 32px;
	background-image: url("../images/icons/sprite-32.png");
}

.icon-48 {
	width: 48px;
	height: 48px;
	background-image: url("../images/icons/sprite-48.png");
}

.icon-64 {
	width: 64px;
	height: 64px;
	background-image: url("../images/icons/sprite-64.png");
}

.icon-16-default,
.icon-24-default,
.icon-32-default,
.icon-48-default,
.icon-64-default {
	background-position: 0 0;
}

.ui-overlay {
	position: fixed;
	z-index: 9002;
}

	.ui-overlay .overlay-close {
		position: absolute;
		top: 0;
		right: 0;
		display: block;
	}

.ui-pagination {
	overflow: hidden;
}

	.ui-pagination li {
		display: inline-block;
		margin: 0 1px;
	}

		.ui-pagination li a {
			display: block;
			float: left;
			text-align: center;
		}

		.ui-pagination li.expander {
			text-align: center;
			font-weight: bold;
		}

.ie .ui-pagination {
	zoom: 1;
	display: inline;
}

	.ie .ui-pagination li {
		zoom: 1;
	}

.ie67 .ui-pagination li {
	float: left;
	display: block;
	margin-right: 2px;
}

	.ie67 .ui-pagination li a {
		float: left;
	}

.ui-slideshow {
	height: 300px;
	width: 640px;
	overflow: hidden;
	position: relative;
	float: left
}

	.ui-slideshow .slideshow {
		height: 300px;
		width: 640px;
		position: relative;
		z-index: 10;
	}

	.ui-slideshow .mask {
		height: 300px;
		width: 640px;
		position: absolute;
		top: 0;
		left: 0;
		z-index: 30;
		cursor: pointer;
	}

	.ui-slideshow .caption {
		position: absolute;
		left: 30px;
		bottom: 30px;
		width: 540px;
		z-index: 35;
		text-shadow: 0 0 15px #000, 0 0 15px #000, 0 0 5px #000, 0 0 19px #000, 0 0 19px #000;
	}

		.ui-slideshow .caption h3 {
			font-size: 28px;
			color: #fff;
			font-weight: normal;
		}

	.ui-slideshow .paging {
		position: absolute;
		bottom: 15px;
		right: 15px;
		width: 51px;
		height: 26px;
		z-index: 35;
	}

		.ui-slideshow .paging a {
			display: block;
			position: absolute;
			height: 24px;
			width: 24px;
			background: rgba(255,255,255,0.1) url("../images/icons/sprite-carousel-buttons.png") 0 0 no-repeat;
		}

			.ui-slideshow .paging a.prev {
				background-position: -2px -1px;
				left: 0px;
				border-top-left-radius: 3px;
				border-bottom-left-radius: 3px;
				border: 1px solid rgba(255,255,255,0.2);
				border-right: 1px solid rgba(255,255,255,0.1);
			}

				.ui-slideshow .paging a.prev:hover {
					border: 1px solid rgba(255,255,255,0.4);
					border-right: 1px solid rgba(255,255,255,0.2);
					background-position: -2px -27px;
					background-color: rgba(255,255,255,0.2);
				}

			.ui-slideshow .paging a.next {
				background-position: -25px -1px;
				left: 25px;
				border-top-right-radius: 3px;
				border-bottom-right-radius: 3px;
				border: 1px solid rgba(255,255,255,0.2);
				border-left: 1px solid rgba(255,255,255,0.1);
			}

				.ui-slideshow .paging a.next:hover {
					border: 1px solid rgba(255,255,255,0.4);
					border-left: 1px solid rgba(255,255,255,0.2);
					background-position: -25px -27px;
					background-color: rgba(255,255,255,0.2);
				}

	.ui-slideshow .preview {
		color: #000;
		text-align: center;
		width: 100px;
		padding: 5px;
		background: #fff;
		position: absolute;
		display: none;
		right: 35px;
		top: 15px;
		border-radius: 5px;
		z-index: 35;
	}

		.ui-slideshow .preview span {
			display: block;
		}

	.ui-slideshow .slide {
		height: 300px;
		width: 640px;
		position: absolute;
		top: 0;
		left: 0;
		background-position: 0 0;
		background-repeat: no-repeat;
		z-index: 15;
	}

		.ui-slideshow .slide .click-area {
			width: 640px;
			height: 300px;
			position: absolute;
			bottom: 0;
			left: 0;
			z-index: 20;
		}

			.ui-slideshow .slide .click-area embed {
				z-index: 25;
			}

.ie .ui-slideshow .paging a {
	overflow: hidden;
}




#toast-container {
	position: fixed;
	bottom: 20px;
	left: 20px;
	z-index: 100;
}

.ie6 #toast-container {
	position: absolute;
}

.ui-toast {
	width: 277px;
	margin-bottom: 15px;
	position: relative;
}

	.ui-toast .toast-top,
	.ui-toast .toast-bot {
		height: 35px;
		display: block;
	}

	.ui-toast .toast-content {
		padding: 0 35px;
	}

	.ui-toast .toast-arrow {
		width: 25px;
		height: 11px;
		position: absolute;
		bottom: 6px;
		left: 70px;
	}

	.ui-toast .toast-close {
		width: 11px;
		height: 11px;
		position: absolute;
		top: 20px;
		right: 20px;
		overflow: hidden;
		display: block;
		background: url("../images/layout/toast-close.gif") no-repeat;
	}

		.ui-toast .toast-close:hover {
			background-position: 0 -11px
		}

.ie67 .ui-tooltip {
	float: left;
}

.ui-tooltip .tooltip-content {
	width: auto;
	height: auto;
}

.ui-tooltip table {
	border-collapse: collapse;
	border-spacing: 0;
}

.ui-tooltip td {
	margin: 0;
	padding: 0
}

.tooltip-frame {
	background: transparent;
	border: none;
	display: none;
	position: absolute;
	z-index: 999;
	width: auto;
	height: auto;
	max-width: 300px;
}

.ui-typeahead {
	position: absolute;
	opacity: 0.99;
	white-space: nowrap;
	overflow: hidden;
}

	.ui-typeahead .group-list a {
		display: block;
		padding: 4px 8px;
	}

		.ui-typeahead .group-list a:hover,
		.ui-typeahead .group-list a.item-active {
			color: #fff;
		}

		.ui-typeahead .group-list a em {
			font-style: normal;
			border-bottom: 1px dotted;
		}

		.ui-typeahead .group-list a .desc {
			font-size: 11px;
		}

	.ui-typeahead .group-title {
		display: block;
		font-weight: bold;
		padding: 4px 8px;
	}

.ui-typeahead-ghost .input {
	position: absolute;
	top: 0;
	left: 0;
}

.ui-typeahead-ghost .input-ghost {
	color: #707070;
}

.ui-typeahead .icon {
	float: left;
	margin-right: 8px;
}

.ui-typeahead .icon-desc {
	margin-top: 3px;
}

.ui-typeahead .group-url .icon-desc .desc,
.ui-typeahead .group-product .icon-desc .desc {
	display: block;
	white-space: normal;
	padding-left: 46px;
}

.ui-typeahead .group-url .icon-desc .title,
.ui-typeahead .group-product .icon-desc .title {
	white-space: pre-wrap;
}

.ui-typeahead .group-url .desc,
.ui-typeahead .group-product .desc {
	display: block;
	white-space: pre-wrap;
}
