body {padding:24px;}
@media screen and (max-width:767px) { body {padding:12px;} }

div#container {background:#E6F1FE; /*background:#5E94D9;*/ color:#222; max-width:600px; 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 .dollar {text-align:right;}*/
div#container label {font-weight:500; cursor:pointer;}

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

div#container div.inputGroup {background:rgba(0,0,0,0.1); padding:12px; border-radius:5px;}

div#container div.inputGroup div.input-row label {padding:8px 0; width:100%;}
div#container div.inputGroup div.input-row input, div#container div.inputGroup div.input-row select {padding:6px 12px; margin-top:4px; margin-bottom:4px;}
div#container div.inputGroup div.input-row input[type='number'], div#container div.inputGroup div.input-row select {width:100%; border-radius:5px; border:1px solid #777; text-align:right;}
div#container div.inputGroup div.input-row select {/*text-indent:50%; */height:32px; cursor:pointer; direction:rtl;}

div#container div.inputGroup div#cTable {display:none;}

div#container div.inputGroup div.button-row {padding-top:12px; text-align:center;}
div#container div.inputGroup div.button-row>div.col-4:nth-of-type(1) {padding-right:4px;}
div#container div.inputGroup div.button-row>div.col-4:nth-of-type(2) {padding-left:4px; padding-right:4px;}
div#container div.inputGroup div.button-row>div.col-4:nth-of-type(3) {padding-left:4px;}
div#container div.inputGroup div.button-row>div.col-6:nth-of-type(1) {padding-right:6px;}
div#container div.inputGroup div.button-row>div.col-6:nth-of-type(2) {padding-left:6px;}
div#container div.inputGroup div.button-row button {width:100%; border-radius:5px; border:1px solid #888; padding:.5em; 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.inputGroup div.button-row input[type=checkbox] {display:none;}
div#container div.inputGroup div.button-row input[type=checkbox]+label {width:100%;}
div#container div.inputGroup div.button-row input[type=checkbox]+label div.chkLabel {background-color:#EEE; border-radius:.25em; display:inline-block; padding:.25em 1em; border:1px solid #888; user-select:none; width:100%;}
div#container div.inputGroup div.button-row input[type=checkbox]:checked+label>div.chkLabel {background-color:dodgerblue; color:#EEE; border-color:#AAA;}

div#container div.output-row div.outputWrapper {border-radius:5px; padding:8px; margin-top:24px; text-align:center; background-color:rgba(255,255,255,0.5);}

div#container div.output-row div#outputBox {display:none; /*background-color:#FFC361;*/}
div#container div.output-row div#outputBox div#feeInfo {display:none;}
div#container div.output-row div#outputBox div.feeInfo {display:none;}
div#container div.output-row div#outputBox div#valueOutput input[type=checkbox] {display:none;}
div#container div.output-row div#outputBox div#valueOutput input[type=checkbox]+label {width:100%;}
div#container div.output-row div#outputBox div#valueOutput input[type=checkbox]+label div.chkLabel {/*background-color:#EEE; border-radius:.25em; display:inline-block; padding:.25em 1em; border:1px solid #888;*/ user-select:none; width:100%; text-align:center;}
div#container div.output-row div#outputBox div#valueOutput input[type=checkbox]:checked+label>div.chkLabel {/*background-color:dodgerblue; color:#EEE; border-color:#AAA;*/}
div#container div.output-row div#outputBox div#valueOutput {text-align:left;}
div#container div.output-row div#outputBox div#valueOutput div.result {font-weight:700; text-align:right;}

div#container div.output-row div#outputTableWrapper {display:none;}
div#container div.output-row div#outputTableWrapper div#outputTable {/*display:none;*/}
div#container div.output-row div#outputTableWrapper div#outputTable div.header {font-weight:700; padding:4px;}

div#container div.output-row div#outputTableWrapperX {display:none;}
div#container div.output-row div#outputTableWrapperX table#outputTableX {display:none;}
div#container div.output-row div#outputTableWrapperX table#outputTableX th, 
div#container div.output-row div#outputTableWrapperX table#outputTableX td {padding:3px 6px; text-align:center;}