@charset "utf-8";
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; font-size: 100%; }
ol, ul { list-style: none; }
table { border-collapse: collapse; border-spacing: 0;}
:focus{outline:0}
button::-moz-focus-inner{padding:0;border:0}
input::-moz-focus-inner { 
  border: 0; 
}
input[type="button"] {
	cursor:pointer;
}
input[type="checkbox"] {
	cursor:pointer;
	vertical-align: middle;
}
label {
	cursor:pointer;
	vertical-align: middle;
}
legend {color:#777777;cursor:pointer;line-height: 12px;}
legend:hover {color:#ffba00;}
.aloader {
	background: url("/images/loaders/loader-c242424.gif") no-repeat scroll center center transparent;
	display:inline-block;
    height: 31px;
	width: 31px;
}
.select-wrapper { 
	border: 1px solid #555555;
    border-radius: 3px 3px 3px 3px;
    display: inline-block;
    margin: 3px auto;
    overflow: hidden;
    vertical-align: top; }
.select-wrapper select { padding:10px; margin:-5px -20px -5px -5px; }
.main-input {
	border: 1px solid #555555;
    border-radius: 3px 3px 3px 3px;
	font-size: 14px;
	margin: 5px;
    padding: 2px 7px;
	/*color:#DDD;*/
}
.faded-text {
	color:#555 !important;
}
.table-info {
	/*background-color:#141414;*/
	text-align:left;
}
.table-info thead tr {
	height:24px;
}
.table-info tbody tr:hover {
	background-color:#202020;
	cursor:pointer;
}
.table-info tbody tr {
	height:44px;	
}
.table-info.medium tbody tr {
	height:30px;	
}
.table-info th { color: #777777;font-size: 11px; font-weight:normal; cursor:pointer;padding: 3px 20px 3px 5px;}
.table-info th:hover { color: #00FF00;}
.table-info td { font-weight:normal;border:1px solid #404040;color: #DDDDDD;font-size: 12px;padding: 4px 10px;}

table.table-info thead tr .headerSortUp {
	background-image: url(/images/sort/sort-asc.gif);
	background-repeat: no-repeat;
	background-position: center right;
}
table.table-info thead tr .headerSortDown {
	background-image: url(/images/sort/sort-desc.gif);
	background-repeat: no-repeat;
	background-position: center right;
}

html, body { height: 100%; font: normal 12px/1.3 "Lucida Sans Unicode", Arial, Helvetica, sans-serif; color:#DDDDDD; -webkit-font-smoothing: antialiased;}
.yellow { color:#ffba00; }
.dlink { color:#ffba00 !important; }
a { outline: 0; text-decoration: none; color:#ffba00;text-shadow: 1px 1px 2px #000000; }
a:hover {text-decoration:underline;color:#ffc528;}
p { margin: 0.5em 0 }
textarea { overflow: auto; }

@font-face {
	font-family: 'belwe';
	src: url('/fonts/belwebd-webfont.ttf');
	src: url('/fonts/belwebd-webfont.eot');
    src: url('/fonts/belwebd-webfont.woff') format('woff'),
         url('/fonts/belwebd-webfont.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;	
}
.bel {
	font-family: belwe;
	font-size:24px;
	color:#FFF;	
	text-shadow: -2px 0 black, 0 2px black, 2px 0 black, 0 -2px black;
}
.mana {
	color:#0070DD;	
}
.red{color:#F00;}
.green{color:#0F0;}
.green-tooltip{color:#1EFF00;}
.good-post{color:#5DF644 !important;}

/* general class and quality colors */
.hsclass.warrior {
    color: #C69B6D !important;
}
.hsclass.paladin {
    color: #F48CBA !important;
}
.hsclass.hunter {
    color: #AAD372 !important;
}
.hsclass.rogue {
    color: #FFF468 !important;
}
.hsclass.priest {
    color: #F0EBE0 !important;
}
.hsclass.shaman {
    color: #2359FF !important;
}
.hsclass.mage {
    color: #68CCEF !important;
}
.hsclass.warlock {
    color: #9382C9 !important;
}
.hsclass.druid {
    color: #FF7C0A !important;
}
.hsclass.neutral {
    color: #999999 !important;
}
.cq0, .quality.basic {
    color: #9D9D9D !important;
}
.cq1, .quality.common {
    color: #FFFFFF !important;
}
.cq2, .quality.rare {
    color: #0070DD !important;
}
.cq3, .quality.epic {
    color: #A335EE !important;
}
.cq4, .quality.legendary {
    color: #FF8000 !important;
}


.border-box {
	border: 1px solid #333333;
    display: inline-block;
    margin: 5px;
    padding: 5px;
	border-radius: 3px 3px 3px 3px;
    /*box-shadow: 3px 3px 10px #000000;*/
}
.border-box:hover {
	border:1px solid #555555;		
}

.icon-small {
    background-position: center center;
    background-repeat: no-repeat;
    display: inline-block;
    height: 18px;
    left: 0;
    padding-left: 4px;
    padding-top: 4px;
    position: relative;
    top: 0;
    width: 18px;
    z-index: 20;
}
.icon-small-border {
    background: url("/images/default_icon_border_small.png") no-repeat scroll center center transparent;
    display: block;
    height: 26px;
    left: 0;
    position: absolute;
    top: 0;
    width: 26px;
    z-index: 2;
}

/*============ rarity ===============*/
.card-rarity-spell {
	background-image: url("/images/sprites/rarity_spell.png");
	background-repeat:no-repeat;
	background-position:center;
	width: 30px;
	height: 30px;
	display:block;
	position:absolute;
	top:135px;
	left:75px;
}
.card-rarity-spell.common { background-position: 0 0;}
.card-rarity-spell.rare { background-position: 0 -30px;}
.card-rarity-spell.epic { background-position: 0 -60px;}
.card-rarity-spell.legendary { background-position: 0 -90px;}

.card-rarity-minion {
	background-image: url("/images/sprites/rarity_minion.png");
	background-repeat:no-repeat;
	background-position:center;
	width: 51px;
	height: 20px;
	display:block;
	position:absolute;
	top:138px;
	left:68px;
}
.card-rarity-minion.common { background-position: 0 0;}
.card-rarity-minion.rare { background-position: 0 -20px;}
.card-rarity-minion.epic { background-position: 0 -40px;}
.card-rarity-minion.legendary { background-position: 0 -60px;}

.dragon-minion { 
	background-image: url("/images/dragon_frame.png");
	background-repeat:no-repeat;
	background-position:center;
	width: 135px;
	height: 102px;
	display:block;
	position:absolute;
	top:-7px;
	left:40px;
}
.dragon-minion-token { 
	background-image: url("/images/dragon-frame-token.png");
	background-repeat:no-repeat;
	background-position:center;
	width: 117px;
	height: 87px;
	display:block;
	position:absolute;
	top:-12px;
	left:10px;
	z-index:5;
}

.puzzle-ui-state-opacity-active {
	opacity:0.5;	
}
.puzzle-ui-state-opacity-hover {
	opacity:0.8;
}
.puzzle-ui-state-opacity-hover > a span.overlay-skull   {
	display:block !important;
}
.token.ui-draggable-dragging > a span.overlay-skull   {
	display:block !important;
}

.card-rarity-equipment {
	background-image: url("/images/sprites/rarity_equipment.png");
	background-repeat:no-repeat;
	background-position:center;
	width: 28px;
	height: 22px;
	display:block;
	position:absolute;
	top:137px;
	left:74px;
}
.card-rarity-equipment.common { background-position: 0 0;}
.card-rarity-equipment.rare { background-position: 0 -22px;}
.card-rarity-equipment.epic { background-position: 0 -44px;}
.card-rarity-equipment.legendary { background-position: 0 -66px;}

.vote-thumb {
	background: url("/images/sprites/thumbs.png") no-repeat scroll 0 0 transparent;
	width: 16px;
	height: 20px;
	display:block;
	position:absolute;
	cursor:pointer;
}
.vote-thumb.up {background-position:0 -20px;}
.vote-thumb.up:hover, .vote-thumb.up.active {background-position:0 0;}
.vote-thumb.down {background-position:0 -60px;}
.vote-thumb.down:hover, .vote-thumb.down.active {background-position:0 -40px;}

.deck-viewer-vote {
	display:inline-block;
	position:relative;
	width:16px;
	height:20px;
	margin:0 10px;	
}
.deck-viewer-vote-count {
	
}
/*============ END WoW Class ===============*/

/*============ WoW Class ===============*/
.wowclass {
	background-image: url("http://www.hsdeck.com/images/sprites/class18px.png");
	background-repeat:no-repeat;
	background-position:center;
	width: 18px;
	height: 18px;
	display:inline-block;
	padding-left: 20px;
}
.wowclass.warrior { background-position: 0 0;} 
.wowclass.druid { background-position: 0 -19px;} 
.wowclass.paladin { background-position: 0 -38px;} 
.wowclass.hunter { background-position: 0 -57px;} 
.wowclass.rogue { background-position: 0 -76px;} 
.wowclass.priest { background-position: 0 -95px;} 
.wowclass.dknight { background-position: 0 -114px;} 
.wowclass.shaman { background-position: 0 -133px;} 
.wowclass.mage { background-position: 0 -152px;} 
.wowclass.warlock { background-position: 0 -171px;}
.wowclass.monk { background-position: 0 -190px;}
/*============ END WoW Class ===============*/
/*============ WoW Class ===============*/
.txclass {
	font-size:12px;
}
.txclass.warrior { color: #c69b6d !important; } /* warrior */
.txclass.paladin { color: #f48cba !important; } /* paladin */
.txclass.hunter { color: #aad372 !important; } /* hunter */
.txclass.rogue { color: #fff468 !important; } /* rogue */
.txclass.priest { color: #f0ebe0 !important; } /* priest */
.txclass.dknight { color: #c41e3b !important; } /* death knight */
.txclass.shaman { color: #2359ff !important; } /* shaman */
.txclass.mage { color: #68ccef !important; } /* mage */
.txclass.warlock { color: #9382c9 !important; } /* warlock */
.txclass.druid { color: #ff7c0a !important; } /* druid */
.txclass.monk { color: #00FF96 !important; } /* monk */
.txclass.neutral { color: #999999 !important; }
/*============ END WoW Class ===============*/
/*----------------------------------------------
	Utility
----------------------------------------------*/
.clear { clear: both; display: block; margin: 0; padding: 0; }
.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; }
.opacity50 { opacity: .50; }
.clickable { cursor: pointer; }
.table-center { margin:auto;}
.hide { display: none; }
.img { vertical-align: bottom; }
.row-hidden { display: none !important; }

/*.quality.basic {color:#9d9d9d !important}
.quality.common {color:#FFFFFF !important}
.quality.rare {color:#0070dd !important}
.quality.epic {color:#a335ee !important}
.quality.legendary {color:#ff8000 !important}*/

.cq.basic {color:#9d9d9d}
.cq.common {color:#FFFFFF}
.cq.rare {color:#0070dd}
.cq.epic {color:#a335ee}
.cq.legendary {color:#ff8000}


/*
#menu {
    -moz-user-select: none;
    height: 60px;
    left: 51px;
    position: absolute;
    top: 20px;
    width: 900px;
}*/

#navbar {
	/*display:block;
	position:relative;*/
	top:0;
	text-align:left;
	margin: 0 auto;
    max-width: 1240px;
    min-width: 980px;
	/*box-shadow: 2px 2px 3px #655C47;*/
	box-shadow: 2px 2px 3px #000000;
	
	background: rgb(88,88,88); /* Old browsers */
	/* IE9 SVG, needs conditional override of 'filter' to 'none' */
	background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIwJSIgeTI9IjEwMCUiPgogICAgPHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iIzU4NTg1OCIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjEwMCUiIHN0b3AtY29sb3I9IiMyNDI0MjQiIHN0b3Atb3BhY2l0eT0iMSIvPgogIDwvbGluZWFyR3JhZGllbnQ+CiAgPHJlY3QgeD0iMCIgeT0iMCIgd2lkdGg9IjEiIGhlaWdodD0iMSIgZmlsbD0idXJsKCNncmFkLXVjZ2ctZ2VuZXJhdGVkKSIgLz4KPC9zdmc+);
	background: -moz-linear-gradient(top,  rgb(88,88,88) 0%, rgb(36,36,36) 100%); /* FF3.6+ */
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgb(88,88,88)), color-stop(100%,rgb(36,36,36))); /* Chrome,Safari4+ */
	background: -webkit-linear-gradient(top,  rgb(88,88,88) 0%,rgb(36,36,36) 100%); /* Chrome10+,Safari5.1+ */
	background: -o-linear-gradient(top,  rgb(88,88,88) 0%,rgb(36,36,36) 100%); /* Opera 11.10+ */
	background: -ms-linear-gradient(top,  rgb(88,88,88) 0%,rgb(36,36,36) 100%); /* IE10+ */
	background: linear-gradient(to bottom,  rgb(88,88,88) 0%,rgb(36,36,36) 100%); /* W3C */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#585858', endColorstr='#242424',GradientType=0 ); /* IE6-8 */
	
	border:1px solid #404040 !important;
	z-index: 9999 !important;
}/*
#navbar ul li {
	position:relative;
	display:inline-block;
	padding:5px;	
}
#navbar ul li a{
	display:block;
	font-size:14px;
	line-height:24px;
	position:relative;
	padding-left:35px;
	padding-right:10px;
}*/
.ad728x90 {
	position:relative;
	display:inline-block;
	width:728px;
	height:90px;
	background:url(/images/ad-defaultbg-728x90.png) no-repeat scroll 0 0 transparent;
}
#hsdeck-wrapper {
	background: url("../images/body-content-bg.jpg") repeat-y scroll 50% 0 #151515;
    margin: 0 auto;
    position: relative;
	min-height:100%;
}
#hsdeck-header {
	height: 95px;
	max-width: 1240px;
    min-width: 980px;
	margin: 0 auto;
	position:relative;
}
	#social-wrapper {
		display:block;
		position: absolute;
		text-align: left;
		height:23px;
		top: 75px;
		width: 250px;
		left:250px;
	}
	.hearthstone-logo {
		background: url("/images/hsdeck-logo-05-50p.png") no-repeat scroll top left transparent;
		position:absolute;
		display:block;
		width:254px;
		height:95px;	
	}
#hsdeck-content {
    margin: 0 auto;
	min-width:980px;
	max-width:1240px;
	padding-bottom:80px;
    position: relative;	
	/*box-shadow:0 0 15px #000000;*/
	background: none repeat scroll 0 0 #242424 !important;
	border:1px solid #404040;

}
#hsdeck-footer {
	bottom: 0;
    color: #999999;
	width:100%;
    display: block;
    height: 80px;
    margin: 0 auto;
    position: absolute;
    text-align: center;	
}
.content-top {

}
.content-bot {   
    background: none repeat scroll 0 0 transparent;
    line-height: 1.8em;
    margin-bottom: 300px;
}

/* CLASSES */
.player-class {
	background: url("../images/sprites/classes.png") no-repeat scroll 0 0 transparent;
	font-size:12px;
	font-weight: bold;
	display:inline-block;
	position:relative;
	width:160px;
	height:130px;
	opacity:1;
	cursor:pointer;
}
.player-class:hover {
	opacity:0.7;	
}
.player-class.druid {
	background-position: 0 -130px;
	color: #FF7D0A;
}
.player-class.hunter {
	background-position: 0 -260px;
	color: #ABD473;
}
.player-class.mage {
	background-position: 0 -390px;
	color: #69CCF0;
}
.player-class.paladin {
	background-position: 0 -520px;
	color: #F58CBA;
}
.player-class.priest {
	background-position: 0 -650px;
	color: #FFFFFF;
}
.player-class.rogue {
	background-position: 0 -780px;
	color: #FFF569;
}
.player-class.shaman {
	background-position: 0 -910px;
}
.player-class.warlock {
	background-position: 0 -1040px;
}
.player-class.warrior {
	background-position: 0 -1170px;
}
.player-class.neutral {
	background-position: 0 -1170px;
}
#deck-creator-filter {
	height:auto;
	line-height:30px;
	
	background-color:#242424;
	margin-bottom: 10px;
	box-shadow: 2px 2px 3px #000000;
	color: #DDDDDD;
	text-align:left;	
}
.deck-creator-option-wrapper {
    margin-right: 300px;
    min-width: 600px;
	min-height: 110px;
}
#dcf-wrapper-ctype, #dcf-wrapper-rarity, #dcf-wrapper-cpp, .options-wrapper  {
	display:inline-block;
	position:relative;
	line-height: 14px;
    margin: 0 10px;
	vertical-align: top;
}
#dcf-keywords span {
	border: 1px solid #555555;
    border-radius: 3px 3px 3px 3px;
    font-size: 12px;
    margin: 2px 5px;
    padding: 2px 10px 2px 7px;
	display: inline-block;
	color:#FFBA00;	
	background: url("/images/misc/delete-gray.png") no-repeat scroll top right #333333;	
}
#dcf-keywords span:hover {	
	cursor:pointer;
	color:#FFFFFF;	
	background: url("/images/misc/delete-hover.png") no-repeat scroll top right #404040;	
}
/* Card - Full */
.card, .card-in-deck {
	display:inline-block;
	position:relative;
	width:178px;
	height:250px;
	cursor:pointer;
	margin: 10px 5px;
	color:#000000;
}
.card-in-deck {	
	margin-left: -90px;
}
.card-in-deck:hover {
	z-index:99999 !important;
}
.card-in-deck.puzzle-builder {
	position:absolute;
	margin:0;
}
.card-overlay {
	display:block;
	position:absolute;
	width:100%;
	height:100%;
}
.card-overlay.spell {	
	background: url("../images/cardframe_spell_03.png") no-repeat scroll center center transparent;	
}
.card-overlay.minion {
	background: url("../images/cardframe_minion_03.png") no-repeat scroll center center transparent;
}
.card-overlay.dragon {
	background: url("../images/cardframe_dragon.png") no-repeat scroll center center transparent;
}
.card-overlay.equipment {
	background: url("../images/cardframe_equipment_03.png") no-repeat scroll center center transparent;
}
.card .equipment-image, .card-in-deck .equipment-image {
	display:block;
	position:absolute;
	top:18px;
	left:32px;
}
.card .minion-image, .card-in-deck .minion-image {
	display:block;
	position:absolute;
	top:5px;
	left:40px;
}
.card .spell-image, .card-in-deck .spell-image {
	display:block;
	position:absolute;
	top:28px;
	left:25px;
}
.card .equipment-title, .card-in-deck .equipment-title {
	display:block;
	position:absolute;
	top:114px;
	left:9px;
}
.card .minion-title, .card-in-deck .minion-title {
	display:block;
	position:absolute;
	top:113px;
	left:9px;
}
.card .spell-title, .card-in-deck .spell-title {
	display:block;
	position:absolute;
	top:108px;
	left:9px;
}
.card .mana-cost, .card-in-deck .mana-cost {
	display:block;
	position:absolute;
	top:10px;	
	left:7px;
}
.card .attack, .card-in-deck .attack {
	display:block;
	position:absolute;
	bottom:5px;	
	left:8px;
}
.card .health, .card-in-deck .health {
	display:block;
	position:absolute;
	bottom:5px;	
	right:6px;
}
.card .equipment-desc, .card-in-deck .equipment-desc {
	display:block;
	position:absolute;
	overflow:hidden;
	top:160px;	
	height:60px;
	max-height:60px;
	left:30px;
	width:115px;
	font-size:12px;
	line-height:12px;
	color:#CCC;
	text-align:center;
}
.card .minion-desc, .card-in-deck .minion-desc {
	display:block;
	position:absolute;
	overflow:hidden;
	top:160px;	
	height:60px;
	max-height:60px;
	line-height:60px;
	left:30px;
	width:115px;
	font-size:11px;	
	text-align:center;	
}
.card .minion-desc span, .card-in-deck .minion-desc span {
	display:inline-block;
	line-height:11px;
	vertical-align:middle;		
}
.card .spell-desc, .card-in-deck .spell-desc {
	display:block;
	position:absolute;
	overflow:hidden;
	top:165px;	
	height:55px;
	line-height:55px;
	left:30px;
	width:116px;
	font-size:11px;		
	text-align:center;
}
.card .spell-desc span, .card-in-deck .spell-desc span {
	display:inline-block;
	line-height:11px;
	vertical-align:middle;		
}

.card .card-count {
	display:block;
	position:absolute;
	overflow:hidden;
	top:238px;	
	height:24px;
	width:100%;	
	font-family: belwe;
	font-size:24px;
	text-align:center;
	color:#777;
	/*text-shadow: -2px 0 black, 0 2px black, 2px 0 black, 0 -2px black;	*/
}
/* END Card Full */
.deck-build-cost {
	position:relative;	
	display: block;
    height: 92px;
	width: 163px;
	background-color:#141414;
	margin:0 auto;
	top: 20px;
}
.deck-build-cost .overlay{
	background-image: url("/images/deck-build-cost.png");
    background-position: center center;
    background-repeat: no-repeat;
    display: block;
    height: 92px;
    left: 0;
    position:absolute;
    top: 0;
    width: 163px;
	z-index:10;
}
.deck-build-cost .bar-mana {
	display:block;
	position:absolute;
	background-color:#ffba00;
	width:16px;
	height:0;
	bottom: 21px;
}
.bar-mana.cost-0{left:1px;}
.bar-mana.cost-1{left:21px;}
.bar-mana.cost-2{left:41px;}
.bar-mana.cost-3{left:61px;}
.bar-mana.cost-4{left:81px;}
.bar-mana.cost-5{left:101px;}
.bar-mana.cost-6{left:121px;}
.bar-mana.cost-7{left:141px;}

.deck-build-mana-card-count {
	color: #777777;
    display: block;
    font-size: 10px;
    height: 16px;
    position: absolute;
    top: -12px;
    width: 16px;
}
.deck-build-mana-card-count.mcc-0{left:1px;}
.deck-build-mana-card-count.mcc-1{left:21px;}
.deck-build-mana-card-count.mcc-2{left:41px;}
.deck-build-mana-card-count.mcc-3{left:61px;}
.deck-build-mana-card-count.mcc-4{left:81px;}
.deck-build-mana-card-count.mcc-5{left:101px;}
.deck-build-mana-card-count.mcc-6{left:121px;}
.deck-build-mana-card-count.mcc-7{left:141px;}
/* Card - Basic */
.card-basic {
	background-color:#141414;
	border:1px solid #404040;
	display:inline-block;
	position:relative;
	width:220px;
	height:50px;
	cursor:pointer;
	margin: 3px 5px;
}
.card-basic:hover {
	border:1px solid #ffba00;
	box-shadow: 2px 2px 5px #000000;
}
.card-basic:active {
	box-shadow:none;
	border:1px solid #555555;
}
.card-basic a {
	display:block;
	width:100%;
	height:100%;	
}
.card-basic .card-icon {
	position:absolute;
	top:3px;
	left:10px;
	padding-left: 4px;
    padding-top: 4px;
}
.card-basic .card-icon .icon-overlay {
	background-image: url("/images/default_icon_border_medium.png");
    background-position: center center;
    background-repeat: no-repeat;
    display: block;
    height: 44px;
    left: 0;
    position: absolute;
    top: 0;
    width: 44px;
    z-index: 30;
}
.card-basic .title {
	font-family: belwe;
	font-size:14px;
	display:block;
	position:absolute;
	display:inline-block;	
	left:60px;
	top:8px;
	height:15px;	
}
.card-basic:hover .title{
	top:0;
}
.card-basic .card-desc {
	position:absolute;
	display:none;
	left:60px;
	top:16px;
	color:#555555;
	font-size:9px;
	height:auto;
	text-align:left;
	line-height:9px;
}
.card-basic:hover .card-desc {	
	display:inline-block;
}
.card-basic .card-stats {
	position:absolute;
	display:none;
	left:60px;
	bottom:0;
	height:18px;
	opacity:0.1;
}
.card-basic:hover .card-stats {
	display:block;
	opacity:0.5;
}
.card-basic .mana-cost {
	background-image: url("/images/mana-gem-29px.png");
    background-position: center center;
    background-repeat: no-repeat;	
	display:block;
	position:absolute;
	top:0;	
	right:-4px;
	width:29px;
	height:29px;
}
.card-basic .card-count {
	display:block;
	position:absolute;
	overflow:hidden;
	bottom:0;	
	height:20px;
	width:30px;	
	font-family: belwe;
	font-size:16px;
	text-align:right;
	color:#777;
	right:3px;
}


/* Card - Listview */
.tbl-deck-builder {
	border-collapse:collapse;
}
.tbl-deck-builder thead tr {
	text-align:center;
}
.tbl-deck-builder thead tr th{
	border: 1px solid #202020;
    color: #777777;
    font-size: 11px;
    font-weight: normal;
    padding: 3px 20px 3px 5px;
}
/*.tbl-deck-builder tbody tr:nth-of-type(odd) {
	background-color: #121212;
} */
.card-listview {
	background-color:#141414;
	border:1px solid #404040;
	width:100%;
	height:44px;
	cursor:pointer;
	text-align:left;
	table-layout:fixed;
}
.card-listview:hover {
	/*box-shadow: 2px 2px 5px #000000;*/
	background-color:#202020 !important;
}
.card-listview .title {
	font-family: belwe;
	font-size:14px;
	min-width:500px;
	width:80%;
}
.card-listview .card-desc {
	color:#555555;
	font-size:10px;
	font: normal 12px/1.3 "Lucida Sans Unicode", Arial, Helvetica, sans-serif;
}
.card-listview:hover .card-desc {
	color:#1EFF00;
	font-size:10px;
	font: normal 12px/1.3 "Lucida Sans Unicode", Arial, Helvetica, sans-serif;
}
.card-listview .cell-icon {
	min-width:50px;
	vertical-align:middle;	
}
	.card-listview .cell-icon .card-icon {
		position:relative;
		display:block;
		padding-left: 4px;
		padding-top: 4px;
	}
	.card-listview .cell-icon .card-icon .icon-overlay {
		background-image: url("/images/default_icon_border_medium.png");
		background-position: center center;
		background-repeat: no-repeat;
		display: block;
		height: 44px;
		left: 0;
		position: absolute;
		top: 0;
		width: 44px;
		z-index: 30;
	}
.card-listview .cell-hero-class {
	min-width:50px;
	vertical-align:middle;
}
.card-listview .cell-mana {
	min-width:50px;
	vertical-align:middle;
}
.card-listview .cell-attack {
	min-width:50px;
	vertical-align:middle;
}
.card-listview .cell-health {
	min-width:50px;
	vertical-align:middle;	
}
.card-listview .cell-mana span, .card-listview .cell-attack span, .card-listview .cell-health span {
	padding-left: 20px;
	color:#FFFFFF;
}
.card-listview .card-count {
	min-width:50px;
	vertical-align:middle;
	text-align:center;	
}


/* Sprites */
.icn16 {
    background: url("http://www.hsdeck.com/images/sprites/sprite16px.png") no-repeat scroll 0 0 transparent;
    display: inline-block;
    height: 16px;
	width: 16px;
    z-index: 2;
}
.icn16.bdeck {
	padding-left:14px;
	line-height:16px;
	margin-right:5px;	
}
.icn16.attack {background-position:0 0;}
.icn16.health {background-position:0 -16px;}
.icn16.mana {background-position:0 -32px;}
.icn16.weapon-attack {background-position:0 -48px;}
.icn16.durability {background-position:0 -64px;}
.icn16.armor {background-position:0 -80px;}

#deck-creator {
	
}

.card-list-wrapper {	
	float:left;
	width:100%;
}
.card-list {
	margin-right: 300px;
	min-height:100px;
	min-width:100px;
}

.deck-wrapper {
	float:left;
	margin-left: -305px;
	width:300px;
	min-height:600px;
}

.deck-card {
	background: url("../images/mana-gem-20.png") no-repeat scroll left center transparent;
    display: inline-block;
    height: 16px;
    position: relative;
	width:100%;
    min-width: 220px;
	cursor:pointer;
	border-bottom:1px solid #333333;
	color:#777777;	
}
.deck-card:hover{
	color:#00FF00;	
}
.deck-card .deck-card-mana-cost {
	display:block;
	position:absolute;	
	height:20px;
	width:20px;
	font-family: belwe;
	font-size:20px;
	line-height:16px;
	color:#FFF;	
	text-shadow: -2px 0 black, 0 2px black, 2px 0 black, 0 -2px black;	
}
.deck-card .deck-card-title {
	display:block;
	position:absolute;	
	font-size:14px;
	height:16px;
	left:32px;
	width:198px;
	color:#FFF;	
	/*text-shadow: -2px 0 black, 0 2px black, 2px 0 black, 0 -2px black;*/
}
.deck-card .deck-card-count {
	display:block;
	position:absolute;	
	font-family: belwe;
	font-size:16px;
	height:16px;
	right:0;
	width:32px;	
}

/*Paginate */
#deck-builder-paginate {margin: 30px 300px 20px 3px;}
#deck-build-info {color: #00FF00;margin: 20px 300px 0 3px;text-align:center;}
.paginate {
    margin: 30px 3px 3px 3px;
    padding: 3px;
    text-align: center;
}
.paginate a {
    background: none repeat scroll 0 0 #233953; /*#2D0404*/
    border-radius: 3px 3px 3px 3px;
    box-shadow: 3px 3px 10px #000000;
    color: #A99877;
    margin: 2px;
    padding: 3px 10px;
    text-decoration: none;
}
.paginate a:hover, .paginate a:active {
    background-color: #33557d; /*#681F16*/
    color: #FFFFFF;
}
.paginate span.current {
    background-color: #33557d;
    border-radius: 3px 3px 3px 3px;
    color: #FFFFFF;
    font-weight: bold;
    margin: 2px;
    padding: 3px 10px;
}
.paginate span.disabled {
    color: #333333;
    margin: 2px;
    padding: 3px 10px;
}
/* END Paginate */

/* blizzard blue post */
#latest-blue, #latest-forum {
	position:relative;
	display:inline-block;
	width:48%;
    box-shadow: 2px 2px 5px #000000;
    margin: 10px 5px 0;
	text-align:left;
	/*border-radius: 10px 10px 10px 10px;*/
	border: 1px solid #333333;
}
#latest-blue {float:left;}
#latest-forum {float:right;}
/*#latest-blue {
	background-color: #13181E;
    background-image: url("/images/bluepost-bg.png");
    background-position: left top;
    background-repeat: no-repeat;
}*/
#latest-blue table tr:hover, #latest-forum table tr:hover {
	/*background-color:#202020;*/
}
#latest-blue table tr td, #latest-forum table tr td{
	/*padding:2px 5px 2px 10px;	*/
	padding:2px 2px 2px 5px;
}
.blue-question {color:#FFF; display:block; padding-top:15px;}
.blue-answer {color:#00C0FF !important;}
.quote-blizz {
    background: url("/images/blog/bluepost-bg.png") no-repeat scroll left top #13181E;
    color: #00C0FF;
}
.golden-border {
	border:1px solid #FFBA00 !important;
}
.news-section {
    /*border: 1px solid #0E3869;*/
    box-shadow: 3px 3px 10px #000000;
    margin: 10px;
	text-align:left;
	border-radius: 10px 10px 10px 10px;
	border: 1px solid #333333;
}
.news-section:hover {
	border: 1px solid #555555;
}
.news-section.blizzard {
	background-color: #13181E;
    background-image: url("/images/bluepost-bg.png");
    background-position: left top;
    background-repeat: no-repeat;
}
.news-section.hearthstone {
	background:url(http://www.hsdeck.com/images/misc/hearthstone-section-bg.jpg) no-repeat scroll top right #242424;
}
.news-section .section-header {
	font-size:14px;
    height: 25px;	
}
.news-section .section-header h3 {
    /*color: #FFFFFF;*/
	color:#ffba00;
    float: left;
    font-size: 12px;
    font-weight: normal;
    height: 25px;
    line-height: 25px;
    padding: 0 30px;
}
.news-section .section-date {
    color: #777777;
    float: right;
    font-size: 12px;
	line-height:25px;
    height: 25px;
    padding: 0 10px;
}
.news-section .section-body {
    padding: 5px 20px 15px;
    position: relative;
	color:#DDD;
	line-height:16px;
	font-size:12px;
}

#deck-creator, #deck-viewer {
	text-align:center;	
	/*background-color: #141414;*/
}
/* comments */
.white-headline {
    border-bottom: 1px solid #505050;
    color: white;
    font-size: 17px;
    font-weight: bold;
    line-height: 1.25em;
    margin: 20px 10px 10px;
    padding: 0 0 3px;
}
#post-deck-comment, #post-card-comment, #post-puzzle-comment{	
	text-align:center;
	margin-top: 20px;
}
.dark-gray-block {
	background-color:#141414;
	margin: 0 10px;
    padding: 10px;
	box-shadow: 2px 2px 3px #000000;
	color: #DDDDDD;
}
#deck-comments, #card-comments, #puzzle-comments {	
	/*padding: 10px;*/
	position: relative;
	text-align:left;
}
.hidden-comment {
	cursor:pointer;
	min-height: 30px;
	opacity:0.5;	
}
.comment-wrapper {
	border-radius: 6px 6px 6px 6px;
    color: #DDDDDD;
	background-color:#242424;
	padding: 0 6px 6px;
	margin-bottom: 10px;
	box-shadow: 2px 2px 3px #000000;
	border: 1px solid #333333;
}
.comment-wrapper.latest {	
	border: 1px solid #009900;
	background-color: #001100;
}
.comment-wrapper:hover {
	background-color:#282828;
	border: 1px solid #555555;
}
.comment-wrapper.reply {
	margin-left:20px;
}
.comment-wrapper .comment {
	padding:20px 10px 10px;
	position: relative;
	min-height: 20px;
}
.comment-wrapper .comment-author {	
    display: block;
    height: 16px;
    left: 50px;
    position: absolute;
    top: 0;
    width: 200px;
	font-size:12px;
	text-align:left;
}
.comment-wrapper .comment-date {
	color:#777777;
	font-size:10px;	
}
.comment-wrapper .comment-text {
	padding-left: 40px;	
	display: block;
}
.comment-reply {
	color:#00C0FF;
	cursor:pointer;
	position:absolute;
	top:0;
	width: 50px;
	font-size:12px;
	text-align:center;
	right:0;
}
.comment-reply-wrapper {
	display:none;
	padding-left: 40px;	
}
.card-vote-wrap {
	display:block;
	position:absolute;
	width:40px;
	height:16px;
	left:0;
	top:0;
	text-align:center;
	font-size:12px;	
	font-weight:bold;
}
.card-vote-wrap .comment-score {color: #555555;font-size:16px; display:block;}
.card-vote-wrap .vote-up {color:#0F0; display:block; padding:0 5px; font-size:10px; opacity:0.2;}
.card-vote-wrap .vote-up:hover {color:#0F0; cursor:pointer; opacity:1;}
.card-vote-wrap .vote-down {color:#F00; display:block; padding:0 5px; font-size:10px; opacity:0.2;}
.card-vote-wrap .vote-down:hover {color:#F00; cursor:pointer; opacity:1;}
/* end comments */



/* Horizontal Style */


#utopian-navigation, #utopian-navigation ul {
	font-size: 14px;
	list-style: none;
	margin: 0;
	padding: 0;
}

#utopian-navigation a {
	color: #ffba00;
	display: block;
	line-height: 1;
	/*font-weight: bold;*/
	padding: 10px 20px;
	text-decoration: none;
}
#utopian-navigation a:hover {
	color: #ffffff !important;
}

#utopian-navigation li {
	float: left;
}

#utopian-navigation li ul {
	background: #666666;
	background: -moz-radial-gradient(80% 0% 0deg, circle cover, #787878, #666666, #666666 90%);
	background: -webkit-gradient(radial, 160 -100, 0, 160 -100, 200, from(#8a8a8a), to(#666666));
	box-shadow: 3px 3px 5px rgba(0, 0, 0, 0.6);
	-moz-box-shadow: 3px 3px 5px rgba(0, 0, 0, 0.6);
	-webkit-box-shadow: 3px 3px 5px rgba(0, 0, 0, 0.6);
	left: -9999px;
	position: absolute;
	width: 190px;
	z-index:1000;
}

#utopian-navigation li ul a {
	border-top: 1px solid #838383;
	border-right: 1px solid #7b7b7b;
	border-bottom: 1px solid #484848;
	border-left: 1px solid #4c4c4c;
	color: #a4a4a4;
	font-weight: normal;
	padding: 5px 19px;
	text-shadow: #4d4d4d -1px -1px 0;
	width: 150px;
}
#utopian-navigation li ul a:hover, #utopian-navigation > li.dropdown li.dropdown > a:hover, #utopian-navigation > li.dropdown li.dropdown:hover > a {
	background: #0099ff;
	background: -moz-linear-gradient(100% 100% 90deg, #017bcd, #33adff);
	background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#33adff), to(#017bcd));
	border-top: 0;
  	color: #ffffff;
	font-weight: bold;
	padding-top: 6px;
	text-shadow: #1c567c -1px -1px 0;
}

#utopian-navigation > li.dropdown li.dropdown > a:hover, #utopian-navigation > li.dropdown li.dropdown:hover > a {
	background: #0099ff url(../assets/arrow-right-white.gif) no-repeat center right;
	background-image: url(../assets/arrow-right-white.gif), -moz-linear-gradient(100% 100% 90deg, #017bcd, #33adff);
	background-image: url(../assets/arrow-right-white.gif), -webkit-gradient(linear, 0% 0%, 0% 100%, from(#33adff), to(#017bcd));
}

#utopian-navigation li ul ul {
	margin: -26px 0 0 190px;
}

#utopian-navigation li:hover ul ul, #utopian-navigation li:hover ul ul ul {
	left: -9999px;
}

#utopian-navigation li:hover ul, #utopian-navigation li li:hover ul, #utopian-navigation li li li:hover ul { /* lists nested under hovered list items */
	left: auto;
}

#utopian-navigation > li.dropdown > a {
	background: url(../assets/arrow-down-gray.gif) no-repeat center right;
	padding-right: 35px;
}

#utopian-navigation > li.dropdown:hover > a {
	background: #666666 url(../assets/arrow-down-white.gif) no-repeat center right;
	background-image: url(../assets/arrow-down-white.gif), -moz-radial-gradient(80% 0% 0deg, circle cover, #787878, #666666, #666666 90%);
	background-image: url(../assets/arrow-down-white.gif), -webkit-gradient(radial, 160 -100, 0, 160 -100, 200, from(#8a8a8a), to(#666666));
	border-top: 1px solid #8d8d8d;
	border-right: 1px solid #7b7b7b;
	border-bottom: 1px solid #484848;
	border-left: 1px solid #4c4c4c;
	box-shadow: 3px 3px 5px rgba(0, 0, 0, 0.6);
	-moz-box-shadow: 3px 3px 5px rgba(0, 0, 0, 0.6);
	-webkit-box-shadow: 3px 3px 5px rgba(0, 0, 0, 0.6);
	color: #ffffff;
	padding: 9px 34px 9px 19px;
	text-shadow: #595959 -1px -1px 0;
}

#utopian-navigation > li.dropdown li.dropdown > a {
	background: url(../assets/arrow-right-gray.gif) no-repeat center right;
}

#utopian-navigation > li.active > a, #utopian-navigation > li.active > a:hover {
	color: #ffffff;
}


/* Vertical Style */


#utopian-navigation.vertical {
	width: 190px;
}

#utopian-navigation.vertical a {
	width: 150px;
}

#utopian-navigation.vertical li ul {
	margin: -34px 0 0 190px;
}

#utopian-navigation.vertical > li.dropdown > a {
	background: url(../assets/arrow-right-gray.gif) no-repeat center right;
	width: 135px;
}
#utopian-navigation.vertical > li.dropdown:hover > a {
	background: #666666 url(../assets/arrow-right-white.gif) no-repeat center right;
	background-image: url(../assets/arrow-right-white.gif), -moz-radial-gradient(80% 0% 0deg, circle cover, #787878, #666666, #666666 90%);
	background-image: url(../assets/arrow-right-white.gif), -webkit-gradient(radial, 160 -100, 0, 160 -100, 200, from(#8a8a8a), to(#666666));
}


/* Black */


#utopian-navigation.black li ul {
	background: #000000;
	background: -moz-radial-gradient(90% -20% 0deg, circle cover, #252525, #000000, #000000 150%);
	background: -webkit-gradient(radial, 160 -100, 0, 160 -100, 200, from(#444444), to(#000000));
}

#utopian-navigation.black li ul a {
	border-top-color: #1c1c1c;
	border-right-color: #1a1a1a;
	border-bottom-color: #000000;
	border-left-color: #000000;
	color: #4d4d4d;
	text-shadow: #000000 -1px -1px 0;
}
#utopian-navigation.black li ul a:hover, #utopian-navigation.black > li.dropdown li.dropdown > a:hover, #utopian-navigation.black > li.dropdown li.dropdown:hover > a {
	background: #181818;
	background: -moz-linear-gradient(100% 100% 90deg, #181818, #252525);
	background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#252525), to(#181818));
  	color: #ffffff;
	font-weight: bold;
}

#utopian-navigation.black > li.dropdown li.dropdown > a:hover, #utopian-navigation.black > li.dropdown li.dropdown:hover > a {
	background: #181818 url(../assets/arrow-right-white.gif) no-repeat center right;
	background-image: url(../assets/arrow-right-white.gif), -moz-linear-gradient(100% 100% 90deg, #181818, #252525);
	background-image: url(../assets/arrow-right-white.gif), -webkit-gradient(linear, 0% 0%, 0% 100%, from(#252525), to(#181818));
}

#utopian-navigation.black > li.dropdown:hover > a {
	background: #000000 url(../assets/arrow-down-white.gif) no-repeat center right;
	background-image: url(../assets/arrow-down-white.gif), -moz-radial-gradient(90% -20% 0deg, circle cover, #191919, #000000, #000000 150%);
	background-image: url(../assets/arrow-down-white.gif), -webkit-gradient(radial, 160 -100, 0, 160 -100, 200, from(#444444), to(#000000));
	border-top-color: #1c1c1c;
	border-right-color: #1a1a1a;
	border-bottom-color: #000000;
	border-left-color: #000000;
	color: #ffffff;
	text-shadow: none;
}
#utopian-navigation.vertical.black > li.dropdown:hover > a {
	background: #000000 url(../assets/arrow-right-white.gif) no-repeat center right;
	background-image: url(../assets/arrow-right-white.gif), -moz-radial-gradient(90% 0% 0deg, circle cover, #191919, #000000, #000000 150%);
	background-image: url(../assets/arrow-right-white.gif), -webkit-gradient(radial, 160 -100, 0, 160 -100, 200, from(#4d4d4d), to(#000000));
}

#utopian-navigation.black > li.dropdown li.dropdown > a {
	background: url(../assets/arrow-right-darkgray.gif) no-repeat center right;
	text-shadow: none;
}

/* deck tester */
.token {
	height:135px;
	width:105px;
	margin:0 5px;
	display:inline-block;
	position:relative;
	/*z-index:10;*/
	cursor:pointer;
	vertical-align: top;
}
.token:hover {
	opacity:0.8;
	z-index:10;	
}
.token .overlay {
	position:absolute;
	left:0;
	top:0;
	background: url("/images/token.png") no-repeat center center transparent;
	height:100%;
	width:100%;
	z-index:3;
}
.token .timg {
	position:absolute;
	width:86px;
	height:116px;
	top:5px;
	left:9px;
	z-index:0;
}
.token .attack {
	position: absolute; 
	width: 30px;
	left: 6px; 
	height: 24px; 
	bottom: 25px; 
	text-align: center; 
	z-index: 10;
	line-height:24px;
}
.token .health {
	position: absolute; 
	width: 30px;
	right: 10px; 
	height: 24px; 
	bottom: 25px; 
	text-align: center; 
	z-index: 10;
	line-height:24px;
}
/*taunt */
.token.taunt {
	height:155px;
	width:119px;
}
.token.taunt .overlay {
	background: url("/images/token-taunt.png") no-repeat center center transparent;
}
.token.taunt .timg {	
	top:6px;
	left:14px;
}
.token.taunt .attack {	
	left: 11px; 
	bottom: 43px;
}
.token.taunt .health {	
	right: 16px; 
	bottom: 43px; 
}
/* taunt end */

/*overlay skull */
.token .overlay-skull {
	background: url("/images/misc/skull.png") no-repeat center center transparent;
	width:73px;
	height:75px;
	top:12px;
	left:12px;
	z-index:21;
	position:absolute;	
	display: none;
}
/* skull end */

/*frozen */
.token .overlay-frozen {
	background: url("/images/token-frozen.png") no-repeat center center transparent;
	width:157px;
	height:135px;
	top:-4px;
	left:-27px;
	z-index:6;
	position:absolute;	
}
/* frozen end */

/*silenced */
.token .overlay-silenced {
	background: url("/images/token-silenced.png") no-repeat center center transparent;
	width:123px;
	height:137px;
	top:-8px;
	left:-14px;
	z-index:8;
	position:absolute;	
}
/* silenced end */

/*stealthed */
.token .overlay-stealthed {
	background: url("/images/token-stealthed.png") no-repeat center center transparent;
	width:86px;
	height:116px;
	top:2px;
	left:9px;
	z-index:2;
	position:absolute;	
}
/* stealthed end */

/*divine-shield */
.token .overlay-divine-shield {
	background: url("/images/token-divine-shield.png") no-repeat center center transparent;
	width:157px;
	height:186px;
	top:-23px;
	left:-29px;
	z-index:20;
	position:absolute;	
}
/* divine-shield end */

/*taunt */
.token .overlay-taunt {
	background: url("/images/token-taunt.png") no-repeat center center transparent;
	width:119px;
	height:155px;
	top:-4px;
	left:-6px;
	z-index:5;
	position:absolute;	
}
/* taunt end */

.test-card-wrapper {
	min-height:260px;
	display:block;
	min-width:900px;
	width:100%;
	margin:0 auto;
	text-align:center;
	position:absolute;
	/*left:50px;*/
	left:0;
	top:730px;
	border:1px solid transparent;
}
.test-token-wrapper {
	min-height:130px;
	display:block;
	width:866px;	
	margin:0 auto;	
	/*border:1px solid #555;
	border-radius: 6px 6px 6px 6px;
	background-color: #242424;
	box-shadow: 3px 3px 5px #000000;*/
	text-align:center;
	/*box-shadow: 2px 2px 3px #000000;*/
	position:absolute;	
	left:120px;
	border:1px solid transparent;
	border-radius: 6px 6px 6px 6px;
}
.test-token-wrapper.enemy {
	top:203px;
	
}
.test-token-wrapper.my {
	top:357px;
}

#puzzle-card-results ul li {
	cursor:pointer;		
}
#puzzle-card-results ul li span {
	font-size:12px;
}
#puzzle-card-results ul li:hover {
	background-color:#202020;	
}
#puzzle-card-destroy {
	background:url("/images/buttons/puzzle-trash.png") no-repeat scroll center center transparent; 
	margin-top:30px;
	min-height:100px; 
	text-align:center;
	border: 1px solid #333333;
	border-radius: 6px 6px 6px 6px;
}
.puzzle-ui-state-active {
	/*background-color:#000D20 !important;
	border-color:#0E3869;	*/
	border:1px solid #555555 !important;
	background-color:rgba(0,0,0,0.5) !important;
}
.puzzle-ui-state-hover {
	/*background-color:#777777 !important;*/
	background-color:rgba(0,0,0,0.2) !important;
	border-color:#244F72 !important;	
}

#my-card-wrapper {
	
}

#puzzle-board .puzzle-class {
	position:absolute;	
	width:125px;
	height:143px;
	display:block;
	cursor:pointer;
}
#puzzle-board .puzzle-class:hover {
	opacity:0.9;
}

#puzzle-board .puzzle-class.enemy {
	left:490px;
	top:42px;
}
#puzzle-board .puzzle-class.player {
	left:493px;
	top:525px;
}

.puzzle-class .health {
	background: url("/images/health-01.png") no-repeat scroll center center transparent;
	display:block;
	position:absolute;
	width:39px;
	height:50px;
	z-index:5;	
	left:98px;
	top:104px;
	line-height: 50px;
    text-align: center;
	cursor:pointer;	
}

.puzzle-class .attack {
	background: url("/images/misc/sword-gold.png") no-repeat scroll center center transparent;
	display:block;
	position:absolute;
	width:46px;
	height:52px;
	z-index:5;	
	left:-25px;
	top:100px;
	line-height: 60px;
    text-align: center;
	cursor:pointer;
	padding-left:10px;
}

.puzzle-class .armor {
	background: url("/images/misc/shield.png") no-repeat scroll center center transparent;
	display:block;
	position:absolute;
	width:40px;
	height:47px;
	z-index:5;	
	left:95px;
	top:62px;
	line-height: 50px;
    text-align: center;
	cursor:pointer;	
}

.puzzle-mana {
	position:absolute;
	display:block;
	width:65px;
	height:31px;
	text-align:center;
	cursor:pointer;
	/*background:url("/images/misc/mana-status-bg.png") no-repeat scroll center center transparent;*/
}
.puzzle-mana:hover {
	opacity:0.8;
}
.puzzle-mana.enemy {
	left:719px;
	top:0;	
}
.puzzle-mana.player {
	left:751px;
	top:713px;	
}

.hero-power-wrapper {
	position:absolute;
	display:block;
	width:113px;
	height:120px;
}

.hero-power-wrapper.enemy {
	left:627px;
	top:82px;	
}
.hero-power-wrapper.player {
	left:630px;
	top:533px;	
}
.hero-power-overlay {
	position:absolute;
	display:block;
	width:100%;
	height:100%;
	background:url("/images/hero-power/hero-power-overlay.png") no-repeat scroll center center transparent;
	z-index:5;
}

.hero-power-wrapper .ability {
	position:absolute;
	display:block;
	width:71px;
	height:69px;
	left:22px;
	top:30px;	
}

/* hero weapon */
.hero-weapon-wrapper {
	position:absolute;
	display:block;
	width:150px;
	height:135px;
}

.hero-weapon-wrapper.enemy {
	left:327px;
	top:70px;	
}
.hero-weapon-wrapper.player {
	left:330px;
	top:533px;	
}
.hero-weapon-overlay {
	position:absolute;
	display:block;
	width:100%;
	height:100%;
	background:url("/images/misc/weapon-frame.png") no-repeat scroll center center transparent;
	z-index:5;
}
.hero-weapon-durability {
	position:absolute;
	display:block;
	width:35px;
	height:35px;
	right:10px;
	bottom:10px;
	line-height:35px;
	text-align:center;
	background:url("/images/misc/weapon-durability.png") no-repeat scroll center center transparent;
	z-index:6;
}
.hero-weapon-attack {
	position:absolute;
	display:block;
	width:35px;
	height:35px;
	left:20px;
	bottom:10px;
	line-height:35px;
	text-align:center;
	background:url("/images/misc/weapon-attack.png") no-repeat scroll center center transparent;
	z-index:6;
}

.hero-weapon-wrapper .weapon {
	position:absolute;
	display:block;
	width:112px;
	height:100px;
	left:20px;
	top:17px;	
}

.puzzle-bg-overlay {
	position:absolute;
	display:block;
	width:100%;
	height:100%;
	background:url("/images/background/puzzle-bg-3.jpg") no-repeat scroll 0 -35px #242424;
}
#puzzle-mana-bar-wrapper {
	display:block;
	position:absolute;
	top:716px;
	left:827px;
	max-width:250px;
	height:24px;	
}
.mana-crystal {
	background:url("/images/sprites/mana-dual.png") no-repeat scroll 0 0 transparent;	
	width:24px;
	height:24px;
	display:inline-block;
	position:relative;
}
.mana-crystal.faded {
	background-position:0 -24px;	
}
#puzzle-options-wrapper {
	margin-bottom:10px;
	border: 1px solid #333333;
	border-radius: 6px 6px 6px 6px;
	background-color:#202020;
	padding:5px 10px;
}
#puzzle-options-wrapper .options-toggle {
	text-align:right;
	cursor:pointer;
	color:#FFBA00;
}
#puzzle-options-wrapper .options-data {
	display:none;		
}

#puzzle-description {
	border: 1px solid #333333;
	border-radius: 6px 6px 6px 6px;
	padding:5px 10px;
	margin-bottom:10px;
	background-color:#202020;
}
#puzzle-description .ptitle {
	display:block;
	text-align:center;
	color:#1EFF00;
	font-size:14px;
	margin:10px auto;
}
#puzzle-description .pcomment {
	display:block;
	text-align:left;
	color:#AAAAAA;
	font-size:11px;
	margin:0 10px 10px;
}
#puzzle-description .plink a {
	display:block;
	text-align:right;
	color:#FFBA00;
}
/* buttons */
.btn {
	cursor:pointer;
	display:inline-block;
	height:31px;	
	width:auto;	
	background:url("/images/buttons/hearthstone-logo.png") no-repeat scroll 0 0 transparent;
}
.btn:hover {
	background-position:0 -31px !important;	
}
.btn.save-puzzle {	
	background-image:url("/images/buttons/hearthstone-logo.png");
}
.btn span {
	color:#FFBA00;
	display:inline-block;
	height:100%;
	padding-left:40px;
	line-height:31px;
	font-size:14px;	
}
.btn span:hover {
	color:#FFFFFF;
	text-shadow:0 0 10px #FFFFFF;	
}

.deck-viewer-options {
	background-color: #242424;
    box-shadow: 2px 2px 3px #000000;
    color: #DDDDDD;
    height: auto;
    line-height: 30px;
    margin-bottom: 10px;
    text-align: left;
	max-height:85px;
	overflow: hidden;
    position: relative;
}

/* deck-list */
#deck-list {
	position:relative;
	display:block;	
}
#deck-list .deck-list-content {
    float: left;
    width: 100%;
}
#deck-list .deck-list-ads {
    float: left;
    margin-left: -160px;
    min-height: 600px;
    width: 160px;			
}
.ad-160x600 {
    min-height: 600px;
    min-width: 160px;
	background:url(/images/misc/ad160x600.png) no-repeat scroll 0 0 transparent;			
}
.ad-300x250 {
    min-height: 250px;
    min-width: 300px;
	background:url(/images/misc/ad300x250.png) no-repeat scroll 0 0 transparent;			
}

