.item {
	width:70px;
	height:70px;
}

.item a {
	background-image:url(../../../images/misc/item_frame.png);
	width:68px;
	height:68px;
	margin-top:-6px;
	margin-left:-6px;
	position:absolute;
	z-index:999;
	display:block;
}

.socket-prismatic { margin-left: 1px; padding-left: 26px; background: url(../css/images/sockets/socket-prismatic.gif) no-repeat left center }
.socket-hydraulic { margin-left: 1px; padding-left: 26px; background: url(../css/images/sockets/socket-hydraulic.gif) no-repeat left center }
.socket-cogwheel { margin-left: 1px; padding-left: 26px; background: url(../css/images/sockets/socket-cogwheel.gif) no-repeat left center }

#armory_top {
	padding:10px;
}

#armory_top img {
	float:left;
	display:block;
	width:64px;
	height:64px;
	margin-right:15px;
}

#armory_name {
	float:left;
	margin-top:-8px;
}

#armory_top h1 {
	margin:0px;
	padding:0px;
	font-size:40px;
	font-weight:normal;
	overflow:hidden;
	height:60px;
	width:400px;
}

#armory_top h1 a {
	font-size:18px;
}

#armory_top h2 {
	margin:0px;
	padding:0px;
	margin-top:-5px;
	font-size:16px;
	font-weight:normal;
}

#armory_top h2 i {
	opacity:0.7;
}

#armory_bars {
	float:right;
}

#armory_bars div {
	height:22px;
	width:170px;
	color:#fff;
	text-shadow:1px 1px 0px #1e1e1e;
	text-align:center;
	padding-top:8px;
	margin-bottom:10px;
	border-radius:2px;
	-moz-border-radius:2px;
	-webkit-border-radius:2px;
	box-shadow:0px 1px 0px rgba(255,255,255,0.3) inset;
	-moz-box-shadow:0px 1px 0px rgba(255,255,255,0.3) inset;
	-webkit-box-shadow:0px 1px 0px rgba(255,255,255,0.3) inset;
}

