Panel w/ HTML, CSS, & Bootstrap

<div class="myPanel">
			<div class="heading">Header</div>
			<div class="body">Body</div>
			<div class="showOnHover">
				<a href="" class="btn btn-xs btn-danger">Delete</a>
			</div>
		</div>

		<div class="myPanel">
			<div class="heading">Header</div>
			<div class="body">Body</div>
			<div class="showOnHover">
				<a href="" class="btn btn-xs btn-danger">Delete</a>
			</div>
		</div>

		<div class="myPanel">
			<div class="heading">Header</div>
			<div class="body">Body</div>
			<div class="showOnHover">
				<a href="" class="btn btn-xs btn-danger">Delete</a>
			</div>
		</div>
------------------------------------------------------------------------------------------------------------------------------
.myPanel
{
	margin: 3%;
	border: 1px solid #687D6D;
	border-radius: 5px;
	/* x y blur color */
	box-shadow: 0px 0px 4px #ccc;
}

.myPanel .heading
{
	background: #B6F0C4;
	/* the curved corners */
	border-radius: 5px 5px 0 0;
	color: #687D6D;
	padding: 10px 20px;
}

.myPanel .body
{
	padding: 10px 20px;
}

.myPanel .showOnHover
{
	/* they aren't going to show at all */
	display: none;
}

/* this is for whenever you hover your myPanel*/
.myPanel:hover
{
	box-shadow: 0px 0px 8px #666;
	border: 2px solid #687D6D;
	margin: 1% 3%;
}

/* show .showOnHover whenever you hover on myPanel */
.myPanel:hover .showOnHover
{
	/* go back to what it was before */
	display: inline-block;
}

/*
	this is for broswers that don't support the border-radius tag
	-webkit-border-radius: 5px 5px 0 0;
	this is for mozilla firefox
	-moz-border-radius: 5px 5px 0 0;
	this is for opera
	-o-border-radius: 5px 5px 0 0;
*/