#deck-list .deck-list-item {
	display:inline-block;
	height:85px;
	width:27%;
	margin:3px 5px;
	border:1px solid #404040;
	background-color:#242424;
	position: relative;	
	box-shadow: 2px 2px 5px #000000;
}
#deck-list .deck-list-item:hover {
	border:1px solid #FFBA00;
}
#deck-list .deck-list-item a {
	display:inline-block;
	height:100%;
	width:100%;
}
.hero-portrait-transparent {
	background:	url(/images/sprites/hero-portrait-transparent.png) no-repeat scroll 0 85px transparent;
	display:block;
	position:absolute;
	right:0;
	top:0;
	width:108px;
	height:85px;			
}
.hero-portrait-transparent.neutral {background-position:0 85px;}
.hero-portrait-transparent.druid {background-position:0 0;}
.hero-portrait-transparent.hunter {background-position:0 -85px;}
.hero-portrait-transparent.mage {background-position:0 -170px;}
.hero-portrait-transparent.paladin {background-position:0 -255px;}
.hero-portrait-transparent.priest {background-position:0 -340px;}
.hero-portrait-transparent.rogue {background-position:0 -425px;}
.hero-portrait-transparent.shaman {background-position:0 -510px;}
.hero-portrait-transparent.warlock {background-position:0 -595px;}
.hero-portrait-transparent.warrior {background-position:0 -680px;}