#armory_health {
	background-image: linear-gradient(bottom, #2AA728 100%, #199517 0%);
	background-image: -o-linear-gradient(bottom, #2AA728 100%, #199517 0%);
	background-image: -moz-linear-gradient(bottom, #2AA728 100%, #199517 0%);
	background-image: -webkit-linear-gradient(bottom, #2AA728 100%, #199517 0%);
	background-image: -ms-linear-gradient(bottom, #2AA728 100%, #199517 0%);
	background-image: -webkit-gradient(
		linear,
		left bottom,
		left top,
		color-stop(1, #2AA728),
		color-stop(0, #199517));
	background-color:#199517;
	border:1px solid #22600c;
}

#armory_mana {
	background-image: linear-gradient(bottom, #2876a7 100%, #176595 0%);
	background-image: -o-linear-gradient(bottom, #2876a7 100%, #176595 0%);
	background-image: -moz-linear-gradient(bottom, #2876a7 100%, #176595 0%);
	background-image: -webkit-linear-gradient(bottom, #2876a7 100%, #176595 0%);
	background-image: -ms-linear-gradient(bottom, #2876a7 100%, #176595 0%);
	background-image: -webkit-gradient(
		linear,
		left bottom,
		left top,
		color-stop(1, #2876a7),
		color-stop(0, #176595)
	);
	background-color:#176595;
	border:1px solid #0c3e5d;
}

#armory_rage {
	background-image: linear-gradient(bottom, #a72828 100%, #951717 0%);
	background-image: -o-linear-gradient(bottom, #a72828 100%, #951717 0%);
	background-image: -moz-linear-gradient(bottom, #a72828 100%, #951717 0%);
	background-image: -webkit-linear-gradient(bottom, #a72828 100%, #951717 0%);
	background-image: -ms-linear-gradient(bottom, #a72828 100%, #951717 0%);
	background-image: -webkit-gradient(
		linear,
		left bottom,
		left top,
		color-stop(1, #a72828),
		color-stop(0, #951717)
	);
	background-color:#951717;
	border:1px solid #5d0c0c;
}

#armory_focus {
	background-image: linear-gradient(bottom, #863d14 0%, #a74b14 100%);
	background-image: -o-linear-gradient(bottom, #863d14 0%, #a74b14 100%);
	background-image: -moz-linear-gradient(bottom, #863d14 0%, #a74b14 100%);
	background-image: -webkit-linear-gradient(bottom, #863d14 0%, #a74b14 100%);
	background-image: -ms-linear-gradient(bottom, #863d14 0%, #a74b14 100%);
	background-image: -webkit-gradient(
		linear,
		left bottom,
		left top,
		color-stop(0, #863d14),
		color-stop(1, #a74b14)
	);
	background-color:#a74b14;
	border:1px solid #5d300c;
}

#armory_energy {
	background-image: linear-gradient(bottom, #a78828 100%, #957917 0%);
	background-image: -o-linear-gradient(bottom, #a78828 100%, #957917 0%);
	background-image: -moz-linear-gradient(bottom, #a78828 100%, #957917 0%);
	background-image: -webkit-linear-gradient(bottom, #a78828 100%, #957917 0%);
	background-image: -ms-linear-gradient(bottom, #a78828 100%, #957917 0%);
	background-image: -webkit-gradient(
		linear,
		left bottom,
		left top,
		color-stop(1, #a78828),
		color-stop(0, #957917)
	);
	background-color:#957917;
	border:1px solid #5d4b0c;
}

#armory_runic {
	background-image: linear-gradient(bottom, #28a3a7 100%, #179195 0%);
	background-image: -o-linear-gradient(bottom, #28a3a7 100%, #179195 0%);
	background-image: -moz-linear-gradient(bottom, #28a3a7 100%, #179195 0%);
	background-image: -webkit-linear-gradient(bottom, #28a3a7 100%, #179195 0%);
	background-image: -ms-linear-gradient(bottom, #28a3a7 100%, #179195 0%);
	background-image: -webkit-gradient(
		linear,
		left bottom,
		left top,
		color-stop(1, #28a3a7),
		color-stop(0, #179195)
	);
	background-color:#179195;
	border:1px solid #0c5d58;
}

#armory {
	width:698px;
	margin-left:auto;
	margin-right:auto;
	min-height:512px;
	background-position:top center;
	background-repeat:no-repeat;
	position:relative;
}

#armory_stats {
	float:left;
	width:367px;
	height:232px;
	margin-left:58px;
	margin-top:145px;
	text-shadow:1px 1px 0px #000;
	overflow:hidden;
}

#armory_stats_top a {
	color:#ccc;
	font-size:14px;
	margin-right:20px;
	margin-left:20px;
}

#armory_stats a:hover {
	color:#fff;
}

.armory_current_tab {
	font-weight:bold;
	color:#fff !important;
}

#armory_stats section {
	display:none;
	color:#fff;
	margin-top:8px;
}

#armory_stats td {
	padding:7px;
	font-size:14px;
}

#armory_stats table {
	margin-left:auto;
	margin-right:auto;
}

#armory_stats_next a,
.armory_stats_nav a {
	border:1px solid #3a3a3a;
	background-image: linear-gradient(bottom, rgba(200,200,200,0.3) 0%, rgba(255,255,255,0.3) 100%);
	background-image: -o-linear-gradient(bottom, rgba(200,200,200,0.3) 0%, rgba(255,255,255,0.3) 100%);
	background-image: -moz-linear-gradient(bottom, rgba(200,200,200,0.3) 0%, rgba(255,255,255,0.3) 100%);
	background-image: -webkit-linear-gradient(bottom, rgba(200,200,200,0.3) 0%, rgba(255,255,255,0.3) 100%);
	background-image: -ms-linear-gradient(bottom, rgba(200,200,200,0.3) 0%, rgba(255,255,255,0.3) 100%);
	background-image: -webkit-gradient(
		linear,
		left bottom,
		left top,
		color-stop(1, rgba(255,255,255,0.3)),
		color-stop(0, rgba(200,200,200,0.3))
	);
	text-shadow:1px 1px 0px #000;
	box-shadow:0px 1px 0px #a2a2a2 inset;
	-webkit-box-shadow:0px 1px 0px #a2a2a2 inset;
	-moz-box-shadow:0px 1px 0px #a2a2a2 inset;
	color:#fff;
	display: inline-block;
	padding: 5px 10px;
	border-radius:5px;
	font-size:14px;
}

#armory_stats_next a:active,
.armory_stats_nav a:active {
	box-shadow:0px 0px 5px #151515 inset;
	-webkit-box-shadow:0px 0px 5px #151515 inset;
	-moz-box-shadow:0px 0px 5px #151515 inset;
	color:#c1c1c1;
}

#armory_stats_next,
.armory_stats_nav {
	margin-top:10px;
}

.armory_stats_nav {
	display: flex;
	justify-content: center;
	gap: 10px;
	flex-wrap: wrap;
}

.character-container-modern #armory_stats_top a {
	display: inline-flex;
	align-items: center;
	height: 20px;
	padding: 0 8px;
	margin: 0;
	font-size: 11px;
	line-height: 20px;
	border-radius: 8px;
}

.character-container-modern #tab_stats table {
	min-height: 150px;
}

.character-container-modern #attributes_wrapper {
	height: 194px !important;
}

.character-container-modern #armory_stats {
	height: 232px;
	overflow: hidden;
}

.character-container-modern #armory_stats_top {
	display: flex;
	justify-content: center;
	align-items: center;
	gap: 8px;
	margin-top: -6px;
	margin-bottom: 6px;
}

.character-container-modern #armory_stats td {
	padding: 5px 8px;
	font-size: 13px;
}

#armory_stats td:first-child {
	color:#fff;
}

#armory_stats td:nth-child(2) {
	text-align:right;
}

#armory_left {
	float:left;
	margin-left:40px;
	margin-top:15px;
	width:68px;
}

#armory_right {
	float:left;
	margin-top:15px;
	margin-left:65px;
	width:70px;
}

#armory_bottom .item {
	float:left;
}

#armory_bottom {
	clear:both;
	margin-left:auto;
	margin-right:auto;
	width:222px;
	height:70px;
}

#armory_inventory_buttons {
	position:absolute;
	right:25px;
	bottom:25px;
	z-index:1000;
}

.armory_inventory_btn {
	display:inline-block;
	margin-left:8px;
	padding:6px 10px;
	font-size:12px;
	color:#b38e3f;
	text-decoration:none;
	background:rgba(0,0,0,0.45);
	border:1px solid rgba(179,142,63,0.45);
	border-radius:4px;
	box-shadow: inset 0 0 0 1px rgba(255,255,255,0.02), 0 0 4px rgba(0,0,0,0.6);
}

.armory_inventory_btn:before {
	content:"";
	display:inline-block;
	width:16px;
	height:16px;
	margin-right:6px;
	vertical-align:-3px;
	background-size:16px 16px;
	background-repeat:no-repeat;
}

.armory_inventory_btn.inv_bags:before {
	background-image:url(https://wow.zamimg.com/images/wow/icons/small/inv_misc_bag_08.jpg);
}

.armory_inventory_btn.inv_bank:before {
	background-image:url(https://wow.zamimg.com/images/wow/icons/small/achievement_guildperk_mobilebanking.jpg);
}

.armory_inventory_btn:hover {
	color:#f1d17a;
	border-color:rgba(241,209,122,0.7);
	background:rgba(0,0,0,0.55);
}

#inventory_viewer.popup {
	width: 920px;
	max-width: 92vw;
	margin-left: -460px;
	top: 8%;
	background-color: rgba(0,0,0,0.85);
	border: 1px solid rgba(179,142,63,0.35);
	color: #d8c79a;
}

@media (max-width: 820px) {
	#inventory_viewer.popup {
		width: 92vw;
		margin-left: -46vw;
		top: 6%;
	}
}

#inventory_viewer_body {
	max-height: 70vh;
	overflow: auto;
}

#inventory_viewer.popup h1 {
	color: #f1d17a;
	text-shadow: 0 1px 0 #000;
}

#inv_tabs {
	text-align: center;
	margin-bottom: 10px;
}

#inv_tabs a {
	display: inline-block;
	float: none;
	padding: 7px 14px;
	margin: 0 6px;
	border-radius: 3px;
	background: rgba(0,0,0,0.45);
	border: 1px solid rgba(179,142,63,0.35);
	color: #b38e3f;
	text-shadow: none;
}

#inv_nav {
	text-align: center;
	margin-bottom: 10px;
	color: #666;
	font-size: 12px;
}

#inv_nav a {
	display: inline-block;
	float: none;
	padding: 6px 10px;
	margin: 0 8px;
	border-radius: 3px;
	background: rgba(0,0,0,0.15);
	border: 1px solid rgba(0,0,0,0.2);
	color: #444;
}

#inv_grid {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	gap: 8px;
	padding: 12px;
	max-height: 56vh;
	overflow: auto;
	background: rgba(0,0,0,0.25);
	border: 1px solid rgba(179,142,63,0.20);
	border-radius: 6px;
}

#inv_grid .inv_cell {
	width: 48px;
	height: 48px;
	display: flex;
	align-items: center;
	justify-content: center;
}

#inv_grid .item {
	width: 48px;
	height: 48px;
	position: relative;
}

#inv_grid .item a {
	position: absolute;
	left: 0;
	top: 0;
	width: 100%;
	height: 100%;
	z-index: 2;
	display: block;
	background: none !important;
	background-image: none !important;
	background-repeat: no-repeat !important;
	background-position: center !important;
	background-size: 100% 100% !important;
	margin: 0 !important;
}

#inv_grid .item img {
	width: 48px;
	height: 48px;
	border-radius: 6px;
	border: 2px solid rgba(139, 119, 101, 0.55);
	background: rgba(45, 38, 29, 0.85);
	box-shadow: 0 2px 8px rgba(0, 0, 0, 0.35);
	display: block;
}

#inv_grid .inv_cell:hover img {
	border-color: rgba(255, 215, 0, 0.65);
	box-shadow: 0 4px 12px rgba(0, 0, 0, 0.45);
}

#inv_grid::-webkit-scrollbar {
	width: 10px;
}

#inv_grid::-webkit-scrollbar-track {
	background: rgba(0,0,0,0.25);
	border-radius: 10px;
}

#inv_grid::-webkit-scrollbar-thumb {
	background: rgba(139, 69, 19, 0.55);
	border: 1px solid rgba(255, 215, 0, 0.12);
	border-radius: 10px;
}

#inv_grid::-webkit-scrollbar-thumb:hover {
	background: rgba(139, 69, 19, 0.75);
}

#tab_armory_1, #tab_armory_2, #tab_armory_3 {
	width:367px;
}

