
body {padding:24px;}
@media screen and (max-width:767px) { body {padding:12px;} }

#container {text-align:center; background-color:#E6F1FE; color:#222; max-width:800px; border-radius:8px; padding:24px; box-shadow: 0px 2px 6px 0px rgba(0,0,0,0.4); transition:.5s;}
#container:hover {box-shadow: 0px 2px 12px 4px rgba(0,0,0,0.5);}

#container > .row {padding-top:6px; padding-bottom:4px;}

#container .input-row {padding-top:3px; padding-bottom:3px;}
#container .input-row label {width:100%; text-align:left; padding:4px; margin:0;}
#container .input-row input {width:100%; border-radius:5px; border:1px solid #888; padding:4px 12px; text-align:right;}

#container .button-row {padding-top:24px;}
#container .button-row > div:nth-of-type(1) {padding-right:2px;}
#container .button-row > div:nth-of-type(2) {padding-left:2px; padding-right:2px;}
#container .button-row > div:nth-of-type(3) {padding-left:2px;}
#container .button-row button {width:100%; border-radius:5px; border:1px solid #888; padding:4px; background-color:#EEE;}

#container .output-row #output {border-radius:5px; border:1px solid #888; padding:12px 36px; background-color:#DDD; text-align:left;}

/** {border:1px dotted #000;}*/