#deck-list .deck-list-item .hero-class {
	position:absolute;
	display:block;
	left:0;
	top:50px;
	width:60px;
	height:10px;
	line-height:10px;
	font-size:10px;
	text-align:center;	
}

#deck-list .deck-list-item .deck-card-quality-wrapper {
	position:absolute;
	display:block;
	left:200px;
	top:10px;
	height:auto;
	width:auto;
}
#deck-list .deck-list-item .deck-card-quality {
	font-size:10px;
	display:block;
	position:relative;
	height:10px;
	margin:4px 0;
}
#deck-list .deck-list-item .deck-card-quality.rare {
	color:#0070dd;
}
#deck-list .deck-list-item .deck-card-quality.epic {
	color:#a335ee;
}
#deck-list .deck-list-item .deck-card-quality.legendary {
	color:#ff8000;
}

#deck-list .deck-list-item .deck-votes {
	position:absolute;
	display:block;
	right:5px;
	bottom:5px;
	height:10px;
	width:auto;
	line-height:10px;
	font-size:10px;	
	color:#777;
}
#deck-list .deck-list-item .deck-votes .vote-neutral { color:#FFFFFF;}
#deck-list .deck-list-item .deck-votes .vote-good { color:#00FF00;}
#deck-list .deck-list-item .deck-votes .vote-bad { color:#FF0000;}