/* Professions & Activity */

#armory_mid_info {
	font-size: 16px;
	display:block;
	color:#b38e3f;
	}
	#armory_mid_info h3 {
	font-size: 16px;
	color: #B38E3F;
	margin: 10px 0 0 0;
	}
	
	#armory_mid_info .professions {
	float: left;
	margin-left: 25px;
	}
	#armory_mid_info .professions .profession-empty {
		display:  block;
		width: 284px;
		height: 24px;
		color: #434749;
		background: rgba(153, 153, 153, 0.07);
		box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .02), 0 0 4px rgba(0, 0, 0, .6);
		-moz-border-radius: 3px; 
		-webkit-border-radius: 3px; 
		border-radius: 3px;
		margin: 8px 0 0 0;
		font-size: 12px;
		line-height: 24px;
		text-align: center;
		}
	
	/* Progress bar */
	
	.profile-progress {
		-moz-border-radius: 3px; 
		-webkit-border-radius: 3px; 
		border-radius: 3px; 
		color: white; 
		background: rgba(255,255,255,.1); 
		width: 284px; height: 24px;
		margin: 8px 0 0 0; 
		text-align: left;
		position: relative;
		}
		.profile-progress .bar {
			-moz-border-radius: 3px;
			-webkit-border-radius: 3px;
			border-radius: 3px; 
			display: block; 
			height: 24px; 
			z-index: 1; 
			left: 0; 
			top: 0; 
			position: absolute; 
			-moz-border-radius-bottomright: 0; 
			-webkit-border-bottom-right-radius: 0;
			border-bottom-right-radius: 0;
			-moz-border-radius-topright: 0; 
			-webkit-border-top-right-radius: 0; 
			border-top-right-radius: 0;
			
			background: rgb(34,102,20);
			background: -moz-linear-gradient(left,  rgba(34,102,20,1) 0%, rgba(42,186,47,1) 50%, rgba(34,102,20,1) 100%);
			background: -webkit-gradient(linear, left top, right top, color-stop(0%,rgba(34,102,20,1)), color-stop(50%,rgba(42,186,47,1)), color-stop(100%,rgba(34,102,20,1)));
			background: -webkit-linear-gradient(left,  rgba(34,102,20,1) 0%,rgba(42,186,47,1) 50%,rgba(34,102,20,1) 100%);
			background: -o-linear-gradient(left,  rgba(34,102,20,1) 0%,rgba(42,186,47,1) 50%,rgba(34,102,20,1) 100%);
			background: -ms-linear-gradient(left,  rgba(34,102,20,1) 0%,rgba(42,186,47,1) 50%,rgba(34,102,20,1) 100%);
			background: linear-gradient(to right,  rgba(34,102,20,1) 0%,rgba(42,186,47,1) 50%,rgba(34,102,20,1) 100%);
			filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#226614', endColorstr='#226614',GradientType=1 );

			}
		.profile-progress.completed .bar {
			-moz-border-radius: inherit;
			-webkit-border-radius: inherit;
			border-radius: inherit;
			}
		.profile-progress .bar-contents {
			position: relative;
			top: 0;
			left: 0;
			font-size: 12px;
			line-height: 24px;
			z-index: 5;
			text-shadow: #000 1px 1px 1px ;
			}
	
	.icon-frame { margin-right: 2px; display: inline-block; overflow: hidden; padding: 1px; background-color: #000; background-position: 1px 1px; background-repeat: no-repeat; -moz-border-radius: 3px; -webkit-border-radius: 3px; border-radius: 3px; border: 1px solid #434445; border-bottom-color: #2f3032; border-top-color: #b1b2b4; }
	.icon-frame img { display: block; }		
	.icon-frame.frame-12 { height: 16px; width: 16px; }
	.icon-frame.frame-56 { height: 56px; width: 56px; -moz-box-shadow: #000 0 0 10px; -webkit-box-shadow: #000 0 0 10px; box-shadow: #000 0 0 10px; }
	
	/* Achievement Tooltips */
	
	.wiki-tooltip { position: relative; padding: 3px; max-width: 400px; }
	.wiki-tooltip .frame-56 { position: absolute; top: -8px; left: -71px; }
	.wiki-tooltip h3 { font-size: 16px; font-weight: normal; } /* title of the tooltip */
	.wiki-tooltip h3 span { float: right; margin-left: 5px; }
	
	.color-tooltip-yellow { color: #ffd100 !important; }
	.color-tooltip-red { color: #f00 !important; }
	.color-tooltip-green { color: #0f0 !important; }
	.color-tooltip-blue { color: #71D5FF !important; }
	.color-tooltip-beige { color: #FFFF98 !important; }
	
	/* Professions */
	
	.professions .profession {
		position: relative;
		}
		.professions .profession-details {
			position: absolute;
			width: 284px; height: 24px;
			display: block;
			left: 0;
			top: 0;
			text-shadow: 1px 1px 1px #000;
			}
			.professions .profession-details:hover {
				background-color: rgba(255, 255, 255, 0.15);
				-moz-border-radius: 3px;
				-webkit-border-radius: 3px;
				border-radius: 3px;
				}
			.professions .profession-details span {
				float: left;
				color: white;
				}
			.professions .icon {
				margin: 2px 0 0 2px;
				}
			.professions .name {
				line-height: 24px;
				font-size: 11px;
				margin-left: 5px;
				}
			.professions .value {
				line-height: 24px;
				padding-right: 6px;
				font-family: 'Arial Black', Verdana, Arial, sans-serif;
				font-weight: bold;
				float: right !important;
				}
	
	#armory_mid_info .recent-activity {
		float: left;
		width: 380px;
		margin-left: 0px;
		}
		.recent-activity #inventory_viewer_open {
		display: none;
		}
		.recent-activity .achievements {
			list-style: none;
			margin-top: 5px;
			background: rgba(153,153,153,0.07);
			border-radius: 3px;
			box-shadow: inset 0 0 0 1px rgba(255,255,255,.02), 0 0 4px rgba(0,0,0,.6);
			padding: 10px;
			}
			.recent-activity #view-all {
			text-align: center;
			font-size: 14px;
			padding-top: 10px;
			width: 100%;
			}
			.recent-activity #view-all a {
			display: inline-block;
			padding: 6px 12px;
			color: #f1d17a;
			text-decoration: none;
			background: rgba(0,0,0,0.45);
			border: 1px solid rgba(179,142,63,0.45);
			border-radius: 4px;
			box-shadow: inset 0 0 0 1px rgba(255,255,255,0.02), 0 0 4px rgba(0,0,0,0.6);
			}
			.recent-activity #view-all a:hover {
			color: #f1d17a;
			border-color: rgba(241,209,122,0.7);
			background: rgba(0,0,0,0.55);
			}
			.achievements #no-records {
			color: #434749;
			font-size: 12px;
			text-align: center;
			}
			.achievements .achievement {
				margin-bottom: 10px;
				}
				.achievement #icon {
				float: left;
				padding-top: 3px;
				}
				.achievement #info {
				float: left;
				color: #434749;
				font-size: 12px;
				width: 315px;
				margin-left: 5px;
				text-shadow: 0 0 3px rgba(0,0,0,1);
				}
				.achievement #date {
				color: #333;
				font-size: 11px;
				}
				.achievements .achievement a {
					color: #999;
					}
					.achievements .achievement a:hover {
					color: #A07332;
					}
			.achievements .achievement:last-child {
			margin: 0;
			}
		
