bucket.css

.bucket-deposit {
    padding:10px;
    background:#f0f0f0;
    border:1px solid #ccc;
    text-align:center;
}

.bucket-store {
    padding:10px;
    background:#f7f7f7;
    border:1px solid #ccc;
    border-top:0;
}

.bucket-actions {
    background:#fff;
    text-align:center;
    padding:10px;
}

.bucket-actions button {
    color:#aaa;
    font:inherit;
    background:#f7f7f7;
    border:1px solid #888;
    border-radius:3px;
    padding:10px 20px;
    line-height:10px;
    height:30px;
}

.bucket {
    color:#aaa;
    box-shadow: inset 1px 1px 1px 1px #eee;
    border:1px solid #888;
    border-radius:20px;
    padding:10px 20px;
    line-height:20px;
    height:40px;
    display:inline-block;
    background:#fff;
    transition:all 400ms;
    -webkit-transition:all 400ms;
}

.bucket.filled {
    background:#BBDAB4;
    box-shadow:none;
    color:#444;
}

.remove-button {
    background:#D8E7D5;
    width:20px;
    height:20px;
    border-radius:10px;
    font-weight:bold;
    vertical-align:bottom;
    line-height:17px;
    text-align:center;
    display:inline-block;
    cursor:pointer;
    margin-left:10px;
}

.bucket-join .bucket {
    border-radius:0;
    border-right:0;
}

.bucket-join .bucket:first-child {
    border-radius:20px 0 0 20px;
}

.bucket-join .bucket:last-child {
    border-right:1px solid #888;
    border-radius:0 20px 20px 0 ;
}

.bucket-source {
    border:1px solid #888;
    border-radius:20px;
    padding:10px 20px;
    line-height:20px;
    height:40px;
    display:inline-block;
    background:#fff;
}

.example {
    background:#eee;
}