* { box-sizing: border-box; -webkit-box-sizing: border-box; } html,body { font-family: 'Open Sans'; position:Relative; width:100%; height:100%; padding:0px; margin:0px; } .flex-column { width:100%; height:100%; display:flex; flex-direction:column; } .flex-column > * { padding:10px; margin:10px; } .flex-row { width:100%; display:flex; flex-direction:row; align-items:center; justify-content:center; padding:0px; margin:0px; } .flex-row > *{ flex-grow:1; } .output { height:100%; border: solid 1px rgba(0,0,0,0.1); overflow-y:auto; } .output p { margin: 2px 2px 2px 2px; } .output p.error { color: #F55; } button { margin: 10px 10px 10px 10px; padding: 10px 20px 10px 20px; background: #555; color: #FFF; border:none; font-size: 16px; font-weight:bold; } button:hover { background: #888; } .request { } .layout-container { background: #EEE; } .hpane { background: #FFF; box-shadow: 0px 1px 3px 0px rgba(0,0,0,0.3); } .hpane >header { background: #EEE; color:#333; } .hpane .hcontent { background: #FFF; } section.horizontal > *:first-child { margin-bottom:9px; } section.vertical > *:first-child { margin-right:9px; } ul.entry-list { list-style-type: none; display:flex; padding:0px; margin:0px; flex-direction: column; } .entry-list > li { rborder: solid 1px #F00; display:flex; flex-direction:row; height:48px; align-items: center; justify-content: center; margin:10px; } .entry-list > li > * { margin:0px; padding:0px; display:flex; align-items:center; justify-content:center; width:100%; height:100%; } .entry-list > li > input[type=text] { /*border:none; border-bottom: solid 1px #555;*/ } .entry-list > li > .entry-name { font-weight: bold; align-items:right; padding:10px; margin-right:10px; flex:auto; text-align:right; } .entry-list > li> .entry-content { text-align:center; padding:10px; margin-right:10px; } .entry-list > li > .entry-remove { padding:0px; margin:0px; width:47px; min-width:47px; } .hpane.requester { flex-grow:0.2; min-height: fit-content; min-height: 160px; } .output-clear { background:Transparent; color:#333; margin:0px; padding:2px; float:right; } .output-clear:hover { background:Transparent; color:#777; } }