
#colorwheel {
	position: relative;
	float: right;
	width: 350px;
	height: 410px;
	background-color: white;
	border: solid 1px black;
	margin-bottom: 1em;
	margin-left: 1em;
}


#content #colorwheel p {
	position: absolute;
	bottom: 0em;
	font-size: 0.9em;
	text-align: justify;
	line-height: 1.1em !important;
	padding: 0 1em;
}



div.testBlock {
	position: absolute;	
	width: 125px;
	height: 40px;
	padding: 5px;
	top: 145px;
	left: 100px;
	border: solid 1px black;
	color: white;
	text-align: left;
	-sand-transform: rotate(90deg);
	font-size: 15px;
	font-weight: bold;
	
	
	
}
div.testBlock span {
	display: block;
	text-align: left;
	padding: 7px;
	width: 115px;
	
	
}

div.testBlock span strong {
	
	font-size: 18.5px;
}

#o1 {
	background: hsla(0, 75%, 50%, 1);
	-sand-transform: rotate(0deg) translateY(-80px) rotate(90deg);
}

#o2 {
	background: hsla(60, 75%, 50%, 1);
	-sand-transform: rotate(60deg) translateY(-80px) rotate(90deg) scale(-1, -1);;
}

#o2, #o3 {
	
}

#o2 span, #o3 span {
	text-align: right;
	
}
	

#o3 {
	background: hsla(120, 75%, 50%, 1);
	-sand-transform: rotate(120deg) translateY(-80px) rotate(90deg) scale(-1, -1);;
}

#o4 {
	background: hsla(180, 75%, 50%, 1);
	-sand-transform: rotate(180deg) translateY(-80px) rotate(90deg);
	
}

#o5 {
	background: hsla(240, 75%, 50%, 1);
	-sand-transform: rotate(240deg) translateY(-80px) rotate(90deg);
	
}

#o6 {
	background: hsla(300, 75%, 50%, 1);
	-sand-transform: rotate(300deg) translateY(-80px) rotate(90deg);
}

.example {
	padding: 10px;
	color: white;
	width: 20em;
	margin: 0 auto 2em auto;

}

.purple {
	background: hsl(270, 100%, 50%);
}

.bluePurple {
	background: hsl(255, 100%, 50%);
}

.magentaPurple {
	background-color: hsl(285, 100%, 50%);
}

#colorfulnessTable td, #brightnessTable td, #alphaTable td, #gradientTable td {
height: 100px;
}

table#colorfulnessTable td.c1 {
	background-color: hsl(120, 0%, 50%);
}

table#colorfulnessTable td.c2 {
	background-color: hsl(120, 25%, 50%);
}

table#colorfulnessTable td.c3 {
	background-color: hsl(120, 50%, 50%);
}

table#colorfulnessTable td.c4 {
	background-color: hsl(120, 75%, 50%);
}

table#colorfulnessTable td.c5 {
	background-color: hsl(120, 100%, 50%);
}

table#brightnessTable td.c1 {
	background-color: hsl(120, 50%, 0%);
}

table#brightnessTable td.c2 {
	background-color: hsl(120, 50%, 25%);
}

table#brightnessTable td.c3 {
	background-color: hsl(120, 50%, 50%);
}

table#brightnessTable td.c4 {
	background-color: hsl(120, 50%, 75%);
}

table#brightnessTable td.c5 {
	background-color: hsl(120, 50%, 100%);
}

table#alphaTable tr,  table#gradientTable tr{
	background-image: url(/prx/000/http/www.useragentman.com/tests/cssSandpaper/images/background.gif);
}

table#alphaTable td.c1 {
	background-color: hsla(120, 50%, 50%, 0);
}

table#alphaTable td.c2 {
	background-color: hsla(120, 50%, 50%, 0.25);
}

table#alphaTable td.c3 {
	background-color: hsla(120, 50%, 50%, 0.5);
}

table#alphaTable td.c4 {
	background-color: hsla(120, 50%, 50%, 0.75);
}

table#alphaTable td.c5 {
	background: hsla(120, 50%, 50%, 1);
}

table#gradientTable td.c1 {
	background: -sand-gradient(linear, center top, center bottom, from(hsla(60, 100%, 50%, 0.8)), to(hsla(255, 100%, 50%, 0.2)));
}

blockquote.smaller {
	margin-right: 370px !important;
}