.deck-list-item .card-icon {
	position:absolute;
	top:3px;
	left:8px;
	padding-left: 4px;
    padding-top: 4px;
}
.deck-list-item .card-icon .icon-overlay {
	background-image: url("/images/default_icon_border_medium.png");
    background-position: center center;
    background-repeat: no-repeat;
    display: block;
    height: 44px;
    left: 0;
    position: absolute;
    top: 0;
    width: 44px;
    z-index: 30;
}
.mana-values {
	background-color:#141414;
	display:block;
	position:absolute;
	width:129px;
	height:73px;
	top:7px;
	left:60px;
}
.mana-values .bar-mana {
    background-color: #FFBA00;
    bottom: 17px;
    display: block;
    height: 50px;
    position: absolute;
    width: 13px;
	z-index:1;
	opacity:0.5;
}
.deck-list-item:hover .mana-values .bar-mana {
	background-color: #FFBA00;
	opacity:1;	
}
.mana-values .bar-mana.cost-0 {left: 0;}
.mana-values .bar-mana.cost-1 {left: 17px;}
.mana-values .bar-mana.cost-2 {left: 33px;}
.mana-values .bar-mana.cost-3 {left: 48px;}
.mana-values .bar-mana.cost-4 {left: 65px;}
.mana-values .bar-mana.cost-5 {left: 81px;}
.mana-values .bar-mana.cost-6 {left: 97px;}
.mana-values .bar-mana.cost-7 {left: 113px;}
.mana-values .overlay {
	background: url("/images/misc/mana-grid-small.png") no-repeat scroll 0 0 transparent;
	display:block;
	position:absolute;
	width:100%;
	height:100%;
	z-index:99;
}

