/* #fcf1f1 = background
#f9e0ae = circle
#835050 = pot 
#799351 = cactus
#335d2d = cactus lines */

* {
    margin : 0;
    padding :0;
    box-sizing:border-box;
} 

.parentsbox{
    background-color: #ffff00;
    width: 500px;
    height: 500px;
    border-radius: 100px;
    position: relative;
}

.pighead {
    position: absolute;
    width: 210px;
    height: 160px; 
    background-color: #fff;
    background-image: radial-gradient(ellipse at 50% 60%, #333 12px, transparent 12px), radial-gradient(ellipse at 50% 80%, #555 6px, transparent 6px);
    border-top-left-radius: 110px;
    border-top-right-radius: 110px;
    border-bottom-left-radius: 110px 60px;
    border-bottom-right-radius: 110px 60px;
    border: 5px solid #333;
    border-bottom-width: 10px;
    box-shadow: inset 10px -10px 0 #eee;
    left: 130px;
    top: 170px;
  }
  
  .eye2  {
    position: absolute;
    margin-top: 150px;
margin-left: 130px;
    
    width: 70px;
    height: 40px;
    left: 29px;
    top: 55px;
    background-color: #333;
    background-image: radial-gradient(circle at 51px 20px, #fff 3px, transparent 3px), radial-gradient(circle at 46px 20px, #333 7px, transparent 7px), radial-gradient(circle at 45px 20px, #fff 10px, transparent 10px);
    border-radius: 50% 50% 45% 42%;
    transform: rotate(-45deg);
    box-shadow: 3px -50px 0 -4px #333;
  }

  .eye1 {
    position: absolute;
    margin-top: 150px;
    margin-left: 130px;
    width: 70px;
    height: 40px;
    left: 111px;
    top: 55px;
    background-color: #333;
    background-image: radial-gradient(circle at 24px 15px, #fff 3px, transparent 3px), radial-gradient(circle at 24px 20px, #333 7px, transparent 7px), radial-gradient(circle at 25px 20px, #fff 10px, transparent 10px);
    border-radius: 50% 50% 42% 45%;
    transform: rotate(45deg);
    box-shadow: -3px -50px 0 -4px #333;
  }