style.css

.face{
    height: 220px;
    width: 220px;
    background: pink;
    border-radius: 50%;
    margin-top: -9rem;
    border: 0.2px solid black;
    /* margin-left: 0.1rem; */
}

.eyes{
    display:flex;
    justify-content: space-evenly;
    padding-top:  50px;
}
h1{
    margin-bottom: 2rem;
    margin-top: 15rem;
}

.leye{
    height: 22px;
    width: 22px;
    background: black;
    border-radius: 50%;
    border: 10px solid white;
}

.reye{
    height: 22px;
    width: 22px;
    background: black;
    border-radius: 50%;
    border: 10px solid white;

}

.mouth{
    height: 52px;
    width: 85px;
    background: red;
    margin: auto;
    margin-top: 10%;
    border: 3px pink;
    border-radius: 25px;
    display: flex;
    justify-content: space-evenly;
    align-items: center;
}

.mouth div{
    background-color: black;
    width: 1rem;
    height: 1rem;
    border-radius: 50%;
}

.ears{
    display: flex;
    justify-content: space-between;
    width: 17rem;
    height: 10rem;
}

.ears div{
    background-color: pink;
    width: 6rem;
    height: 6rem;
    border-radius: 50%;
    z-index: -1;
    border: .1px solid black;
}


/* .main:hover .face{
    background: red;
}

.main:hover .leye{
    height: 10px;
    border-radius: 50%;
    padding-top: 20px;

}

.main:hover .tongue{
    height: 0px;
    width:

} */