background-color voor afbeelding

Ik ben bezig met een webshop aan het maken en graag zou ik de prijs in een cirkel (div met border-radius) plaatsen en deze cirkel boven een afbeelding plaatsten. Nu ben ik er in geslaagd om de tekst voor de image te brengen met z-index, maar dit lukt niet voor de background color, hoe kan ik de background color naar boven brengen? (VB: http://www.spelgezel.nl/spel-zoeken/gevonden.asp?speelduur=&spelers=&spel=kolonisten-catan-2012&leeftijd=strategie&sorteer=naam&rijen=2) Maar dan met cirkels in plaats van met schilden

CODE

index.php

<?php
echo '<div class="bgsec"><h5>'.$gr['name'].'</h5><img src="'.$gr['img1'].'" width="200" height="150" /><br /><div class="price"><s>&euro;'.number_format($gr['price'],2, ',', ' ').'</s><br/><b>&euro;'.number_format($gr['promo'],2, ',', ' ').'</b></div><br /><a href="cart.php?add='.$gr['id'].'">Add to cart</a></div>';
?>

style.css

.bgsec {
	height: 300px;
	width: 200px;
	border-radius: 15px;
	box-shadow: 0 0 3px 3px #ccc; 
	background-color: #ffffff;
	padding: 0 5px 5px 5px; 
}

.bgsec img {
	margin-top: -20px;
	z-index: -1;
}

.price s {
	font-size: 12px;
	margin-left: 20px;
}

.price b {
	margin: 15px 0 0 6px;
}

.price {
	width: 80px;
	height: 80px;
	background-color: #c0392b;
	border-radius: 40px;
	margin-top: -60px;
	z-index: 999;
}