@import url("ios7Common.css");

/*
Edit: fhainz
*/

body     { background-color: #e5e5e5; font-family:Helvetica; font-weight:300; }
textarea { font-family:Helvetica; font-weight:300; font-size:16px;}
input    { font-family:Helvetica; font-weight:300; font-size:16px;}
select   { font-family:Helvetica; font-weight:300; font-size:16px;}
#back    { position:absolute; top: 2px; left:18px; }
#logo    { position:absolute; top: 2px; left: 2px; 
           width:64px;  height:67px; background-image:url(../images/default/fhemicon_smallscreen.png); }
#menu    { position:absolute; top: 2px; left:65px; }
#console { width:100%; height:100%; position:absolute; overflow-y:auto;}
#hdr     { position:absolute; top:40px; left:65px; }
#content { position:absolute; top:85px; left: 0px; right: 0px;}
#errmsg { background-color: #000000; color: #FFFFFF; position:absolute; top:0px; left:0px; z-index: 10; }

.devType { padding-top:10px; font-size:16px;}
a {  color: #151515; }
img {  border-style: none; }
.col2 { text-align:center; }
tr.column td { padding:0; vertical-align:top;}

div.col1 { width: 188px; height: 30px; white-space: nowrap; }
div.col2 { width: 108px; height: 30px; 
  -webkit-box-pack: center; -moz-box-pack: center; box-pack: center;
  white-space: wrap;
  font-size:16px;
}
div.col1, div.col2 {
  overflow: hidden; text-overflow: ellipsis;

  padding-top: 10px; padding-bottom: 10px;
  padding-left: 5px; padding-right: 5px;
  display: -webkit-box; -webkit-box-align: center;
  display: -moz-box; -moz-box-align: center;

  background: #fff;
}

div.dname, div.dval  {
  width: 152px; 
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
  font-size:16px;
}
div.tiny { font-size:10px; }

table.block { width: 320px; background: #fff; border-spacing:0px; } 
table.block tr { border:1px solid gray; border-spacing:0px; }
table.block tr.odd { background: #fff; }
table.block tr.sel { background: #fff; }
table.block td { width: 150px; border-bottom: 1px solid #cbcbcb; };
table { -moz-border-radius:8px; border-radius:8px; }

#menu #block { visibility: hidden; }
#right { position:absolute; top:85px; left: 0px; right: 0px;
           font-family:Arial, sans-serif; font-size:16px; }
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; }
button.dist { margin:5px; background:transparent; border:0px; cursor:pointer; }

.makeTable { display:inline; float:left; clear:left;
             margin-top:10px; margin-bottom:20px;}
.makeSelect { display:inline; float:left; clear:left; }

.get,.set,.attr { margin-bottom:5px; float:left;}
.slider { float:right; width:320px; height:26px; }
.get .slider,.set .slider,.attr .slider { background:#F0F0D8; }
.handle { position:relative; cursor:pointer; width:50px;
          height:20px; line-height:20px;
          -webkit-user-select:none; -moz-user-select:none; -user-select:none;
          border:3px solid; color:#278727; text-align:center; } 

svg { height:32px; width:32px; fill:#1c7efb; vertical-align:middle; margin:2px 0; }
g.on { fill:red; }