/* CSS Document */

*{padding:0; margin:0; list-style:none;}
body{background:#ABCDEF;}
#header{width:900px; height:100px; font-size:36px; background:#672; margin:0 auto; 
text-align:center; line-height:100px;}
#content{ width:880px; height:550px; background:gray; margin:0 auto; padding:10px;}
#tools{height:550; text-align:center;}
#tools li{float:left; width:175px; height:130px; background:#ccc; border-right:1px solid red;}
#image{text-align:left; padding:20px;}
#image li{ height:30px; width:100px; list-style:square inside; border:0}
#image li button{background:gray; border:1px solid #000}
#image li button:hover{background:gray; border:1px solid #fff}

#means,#shape{padding:20px; font-size:12px; width:240px;}
#size{padding:20px; font-size:12px; width:135px;}

#means li,#shape li{width:20px; height:50px; border:1px solid #000; margin-bottom:10px;}
#means li:hover,#shape li:hover{width:20px; height:50px; border:1px solid #fff; margin-bottom:10px;}

#means img,#shape img{width:20px; height:20px;}
#size{padding:10px;}
#size li{height:20px; width:120px; border:1px solid #ccc;}
#size li:hover{height:20px; width:120px; border:1px solid #fff;}

#color{padding:10px;}
#color li{width:25px; height:20px; border:1px solid #000; margin-bottom:10px; margin-right:3px;}
#color li:hover{width:25px; height:20px; border:1px solid #fff; margin-bottom:10px; margin-right:3px;}

#color #red{background:red;}
#color #green{background:green;}
#color #blue{background:blue;}
#color #yellow{background:yellow;}
#color #white{background:white;}
#color #black{background:black;}
#color #pink{background:pink;}
#color #purple{background:purple;}
#color #cyan{background:cyan;}
#color #orange{background:orange;}

#canvas{ background:white;}
#canvas:hover{cursor:crosshair;}
#footer{width:900px; height:30px; background:#672; margin:0 auto; text-align:center;}