body { font-family:"MS Sans Serif"; font-size:14px; } .fe-opt-header { height:120px; width:100%; position:fixed; top:0; left:0; } .fe-opt-header .top{ padding:10px; } .fe-opt-header .top img{ width:60px; } .fe-opt-header .top .text{ font-size:20pt; position:absolute; top:30px; left:80px; } .fe-opt-header .top .copy-right{ font-size:12px; position:absolute; bottom:35px; right:10px; color:#77C; } .fe-opt-header .bar{ height:30px; width:100%; position:absolute; bottom:0; left:0; border-top:1px solid #78b; background:#def; clear:both; } .fe-opt-header .bar:after { content:"\20"; } .fe-opt-header .bar .text{ float:left; padding:5px; } .fe-opt-header .bar .btn{ float:right; margin:5px 10px; font-weight:bold; color:#00b; cursor:pointer; } .fe-opt-header .bar .btn.close { margin-left:0; margin-right:20px; } .fe-opt-header .bar .btn:hover { color:#b00; } .fe-opt-content { position:absolute; top:120px; left:0; bottom:0; right:0; } .fe-opt-content .left{ position:absolute; top:0; left:0; bottom:0; width:200px; border-right:5px solid #def; } .fe-opt-content .left ul{ margin:0; padding:5px; } .fe-opt-content .left li{ padding:6px 0 6px 20px; cursor:default; margin:4px 0; list-style:none; } .fe-opt-content .left li:hover{ background:#eee; color:#b00; } .fe-opt-content .left li.selected{ background:#eee; color:#b00; } .fe-opt-content .right{ position:absolute; left:210px; } .fe-opt-content .right .title{ margin:20px 0 10px; color:#48b; font-weight:bold; } .fe-opt-content .right ul{ margin:0px; padding:5px; } .fe-opt-content .right ul li{ margin:0 0 0 20px; padding:5px; } .fe-opt-content .right ul.no-list-style li{ margin:0; list-style:none; } .fe-opt-content .right ul li:hover{ background:#f8f8f0; } .fe-hide { display:none; } .fe-opt-footer { }