.parentsbox{
    height :1000px;
    width : 1000px;
    border-radius: 100px;
    position : absolute;
    background-color: yellow;
}


.parentsbox::before{
    content: "Joren Alexander Toding";
    align-content: center;
    font-size: 20px;
    font-family: 'Courier New', Courier, monospace;
   padding-left: 35%;
   animation: name 2s infinite;
    
    
}

.parentsbox:hover{
    
    background-color: aqua;
}

.pigear.ear2{
    width :50%;
    height : 52%;
    border : 0px solid;
    border-radius: 100%/70% 60% 130% 120%;
    top :20%;
    left:25%;
    position: absolute;
    background-color: #efc092;
}

.pignose{
    position: absolute;
    width:15%;
    height:7%;
    background-color: black;
    border-radius: 80%/40% 40% 120% 120%;
    bottom: 45%;
    left : 43%;
    background: radial-gradient(at 20% 25%, #fff 10%, #000 0);
}
.pigeye.eye1{
    position:absolute;
   width : 10%;
   height:10%;
   background-color: black;
   border-radius: 100%/100%;
   background:
   radial-gradient(circle at 35% 50%, #fff 12%, #0000 0),
   radial-gradient(circle at 49% 40%, #fff 7%, #0000 0),
   radial-gradient(circle at 50% 60%, #000 20%, #752 21% 40%, #0000 41%);
   background-color: white;
   bottom: 55%;
   left: 35%;
}
.pigeye.eye2{
    position: sticky;
    position:absolute;
   width : 10%;
   height:10%;
   background-color: black;
   border-radius: 100%/100%;
   background:
   radial-gradient(circle at 35% 50%, #fff 12%, #0000 0),
   radial-gradient(circle at 49% 40%, #fff 7%, #0000 0),
   radial-gradient(circle at 50% 60%, #000 20%, #752 21% 40%, #0000 41%);
   background-color: white;
   bottom: 55%;
   left: 55%;
   

}
.pighead{
    width: 250px;
	height: 200px;
	position: absolute;
	z-index: 0;
	top: -2px;
    top:10%;
    left: 60%;
	border-radius: 150px 0 150px 0;
	background-color: #efc092;
    transform: rotate(-10deg);
    
}
.parentsbox:hover .pighead{
    animation: ear 4s linear infinite;
}
.pighead:after{
    content: "";
  width: 220px;
	height: 180px;
	position: absolute;
	z-index: 0;
	top: 8px;
	left: 20px;
	border-radius: 150px 0 150px 0;
	transform: rotate(-176deg);
	background-color: #fee2d2;
}
.pigear.ear1{
    width: 250px;
	height: 200px;
	position: absolute;
	z-index: 0;
	top: 10%;
    left: 16%;
	border-radius: 150px 0 150px 0;
	background-color: #efc092;
    transform: rotate(90deg);
    
    
}
.parentsbox:hover .pigear.ear1{
    animation: ear2 4s linear infinite;
}
.parentsbox:hover .pigear.ear1::after{
    box-shadow: 
    2px 2px 5px 5px #555;
    
}
.pigear.ear1:after{
    content: "";
  width: 220px;
	height: 180px;
	position: absolute;
	z-index: 0;
	top: 8px;
	left: 20px;
	border-radius: 150px 0 150px 0;
	transform: rotate(185deg);
	background-color: #fee2d2;
}
.pigsmile{
    width: 200px;
    height: 100px;
    background-color: #fee2d2;
    position: absolute;
    bottom: 60%;
    top:60%;
    left: 40%;
    z-index: 10;
    border-radius: 50%;
}
.pigsmile::after{
content: "";
width: 10px;
height: 40px;
  background-color: #fee2d2;
  position: absolute;
  bottom: 30px;
  left: 24px;
  z-index: 10;
  border-radius: 20px;
}
.pigsmile::after{
    width: 100px;
    height: 60px;
    position: absolute;
    top: 24px;
    left: 25%;
    background-color: #f4a4ad;
    border-radius: 0 0 50% 50%;
    animation: tongue 4s  infinite;
}
@keyframes tongue {
    0% {
		height: 50px;
	}
	30% {
		height: 70px;
	}
	40% {
		height: 90px;
	}
	60% {
		height: 110px;
	}
	80% {
		height: 90px;
	}
	90% {
		height: 70px;
	}
	100% {
		height: 50px;
	}
}
p{
    visibility: hidden;
}
@keyframes ear{
    0%{
        top:10%;
    left: 60%;
    }
    50%{
        top:20%;
        left:70%;
    }
    100%{
        top:10%;
    left: 60%;
    }

}
@keyframes ear2 {
    0%{
        top: 10%;
        left: 16%;
    }
    50%{
        top:20%;
        left:10%;
    }
    100%{
        top: 10%;
        left: 16%;
    }
}.parentsbox:hover .pighead::after{
    box-shadow: 
    2px 2px 5px 5px #555;

}