.nail{
width:15px;
height:15px;
border-radius:50%;
background-color:black;
box-shadow:2px 2px 2px 0px rgb(200,200,200);
position:absolute;
top:100px;
left:117px;
z-index:1000;
}
.falling-banner{
color:white;
position:absolute;
top:100px;
left:0px;
width:250px;
height:150px;
-webkit-animation:fallingBanner 1s 1;
animation:fallingBanner 1s 1;

}

.string
{
width:10%;
height:10%;
border-top-left-radius:50%;
border-top-right-radius:50%;
border:2px solid rgba(221,187,127,1);
margin:auto;
border-bottom:none;
}

.perspective-container{
width:100%;
height:100%;
background-color:rgb(210,210,210);
border-radius:10px;
-webkit-perspective: 400px;
perspective: 400px;
}

.vibrating-box{
width:100%;
height:100%;
background-color:rgba(221,187,127,1);
color:white;
border-radius:10px;
-webkit-transform:rotateX(0deg);
-webkit-transform-origin:top;
-webkit-animation:vibratingBox 2s 1;
-webkit-animation-delay:1s;
transform:rotateX(0deg);
transform-origin:top;
animation:vibratingBox 2s 1;
animation-delay:1s;
box-shadow:5px 5px 5px 0px rgba(210,210,210,0.5);
}
.message-box{
width:95%;
height:92%;
position:absolute;
left:2%;
top:3%;
border:1px dashed yellow;
border-radius:10px;
background-color:rgba(221,187,127,1);
color:white;
font-family:'Dancing Script', cursive;
}

@-webkit-keyframes fallingBanner{
0%{
	top:-300px;
	-webkit-animation-timing-function:ease-in;
	animation-timing-function:ease-in;
}
100%{
	top:100px;
}
}


@keyframes vibratingBox{
0%{
	transform:rotateX(50deg);
}
12.5%{
	transform:rotateX(0deg);
}
25%{
	transform:rotateX(37.5deg);
}
37.5%{
	transform:rotateX(0deg);
}
50%{
	transform:rotateX(28.125deg);
}
62.5%{
	transform:rotateX(0deg);
}
75%{
	transform:rotateX(21deg);
	animation-timing-function:ease-in;
}
100%{
	transform:rotateX(0deg);
}

}

@-webkit-keyframes vibratingBox{
0%{
	-webkit-transform:rotateX(50deg);

}
12.5%{
	-webkit-transform:rotateX(0deg);

}
25%{
	-webkit-transform:rotateX(37.5deg);
}
37.5%{
	-webkit-transform:rotateX(0deg);
}
50%{
	-webkit-transform:rotateX(28.125deg);
}
62.5%{
	-webkit-transform:rotateX(0deg);
}
75%{
	-webkit-transform:rotateX(21deg);
	-webkit-animation-timing-function:ease-in;
}
100%{
	-webkit-transform:rotateX(0deg);
}

}