
body {padding:24px;}
@media screen and (max-width:767px) { body {padding:12px;} }

div#container {text-align:center; background-color:#9bd7ff; /*color:#007acc;*/ max-width:400px; border-radius:8px; padding:12px; box-shadow: 0px 2px 6px 0px rgba(0,0,0,0.4); transition:.5s; transform:scale(.97);}
div#container:hover {box-shadow: 0px 2px 12px 4px rgba(0,0,0,0.5); transform:scale(1);}

/*div#container .row {padding-top:6px; padding-bottom:4px;}*/

div#container div.head-row {margin-bottom:24px;}

div#container div.inputGroup {background:rgba(0,0,0,0.1); padding:12px; border-radius:5px;}
div#container div.input-row input, 
div#container div.input-row select {text-align:right; border-radius:5px; border:1px solid #888; padding:4px 8px; width:100%;}
div#container div.input-row label.inputLabel {padding:5px 2px; text-align:left; width:100%;}

div#container div.button-row {padding-top:24px;}
div#container div.button-row > div:nth-of-type(1) {padding-right:4px;}
div#container div.button-row > div:nth-of-type(2) {padding-left:4px; padding-right:4px;}
div#container div.button-row > div:nth-of-type(3) {padding-left:4px;}
div#container div.button-row button {width:100%; border-radius:5px; border:1px solid #888; padding:4px 0; 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 div#output {text-align:left; margin-top:24px;}