/* BUTTONS */
.hs-ui-button, .hs-ui-cancel {
    background: none repeat scroll 0 0 transparent;
    border: 0 none;
    cursor: pointer;
    display: inline-block;
    height: auto;
    margin: 0;
    outline: medium none;
    overflow: visible;
    padding: 0;
    vertical-align: middle;
}
.hs-ui-button span, .hs-ui-cancel span {
    cursor: pointer;
    display: inline-block;
    font-family: "Lucida Sans Unicode", Arial, Helvetica, sans-serif;;
    font-size: 12px;
    font-weight: normal;
    height: 38px;
    line-height: 38px;
    margin: 0;
    outline: medium none;
    padding: 0;
    text-align: center;
    text-decoration: none;
    text-transform: uppercase;
    white-space: nowrap;
}
.button1 span {
    background-image: url("http://www.hsdeck.com/images/buttons/button-1-1.png");
    background-repeat: no-repeat;
    color: #FFBA00;
}
.button1 span:hover {
    color: #FFFFFF;
}
.hs-ui-button span span.wide {
    width: 220px;
}
.hs-ui-button span {
    background-position: 0 0;
    padding: 0 0 0 28px;
}
.hs-ui-button span span {
    background-image: url("http://www.hsdeck.com/images/buttons/button-1-1.png");
    background-position: 100% -123px;
    padding: 0 28px 0 0;
}
.hs-ui-button.disabled, .ui-button.processing {
    cursor: default;
}
.hs-ui-button.disabled span, .hs-ui-button.disabled:hover span, .hs-ui-button.disabled.hover span, .hs-ui-button.processing span, .hs-ui-button.processing:hover span, .hs-ui-button.processing.hover span {
    background-position: 0 -82px;
    cursor: default;
}
.hs-ui-button.disabled span span, .hs-ui-button.disabled:hover span span, .hs-ui-button.disabled.hover span span, .hs-ui-button.processing span span, .hs-ui-button.processing:hover span span, .hs-ui-button.processing.hover span span {
    background-position: 100% -205px;
    color: #8D9C94;
    cursor: default;
}