* {
	box-sizing: border-box;
}

body {
	background: #cccccc;
}

.canvas {
	width: 900px;
	height: 556px;
	margin: 100px auto;
	background: white;
	position: relative;
}


#parallelogram {
	position: absolute;
	top: 100px;
	left: 150px;
	width: 600px;
	height: 400px;
	-webkit-transform: skew(20deg);
	-moz-transform: skew(30deg);
	-o-transform: skew(20deg);
	background: #FF1493;
}


.vase{
	left: 600px;
	position: absolute;
	top: 220px;
	opacity:0.7;

}

#bowl{

	top: 60px;
	display:block;
	position: absolute;
	width: 126px;
	height: 200px;
	background-color: #6B8E23;
	-webkit-border-radius: 63px 63px 63px 63px / 108px 108px 72px 72px;
	border-radius:         60%  60%  50%  50%  / 60%   60%   40%  40%;
}

#neck{
	left: 52px;
	position: absolute;
	width: 20px;
	height: 100px;
	background:#6B8E23;
}

.stem{
	left: 660px;
	top: 120px;
	width: 8px;
	height: 350px;
	background: #b7e56e;

	position: absolute;
	transform: rotate(175deg);

}



#ball{
	
	left: 480px;
	top: 50px;
	position: absolute;
	width: 200px;
	height: 200px;
	background:#FFDAB9;
	-moz-border-radius: 100px;
	-webkit-border-radius: 100px;
	border-radius: 100px;
}

#bottom{
	top: 180px;
	left: 70px;
	position: absolute;
	display:block;
	width: 126px;
	height: 180px;
	background-color: #6B8E23;
	-webkit-border-radius: 63px 63px 63px 63px / 108px 108px 72px 72px;
	border-radius:         30%  30%  40%  40%  / 60%   60%   40%  40%;
}

#top{
	
	width: 280px;
	height: 280px;
	background: #32CD32;
	-webkit-clip-path: polygon(35% 10%, 57% 38%, 76% 21%, 60% 57%, 55% 69%, 42% 70%, 11% 40%, 36% 52%, 14% 15%, 39% 35%);
	clip-path: polygon(35% 10%, 57% 38%, 76% 21%, 60% 57%, 55% 69%, 42% 70%, 11% 40%, 36% 52%, 14% 15%, 39% 35%);
}