html, body {
    margin: 5px;
    padding: 0;
}

h2 {margin:0;}
h3 {margin:0;}
.clear {clear:both; float:none;}

.AttributeClass {
    float: left;
    padding: 1em;
}

.circle {
    width: 0.9em;
    height: 0.9em;
    cursor: pointer;
    background-color: aliceblue;
    border: 0.1em solid lightgrey;
    display: inline-block;
    vertical-align: top;
    margin-right: 2px;
    border:1px solid #bbb; border-color:#ccc #888 #888 #ccc; border-radius:0.5rem; 
    background: aliceblue linear-gradient(-30deg, #fff, aliceblue);
}

.circleBlack {
	background: black linear-gradient(-215deg, #666, black);
}

.circleGreen {
	background: green linear-gradient(-30deg, #ddffdd, green);
}

.circleRed {
	background: red linear-gradient(-30deg, #ffdddd, red);
}

.textred {
    color: red;
}