body{
	padding:0;
	margin:0;
	border:0;
}
#ui{
	background:#c0c0c0;
	border:0;
	border-bottom-color:#404040;
	border-right-color:#404040;
	font:12px Arial, Helvetica, sans-serif;
	font-weight:bold;
	height:480px;
	margin:0;
	padding:0;
	position:relative;
	text-align:center;
	width:640px;
}
#ui>div,#ui.on>span{display:none;}
#ui.on>div,#ui>span{display:block;}
#ui>span{
	margin:-100px 0 0 -100px;
	position:absolute;
	top:50%;left:50%;
	width:200px;
}
#ui>span a{
	display:block;
	height:28px;
	margin:5px 0 5px 50px;
	width:100px;
}
#ui>span a>b{
	background:#c0c0c0;
	height:25px;
	line-height:25px;
	width:97px;
}
#ui>div{
	margin:0;
	text-align:center;
	width:63px;
}
#ui>div>div{
	border:solid 1px #808080;
	border-bottom-color:#fff;
	border-right-color:#fff;
}
#ui>div>div>div{
	border:solid 1px #000;
	border-bottom-color:#c0c0c0;
	border-right-color:#c0c0c0;
}

a{
	border:solid 1px #fff;
	border-bottom-color:#000;
	border-right-color:#000;
	cursor:default;
	display:inline-block;
}
a>b{
	border:solid 1px rgba(0,0,0,0);
	border-bottom-color:#808080;
	border-right-color:#808080;
	display:block;
	margin:1px;
}
a:active{
	background:#808080;
	border-color:#000;
}

#forms{
	margin-bottom:3px;
}
#forms a{
	height:45px;
	margin:1px 0 -2px 0;
	width:55px;
}
#forms b{
	background:#c0c0c0 url(style.png);
	height:42px;
	width:52px;
}
#trapeze>b{background-position:0 -45px;}
#hexagon>b{background-position:0 -90px;}
#square>b{background-position:0 -135px;}
#triangle>b{background-position:0 -180px;}
#rhomb>b{background-position:0 -225px;}

#colors{
	margin:3px 0;
}
#colors a{
	height:21px;
	margin:1px 0 -1px 0;
	width:26px;
}
#colors b{
	height:18px;
	width:23px;
}
#colors a.red>b{	background:#ff0000;}
#colors a.orange>b{background:#ffc800;}
#colors a.yellow>b{	background:#ffff00;}
#colors a.white>b{	background:#ffffff;}
#colors a.green>b{	background:#57ee4f;}
#colors a.blue>b{	background:#64bfff;}

#btnDelete,#btnClear,#btnBack{
	height:24px;
	margin:1px 0;
	width:60px;
}
#btnDelete b,#btnClear b,#btnBack b{
	background:#c0c0c0;
	font-size:12px;
	height:21px;
	line-height:21px;
	width:57px;
}
#btnBack>b{
	font-size:24px;
}

#gfx{
	height:470px;
	position:absolute;
	top:5px;right:5px;
	width:560px;
}
#gfx>div{
	background:#e0e0e0;
	height:468px;
}
.axes>div{background:#e0e0e0 url(axes.png) no-repeat center center!important;}
.u3 #gfx,.u4 #gfx{height:440px;}
.u3 #gfx>div,.u4 #gfx>div{height:438px;}

#axes{
	background:url(style.png) no-repeat 0 -350px;
	cursor:pointer;
	position:absolute;
	bottom:5px;left:7px;
	height:17px;line-height:17px;
	text-align:left;
	padding-left:22px;
	width:30px;
}
.axes #axes{background-position:0 -370px}

#trash{
	background:url(style.png) -10px -270px;
	height:31px;
	position:absolute;
	bottom:5px;right:5px;
	width:31px;
}
#trash.hover{
	background-position:-10px -305px;
}

svg{
	position:absolute;
	top:0;left:0;
}

#composite,#dilation{
	display:none;
	margin-top:5px;
}
.u3 #dilation,.u4 #composite{display:inline-block}
#s1{margin-right:100px;}
#s2{margin-right:-25px}

#slider{
	background:url(style.png) 0 -425px;
	height:22px;
	position:relative;
	width:200px;
}
#crs{
	background:url(style.png) 0 -400px;
	height:22px;
	position:absolute;
	width:20px;
}
#crs.hover{
	background-position:-25px -400px;
}
#crs2{
	color:#00f;
	font-size:14px;
	font-weight:100;
	line-height:22px;
	position:relative;
	margin-left:215px;
}

pattern>circle{stroke: none; fill: #000}
#res polygon,#Res polygon{stroke:#c0c0c0;stroke-width:1}
#svg>polygon,#svg>g>polygon{stroke:#000;stroke-width:1}

#crsTranslation,#crsRotation,#crsReflection,#crsDilation,#c4Line,
#CrsTranslation,#CrsRotation,#CrsReflection,#CrsDilation{display:none}
.u0 #crsTranslation,.u1 #crsRotation,.u2 #crsReflection,.u3 #crsDilation,.u3 #c4Line{display:block;}

path{fill:rgba(0,0,0,0);stroke:#000;}
.crs{fill:rgba(128,0,0,0);}
.touch .crs{fill:rgba(0,128,0,0);}
.white{stroke:#fff;}
.dotted{stroke-dasharray:5,5;}
.off{display:none}
.active .off{display:block}
.active #c1Line,.active #C1Line{stroke-width:3}

#c2Angle,#C2Angle{stroke:#fff;}
#c2Border,#C2Border{stroke:#000;}
#c2Angle,#c2Lines,#c2Border,#c2AngleArc,#c2Arrow,
#C2Angle,#C2Lines,#C2Border,#C2AngleArc,#C2Arrow{fill:none}
#c2Text{
	color:#000;
	font:12px Arial;
}

#c3White,#C3White{
	stroke:#fff;
	stroke-dasharray:5,5;
}