
html,body {padding:12px; font-family:"Lucida Grande";}

div#container {background-color:#9bd7ff; background-color:rgba(30,144,255,0.25); /*color:#007acc;*/ padding:1rem;}
div#container {text-align:center; border-radius:8px; box-shadow: 0px 2px 6px 0px rgba(0,0,0,0.4); transition:1s; max-width:500px; margin:0 auto;}
div#container:hover {box-shadow: 0px 2px 12px 4px rgba(0,0,0,0.5);}

/*div#container .row {margin-bottom:.5rem;}*/

div#container div.head-row {text-align:center; margin-bottom:24px;}
div#container div.head-row h2 {text-align:center;}
div#container div.head-row h2 img {height:34px; position:relative; bottom:3px;}

div#container p#definition {font-size:12px; max-width:280px; position:relative; left:50%; transform:translateX(-50%);}

div#container .equation-row {display:none;}
div#container .equation-row > div {margin-top:12px;}

/*div#container .input-row > div > div {padding:2px;}*/
div#container .input-row input , 
div#container .input-row select {text-align:center; padding:.25rem; border-radius:6px; border:1px solid #999; width:100%;}
div#container .input-row select {-webkit-appearance:none; -moz-appearance:none; appearance:none; padding:4px 8px 5px; border-radius:6px; border:1px solid #999; width:100%;}
/*div#container .button-row {padding:12px;}*/
/*div#container .button-row > div {padding:2px 6px;}*/
div#container .button-row button {padding:6px 16px; border-radius:5px; border:1px solid #999; width:100%;}

div#container div.button-row {margin-top:6px; margin-bottom:24px;}
div#container div.button-row div.col-4:nth-of-type(1) {padding-right:3px;}
div#container div.button-row div.col-4:nth-of-type(2) {padding-left:3px; padding-right:3px;}
div#container div.button-row div.col-4:nth-of-type(3) {padding-left:3px;}

.inputGroup {background-color:rgba(0,0,0,0.1); padding:12px; border-radius:.3rem;}
