/*keep this same for all*/
/*the main div container parallel to and above mainBox div*/
#wepLab17 {
  position: relative;
  width: 100%;
  height: 100%;

  top: 0%;
  left: 0%;

  margin: 0;
  padding: 0;

  /*background-color: #37C2DA;*/

  /*change only this*/
}

/*power intro text*/
#powerIntro {
  display: none;
  position: absolute;
  top: 1%;

  /*width property is essential for the text-align property to work*/
  width: 95%;
  text-align: center;

  color: darkgreen;

  font-weight: bold;
  font-size: 2em;

  /*text-shadow:0px 3px 3px rgba(0,0,0,0.2);*/
}
/*for the land to run*/
#land1,
#land2 {
  position: absolute;
  top: 40%;
  left: 5%;
  width: 90%;
  height: 0.1%;
  border: 1px solid white;
}

#land2 {
  position: absolute;
  top: 85%;
}

#land1Mark1,
#land2Mark1 {
  position: absolute;
  top: 37%;
  left: 10%;
  height: 5%;
  border: 1px solid brown;
}

#land1Mark2,
#land2Mark2 {
  /*display: none;*/
  position: absolute;
  top: 37%;
  left: 59%;
  height: 5%;
  border: 1px solid brown;
}

#land2Mark1,
#land2Mark2 {
  top: 82%; /* override this top position */
}

/*donkey images*/
#donkeyStandFirst,
#donkeyMove,
#donkeyStandLast {
  position: absolute;
  top: 65.5%;
  left: 9%;

  width: 40%;
}

#donkeyMove,
#donkeyStandLast {
  display: none;
}

#donkeyMove {
  width: 30%;
  top: 68.9%;
  left: 8.5%;
}

#donkeyStandLast {
  /*override donkeys last position*/
  left: 50%;
}

/*race button*/
#race {
  position: absolute;
  top: 50%;
  left: 10%;

  cursor: pointer;

  font-size: 2em;
}

/*bus div*/
#bus {
  position: absolute;
  /*top:25.5%;*/

  top: 20%;
  left: 9%;
  /*left:50%;*/
  width: 40%;

  height: 14.5%;

  /*border:1px solid;*/
}

#busBody {
  position: absolute;
  top: 0%;
  left: 0%;

  width: 100%;
}

#wheelFront,
#wheelBack {
  position: absolute;
  top: 94%;
  left: 57.5%;

  width: 9.5%;

  transform-origin: 50% 50%;
  -webkit-transform-origin: 50% 50%;
}

#wheelFront {
  width: 9.5%;
  left: 89.5%;
}

/*conclusion text*/
#concludePower1,
#concludePower2,
#concludePower3 {
  display: none;
  position: absolute;
  top: 40%;

  width: 100%;
  text-align: center;
  padding: 2%;

  color: darkblue;
  font-size: 1.7em;
}

#concludePower2 {
  /*override top position*/
  top: 52%;
  color: yellow;
}

#concludePower3 {
  /*override top position*/
  top: 83%;
  color: purple;
}