/* Talents */

.talents-specs {
	display: block;
	height: 60px;
	z-index: 1;
	}
	.talents-spec {
		display: block;
		float: left;
		padding: 10px;
		margin: 0 16px 0 0;
		height: 40px;
		background: rgba(153,153,153,0.05);
		border-top-left-radius: 5px;
		border-top-right-radius: 5px;
		/*box-shadow: inset 0 0 0 1px rgba(255,255,255,.02), 0 0 4px rgba(0,0,0,.6);*/
		}
		.talents-spec:hover {
		box-shadow:inset 0 2px 1px rgba(255,255,255,.05);
		}
		.talents-spec:hover div .talents-spec-info span#title {
		color: #B38E3F;
		}
		.talents-spec:hover div .talents-spec-info span#points {
		color: #3D4346;
		}
		.talents-spec-active {
			background: rgba(153,153,153,0.07);
			}
			.talents-spec-active div .talents-spec-info span#title {
			color: #fff; 
			}
		.talents-spec-icon {
			float: left;
			}
			.talents-spec-icon img {
			box-shadow: inset 0 0 0 1px rgba(255,255,255,.02), 0 0 4px rgba(0,0,0,.6);
			}
		.talents-spec-info {
			float: left;
			padding-left: 10px;
			min-width: 100px;
			}
			.talents-spec-info #title {
			font-size: 16px;
			line-height: 20px;
			font-weight: bold;
			color: #999;
			}
		.talents-spec-char-selected {
		margin-left: 20px;
		float: left;
		width: 20px; height: 40px;
		background-image: url(../css/images/talents-check.gif);
		background-repeat: no-repeat;
		background-position: center;
		}
			
.talents {
	display: block;
	/*box-shadow: inset 0 0 0 1px rgba(255,255,255,.02), 0 0 4px rgba(0,0,0,.6);*/
	border-radius: 5px;
	border-top-left-radius: 0;
	overflow: hidden;
	z-index: 2;
	background: rgba(153,153,153,0.07);
	padding: 0 0 23px 0;
	}
	.talents h3 {
	padding: 20px 0 10px 30px;
	}
	.talents-glyphs {
		background: rgba(0,0,0,.8);
		border-radius: 3px;
		box-shadow: inset 0 0 0 1px rgba(255,255,255,.06), 0 0 4px rgba(0,0,0,.6);
		padding: 20px;
		margin: 0 20px 0 20px;
		}
		.talents-glyphs .iconsmall {
		margin: 0;
		}
		.talents-glyphs-column {
			float: left;
			}
			.talents-glyphs-list {
			width: 206px;
			}
				.talents-glyphs-glyph .iconsmall {
				float: left;
				}
				.talents-glyphs-glyph #glyph-name {
				display:block;
				float: left;
				font-size: 12px;
				padding: 4px 0 0 3px;
				}
	.talents-body {
		height:583px;
		}
		.talents-expansion-cata .talents-body {
		height: 385px;
		}
		.talents-tree {
			position: relative;
			width: 204px;
			height: 583px;
			border-radius: 3px;
			margin-left: 23px;
			}
			.talents-expansion-cata .talents-tree {
			height: 383px;
			}
			.talents-tree-bg {
			display: block;
			position: absolute;
			width: 204px;
			height: 554px;
			border-radius: 3px;
			background-repeat: no-repeat;
			opacity: 0.3;
			top: 29px;
			box-shadow: inset 0 0 0 1px rgba(255,255,255,.06), 0 0 4px rgba(0,0,0,.6);
			}
			.talents-expansion-cata .talents-tree-bg {
			height: 354px;
			}
			.talents-tree-title {
				height:24px;
				line-height:24px;
				overflow:hidden;
				padding:0;
				margin:0 auto 5px auto;
				text-align:center;
				background: rgba(0,0,0,.8);
				position: relative;
				display: block;
				border-radius: 3px;
				box-shadow: inset 0 0 0 1px rgba(255,255,255,.06), 0 0 4px rgba(0,0,0,.6);
				}
				.talents-tree-title img {
				display: block;
				position: absolute;
				margin-top: 2px;
				margin-left: 2px;
				border-radius: 3px;
				}
			
			/* Talent Trees Backgrounds */
			
			.talents-tree-bg {
			display: block;
			position: absolute;
			width: 204px;
			height: 554px;
			border-radius: 3px;
			background-repeat: no-repeat;
			opacity: 0.4;
			}
	
			.deathknight-1 { background-image: url(../css/images/backgrounds/deathknight_1.jpg); }
			.deathknight-2 { background-image: url(../css/images/backgrounds/deathknight_2.jpg); }
			.deathknight-3 { background-image: url(../css/images/backgrounds/deathknight_3.jpg); }
	
			.druid-1 { background-image: url(../css/images/backgrounds/druid_1.jpg); }
			.druid-2 { background-image: url(../css/images/backgrounds/druid_2.jpg); }
			.druid-3 { background-image: url(../css/images/backgrounds/druid_3.jpg); }
	
			.hunter-1 { background-image: url(../css/images/backgrounds/hunter_1.jpg); }
			.hunter-2 { background-image: url(../css/images/backgrounds/hunter_2.jpg); }
			.hunter-3 { background-image: url(../css/images/backgrounds/hunter_3.jpg); }
	
			.mage-1 { background-image: url(../css/images/backgrounds/mage_1.jpg); }
			.mage-2 { background-image: url(../css/images/backgrounds/mage_2.jpg); }
			.mage-3 { background-image: url(../css/images/backgrounds/mage_3.jpg); }
	
			.paladin-1 { background-image: url(../css/images/backgrounds/paladin_1.jpg); }
			.paladin-2 { background-image: url(../css/images/backgrounds/paladin_2.jpg); }
			.paladin-3 { background-image: url(../css/images/backgrounds/paladin_3.jpg); }
	
			.priest-1 { background-image: url(../css/images/backgrounds/priest_1.jpg); }
			.priest-2 { background-image: url(../css/images/backgrounds/priest_2.jpg); }
			.priest-3 { background-image: url(../css/images/backgrounds/priest_3.jpg); }
	
			.rogue-1 { background-image: url(../css/images/backgrounds/rogue_1.jpg); }
			.rogue-2 { background-image: url(../css/images/backgrounds/rogue_2.jpg); }
			.rogue-3 { background-image: url(../css/images/backgrounds/rogue_3.jpg); }
	
			.shaman-1 { background-image: url(../css/images/backgrounds/shaman_1.jpg); }
			.shaman-2 { background-image: url(../css/images/backgrounds/shaman_2.jpg); }
			.shaman-3 { background-image: url(../css/images/backgrounds/shaman_3.jpg); }
	
			.warlock-1 { background-image: url(../css/images/backgrounds/warlock_1.jpg); }
			.warlock-2 { background-image: url(../css/images/backgrounds/warlock_2.jpg); }
			.warlock-3 { background-image: url(../css/images/backgrounds/warlock_3.jpg); }
	
			.warrior-1 { background-image: url(../css/images/backgrounds/warrior_1.jpg); }
			.warrior-2 { background-image: url(../css/images/backgrounds/warrior_2.jpg); }
			.warrior-3 { background-image: url(../css/images/backgrounds/warrior_3.jpg); }
			
			/* End.Talent Trees Backgrounds */
			
			.talents-tree table {
			opacity: 1;
			}
			.talents-tree table tr td {
			width: 50px;
			height: 50px;
			}
			
