@CHARSET "UTF-8";
html,body{margin:0;padding:0;height:100%;left:0;font-size:13px;color:#333;background-color:#eee;-webkit-text-size-adjust:none;box-sizing:border-box;}
ol,ul{list-style:none;margin:0;padding:0}
a{text-decoration:none;color:#69f}
a:hover{text-decoration:underline;}

.wrapper{box-sizing:border-box;width:100%;height:100%;visibility:hidden;overflow:hidden;}
.wrapper.visible{visibility:visible;}


.memoWrap{position:relative;}
.memoItem{position:absolute;top:50px;left:50px;width:200px;height:100px;background-color:#fff;box-sizing:border-box;border:1px solid #666;box-shadow:1px 1px 2px rgba(0,0,0,0.2);}
.memoItem.onTop{box-shadow:4px 4px 6px rgba(0,0,0,0.4);}
.memoItem.color1{background-color:#def;}
.memoItem.color2{background-color:#fde;}
.memoItem.color3{background-color:#efd;}
.memoItem.color4{background-color:#fed;}
.memoItem.color5{background-color:#dfe;}
.memoItem.color6{background-color:#edf;}
.memoItem.color7{background-color:#ddd;}
.memoItem.color8{background-color:lightyellow;}
.memoTitle{position:relative;height:24px;line-height:24px;padding-left:5px;cursor:pointer;}
.memoCont{position:absolute;top:24px;left:0;right:0;bottom:0;background-color:rgba(255,255,255,0.6);}
.memoCont div{position:absolute;top:1px;left:1px;right:1px;bottom:1px;}
.memoCont textarea{display:block;width:100%;height:100%;margin:0;padding:5px;border:none;background:transparent;resize:none;box-sizing:border-box;font-size:14px;}
.memoSize{position:absolute;right:0;bottom:0;width:12px;height:12px;overflow:hidden;cursor:nwse-resize;}
.memoSize:after{content:"";display:block;width:16px;height:16px;background-color:#666;opacity:0.8;transform:rotate(45deg);position:absolute;top:4px;left:4px;}
.memoAdd{position:absolute;top:10px;right:10px;display:block;width:34px;height:34px;cursor:pointer;z-index:500;}
.memoAdd:before,
.memoAdd:after{content:"";display:block;position:absolute;background-color:#69f;}
.memoAdd:before{width:27px;height:3px;top:15px;left:3px;}
.memoAdd:after{width:3px;height:27px;top:3px;left:15px;}
.memoDel{position:absolute;top:0;right:0;height:24px;width:24px;cursor:pointer;}
.memoDel:before,
.memoDel:after{content:"";display:block;width:14px;height:1px;background-color:#666;position:absolute;top:12px;left:6px;}
.memoDel:before{transform:rotate(45deg);}
.memoDel:after{transform:rotate(-45deg);}