div.progressbar {border: 1px solid #db7a15; background-color: #efefef; width: 200px; border-radius: 3px; -o-border-radius: 3px; -moz-border-radius: 3px; -webkit-border-radius: 3px; text-align: center;}
div.result_bar {float: left; font-weight: bold; line-height: 20px; padding: 3px 0 0 5px; width: 100%}
div.pgbar {display: block; width: 90%; border: 1px solid #db7a15; background-color: #efefef; min-width: 105px; border-radius: 3px; -o-border-radius: 3px; -moz-border-radius: 3px; -webkit-border-radius: 3px; text-align: center;}
div.count_pb {float: left; padding-left: 5px; padding-top: 3px; font-size: 12px; min-width: 105px;}
div.text_pb {float: right; padding-right: 10px; text-align: center; font-size: 11px; font-weight: bold; color: #333; line-height: 20px; text-shadow: 0px 0px 2px #fed; display: block;}
div.percent_pb {background-color: #e39119; height: 20px; border-radius: 2px; -o-border-radius: 2px; -moz-border-radius: 2px; -webkit-border-radius: 2px; z-index: 10; }
.pb_participant  {width: 160px}
.pb_participant_name  {font-size: 12px; display: block;}
.pb_participant_img  {float: left;}

@media screen and (min-width: 380px) {
	div.pgbar {min-width: 50px;}
}

@media screen and (min-width: 800px) {
	div.pgbar {width: 50%; float: left;}
	div.count_pb {width: 30%; padding-left: 10px;}
	.pb_participant  {width: 250px}
	.pb_participant_name  {font-size: 12px; float: left;}
	.pb_participant_img  {float: right;}
}

@media screen and (min-width: 1200px) {
	div.pgbar {width: 71%; float: left;}
	div.count_pb {width: 20%; padding-left: 10px;}
	.pb_participant  {width: 290px}
	.pb_participant_name  {font-size: 14px;}
}