h1 {padding:10px; height:3.0rem; font-size:1.3rem; font-weight:bold; color:#336699; background-color:#e0f0ff; text-align:center; margin:0;}

body {padding: 0; margin: 0; font-family:Verdana;}

* {box-sizing: border-box;}

#sorry{display:none;text-align:center;font-size:1.0rem;font-style:italic;color:#CB365D;text-shadow:1px 1px 0 #fff;text-align:center;padding:100px 0;}

#v-box,#h-box,#c-box{position:relative; background-color:#ffffff; margin: auto; z-index:300; overflow:hidden; border:0.1rem solid #728300;
              -moz-border-radius:120px;-webkit-border-radius:120px;border-radius:120px;background:#e6f0a3;
              background:-moz-linear-gradient(top, #e6f0a3 0%, #d2e638 50%, #c3d825 51%, #dbf043 100%);
              background:-webkit-gradient(linear, left top, left bottom, color-stop(0%, #e6f0a3), color-stop(50%, #d2e638), color-stop(51%, #c3d825), color-stop(100%, #dbf043));
              background:-webkit-linear-gradient(top, #e6f0a3 0%, #d2e638 50%, #c3d825 51%, #dbf043 100%);
              background:-o-linear-gradient(top, #e6f0a3 0%, #d2e638 50%, #c3d825 51%, #dbf043 100%);
              background:-ms-linear-gradient(top, #e6f0a3 0%, #d2e638 50%, #c3d825 51%, #dbf043 100%);
              background:linear-gradient(top, #e6f0a3 0%, #d2e638 50%, #c3d825 51%, #dbf043 100%);
              -webkit-box-shadow:inset 0 2px 10px rgba(0,0,0, 0.18), 0 3px 2px rgba(0,0,0, 0.3);
              -moz-box-shadow:inset 0 2px 10px rgba(0,0,0, 0.18), 0 3px 2px rgba(0,0,0, 0.3);
              box-shadow:inset 0 2px 10px rgba(0,0,0, 0.18), 0 3px 2px rgba(0,0,0, 0.3);}
#c-box,#v-box,#h-box {float:left; margin:0.5rem;}

#v-box:after,#h-box:after{content:""; position:absolute; display:block; top:2%; left:9%; right:9%; height:15px; background:rgba(255, 255, 255, 0); background:-webkit-gradient(linear, left top, left bottom, from(rgba(255, 255, 255, 0)), to(rgba(255, 255, 255, 0.3)));background:-webkit-linear-gradient(rgba(255, 255, 255, 0), rgba(255, 255, 255, 0.3));background-image:-moz-linear-gradient(top, rgba(255, 255, 255, 0), rgba(255, 255, 255, 0.3));background-image:-moz-gradient(top, rgba(255, 255, 255, 0), rgba(255, 255, 255, 0.3));-moz-border-radius:50px;-webkit-border-radius:50px;border-radius:50px;}
#v-box:before,#h-box:before{content:""; position:absolute; display:block; border:1px solid rgba(0, 0, 0, 0.35); width:44px; height:44px; z-index:900;}

#h-box{width:250px; height:50px; margin-top:2.0rem;}
#h-box:before{top:3px; left:102px; border-width:0 0.1rem;}

#v-box{width:50px;height:250px;background:#e6f0a3;background:-moz-linear-gradient(left, #e6f0a3 0%, #d2e638 50%, #c3d825 51%, #dbf043 100%);background:-webkit-gradient(linear, left top, right top, color-stop(0%, #e6f0a3), color-stop(50%, #d2e638), color-stop(51%, #c3d825), color-stop(100%, #dbf043));background:-webkit-linear-gradient(left, #e6f0a3 0%, #d2e638 50%, #c3d825 51%, #dbf043 100%);background:-o-linear-gradient(left, #e6f0a3 0%, #d2e638 50%, #c3d825 51%, #dbf043 100%);background:-ms-linear-gradient(left, #e6f0a3 0%, #d2e638 50%, #c3d825 51%, #dbf043 100%);background:linear-gradient(left, #e6f0a3 0%, #d2e638 50%, #c3d825 51%, #dbf043 100%);}
#v-box:after{left:30%;right:30%;}
#v-box:before{top:102px;left:3px;border-width:1px 0;}

#v,#h{z-index:800;overflow:hidden;position:absolute;display:block;-moz-border-radius:300px;-webkit-border-radius:300px;border-radius:300px;background:rgba(255, 255, 255, 0.5);background:-webkit-gradient(linear, left top, left bottom, from(rgba(255, 255, 255, 0.5)), to(rgba(255, 255, 255, 0.86)));background:-webkit-linear-gradient(rgba(255, 255, 255, 0.5), rgba(255, 255, 255, 0.86));background-image:-moz-linear-gradient(top, rgba(255, 255, 255, 0.5), rgba(255, 255, 255, 0.86));background-image:-moz-gradient(top, rgba(255, 255, 255, 0.5), rgba(255, 255, 255, 0.86));-webkit-box-shadow:inset 0 -2px 10px rgba(0,0,0, 0.2), inset 0px -2px 3px rgba(0,0,0, 0.35), 0 1px 4px rgba(0,0,0, 0.12);-moz-box-shadow:inset 0 -2px 10px rgba(0,0,0, 0.2), inset 0px -2px 3px rgba(0,0,0, 0.35), 0 1px 4px rgba(0,0,0, 0.12);box-shadow:inset 0 -2px 10px rgba(0,0,0, 0.2), inset 0px -2px 3px rgba(0,0,0, 0.35), 0 1px 4px rgba(0,0,0, 0.12);width:44px;height:44px;margin:3px;}



#c-box:after:after{content:""; position:absolute; display:block; top:2%; left:9%; right:9%; height:15px; background:rgba(255, 255, 255, 0); background:-webkit-gradient(linear, left top, left bottom, from(rgba(255, 255, 255, 0)), to(rgba(255, 255, 255, 0.3)));background:-webkit-linear-gradient(rgba(255, 255, 255, 0), rgba(255, 255, 255, 0.3));background-image:-moz-linear-gradient(top, rgba(255, 255, 255, 0), rgba(255, 255, 255, 0.3));background-image:-moz-gradient(top, rgba(255, 255, 255, 0), rgba(255, 255, 255, 0.3));-moz-border-radius:50px;-webkit-border-radius:50px;border-radius:50px;}
#c-box:after{left:3px; top:125px; border-width:0 0.1rem;}
#c-box:after{left:30%;right:30%;}

#c-box{width:250px; height:250px; margin-top:2.0rem; border-radius:50%;}
#cv {top:0px; left:125px; position:absolute; display:block; border:0rem solid rgba(0, 0, 0, 0.35); width:1px; height:250px; background-color:rgba(0,0,0,0.35); z-index:900;}
#ch {left:0px; top:125px; position:absolute; display:block; border:0rem solid rgba(0, 0, 0, 0.35); width:250px; height:1px; background-color:rgba(0,0,0,0.35); z-index:900;}
#cc {top:100px; left:100px; width:50px; height:50px; position:absolute; display:block; border:0.1rem solid rgba(0, 0, 0, 0.35); border-radius:50%; background:transparent; z-index:901;}
#c {z-index:800;overflow:hidden;position:absolute;display:block;-moz-border-radius:300px;-webkit-border-radius:300px;border-radius:300px;background:rgba(255, 255, 255, 0.5);background:-webkit-gradient(linear, left top, left bottom, from(rgba(255, 255, 255, 0.5)), to(rgba(255, 255, 255, 0.86)));background:-webkit-linear-gradient(rgba(255, 255, 255, 0.5), rgba(255, 255, 255, 0.86));background-image:-moz-linear-gradient(top, rgba(255, 255, 255, 0.5), rgba(255, 255, 255, 0.86));background-image:-moz-gradient(top, rgba(255, 255, 255, 0.5), rgba(255, 255, 255, 0.86));-webkit-box-shadow:inset 0 -2px 10px rgba(0,0,0, 0.2), inset 0px -2px 3px rgba(0,0,0, 0.35), 0 1px 4px rgba(0,0,0, 0.12);-moz-box-shadow:inset 0 -2px 10px rgba(0,0,0, 0.2), inset 0px -2px 3px rgba(0,0,0, 0.35), 0 1px 4px rgba(0,0,0, 0.12);box-shadow:inset 0 -2px 10px rgba(0,0,0, 0.2), inset 0px -2px 3px rgba(0,0,0, 0.35), 0 1px 4px rgba(0,0,0, 0.12);width:44px;height:44px;margin:3px;}

#valorbeta,#valorgamma {display:none;}
