@charset "utf-8";
@import url('https://fonts.googleapis.com/css?family=Share+Tech');
* { margin: 0; padding: 0;}
html{width:100%; height: 100vh; overflow:hidden;}
body {width:100%;min-height:100vh;
    background-color: whitesmoke;
	 color: rgba(255, 255, 255, 0.9);
	 font-family: 'Share Tech', sans-serif;
}
.visual{margin-left: 2vw; width: 96vw; height:49vh; background: whitesmoke ;padding:1vw;}
.click{cursor: pointer;}
.robot {top: 22vh; width:8vw; height: 7vw; position: relative; z-index:2;}
.object {top: 19vh; left:60vw; width: 4vw; height: 4vw; position: relative; display:none; z-index:1;}
.object2 {top: 18vh; left:45vw; width: 5vw; height: 10vw; position: relative; display:none; z-index:1;}
.panel-body { margin: auto;  background: #efefef; color:#333; padding: 1.4vw; font-size: 120%;}
#countdown, #resultat {position: absolute; top: 10vh; right: 1vw; background: #fafafa; border:1px solid #777; box-shadow:2px 3px #CCC; padding:.9vw; border-radius:5px; z-index:2; color:#333; font-size: 150%;}
#resultat{width:4vw; text-align: center;}
.reset {color:forestgreen;}
#rubric {position: absolute; top: 10vh; left: 2vw; width: 79vw; height: 65vh; background: #FFF; border:2px solid #717171; box-shadow:2px 3px #CCC; padding:2vw; border-radius:5px; z-index:3; color:#717171; font-size: 150%; opacity: .9; display: none;}
.close{position: absolute; top:1vw; right:1vw; cursor: pointer; color: red; font-size: 200%; font-weight: 700;}
.contain {display: block;margin-left:1vw; position: relative; padding-left: 2.5vw; cursor: pointer; line-height: 5vh;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}
.contain input {position: absolute;  opacity: 0; cursor: pointer;}
.checkmark {position: absolute;  top: .2vw;  left: 0;  height: 1.5vw;  width: 1.5vw;  background-color: #eee;  border-radius: 50%;}
.contain:hover input ~ .checkmark {background-color: #ccc;}
.contain input:checked ~ .checkmark { color: green; font-size:145%;}
.checkmark:after {content: "";  position: absolute; top: 0; display: none;}
.contain input:checked ~ .checkmark:after {display: block;}
.contain .checkmark:after {content:"✔";  top: -.5vw; }
.plan-button {
  position: relative;
  display: block;
  padding:1vw 2vw 1vw 2vw;
  font-size: 1.2vw;
  font-weight: 500;
  color: white;
  text-align: center;
  background:#E7800C;
  border-radius: 4px;
}