div#drawToolContainer {
    width:800px;
    
}

div#drawToolContainer h2 {
    margin-bottom:10px;
}
div#drawToolContainer .mup,
div#drawToolContainer .mup2
{
    width:740px;
    margin-left:10px;
    margin-bottom:30px;
}
div#drawToolContainer .mup2 {
    margin-bottom:10px;
}

canvas#zoomedArea {
    display:inline;
    float:left;
}
canvas#paletteArea {

    float:left;
    display:inline;
    margin-left:30px;
}
canvas#drawArea {
    display:none;
}

div.leftPanel .undoBtn {
    margin-top:82px;
}
div.leftPanel {
    width:56px;
    overflow:hidden;
    margin-right:20px;
    float:left;
}
ul#panel {
    margin:0;
    padding:0;
    width: 56px;

}
ul#panel li {
    list-style: none;
    padding:0;
    margin:0;
    padding-bottom:10px;
    width:56px;
    height:53px;
}
img.newBtn {
    margin:20px 0 20px;
}
ul#panel li.brush {
    background: url(../i/drawtool/brush.png) no-repeat;
}
ul#panel li.eyedropper {
    background: url(../i/drawtool/eyedropper.png) no-repeat;
}
ul#panel li.fill {
    background: url(../i/drawtool/fill.png) no-repeat;
}
ul#panel li.eraser {
    background: url(../i/drawtool/eraser.png) no-repeat;
}
ul#panel li img {
    display:none;
}
ul#panel li div.colorbox {
    margin-left:6px;
}
ul#panel li div.colorbox div.outer1 {
    position:relative;
    border:1px solid black;
    width:26px;
    height:26px;
}
ul#panel li div.colorbox div.outer2 {
    position:relative;
    border:1px solid black;
    width:26px;
    height:26px;
    left:16px;
    top:16px;
}
ul#panel li div.colorbox div.outer1 div.color1 {
    width:24px;
    height:24px;
    background-color:yellow;
    border:1px solid white;
    z-index: 4;
}
ul#panel li div.colorbox div.outer2 div.color2 {
    width:24px;
    height:24px;
    background-color:lightblue;
    border:1px solid white;
    z-index: 3;
}
#tileMatrix {
    float:left;
    padding-top:14px;
    padding-left:30px;
}
#tileMatrixImgs {
    width:96px;
    height:96px;
    overflow:hidden;
}
#tileMatrixImgs img {
    padding:0;
    margin:0;
    width:32px;
    height:32px;
    display:block;
    float:left;
}
#actualSize {
    float:left;
    padding-top:14px;
    padding-left:30px;
}
#actualSizeImgs {

}
#actualSizeImgs img {
    width:64px;
    height:64px;
    padding:0;
    margin:0;
    image-rendering:optimizeSpeed;
    image-rendering:-moz-crisp-edges;
    image-rendering:-o-crisp-edges;
    image-rendering:optimize-contrast;
    image-rendering:-webkit-optimize-contrast;
    -ms-interpolation-mode: nearest-neighbor;
}
div#bottomBar {
    margin-top:20px;
    margin-left:76px;
    width:388px;
}
div#bottomBar .save {
    float:left;
}
div#bottomBar .clear {
    float:right;
}
div#myTiles {
    image-rendering:optimizeSpeed;
    image-rendering:-moz-crisp-edges;
    image-rendering:-o-crisp-edges;
    image-rendering:optimize-contrast;
    image-rendering:-webkit-optimize-contrast;
    -ms-interpolation-mode: nearest-neighbor;
}

div#myTiles div {
    float: left;
    width:68px;
    height:68px;
    padding:20px;
    margin:4px;
    background: #eee;
    overflow: hidden;
}
div#myTiles div.hot {
    background: #dfd;
}

div#myTiles img.thumb {
    width:64px;
    height:64px;
    border:2px solid black;
    padding:2px;
}
div#myTiles img.selected {
    border:2px dashed yellowgreen;
}
div.br {
    clear:both;
}