ul.drag-holder {
  margin: 0;
  padding: 0;
  list-style:none

}

ul.drag-holder li {
  padding: 10px 15px;

  line-height:40px;
  text-align: center;
  margin: 2px;
  background:#fff;

 
}



li {
  padding: 10px 15px;
  background: #4ac;
  display: block;
   line-height:40px;
  text-align: center;
  margin: 2px;
}

img {   border: solid 3px #fff;
    -moz-box-shadow: 1px 1px 5px #999;
    -webkit-box-shadow: 1px 1px 5px #999;
        box-shadow: 1px 1px 5px #999;}

ul {
  margin: 0;
  padding: 0;
}

button {background:#DDD; margin:0; color:#257894;}

.audio button.play {

	background:#DDD; color:#257894; font-weight: bold;border-color: #257894;


}
.audio button.pause { background:#DDD; color:#257894;}




.css3-play {
	display: block;

    position: relative;
    border: 6px solid #87CAE0;
    width: 70px;
    height: 70px;
    border-radius: 50%;
    transition: all 0.2s linear;
}
.css3-play:before {
   content: '';
   position: absolute;
top: 9px;
   left: 15px;
   border-left: 40px solid #87CAE0;
   border-top: 20px solid transparent;
   border-bottom: 20px solid transparent;
   transition: all 0.2s linear;

}
.css3-play:after {
    content: '';
	position: absolute;

	font-size: 2em;
	text-align: right;
	width: 152px;
	padding-right:6px;
	opacity: 0;
	color: #87CAE0;
	transition: all 0.25s linear;

}
.css3-play:hover {
    border-color: #257894;
}


.css3-play:hover:before {
   border-left: 40px solid #87CAE0;
}
.css3-play:hover:after{
  display: block;
   border-color: #257894;
	opacity: 1;
	left: 148px;
}

li.ui-draggable {
	cursor:pointer;
}

#cards > li.ui-draggable {
	background:#87CAE0;
	border-radius:8px;
	color:#333;
	
}