body     { background-color: #FFFFE7;
           font-family:Arial, sans-serif; font-size:16px;}
input    { font-family:Arial, sans-serif; font-size:16px; }
select   { font-family:Arial, sans-serif; font-size:16px; }

#logo    { position:fixed; top:10px; left:20px;
            width:120px;  height:132px; background-image:url(../icons/fhemicon.png); }
#menu    { position:fixed; top:152px;left:20px; width:140px; }
#hdr     { position:absolute; top:10px; left:180px; }
#content { position:absolute; top:50px; left:180px; bottom:20px; right:10px; }

.devType { padding-top:20px; }
a {  color: #278727; }
img {  border-style: none; }

.wide { width:100%; }

table.block { border:1px solid gray; background: #F8F8E0; }
table.block tr.odd { background: #F0F0D8; }
table.block tr.sel { background: #F0F0D8; }
table { border-radius:8px; }

table#room { border:1px solid gray; width: 100%; background: #D7FFFF; }
table#room tr.sel { background: #A0FFFF; }

#right { position:absolute; top:20px; left:180px; bottom:20px; right:10px; }
h2,h3,h4 { color:#52865D; line-height:1.3;
           margin-top:1.5em; font-family:Arial,Sans-serif; }
div#block { border:1px solid gray; background: #F8F8E0; padding:0.7em; }
div#dist { padding-top:0.3em; }

a img { border-style:none; }

/* detail-selector & slider */
select {  margin-left:5px; margin-right:5px; }
.set,.attr { margin-bottom:5px; float:left; }
.slider { float:left; width:250px; height:26px; }
.set .slider { background:#F0F0D8; border-radius:8px; }
/* timepicker */
.set .set { margin-bottom:2px; margin-top:3px; }

.handle { position:relative; cursor:pointer; width:50px;
          height:20px; line-height:20px; user-select:none;
          border:3px solid; color:#278727; text-align:center; } 
.downText { margin-top:2px; }
