.rate { 
	float: right; 
    width: 165px;        
    border-radius: 2px;
	border: 1px solid rgba(0, 0, 0, 0.2);
	box-shadow: 0px 1px 4px rgba(0, 0, 0, 0.15);
    padding: 4px 8px 8px 8px;
	margin-left:10px;
	margin-bottom:5px;
	
}
.grades_score { float: left; line-height: 14px; font-size: 12px; padding-left:7px;}
.grades_score:hover { text-decoration:underline; color: #360;}
.grades_title {font-size: 11px; margin-bottom: 2px;}

.rate .grades_widget, .rate .grades_widget_disabled  {
	width: 100px;
	height: 13px;
	position: relative;
    float: left;
    border-radius: 2px;
	border: 1px solid rgba(0, 0, 0, 0.2);
	box-shadow: 0px 1px 4px rgba(0, 0, 0, 0.15);
}

.rate .grades_widget {cursor: pointer;}

.rate .grades_widget span {
	display: block;
	height: 100%;
	position: absolute;
	top: 0;
	left: 0;
	z-index: 2;
	background: url("/templates/default/controllers/grades/images/progress.png") left center; 
	width: 0;
	
}


.rate .vote-up{ 
	background: url("/templates/default/controllers/grades/images/green.png") left; 
	width: 0;
	height: 100%;	
	top: 0;
	left: 0;
}

#red_scale{background: url("/templates/default/controllers/grades/images/red.png") left;}
#yellow_scale{background: url("/templates/default/controllers/grades/images/yellow.png") left;}
#green_scale{background: url("/templates/default/controllers/grades/images/green.png") left;}

.grades_info_list .item .score.positive{ background-color:green; }
.grades_info_list .item .score.negative{ background-color:red; }
.grades_info_list .item .score.neutral{ background-color: #C90; }


.clickable{
    cursor: pointer;	
}

.grades_info { float:left; line-height:12px; color:#F00; font-size:10px; margin-top:3px;}
/* Grades info ============================================================== */

#grades_info_window {
    padding:20px;
}

.grades_info_list .item{
    padding:6px 0;
    margin:2px 0;
    border-bottom: dashed 1px #EDEDED;
    min-width: 250px;
    overflow:hidden;
}

.grades_info_list .item:last-child{
    border:none;
}

.grades_info_list .item .score{
    display: inline-block;
    float:left;
    border-radius:4px;
    color:#FFF;
    min-width:25px;
    text-align: center;
    margin-right:10px;
}

.grades_info_list .item .score.positive{ background-color:green; }
.grades_info_list .item .score.negative{ background-color:red; }

.grades_info_list.loading-panel {
    background-color:#F4F8FD;
    background-position: center center;
    border-radius: 5px;
}
.grades_info_list.loading-panel .item{ visibility: hidden; }

.grades_info_pagination { margin-top: 20px; font-size:12px; }
.grades_info_pagination a {
    display: inline-block;
    padding:0 4px; text-decoration: none; color:#34495e; border-radius: 4px;
}
.grades_info_pagination a:hover { background-color:#EDEDED; }
.grades_info_pagination a.active,
.grades_info_pagination a.active:hover { color:#FFF; background-color: #34495e; }

.grades_list_green, .grades_list_yellow, .grades_list_red, .grades_list_gray {
	width: 32px;
	height: 32px;
	font-size: 14px;
	color:#FFF;
	font-weight:bold;
	text-align:center;
	line-height:32px;
	float: right;
	cursor: help
}

.grades_list_green:hover, .grades_list_yellow:hover, .grades_list_red:hover, .grades_list_gray:hover {
	color:#F7EA72;
}
.grades_list_green {
	background: url("/templates/default/controllers/grades/images/grade_green.png") no-repeat left center
}
.grades_list_yellow {
	background: url("/templates/default/controllers/grades/images/grade_yellow.png") no-repeat left center
}
.grades_list_red {
	background: url("/templates/default/controllers/grades/images/grade_red.png") no-repeat left center
}
.grades_list_gray {
	background: url("/templates/default/controllers/grades/images/grade_gray.png") no-repeat left center
}