@charset "UTF-8";

body {
background-color: aliceblue;
}

#resetMe {
	float:right;
  width: 10vw;
  height: 3vw;
	font-family: "wigwag-bold";
	font-size: 2vw;
	text-align: center;
	vertical-align: middle;
	font-size: 2vw;
	text-align: center;
	vertical-align: middle;
  background: #DCF5F9;
	clear:right;
}

#checkIt {
	z-index: 100;
	width: 10vw;
  height: 3vw;
	float:left;
	margin-bottom: 0.5vw;
	background-color: aquamarine;
	font-family: "wigwag-bold";
	font-size:1.8vw;
	cursor: pointer;
	box-shadow:  0 0 0.5vw #000000;
	clear:left;
}

.circles {
	background-color: #B4E1FC;
	text-align: center;
	position:relative;
	font-family: "wigwag-bold";
	font-size: 5vw;
	width: 8vw;
	height: 8vw;
	float:left;
	margin: 0.5vw;
	border-radius: 100%;
	line-height: 8vw;
	box-shadow: inset 0 0 2vw #185cc9;
	border:none;
    cursor:pointer;	
	z-index: 5;
}
.circleContainer{
	position:absolute;
	clear:both;
	width:30vw;
	padding-top: 8vw;
	padding-left: 4.4vw;
	padding-right: 4.4vw;
	
}
#instructions{
	position:relative;
	width:100vw;
	font-family: "wigwag-bold";
	font-size: 2vw;
	width:70vw;
	cursor:default;
	margin-left: 25vw;
	margin-right: 5vw;
	clear:both;
	text-align: center;
}

.targets1 {
	background-color: #FFFFFF;
	position:relative;
	width: 8vw;
	height: 8vw;
	float:left;
	margin-top: 0.2vw;
	margin-bottom: 0.2vw;
	margin-left: 58vw;
	margin-right: 1vw;
	border-radius: 50%;
	border-style:solid;
	border-color: #000000;
	border-width: medium;
	z-index: 0;
	font-family: "wigwag-bold";
	font-size: 6vw;
	line-height: 9vw;
	text-align: center;
	clear:both;
}

.targets2 {
	background-color: #FFFFFF;
	position:relative;
	width: 8vw;
	height: 8vw;
	float:left;
	margin-top: 0.2vw;
	margin-bottom: 0.2vw;
	margin-left: 50vw;
	margin-right: 6vw;
	border-radius: 50%;
	border-style:solid;
	border-color: #000000;
	border-width: medium;
	z-index: 0;
	font-family: "wigwag-bold";
	font-size: 6vw;
	line-height: 9vw;
	text-align: center;
	clear:left;

}

.targets {
	background-color: #FFFFFF;
	position:relative;
	width: 8vw;
	height: 8vw;
	float:left;
	margin-top: 0.2vw;
	margin-bottom: 0.2vw;
	margin-left: 1vw;
	margin-right: 4vw;
	border-radius: 50%;
	border-style:solid;
	border-color: #000000;
	border-width: medium;
	z-index: 0;
	font-family: "wigwag-bold";
	font-size: 6vw;
	line-height: 9vw;
	text-align: center;
}

.targets3 {
	background-color: #FFFFFF;
	position:relative;
	width: 8vw;
	height: 8vw;
	float:left;
	margin-top: 1vw;
	margin-bottom: 0.2vw;
	margin-left: 43vw;
	margin-right: 20vw;
	border-radius: 50%;
	border-style:solid;
	border-color: #000000;
	border-width: medium;
	z-index: 0;
	font-family: "wigwag-bold";
	font-size: 6vw;
	line-height: 9vw;
	text-align: center;
	clear:left;
}

.targets4 {
	background-color: #FFFFFF;
	position:relative;
	width: 8vw;
	height: 8vw;
	float:left;
	margin-top: 0.2vw;
	margin-bottom: 0.2vw;
	margin-left: 37vw;
	margin-right: 5vw;
	border-radius: 50%;
	border-style:solid;
	border-color: #000000;
	border-width: medium;
	z-index: 0;
	font-family: "wigwag-bold";
	font-size: 6vw;
	line-height: 9vw;
	text-align: center;
	clear:both;
}


.svg-content { 
	display: inline-block;
	position: absolute;
	top: 0;
	left: 0;
	z-index: -1;
}

.noselect {
  -webkit-touch-callout: none; /* iOS Safari */
    -webkit-user-select: none; /* Safari */
     -khtml-user-select: none; /* Konqueror HTML */
       -moz-user-select: none; /* Firefox */
        -ms-user-select: none; /* Internet Explorer/Edge */
            user-select: none; /* Non-prefixed version, currently
                                  supported by Chrome and Opera */
}