/*widget layout css*/
.wr-clear {
    float:none;
    clear:both;
}

/**
	WOW Recruit Widget Layout Stylesheet

	Use the CSS rules below to modify the look of your widget.

	To create additional rules, use the markup below as a guide to WOW Recruit Widget's Layout architecture.

	<div class="wow-recruit-widget">
		<ul class="wr-container">
			<li class="wr-item wr-odd">
				<div class="wr-left">
					<img class="wr-icon" src="images/class-shaman.png" />
				</div>
				<div class="wr-right">
					<div class="wr-class-text wr-shaman">
						Shaman
					</div>
					<div class="wr-status wr-high">
						High
					</div>
					<div class="wr-note">
						Note: Enhancement
					</div>
				</div>
			</li>
			<li class="wr-item wr-even">
				<div class="wr-left">
					<img class="wr-icon" src="images/class-shaman.png" />
				</div>
				<div class="wr-right">
					<div class="wr-class-text wr-shaman">
						Shaman
					</div>
					<div class="wr-status wr-medium">
						Medium
					</div>
					<div class="wr-note">
						Note: Restoration
					</div>
				</div>
			</li>
		</ul>
	<div>
*/

/*widget font settings*/
.wow-recruit-widget {

    /*font-family:verdana,arial,sans-serif;*/
}

.wr-message
{
}
.wr-container {
    font-weight:bold;
    font-size:90%;
    list-style: none;
    padding:0px;
    margin:0px;
}

.wr-item {
    display:block;
    float:left;
    width:175px;
    height:30px;
    padding:5px 0px;
}
.wr-odd {}
.wr-even {}
.wr-left {
    display:block;
    float: left;
    width: 25px;
    height: 30px;
    text-align:center;
}
.wr-right {
    display:block;
    float:left;
    height:30px;
    width:145px;
    position:relative;
}


.wr-class-text {
    display:block;
    margin-left:5px;
    height:15px;
    line-height:15px;
    width:80px;
    position:absolute;
    top:0px;
    left:0px;
}
.wr-status {
    display:block;
    margin-left:5px;
    height:15px;
    line-height:15px;
    width:55px;
    position:absolute;
    top:0px;
    left:90px;
}
.wr-note {
    display:block;
    font-weight:normal;
    font-style:italic;
    color:#cee683;
    line-height:15px;
    height:15px;
    margin-left:5px;
    position:absolute;
    top:15px;
}


/*widget color css*/

/*class icon image sprite*/
.wr-icon {
    vertical-align:middle;
    width: 25px;
    height:25px;
    background-image:url(../img/class-sprite.png);
}	
.wr-deathknight 	{ background-position: 0 0;}
.wr-druid 		{ background-position: -25px 0;}
.wr-hunter 		{ background-position: -50px 0;}
.wr-mage 		{ background-position: -75px 0;}
.wr-paladin 		{ background-position: -100px 0;}
.wr-priest 		{ background-position: -125px 0;}
.wr-rogue 		{ background-position: -150px 0;}
.wr-shaman 		{ background-position: -175px 0;}
.wr-warlock 		{ background-position: -200px 0;}
.wr-warrior 		{ background-position: -225px 0;}

/*status colors, currently using wowprogress.com colors*/
.wr-status3 			{ color:#FF420E; }
.wr-status2 			{ color:#FFD320; }
.wr-status1			{ color:#1EF1A2; }

/*class colors, currently using wowprogress.com colors*/
.wr-deathknight 		{ color: #C41F3B; font-size: 90%; }
.wr-druid 			{ color: #FF7D0A; }
.wr-hunter 			{ color: #ABD473; }
.wr-mage 			{ color: #69CCF0; }
.wr-paladin 			{ color: #F58CBA; }
.wr-priest 			{ color: #FFFFFF; }
.wr-rogue 			{ color: #FFF569; }
.wr-shaman 			{ color: #2459FF; }
.wr-warlock 			{ color: #9482CA; }
.wr-warrior 			{ color: #C79C6E; }