
* {transition:1s width;}
body {padding:12px;}
div#container {text-align:center; background-color:#E6F1FE; color:#222; max-width:600px; border-radius:6px; padding:12px;}

div#container div.inputGroup {background:rgba(0,0,0,0.1); padding:12px; border-radius:5px;}

div#container div.inputGroup div.head-row h2 {text-align:center; margin-bottom:24px;}
div#container div.inputGroup div.head-row h2 img {height:34px; position:relative; bottom:3px;}

div#container div.inputGroup div.input-row {padding:2px;}
div#container div.inputGroup div.input-row > div {padding-left:4px; padding-right:4px;}
div#container div.inputGroup div.input-row label {width:100%; padding:4px 12px; margin:0; text-align:left;}
div#container div.inputGroup div.input-row input {width:100%; border-radius:5px; border:1px solid #888; padding:4px 12px; text-align:right;}

div#container div.inputGroup div.button-row {margin-top:12px;}
div#container div.inputGroup div.button-row > div:nth-of-type(1) {padding-right:4px;}
div#container div.inputGroup div.button-row > div:nth-of-type(2) {padding-left:4px; padding-right:4px;}
div#container div.inputGroup div.button-row > div:nth-of-type(3) {padding-left:4px;}

div#container div.inputGroup div.button-row button {width:100%; border-radius:5px; border:1px solid #888; padding:6px; background-color:#EEE; font-weight:bold;}
div#container div.inputGroup div.button-row > div:nth-of-type(1) button {background-color:#efefef;}
div#container div.inputGroup div.button-row > div:nth-of-type(2) button {background-color:dodgerblue; color:#fff;}
div#container div.inputGroup div.button-row > div:nth-of-type(3) button {background-color:#efefef;}

div#container div.output-row div#output {background-color:#DDD; background-color:rgba(0,0,0,0.25); border-radius:5px; border:1px solid #888; padding:24px; margin-top:12px; display:none;}
div#container div.output-row div#output .rLabel {text-align:left;}
div#container div.output-row div#output .result {font-weight:bold; font-size:16px; margin-bottom:12px; text-align:center;}

@media screen and (max-width:767px) {
	body {padding:12px;}
	div#container {padding:12px;}
	div#container div.output-row div#output .rLabel {text-align:center;} 
}
