
body {padding:12px; transition:1s;}

div#container {/*text-align:center;*/ background-color:#E6F1FE; background-color:#007acc; color:#222; /*color:#bdd;*/ max-width:400px; border-radius:8px; padding:12px; box-shadow: 0px 2px 6px 0px rgba(0,0,0,0.4); transition:.5s;}
div#container:hover {box-shadow: 0px 2px 12px 4px rgba(0,0,0,0.5);}

div#container {position:relative; animation:showUp 1s;}
@keyframes showUp {from{bottom:-100px;opacity:0;}to{bottom:0; opacity:1;}}

/*div#container > div.row {padding-top:6px; padding-bottom:4px;}*/

div#container div.head-row h2 {text-align:center; margin-bottom:24px;}
div#container div.head-row h2 img {height:34px; position:relative; bottom:3px;}

div#container div.inputGroup {background-color:rgba(0,0,0,0.1); padding:12px; border-radius:5px;}
/*div#container div.inputGroup div.input-row {padding-top:3px; padding-bottom:3px;}*/
div#container div.inputGroup div.input-row.B {display:none;}
div#container div.inputGroup div.input-row.A.B {display:block;}
div#container div.inputGroup div.input-row div.unit-row {font-size:.8em;}
div#container div.inputGroup div.input-row div.unit-row label,
div#container div.inputGroup div.input-row div.unit-row input {text-align:center; width:100%;}
div#container div.inputGroup div.input-row label {/*width:100%;*/ text-align:left; padding:4px; margin:0;}
div#container div.inputGroup div.input-row input {border-radius:5px; border:1px solid #666; text-align:right; padding:4px 12px; margin-top:4px; margin-bottom:4px;}
div#container div.inputGroup div.input-row input[type='number'] {width:100%;}

div#container div.inputGroup div.button-row {padding-top:24px;}
div#container div.inputGroup div.button-row > div.col-xs-4:nth-of-type(1) {padding-right:4px;}
div#container div.inputGroup div.button-row > div.col-xs-4:nth-of-type(2) {padding-left:4px; padding-right:4px;}
div#container div.inputGroup div.button-row > div.col-xs-4:nth-of-type(3) {padding-left:4px;}
div#container div.inputGroup div.button-row button {width:100%; border-radius:5px; border:1px solid #666; padding:6px; background-color:#EEE; font-weight:bold;}
div#container div.button-row > div:nth-of-type(1) button {background-color:#efefef;}
div#container div.button-row > div:nth-of-type(2) button {background-color:dodgerblue; color:#fff;}
div#container div.button-row > div:nth-of-type(3) button {background-color:#efefef;}

div#container div.output-row #outputBox {border-radius:5px; border:1px solid #888; padding:12px 36px; background-color:#DDD;background-color:rgba(255,255,255,0.5); text-align:center; margin-top:24px; display:none;}
div#container div.output-row #outputBox .result {font-size:20px; font-weight:600;}