/* Icons */

.iconsmall {
	margin: 0 auto;
	width: 26px;
	height: 26px;
	position: relative;
	}
	.iconsmall ins {
		width: 18px;
		height: 18px;
		display: block;
		position: absolute;
		left: 4px;
		top: 4px;
		z-index: 5;
		background-repeat: no-repeat;
	}
	.iconsmall del {
		width: 26px;
		height: 26px;
		display: block;
		position: absolute;
		left: 0;
		top: 0;
		z-index: 10;
		background-image: url(//wowimg.zamimg.com/images/Icon/small/border/default.png);
		background-repeat: no-repeat;
	}
	.iconsmall a {
		display: block; 
		position: absolute;
		left: 3px;
		top: 3px;
		z-index: 13;	
	}
	.iconsmall a { width: 20px; height: 20px; background: url(//wowimg.zamimg.com/images/Icon/small/hilite/default.png) no-repeat 20px 0; }
	.iconsmall a:hover {
		background-position: 0 0;
	}
	
.iconmedium {
	margin: 0 auto;
	width: 44px;
	height: 44px;
	position: relative;
	}
	.iconmedium ins {
		width: 36px;
		height: 36px;
		display: block;
		position: absolute;
		left: 4px;
		top: 4px;
		z-index: 5;
		background-repeat: no-repeat;
	}
	.iconmedium del {
		width: 44px;
		height: 44px;
		display: block;
		position: absolute;
		left: 0;
		top: 0;
		z-index: 10;
		background-image: url(//wowimg.zamimg.com/images/Icon/medium/border/default.png);
		background-repeat: no-repeat;
	}
	.iconmedium a {
		display: block; 
		position: absolute;
		left: 3px;
		top: 3px;
		z-index: 13;	
	}
	.iconmedium a { width: 38px; height: 38px; background: url(//wowimg.zamimg.com/images/Icon/medium/hilite/default.png) no-repeat 38px 0; }
	.iconmedium a:hover {
		background-position: 0 0;
	}
	.iconmedium div.icon-border {
		position:absolute;
		z-index:11;
		left:1px;
		top:1px;
		width:42px;
		height:42px;
		background:url(../css/images/border.gif) no-repeat;
		}
		.iconmedium div.icon-border#active {
		background-position: -84px 0px;
		}
		.iconmedium div.icon-border#inactive {
		background: none;
		}
		.iconmedium div.icon-border#maxed {
		background-position: -42px 0px;
		}
	.iconmedium div.icon-bubble {
		position:absolute;
		z-index:14;
		width:22px;
		height:23px;
		left:30px;
		top:29px;
		background:url(../css/images/bubble.png) no-repeat;
		padding:2px 0 0;
		font-family:Verdana,sans-serif;
		font-size:12px;
		text-align:center;
		cursor:default;
		}
		.iconmedium div.icon-bubble#active {
		visibility: visible;
		color: rgb(23, 253, 23);
		}
		.iconmedium div.icon-bubble#inactive {
		visibility: hidden;
		}
		.iconmedium div.icon-bubble#maxed {
		visibility: visible;
		color: rgb(231, 186, 0);
		}
	.iconmedium .overlay {
		width: 36px;
		height: 36px;
		display: block;
		position: absolute;
		left: 4px;
		top: 4px;
		z-index: 12;
		background: rgba(0,0,0,.6);
	}
	.iconmedium .talent-dependency {
		display: block;
		position: absolute;
		z-index: 15;
		}
		.iconmedium .talent-dependency-down {
			top: 42px;
			left: 15px;
			width: 15px;
			background:url(../css/images/arrows/down.png) bottom no-repeat;
			}
			.iconmedium .talent-dependency-down#maxed {
			background:url(../css/images/arrows/down2.png) bottom no-repeat;
			}
		.iconmedium .talent-dependency-left {
			top: 15px;
			left: -14px;
			height: 15px;
			width: 15px;
			background:url(../css/images/arrows/left.png) left no-repeat;
			}
			.iconmedium .talent-dependency-left#maxed {
			background:url(../css/images/arrows/left2.png) left no-repeat;
			}
		.iconmedium .talent-dependency-right {
			top: 15px;
			left: 43px;
			height: 15px;
			width: 15px;
			background:url(../css/images/arrows/right.png) right no-repeat;
			}
			.iconmedium .talent-dependency-right#maxed {
			background:url(../css/images/arrows/right2.png) right no-repeat;
			}
		.iconmedium .talent-dependency-leftdown {
			top: 15px;
			left: -36px;
			height: 15px;
			width: 36px;
			background:url(../css/images/arrows/leftdown.png) left no-repeat;
			}
			.iconmedium .talent-dependency-leftdown#maxed {
			background:url(../css/images/arrows/leftdown2.png) left no-repeat;
			}
		.iconmedium .talent-dependency-rightdown {
			top: 15px;
			left: 43px;
			height: 15px;
			width: 36px;
			background:url(../css/images/arrows/rightdown.png) right no-repeat;
			}
			.iconmedium .talent-dependency-rightdown#maxed {
			background:url(../css/images/arrows/rightdown2.png) right no-repeat;
			}
			.iconmedium .talent-dependency-rightdown .talent-dependency-second {
			float: right;
			}
		.iconmedium .talent-dependency-leftdown .talent-dependency-second, .iconmedium .talent-dependency-rightdown .talent-dependency-second {
			margin-top: 15px;
			width: 15px;
			background:url(../css/images/arrows/down.png) bottom no-repeat;
			}
			.iconmedium .talent-dependency-leftdown .talent-dependency-second#maxed, .iconmedium .talent-dependency-rightdown .talent-dependency-second#maxed {
			background:url(../css/images/arrows/down2.png) bottom no-repeat;
			}

