body {
	background: #cccccc;
}

.canvas {
	width: 900px;
	height: 556px;
	margin: 100px auto;
	background: white;
	position: relative;
}
#heart {
    position: relative;
    width: 100px;
    height: 90px;
}
#heart:before,
#heart:after {
    position: absolute;
    content: "";
    left: 50px;
    top: 0;
    width: 50px;
    height: 80px;
    background: red;
    -moz-border-radius: 50px 50px 0 0;
    border-radius: 50px 50px 0 0;
    -webkit-transform: rotate(-45deg);
       -moz-transform: rotate(-45deg);
        -ms-transform: rotate(-45deg);
         -o-transform: rotate(-45deg);
            transform: rotate(-45deg);
    -webkit-transform-origin: 0 100%;
       -moz-transform-origin: 0 100%;
        -ms-transform-origin: 0 100%;
         -o-transform-origin: 0 100%;
            transform-origin: 0 100%;
}
#heart:after {
    left: 0;
    -webkit-transform: rotate(45deg);
       -moz-transform: rotate(45deg);
        -ms-transform: rotate(45deg);
         -o-transform: rotate(45deg);
            transform: rotate(45deg);
    -webkit-transform-origin: 100% 100%;
       -moz-transform-origin: 100% 100%;
        -ms-transform-origin: 100% 100%;
         -o-transform-origin: 100% 100%;
            transform-origin :100% 100%;
}

#trapezoid {
	border-bottom: 175px solid yellow;
	border-left: 70px solid transparent;
	border-right: 120px solid transparent;
	height: 0;
	width: 350px;
	position: absolute;
	top: 200px;
	left: 300px;
}

#bottle{ 
	width: 125px;
	height: 125px;
	border-radius: 40px;
	background: #2C5F18;
	-webkit-clip-path: polygon(49% 25%, 49% 0, 57% 0, 58% 25%, 65% 53%, 68% 69%, 69% 100%, 40% 100%, 40% 69%, 43% 53%);
	clip-path: polygon(49% 25%, 49% 0, 57% 0, 58% 25%, 65% 53%, 68% 69%, 69% 100%, 40% 100%, 40% 69%, 43% 53%);
	position: absolute;
	top:200px;
	left:315px;
}

#glass1 {
	width: 65px;
	height: 70px;
	background: #6BD6E5;
	-webkit-clip-path: ellipse(28% 33% at 50% 16%);
    clip-path: ellipse(28% 33% at 50% 16%);
    position: absolute;
	top: 266px;
	left: 451px;

}

#glassbottom1 {
	width: 20px;
	height: 28px;
	background: #6BD6E5;
	-webkit-clip-path: polygon(39% 0, 59% 0, 60% 68%, 100% 100%, 0 100%, 40% 68%);
	clip-path: polygon(39% 0, 59% 0, 60% 68%, 100% 100%, 0 100%, 40% 68%);
	position: absolute;
	top: 288px;
	left: 474px;
}

#glass2 {
	width: 65px;
	height: 70px;
	background: #6BD6E5;
	-webkit-clip-path: ellipse(28% 33% at 50% 16%);
    clip-path: ellipse(28% 33% at 50% 16%);
	position: absolute;
	top: 295px;
	left: 436px;
}

#glassbottom2 {
	width: 20px;
	height: 28px;
	background: #6BD6E5;
	-webkit-clip-path: polygon(39% 0, 59% 0, 60% 68%, 100% 100%, 0 100%, 40% 68%);
	clip-path: polygon(39% 0, 59% 0, 60% 68%, 100% 100%, 0 100%, 40% 68%);
	position: absolute;
	top: 316px;
	left: 459px;
}

#vase {
	width: 30px;
	height: 65px;
	border-radius: 10px;
	background: #1e90ff;
	-webkit-clip-path: polygon(0 28%, 15% 15%, 15% 0%, 85% 0%, 85% 15%, 100% 28%, 100% 85%, 100% 100%, 85% 100%, 15% 100%, 0 100%, 0% 85%);
	clip-path: polygon(0 28%, 15% 15%, 15% 0%, 85% 0%, 85% 15%, 100% 28%, 100% 85%, 100% 100%, 85% 100%, 15% 100%, 0 100%, 0% 85%);
	position: absolute;
	top: 182px;
	left: 383px;
}

#flowerstem {
	width: 3px;
	height: 110px;
	background: red;
	top: 160px;
	left: 350px;
	position: absolute;
}

#flower{
	width: 20px;
	height: 23px;
	background: #1e90ff;
	-webkit-clip-path: polygon(14% 0, 87% 21%, 100% 77%, 75% 100%, 25% 100%, 0 78%);
clip-path: polygon(14% 0, 87% 21%, 100% 77%, 75% 100%, 25% 100%, 0 78%);
	top: 160px;
	left: 350px;
	position: absolute;
}
#flowerfront{
	width: 21px;
	height: 23px;
	background: red;
	-webkit-clip-path: polygon(10% 40%, 86% 0, 100% 77%, 75% 100%, 25% 100%, 0 78%);
	clip-path: polygon(10% 40%, 86% 0, 100% 77%, 75% 100%, 25% 100%, 0 78%);
	position: absolute;
	top: 160px;
	left: 349px;
	
}

#triangle {
	width: 0;
	height: 0;
	border-left: 100px solid transparent;
	border-right: 100px solid transparent;
	border-bottom: 200px solid yellow;
	position: absolute;
	top: 160px;
	left: 100px;
}

#square {
	width: 200px;
	height: 200px;
	background: red;
	top: 160px;
	left: 350px;
	position: absolute;
}

#circle {
	width: 200px;
	height: 200px;
	background: blue;
	border-radius: 200px;
	top: 160px;
	left: 600px;
	position: absolute;
}
