.goalCircle {
  position: absolute;
  border: 0px solid black;
  /* background-color: black; */
  width: 68px;
  height: 68px;
  border-radius: 50%;
  transform:translate(-50%,-50%);
  cursor: pointer;
  opacity: 1.0;
  z-index: 2;
}

.goalUnlocked {
  width: 40px;
  height: 40px;
  /* background-color: #e7c820; */
  background-color: rgba(255, 255, 255, 0);
  border: 0px solid red;
  opacity: 1.0;
  border-radius: 50%;
  z-index: 2;
}

.currentGoal {
  border: 0px solid red;
  /* border-radius: 0; */
  width: 70px;
  height: 70px;
}

.goalInfo {
  position: absolute;
  padding: 20px;
  max-width: 80%;
  height: auto;
  border: 0px solid black;
  border-radius: 5px;
  background-color: #ffec68;
  color: rgba(0, 0, 0, 0.383);
  box-shadow: 5px 10px 18px #888888;
  /* transform:translate(-50%,-50%); */
  z-index: 3;
}

.goalInfoLocked {
  color: black;
}

#sol {
  width: 100px;
  height: auto;
  z-index: 0;
  top: 40%;
  left: 59%;
  padding-left: -0;
  background-color: rgba(255, 255, 255, 0);
  border: 0px solid red;
  border-radius: 0;
  -webkit-animation-name: wiggle;
  -ms-animation-name: wiggle;
  -ms-animation-duration: 2000ms;
  -webkit-animation-duration: 2000ms;
  -webkit-animation-iteration-count: infinite;
  -ms-animation-iteration-count: infinite;
  -webkit-animation-timing-function: ease-in-out;
  -ms-animation-timing-function: ease-in-out;
  transform: scaleX(-1);
}

#circle1 {
  top: 19%;
  left: 23.5%;
}
#goal1 {
  display: none;
  top: 30%;
  left: 2%;
}

#circle2 {
  top: 17%;
  left: 46%;
}
#goal2 {
  display: none;
  top: 20%;
  left: 29%;
}

#circle3 {
  border: 0px solid black;
  top: 16.5%;
  left: 77%;
  width: 100px;
  height: 40px;
}
#goal3 {
  display: none;
  top: 24%;
  left: 45%;
}

#circle4 {
  top: 36%;
  left: 83%;
}
#goal4 {
  display: none;
  top: 39%;
  left: 68%;
}

#circle5 {
  border: 0px solid black;
  top: 26.5%;
  left: 51.5%;
  width: 80px;
  height: 45px;
}
#goal5 {
  display: none;
  top: 34%;
  left: 47%;
}

#circle6 {
  top: 37%;
  left: 25%;
}
#goal6 {
  display: none;
  top: 40%;
  left: 16%;
}

#circle7 {
  top: 31.2%;
  left: 10.6%;
}
#goal7 {
  display: none;
  top: 34%;
  left: 3%;
}

#circle8 {
  border: 0px solid black;
  top: 50%;
  left: 10.5%;
  width: 60px;
  height: 50px;
}
#goal8 {
  display: none;
  top: 59%;
  left: 2%;
}

#circle9 {
  top: 64.5%;
  left: 16.5%;
}
#goal9 {
  display: none;
  top: 67%;
  left: 6%;
}

#circle10 {
  top: 82%;
  left: 4.9%;
}
#goal10 {
  display: none;
  top: 84%;
  left: 1%;
}

#circle11 {
  top: 78.5%;
  left: 34%;
}
#goal11 {
  display: none;
  top: 81%;
  left: 24%;
}

#circle12 {
  top: 71.6%;
  left: 29.6%;
}
#goal12 {
  display: none;
  top: 75%;
  left: 22%;
}

#circle13 {
  border: 0px solid black;
  top: 59.0%;
  left: 56.7%;
  width: 150px;
  height: 35px;
}
#goal13 {
  display: none;
  top: 65%;
  left: 45%;
}

#circle14 {
  top: 50.5%;
  left: 84.5%;
}
#goal14 {
  display: none;
  top: 54%;
  left: 73%;
}

#circle15 {
  top: 43%;
  left: 57.4%;
}
#goal15 {
  display: none;
  top: 47%;
  left: 47%;
}

#circle16 {
  top: 51.8%;
  left: 28%;
}
#goal16 {
  display: none;
  top: 55%;
  left: 18%;
}

#circle17 {
  top: 61.5%;
  left: 35.5%;
}
#goal17 {
  display: none;
  top: 64%;
  left: 24%;
}

#circle18 {
  top: 73.7%;
  left: 49.3%;
}
#goal18 {
  display: none;
  top: 77%;
  left: 38%;
}

#circle19 {
  top: 65.5%;
  left: 82.5%;
}
#goal19 {
  display: none;
  top: 69%;
  left: 71%;
}

#circle20 {
  top: 78.5%;
  left: 91.5%;
}
#goal20 {
  display: none;
  top: 81%;
  left: 76%;
}

#circle21 {
  top: 85%;
  left: 73%;
}
#goal21 {
  display: none;
  top: 88%;
  left: 63%;
}

#circle22 {
  top: 79.5%;
  left: 65.5%;
}
#goal22 {
  display: none;
  top: 83%;
  left: 55%;
}

#circle23 {
  top: 84.8%;
  left: 41.9%;
}
#goal23 {
  display: none;
  top: 87%;
  left: 31%;
}

#circle24 {
  top: 92%;
  left: 10%;
}
#goal24 {
  display: none;
  top: 95%;
  left: 1%;
}

#circle25 {
  top: 96%;
  left: 45.5%;
}
#goal25 {
  display: none;
  top: 99%;
  left: 35%;
}

#circle26 {
  top: 91.4%;
  left: 77.5%;
}
#goal26 {
  display: none;
  top: 94%;
  left: 66%;
}

/* @-webkit-keyframes wiggle {
  0% {-webkit-transform: rotate(0deg);}
  25% {-webkit-transform: rotate(10deg);}
  50% {-webkit-transform: rotate(20deg);}
  75% {-webkit-transform: rotate(-5deg);}
  100% {-webkit-transform: rotate(0deg);}
}

@-ms-keyframes wiggle {
  0% {-ms-transform: rotate(1deg);}
  25% {-ms-transform: rotate(-1deg);}
  50% {-ms-transform: rotate(1.5deg);}
  75% {-ms-transform: rotate(-5deg);}
  100% {-ms-transform: rotate(0deg);}
} */

@keyframes wiggle {
  0% {transform: rotate(0deg);}
  25% {transform: rotate(-5deg);}
  50% {transform: rotate(5deg);}
  75% {transform: rotate(-5deg);}
  100% {transform: rotate(0deg);}
}

@media only screen and (min-width: 600px) {
  #sol {
    width: 130px;
    z-index: 0;
  }

  #circle3 {
    border: 0px solid black;
    top: 16.5%;
    left: 77%;
    width: 220px;
    height: 60px;
  }

  #circle5 {
    border: 0px solid black;
    top: 26.5%;
    left: 51.5%;
    width: 150px;
    height: 85px;
  }

  #circle8 { 
    border: 0px solid black;
    top: 50%;
    left: 10.5%;
    width: 110px;
    height: 110px;
  }

  #circle13 {
    border: 0px solid black;
    top: 59.50%;
    left: 56.7%;
    width: 250px;
    height: 65px;
  }

  .currentGoal {
    width: 150px;
    height: 150px;
  }

  
}