#armory_title h3 {
	font-size: 22px;
	display:block;
	padding:0 0 10px 10px;
	box-shadow: 0 2px 0 rgba(255,255,255,.12);
	color:#b38e3f;
}

#armory_arena_teams {
	margin-top: 15px;
	}
	.armory_arena_box {
		float: left;
		border-radius: 5px;
		width: 220px;
		margin-right: 15px;
		box-shadow: inset 0 0 0 1px rgba(255,255,255,.02), 0 0 4px rgba(0,0,0,.6);
		}
		.armory_arena_box:nth-child(1) {
		margin-left: 8px;
		}
		.armory_arena_box:nth-child(3) {
		margin: 0;
		}
		.arena_box_head {
			padding: 10px 20px 10px 20px;
			background: rgba(153,153,153,0.1);
			border-top-left-radius: 5px;
			border-top-right-radius: 5px;
			box-shadow:0 2px 1px rgba(0,0,0,.3), inset 0 -1px 0 rgba(255,255,255,.01);
			height: 117px;
			}
			.armory_arena_box#inactive .arena_box_head {
				background: rgba(153,153,153,0.06);
				}
				.armory_arena_box#inactive .arena_box_head #team-type {
				color: #403c35;
				}
			.arena_box_head #team-type {
			font-size: 40px;
			margin: 0;
			line-height: normal;
			font-family:"Arial Black", Arial, sans-serif;
			font-weight:900;
			letter-spacing: -0.1em;
			color: #c3b6a1;
			}
			.arena_box_head #player-rating {
				margin-bottom: 8px;
				}
				.arena_box_head #player-rating a {
				font-size: 20px;
				font-family:"Arial Black", Arial, sans-serif;
				font-weight:900;
				line-height:29px;
				color: #9A814B;
				border-bottom: 1px dotted #9A814B;
				cursor: help;
				}
			.arena_box_head #player-games {
				margin-bottom: 6px;
				font: normal 12px/1.5 Arial, Verdana, sans-serif;
				}
				.arena_box_head #player-games #player-wins {
				color: #6a9a1e;
				}
				.arena_box_head #player-games #player-loses {
				color: #9a1e1e;
				}
				.arena_box_head #player-games #player-win-ratio {
				color: #434749;
				padding-left: 4px;
				}
		.arena_box_body {
			background: rgba(153,153,153,0.05);
			padding: 10px 20px 10px 20px;
			text-align:center;
			border-bottom-left-radius: 5px;
			border-bottom-right-radius: 5px;
			text-align: left;
			height: 70px;
			}
			.armory_arena_box#inactive .arena_box_body {
			background: rgba(153,153,153,0.02);
			}
			.arena_box_body #team-name {
			color: #C3B6A1;
			font-size: 14px;
			}
			.arena_box_body #team-stats {
				margin-bottom: 6px;
				}
				.arena_box_body #team-stats #team-rating a {
				font-family: Arial, Helvetica, sans-serif;
				font-size: 14px;
				font-weight: bold;
				color: #9A814B;
				border-bottom: 1px dotted #9A814B;
				cursor: help;
				}
				.arena_box_body #team-stats #team-rank a {
				color: #9A814B;
				font-size: 14px;
				font-weight: bold;
				cursor: help;
				}
			.arena_box_body #team-members {
				margin-bottom: 4px;
				}
				.arena_box_body #team-members a {
				float: left;
				margin-right: 5px;
				margin-bottom: 5px;
				}
				.arena_box_body #team-members a:hover {
				box-shadow: 0 0 5px 0px rgba(160,115,50,.5);
				}

