html,
body {
width: 100%;
height: 100%;
background: radial-gradient(ellipse at center, #160909 0%,#160909 45%,#291111
100%);
display: flex;
justify-content: center;
align-items: center;
overflow: hidden;
}
.container {
display: flex;
justify-content: center;
align-items: center;
flex-direction: column;
}
.pumpkin {
height: 11em;
width: 15em;
background: #f68632;
border: 0.4em solid #a14907;
border-radius: 70%/110%;
position: relative;
box-shadow: inset 0 0px 20px #a14907, 0 0 30px -4px red;
z-index: 1;
animation: float 3s infinite;
}
.pumpkin .texture {
height: 10.8em;
width: 6.5em;
position: absolute;

bottom: -0.4em;
left: 4em;
border-radius: 70%/130%;
border-bottom: 0.5em solid #a14907;
border-top: 0.5em solid #a14907;
}
.pumpkin .texture:after {
content: "";
display: block;
height: 10.7em;
width: 12em;
position: absolute;
bottom: -0.4em;
left: -2.5em;
border-radius: 70%/130%;
border-bottom: 0.5em solid #a14907;
border-top: 0.5em solid #a14907;
}
.pumpkin .root {
background: #517f54;
height: 2.8em;
width: 1.25em;
position: absolute;
left: calc(7.5em - 0.625em);
top: -2.7em;
transform: rotate(5deg);
border-radius: 30% 20% 70% 10%;
z-index: -1;
box-shadow: inset 0 0px 10px #29412b;
}
.pumpkin .eye {
position: absolute;
width: 0;
height: 0;
border-top: 0.8em solid transparent;
top: 2.8em;

}
.pumpkin .eye.right {
right: 3.7em;
transform: rotate(30deg);
border-bottom: 2.1em solid transparent;
border-left: 2.4em solid #401d03;
}
.pumpkin .eye.left {
left: 3.7em;
transform: rotate(-30deg);
border-bottom: 2.1em solid transparent;
border-right: 2.4em solid #401d03;
}
.pumpkin .mouth {
width: 4em;
height: 2em;
position: absolute;
bottom: 1.5em;
border-bottom: 1em solid #401d03;
}
.pumpkin .mouth.right {
right: 3.6em;
border-radius: 0 0 100% 0;
}
.pumpkin .mouth.left {
left: 3.6em;
border-radius: 0 0 0 100%;
}
.pumpkin .teeth {
width: 0.5em;
height: 1em;
position: absolute;
top: 7.7em;
left: 7.25em;

border-top: 0.8em solid transparent;
border-bottom: 0em solid transparent;
border-left: 0.8em solid #401d03;
}
.pumpkin .teeth:before, .pumpkin .teeth:after {
content: "";
display: block;
position: absolute;
width: 0;
height: 0;
border-top: 0.8em solid transparent;
}
.pumpkin .teeth:before {
right: 2.2em;
top: -0.65em;
transform: rotate(30deg);
border-bottom: 0.5em solid transparent;
border-left: 1em solid #401d03;
}
.pumpkin .teeth:after {
left: 1em;
top: -0.85em;
transform: rotate(30deg);
border-bottom: 0.5em solid transparent;
border-left: 1em solid #401d03;
}
.shadow {
margin: 10% auto 0;
background: #000;
width: 230px;
height: 50px;
border-radius: 50%;
animation: zoom 3s infinite;
}

@keyframes float {
0%, 100% {
transform: translateY(0);
}
50% {
transform: translateY(-10%);
}
}
@keyframes zoom {
0%, 100% {
transform: scale(1);
}
50% {
transform: scale(0.8);
}
}