html,body{
  background:radial-gradient(#1d7011,#0c4e03);
  height:100%;
  width:100%;
  margin:0;
  padding:0;
  overflow:hidden;
}


.gumdrop{
  background:radial-gradient(white,pink);
  width:20px;
  height:20px;
  position:absolute;
  top:150px;
  left:-50px;
  border-radius:50%;
}

.gumdrop-p{
  background:radial-gradient(white,purple);
  width:20px;
  height:20px;
  position:absolute;
  top:200px;
  left:-70px;
  border-radius:50%;
}

.gumdrop-r{
  background:radial-gradient(white,red);
  width:20px;
  height:20px;
  position:absolute;
  top:250px;
  left:-50px;
  border-radius:50%;
}

.gumdrop-b{
  background:radial-gradient(white,blue);
  width:20px;
  height:20px;
  position:absolute;
  top:250px;
  left:310px;
  border-radius:50%;
}

.gumdrop-y{
  background:radial-gradient(white,yellow);
  width:20px;
  height:20px;
  position:absolute;
  top:200px;
  left:320px;
  border-radius:50%;
}

.gumdrop-g{
  background:radial-gradient(white,green);
  width:20px;
  height:20px;
  position:absolute;
  top:150px;
  left:310px;
  border-radius:50%;
}

.leftshoe{
  background:black;
  width:60px;
  height:30px;
  position:absolute;
  top:380px;
  left:-100px;
  border-radius:0px 0px 20px 15px;
}

.leftshoe:before{
  content:'';
  background:white;
  position:absolute;
  width:60px;
  height:5px;
}

.rightshoe{
  background:black;
  width:60px;
  height:30px;
  position:absolute;
  top:380px;
  left:-30px;
  border-radius:0px 0px 15px 20px;
}

.rightshoe:before{
  content:'';
  background:white;
  position:absolute;
  width:60px;
  height:5px;
}

.left-eye{
  border-radius:50%;
  background:repeating-linear-gradient(45deg,#e3d2e9,white,#e3d2e9,white,#e3d2e9,white);
  width:20px;
  height:20px;
  position:absolute;
  top:90px;
  left:320px;
  box-shadow:1px 1px 1px #653b3e;
}

.right-eye{
  border-radius:50%;
  background:repeating-linear-gradient(45deg,#e3d2e9,white,#e3d2e9,white,#e3d2e9,white);
  width:20px;
  height:20px;
  position:absolute;
  top:90px;
  left:360px;
  box-shadow:1px 1px 1px #653b3e;
}

.pants{
  background:black;
  width:105px;
  height:70px;
  position:absolute;
  top:310px;
  left:280px;
  border-top:5px solid white;
}

.pants:before{
  content:'';
  position:absolute;
  background:black;
  width:62px;
  height:75px;
  top:15px;
  left:-6px;
  transform: rotate(8deg);
  border-bottom:2px solid white;
}

.pants:after{
  content:'';
  position:absolute;
  background:black;
  width:62px;
  height:75px;
  top:15px;
  left:49px;
  transform: rotate(-8deg);
  border-bottom:2px solid white;
}

.bow-tie{
  width:20px;
  height:20px;
  position:absolute;
  top:70px;
  left:-50px;
  background:radial-gradient(red,maroon);
  border-radius:50%;
}

.bow-tie:before{
  content:'';
  position:absolute;
  background:radial-gradient(red,maroon);
  width:40px;
  height:30px;
  left:20px;
  top:-5px;
  border-radius:40px 20px 20px 40px;

}

.bow-tie:after{
  content:'';
  position:absolute;
  background:radial-gradient(red,maroon);
  width:40px;
  height:30px;
  left:-40px;
  top:-5px;
  border-radius:20px 40px 40px 20px;

}


#rob-icon{
  position:absolute;
  width:50px;
  height:50px;
  background:radial-gradient(#109be9,#155dca);
  bottom:0;
  right:0;
  border-radius:50%;
  display:flex;
  justify-content:center;
  align-items:center;
  color:white;
  font-size:30px;
  text-decoration:none;
  margin:5px;
  font-family:cursive;
  box-shadow:2px 2px 2px grey;
}

#gabby-icon:hover{
  background:#0c83bb;
  transition:background 1s;

}