/* faction */
.color-tooltip-alliance { color: #247FAA; }
.color-tooltip-horde { color: #b30000; }

/* class */
.color-c1,  .color-c1 a { color: #c69b6d !important; } /* warrior */
.color-c2,  .color-c2 a { color: #f48cba !important; } /* paladin */
.color-c3,  .color-c3 a, .color-g2 { color: #aad372 !important; } /* hunter */
.color-c4,  .color-c4 a, .color-g1 { color: #fff468 !important; } /* rogue */
.color-c5,  .color-c5 a { color: #f0ebe0 !important; } /* priest */
.color-c6,  .color-c6 a { color: #c41e3b !important; } /* death knight */
.color-c7,  .color-c7 a { color: #2359ff !important; } /* shaman */
.color-c8,  .color-c8 a, .color-g3 { color: #68ccef !important; } /* mage */
.color-c9,  .color-c9 a { color: #9382c9 !important; } /* warlock */
.color-c10, .color-c10 a { color: #00ffba !important; } /* monk */
.color-c11, .color-c11 a, .color-g4 { color: #ff7c0a !important; } /* druid */

.meta-socket-requires {
	padding-left: 27px;
}

.character-container-modern {
	max-width: 1100px;
	margin: 0 auto;
	padding: 14px;
	background: rgba(0,0,0,0.22);
	border: 2px solid rgba(139, 119, 101, 0.55);
	border-radius: 12px;
	box-shadow: 0 8px 30px rgba(0,0,0,0.45);
}

.character-container-modern #armory_top {
	display: flex;
	align-items: center;
	gap: 12px;
	flex-wrap: wrap;
	padding: 12px;
	border-radius: 10px;
	background: rgba(0,0,0,0.20);
	border: 1px solid rgba(139, 119, 101, 0.35);
}

.character-container-modern #armory_top img {
	float: none;
	display: block;
	width: 64px;
	height: 64px;
	margin-right: 0;
	order: 1;
}

.character-container-modern #armory_name {
	float: none;
	margin-top: 0;
	order: 2;
}

.character-container-modern #armory_top h1 {
	width: auto;
	height: auto;
	font-size: 28px;
	line-height: 1.1;
}

.character-container-modern #armory_top h2 {
	font-size: 14px;
}

.character-container-modern #armory_bars {
	float: none;
	margin-left: auto;
	order: 3;
	display: flex;
	flex-direction: column;
	gap: 10px;
}

.character-container-modern #armory_top .clear {
	display: none;
}

.character-container-modern #armory {
	width: 698px;
	max-width: 100%;
	display: block;
	float: none;
	margin: 14px auto 0 auto;
	margin-left: auto !important;
	margin-right: auto !important;
	border-radius: 12px;
	border: 2px solid rgba(139, 119, 101, 0.45);
	box-shadow: 0 8px 26px rgba(0,0,0,0.45);
	overflow: hidden;
}

.character-container-modern #armory_mid_info,
.character-container-modern #armory_talents,
.character-container-modern #armory_title,
.character-container-modern #armory_arena_teams {
	margin-top: 16px;
	padding: 12px;
	border-radius: 12px;
	background: rgba(0,0,0,0.20);
	border: 1px solid rgba(139, 119, 101, 0.35);
}

.character-container-modern #armory_mid_info h3,
.character-container-modern #armory_talents h3,
.character-container-modern #armory_title h3 {
	color: #ffd100;
	margin: 0 0 10px 0;
	text-transform: uppercase;
	letter-spacing: 0.03em;
}

.character-container-modern #armory_stats_top a {
	display: inline-block;
	padding: 8px 12px;
	margin: 0 6px;
	border-radius: 10px;
	border: 1px solid rgba(255, 209, 0, 0.25);
	background: rgba(255, 209, 0, 0.08);
	color: #ffd100;
	text-shadow: none;
}

.character-container-modern .armory_current_tab {
	background: rgba(255, 209, 0, 0.18) !important;
	border-color: rgba(255, 209, 0, 0.45) !important;
	color: #ffd100 !important;
}

.character-container-modern #achievements_viewer {
	width: 920px;
	max-width: 92vw;
	margin-left: 0;
	left: 50%;
	transform: translateX(-50%);
	top: 10%;
}

.character-container-modern #achievements_viewer_body {
	box-sizing: border-box;
	overflow: hidden;
	padding: 12px;
}

.character-container-modern #achievements_viewer_body #achv_wrap {
	display: flex;
	gap: 12px;
	align-items: stretch;
	height: 72vh;
	max-height: 520px;
	min-height: 360px;
 }

.character-container-modern #achievements_viewer_body #achv_progress {
	margin: 0 0 10px 0;
}

.character-container-modern #achievements_viewer_body .achv_progress_bar {
	position: relative;
	height: 22px;
	border-radius: 10px;
	background: rgba(0, 0, 0, 0.30);
	border: 1px solid #8B4513;
	overflow: hidden;
}

.character-container-modern #achievements_viewer_body #achv_progress_fill {
	position: absolute;
	left: 0;
	top: 0;
	height: 100%;
	width: 0%;
	background: linear-gradient(90deg, rgba(40, 140, 255, 0.85), rgba(35, 210, 255, 0.75));
	box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.08);
	transition: width 0.25s ease;
}

.character-container-modern #achievements_viewer_body #achv_progress_text {
	position: absolute;
	left: 0;
	top: 0;
	width: 100%;
	height: 100%;
	line-height: 22px;
	text-align: center;
	font-size: 12px;
	font-weight: bold;
	color: #e8d2b0;
	text-shadow: 0 1px 0 rgba(0,0,0,0.65);
}

.character-container-modern #achievements_viewer_body #achv_cats {
	flex: 0 0 34%;
	max-width: 34%;
	background: rgba(0, 0, 0, 0.30);
	border: 1px solid #8B4513;
	border-radius: 10px;
	padding: 12px;
	height: 100%;
	overflow-y: auto;
	min-height: 0;
}

.character-container-modern #achievements_viewer_body #achv_list {
	flex: 1 1 auto;
	min-width: 0;
	height: 100%;
	overflow-y: auto;
	min-height: 0;
}

.character-container-modern #achievements_viewer_body ul {
	margin: 0;
	padding: 0;
	list-style: none;
}

.character-container-modern #achievements_viewer_body a {
	float: none;
	width: auto;
	margin: 0;
	padding: 0;
}

.character-container-modern #achievements_viewer_body li {
	margin: 0 0 6px 0;
}

.character-container-modern #achievements_viewer_body .achv_cat {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 10px;
	text-decoration: none;
	padding: 10px 12px;
	border-radius: 10px;
	background: rgba(0, 0, 0, 0.30);
	border: 1px solid rgba(139, 69, 19, 0.55);
	transition: all 0.3s ease;
}

.character-container-modern #achievements_viewer_body .achv_cat.active {
	background: rgba(255, 209, 0, 0.12);
	border-color: rgba(255, 209, 0, 0.35);
}

.character-container-modern #achievements_viewer_body #achv_list {
	background: rgba(0,0,0,0.15);
	border: 1px solid rgba(139, 119, 101, 0.25);
	border-radius: 8px;
	padding: 10px;
	min-height: 320px;
}

.character-container-modern #achievements_viewer_body .q2 {
	color: #2eff6f;
}

.character-container-modern #achievements_viewer_body .q0 {
	color: #d8d8d8;
	opacity: 0.8;
}

 #achievements_viewer {
 	width: 920px;
 	max-width: 92vw;
 	margin-left: 0;
 	left: 50%;
 	transform: translateX(-50%);
 	top: 10%;
 	background: rgba(0, 0, 0, 0.55);
 	border: 1px solid #8B4513;
 	color: #F5DEB3;
 }
 
 #achievements_viewer_body {
 	box-sizing: border-box;
 	overflow: hidden;
 	padding: 12px;
 }
 
 #achievements_viewer_body #achv_wrap {
 	display: flex;
 	gap: 12px;
 	align-items: stretch;
 	height: 72vh;
 	max-height: 520px;
 	min-height: 360px;
 }
 
 #achievements_viewer_body #achv_progress {
 	margin: 0 0 10px 0;
 }
 
 #achievements_viewer_body .achv_progress_bar {
 	position: relative;
 	height: 22px;
 	border-radius: 10px;
 	background: rgba(0, 0, 0, 0.30);
 	border: 1px solid #8B4513;
 	overflow: hidden;
 }
 
 #achievements_viewer_body #achv_progress_fill {
 	position: absolute;
 	left: 0;
 	top: 0;
 	height: 100%;
 	width: 0%;
 	background: linear-gradient(90deg, rgba(40, 140, 255, 0.85), rgba(35, 210, 255, 0.75));
 	box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.08);
 	transition: width 0.25s ease;
 }
 
 #achievements_viewer_body #achv_progress_text {
 	position: absolute;
 	left: 0;
 	top: 0;
 	width: 100%;
 	height: 100%;
 	line-height: 22px;
 	text-align: center;
 	font-size: 12px;
 	font-weight: bold;
 	color: #e8d2b0;
 	text-shadow: 0 1px 0 rgba(0,0,0,0.65);
 }
 
 #achievements_viewer_body #achv_cats {
 	flex: 0 0 34%;
 	max-width: 34%;
 	background: rgba(0, 0, 0, 0.30);
 	border: 1px solid #8B4513;
 	border-radius: 10px;
 	padding: 12px;
 	height: 100%;
 	overflow-y: auto;
 	min-height: 0;
 }
 
 #achievements_viewer_body #achv_list {
 	flex: 1 1 auto;
 	min-width: 0;
 	background: rgba(0, 0, 0, 0.30);
 	border: 1px solid #8B4513;
 	border-radius: 10px;
 	padding: 12px;
 	height: 100%;
 	overflow-y: auto;
 	min-height: 0;
 }
 
 #achievements_viewer_body #achv_cats::-webkit-scrollbar,
 #achievements_viewer_body #achv_list::-webkit-scrollbar {
 	width: 10px;
 }
 
 #achievements_viewer_body #achv_cats::-webkit-scrollbar-track,
 #achievements_viewer_body #achv_list::-webkit-scrollbar-track {
 	background: rgba(0,0,0,0.25);
 	border-radius: 10px;
 }
 
 #achievements_viewer_body #achv_cats::-webkit-scrollbar-thumb,
 #achievements_viewer_body #achv_list::-webkit-scrollbar-thumb {
 	background: rgba(139, 69, 19, 0.55);
 	border: 1px solid rgba(255, 215, 0, 0.12);
 	border-radius: 10px;
 }
 
 #achievements_viewer_body #achv_cats::-webkit-scrollbar-thumb:hover,
 #achievements_viewer_body #achv_list::-webkit-scrollbar-thumb:hover {
 	background: rgba(139, 69, 19, 0.75);
 }

#achievements_viewer_body .achv_col_title {
	font-weight: bold;
	margin: 0 0 8px 0;
	color: #e8d2b0;
	text-shadow: 0 1px 0 rgba(0,0,0,0.65);
}

#achievements_viewer_body .achv_loading,
#achievements_viewer_body .achv_empty {
	padding: 10px;
	opacity: 0.85;
}

#achievements_viewer_body .achv_cat_list {
	margin: 0;
	padding: 0;
	list-style: none;
}

#achievements_viewer_body .achv_cat_list li {
	margin: 0 0 6px 0;
}

#achievements_viewer_body .achv_cat {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 10px;
	text-decoration: none;
}

#achievements_viewer_body .achv_cat_count {
	font-size: 11px;
	line-height: 1;
	padding: 2px 6px;
	border-radius: 10px;
	background: rgba(0,0,0,0.35);
	border: 1px solid rgba(139, 119, 101, 0.25);
	color: #e8d2b0;
	font-weight: bold;
	white-space: nowrap;
}

#achievements_viewer_body .achv_ach_list {
	margin: 0;
	padding: 0;
	list-style: none;
}

#achievements_viewer_body .achv_ach {
	display: flex;
	gap: 10px;
	padding: 8px;
	border-radius: 10px;
	border: 1px solid #8B4513;
	background: rgba(0, 0, 0, 0.30);
	margin: 0 0 8px 0;
 }

 #achievements_viewer_body .achv_ach.achv_earned {
	border-color: rgba(46, 255, 111, 0.55);
	background: rgba(46, 255, 111, 0.08);
	box-shadow: inset 0 0 0 1px rgba(46, 255, 111, 0.08);
 }

 #achievements_viewer_body .achv_ach.achv_earned:hover {
	background: rgba(46, 255, 111, 0.12);
	box-shadow: 0 6px 12px rgba(0, 0, 0, 0.35), inset 0 0 0 1px rgba(46, 255, 111, 0.10);
 }

 #achievements_viewer_body .achv_ach.achv_focus {
	border-color: rgba(255, 209, 0, 0.85);
	box-shadow: 0 0 0 2px rgba(255, 209, 0, 0.18), 0 6px 12px rgba(0, 0, 0, 0.35);
 }

#achievements_viewer_body .achv_ach_left {
	flex: 0 0 auto;
	padding-top: 1px;
}

#achievements_viewer_body .achv_ach_right {
	flex: 1 1 auto;
	min-width: 0;
}

#achievements_viewer_body .achv_ach_title {
	font-weight: bold;
	line-height: 1.2;
	margin-bottom: 4px;
}

#achievements_viewer_body .achv_ach_descr {
	opacity: 0.9;
}

#achievements_viewer_body .achv_points,
#achievements_viewer_body .achv_progress,
#achievements_viewer_body .achv_date {
	font-size: 11px;
	margin-left: 8px;
	padding: 2px 6px;
	border-radius: 10px;
	background: rgba(0,0,0,0.35);
	border: 1px solid rgba(139, 119, 101, 0.25);
	color: #e8d2b0;
}

 #achievements_viewer_body .achv_progress {
 	border-color: rgba(255, 215, 0, 0.20);
 	color: #ffd100;
 }

 #achievements_viewer_body .achv_earned .achv_ach_title {
	color: #2eff6f;
 }

.character-container-modern #achievements_viewer_body .achv_not_earned .achv_ach_title {
	color: #d8d8d8;
}

#achievements_viewer_body a {
	float: none;
	width: auto;
	margin: 0;
	padding: 0;
}

#achievements_viewer_body li {
	margin: 0 0 6px 0;
}

#achievements_viewer_body .achv_cat {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 10px;
	text-decoration: none;
	padding: 10px 12px;
	border-radius: 10px;
	background: rgba(0, 0, 0, 0.30);
	border: 1px solid rgba(139, 69, 19, 0.55);
	transition: all 0.3s ease;
}

#achievements_viewer_body .achv_cat.active {
	background: rgba(255, 209, 0, 0.10);
	border-color: #FFD700;
}

#achievements_viewer_body .achv_cat:hover {
	background: rgba(0, 0, 0, 0.40);
	box-shadow: 0 6px 12px rgba(0, 0, 0, 0.35);
	transform: translateY(-1px);
}

#achievements_viewer_body .q2 {
	color: #2eff6f;
}

#achievements_viewer_body .q0 {
	color: #d8d8d8;
	opacity: 0.8;
}