/*body {
	background: #cccccc;
}*/

/* do NOT modify the canvas */

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

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


#base {
	width: 600px;
	height: 170px;
	transform: skew(160deg);
	background: silver;
	position: absolute;
	top: 360px;
	left: 200px;
}

#pumpkin {
	width: 180px;
	height: 140px;
	background: orange;
	border-radius: 100px;
	top: 300px;
	left: 400px;
	position: absolute;
}

#largestem {
	width: 25px;
	height: 90px;
	background: brown;
	top: 215px;
	left: 475px;
	position: absolute;
}

#vase {
	width: 110px;
	height: 280px;
	background: #219139;
	top: 210px;
	left: 550px;
	border-radius: 0% 0% 20% 20%;
	position: absolute;
}

#water {
	width: 110px;
	height: 200px;
	background: #3FC45B;
	top: 290px;
	left: 550px;
	border-radius: 0% 0% 20% 20%;
	position: absolute;
}

#smallpumpkin {
	width: 100px;
	height: 70px;
	background: tan;
	border-radius: 100px;
	top: 380px;
	left: 217px;
	background: rgba(247,241,212,1);
background: -moz-linear-gradient(left, rgba(247,241,212,1) 0%, rgba(255,243,184,1) 14%, rgba(247,241,212,1) 32%, rgba(255,243,184,1) 50%, rgba(247,241,212,1) 74%, rgba(255,243,184,1) 90%, rgba(254,254,254,1) 100%);
background: -webkit-gradient(left top, right top, color-stop(0%, rgba(247,241,212,1)), color-stop(14%, rgba(255,243,184,1)), color-stop(32%, rgba(247,241,212,1)), color-stop(50%, rgba(255,243,184,1)), color-stop(74%, rgba(247,241,212,1)), color-stop(90%, rgba(255,243,184,1)), color-stop(100%, rgba(254,254,254,1)));
background: -webkit-linear-gradient(left, rgba(247,241,212,1) 0%, rgba(255,243,184,1) 14%, rgba(247,241,212,1) 32%, rgba(255,243,184,1) 50%, rgba(247,241,212,1) 74%, rgba(255,243,184,1) 90%, rgba(254,254,254,1) 100%);
background: -o-linear-gradient(left, rgba(247,241,212,1) 0%, rgba(255,243,184,1) 14%, rgba(247,241,212,1) 32%, rgba(255,243,184,1) 50%, rgba(247,241,212,1) 74%, rgba(255,243,184,1) 90%, rgba(254,254,254,1) 100%);
background: -ms-linear-gradient(left, rgba(247,241,212,1) 0%, rgba(255,243,184,1) 14%, rgba(247,241,212,1) 32%, rgba(255,243,184,1) 50%, rgba(247,241,212,1) 74%, rgba(255,243,184,1) 90%, rgba(254,254,254,1) 100%);
background: linear-gradient(to right, rgba(247,241,212,1) 0%, rgba(255,243,184,1) 14%, rgba(247,241,212,1) 32%, rgba(255,243,184,1) 50%, rgba(247,241,212,1) 74%, rgba(255,243,184,1) 90%, rgba(254,254,254,1) 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f7f1d4', endColorstr='#fefefe', GradientType=1 );
	position: absolute;
}

#smallstem {
	width: 15px;
	height: 30px;
	background: brown;
	top: 356px;
	left: 260px;
	position: absolute;
}

#gourdbody {
	width: 110px;
	height: 110px;
	background: rgba(250,111,5,1);
background: -moz-linear-gradient(left, rgba(250,111,5,1) 0%, rgba(252,229,114,1) 23%, rgba(250,111,5,1) 57%, rgba(252,229,114,1) 85%, rgba(252,229,114,1) 100%);
background: -webkit-gradient(left top, right top, color-stop(0%, rgba(250,111,5,1)), color-stop(23%, rgba(252,229,114,1)), color-stop(57%, rgba(250,111,5,1)), color-stop(85%, rgba(252,229,114,1)), color-stop(100%, rgba(252,229,114,1)));
background: -webkit-linear-gradient(left, rgba(250,111,5,1) 0%, rgba(252,229,114,1) 23%, rgba(250,111,5,1) 57%, rgba(252,229,114,1) 85%, rgba(252,229,114,1) 100%);
background: -o-linear-gradient(left, rgba(250,111,5,1) 0%, rgba(252,229,114,1) 23%, rgba(250,111,5,1) 57%, rgba(252,229,114,1) 85%, rgba(252,229,114,1) 100%);
background: -ms-linear-gradient(left, rgba(250,111,5,1) 0%, rgba(252,229,114,1) 23%, rgba(250,111,5,1) 57%, rgba(252,229,114,1) 85%, rgba(252,229,114,1) 100%);
background: linear-gradient(to right, rgba(250,111,5,1) 0%, rgba(252,229,114,1) 23%, rgba(250,111,5,1) 57%, rgba(252,229,114,1) 85%, rgba(252,229,114,1) 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#fa6f05', endColorstr='#fce572', GradientType=1 );
	border-radius: 100px;
	top: 400px;
	left: 300px;
	-webkit-transform: rotate(120deg);
	-ms-transform: rotate(120deg);
	transform: rotate(120deg);
	position: absolute;
}

#gourdneck {
	width: 45px;
	height: 140px;
	background: rgba(250,111,5,1);
background: -moz-linear-gradient(left, rgba(250,111,5,1) 0%, rgba(252,229,114,1) 23%, rgba(250,111,5,1) 57%, rgba(252,229,114,1) 85%, rgba(252,229,114,1) 100%);
background: -webkit-gradient(left top, right top, color-stop(0%, rgba(250,111,5,1)), color-stop(23%, rgba(252,229,114,1)), color-stop(57%, rgba(250,111,5,1)), color-stop(85%, rgba(252,229,114,1)), color-stop(100%, rgba(252,229,114,1)));
background: -webkit-linear-gradient(left, rgba(250,111,5,1) 0%, rgba(252,229,114,1) 23%, rgba(250,111,5,1) 57%, rgba(252,229,114,1) 85%, rgba(252,229,114,1) 100%);
background: -o-linear-gradient(left, rgba(250,111,5,1) 0%, rgba(252,229,114,1) 23%, rgba(250,111,5,1) 57%, rgba(252,229,114,1) 85%, rgba(252,229,114,1) 100%);
background: -ms-linear-gradient(left, rgba(250,111,5,1) 0%, rgba(252,229,114,1) 23%, rgba(250,111,5,1) 57%, rgba(252,229,114,1) 85%, rgba(252,229,114,1) 100%);
background: linear-gradient(to right, rgba(250,111,5,1) 0%, rgba(252,229,114,1) 23%, rgba(250,111,5,1) 57%, rgba(252,229,114,1) 85%, rgba(252,229,114,1) 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#fa6f05', endColorstr='#fce572', GradientType=1 );
	-webkit-clip-path: polygon(100% 0%, 75% 50%, 100% 100%, 25% 100%, 0% 50%, 25% 0%);
clip-path: polygon(100% 0%, 75% 50%, 100% 100%, 25% 100%, 0% 50%, 25% 0%);
	top: 430px;
	left: 420px;
	border-radius: 20px;
	-webkit-transform: rotate(280deg);
	-ms-transform: rotate(280deg);
	transform: rotate(280deg);
	position: absolute;
}

#gourdstem {
	width: 30px;
	height: 10px;
	background: brown;
	top: 501px;
	left: 510px;
	position: absolute;
}
















#flower {
	width: 43px;
	height: 15px;
	-webkit-transform: rotate(50deg);
	-ms-transform: rotate(50deg);
	transform: rotate(50deg);
	border-radius: 50%;
	background-color: yellow;
	top: 100px;
	left: 530px;
	-webkit-transition: background-color 1s ease-out;
  -moz-transition: background-color 1s ease-out;
  -o-transition: background-color 1s ease-out;
  transition: background-color 1s ease-out;
	position: absolute;
}

#flower:hover {
  background-color: orange;
  cursor: pointer;
}

#flower2 {
	width: 43px;
	height: 15px;
	-webkit-transform: rotate(130deg);
	-ms-transform: rotate(130deg);
	transform: rotate(130deg);
	border-radius: 50%;
	background-color: yellow;
	top: 100px;
	left: 560px;
	-webkit-transition: background-color 1s ease-out;
  -moz-transition: background-color 1s ease-out;
  -o-transition: background-color 1s ease-out;
  transition: background-color 1s ease-out;
	position: absolute;
}

#flower2:hover {
  background-color: orange;
  cursor: pointer;
}

#flower3 {
	width: 43px;
	height: 15px;
	-webkit-transform: rotate(90deg);
	-ms-transform: rotate(90deg);
	transform: rotate(90deg);
	border-radius: 50%;
	background-color: yellow;
	top: 95px;
	left: 545px;
	-webkit-transition: background-color 1s ease-out;
  -moz-transition: background-color 1s ease-out;
  -o-transition: background-color 1s ease-out;
  transition: background-color 1s ease-out;
	position: absolute;
}

#flower3:hover {
  background-color: orange;
  cursor: pointer;
}

#flower5 {
	width: 43px;
	height: 15px;
	-webkit-transform: rotate(120deg);
	-ms-transform: rotate(120deg);
	transform: rotate(120deg);
	border-radius: 50%;
	background-color: orange;
	top: 95px;
	left: 550px;
	-webkit-transition: background-color 1s ease-out;
  -moz-transition: background-color 1s ease-out;
  -o-transition: background-color 1s ease-out;
  transition: background-color 1s ease-out;
	position: absolute;
}

#flower5:hover {
  background-color: yellow;
  cursor: pointer;
}

#flower4 {
	width: 43px;
	height: 15px;
	-webkit-transform: rotate(69deg);
	-ms-transform: rotate(69deg);
	transform: rotate(69deg);
	border-radius: 50%;
	background-color: orange;
	top: 95px;
	left: 538px;
	-webkit-transition: background-color 1s ease-out;
  -moz-transition: background-color 1s ease-out;
  -o-transition: background-color 1s ease-out;
  transition: background-color 1s ease-out;
	position: absolute;
}

#flower4:hover {
  background-color: yellow;
  cursor: pointer;
}

#triangle {
	width: 0;
	height: 0;
	border-left: 17px solid transparent;
	border-right: 17px solid transparent;
	border-bottom: 10px solid green;
	-webkit-transform: rotate(180deg);
	-ms-transform: rotate(180deg);
	transform: rotate(180deg);
	position: absolute;
	top: 120px;
	left: 550px;
}





/* FLOWER2 */

#flower2_1 {
	width: 43px;
	height: 15px;
	-webkit-transform: rotate(50deg);
	-ms-transform: rotate(50deg);
	transform: rotate(50deg);
	border-radius: 50%;
	background-color: yellow;
	top: 90px;
	left: 570px;
	-webkit-transition: background-color 1s ease-out;
  -moz-transition: background-color 1s ease-out;
  -o-transition: background-color 1s ease-out;
  transition: background-color 1s ease-out;
	position: absolute;
}

#flower2_1:hover {
  background-color: orange;
  cursor: pointer;
}

#flower2_2 {
	width: 43px;
	height: 15px;
	-webkit-transform: rotate(130deg);
	-ms-transform: rotate(130deg);
	transform: rotate(130deg);
	border-radius: 50%;
	background-color: yellow;
	top: 90px;
	left: 600px;
	-webkit-transition: background-color 1s ease-out;
  -moz-transition: background-color 1s ease-out;
  -o-transition: background-color 1s ease-out;
  transition: background-color 1s ease-out;
	position: absolute;
}

#flower2_2:hover {
  background-color: orange;
  cursor: pointer;
}

#flower2_3 {
	width: 43px;
	height: 15px;
	-webkit-transform: rotate(90deg);
	-ms-transform: rotate(90deg);
	transform: rotate(90deg);
	border-radius: 50%;
	background-color: yellow;
	top: 85px;
	left: 585px;
	-webkit-transition: background-color 1s ease-out;
  -moz-transition: background-color 1s ease-out;
  -o-transition: background-color 1s ease-out;
  transition: background-color 1s ease-out;
	position: absolute;
}

#flower2_3:hover {
  background-color: orange;
  cursor: pointer;
}

#flower2_5 {
	width: 43px;
	height: 15px;
	-webkit-transform: rotate(120deg);
	-ms-transform: rotate(120deg);
	transform: rotate(120deg);
	border-radius: 50%;
	background-color: orange;
	top: 85px;
	left: 590px;
	-webkit-transition: background-color 1s ease-out;
  -moz-transition: background-color 1s ease-out;
  -o-transition: background-color 1s ease-out;
  transition: background-color 1s ease-out;
	position: absolute;
}

#flower2_5:hover {
  background-color: yellow;
  cursor: pointer;
}

#flower2_4 {
	width: 43px;
	height: 15px;
	-webkit-transform: rotate(69deg);
	-ms-transform: rotate(69deg);
	transform: rotate(69deg);
	border-radius: 50%;
	background-color: orange;
	top: 85px;
	left: 578px;
	-webkit-transition: background-color 1s ease-out;
  -moz-transition: background-color 1s ease-out;
  -o-transition: background-color 1s ease-out;
  transition: background-color 1s ease-out;
	position: absolute;
}

#flower2_4:hover {
  background-color: yellow;
  cursor: pointer;
}

#triangle2 {
	width: 0;
	height: 0;
	border-left: 17px solid transparent;
	border-right: 17px solid transparent;
	border-bottom: 10px solid green;
	-webkit-transform: rotate(180deg);
	-ms-transform: rotate(180deg);
	transform: rotate(180deg);
	position: absolute;
	top: 110px;
	left: 590px;
}







/* FLOWER3 */

#flower3_1 {
	width: 43px;
	height: 15px;
	-webkit-transform: rotate(50deg);
	-ms-transform: rotate(50deg);
	transform: rotate(50deg);
	border-radius: 50%;
	background-color: yellow;
	top: 100px;
	left: 610px;
	-webkit-transition: background-color 1s ease-out;
  -moz-transition: background-color 1s ease-out;
  -o-transition: background-color 1s ease-out;
  transition: background-color 1s ease-out;
	position: absolute;
}

#flower3_1:hover {
  background-color: orange;
  cursor: pointer;
}

#flower3_2 {
	width: 43px;
	height: 15px;
	-webkit-transform: rotate(130deg);
	-ms-transform: rotate(130deg);
	transform: rotate(130deg);
	border-radius: 50%;
	background-color: yellow;
	top: 100px;
	left: 640px;
	-webkit-transition: background-color 1s ease-out;
  -moz-transition: background-color 1s ease-out;
  -o-transition: background-color 1s ease-out;
  transition: background-color 1s ease-out;
	position: absolute;
}

#flower3_2:hover {
  background-color: orange;
  cursor: pointer;
}

#flower3_3 {
	width: 43px;
	height: 15px;
	-webkit-transform: rotate(90deg);
	-ms-transform: rotate(90deg);
	transform: rotate(90deg);
	border-radius: 50%;
	background-color: yellow;
	top: 95px;
	left: 625px;
	-webkit-transition: background-color 1s ease-out;
  -moz-transition: background-color 1s ease-out;
  -o-transition: background-color 1s ease-out;
  transition: background-color 1s ease-out;
	position: absolute;
}

#flower3_3:hover {
  background-color: orange;
  cursor: pointer;
}

#flower3_5 {
	width: 43px;
	height: 15px;
	-webkit-transform: rotate(120deg);
	-ms-transform: rotate(120deg);
	transform: rotate(120deg);
	border-radius: 50%;
	background-color: orange;
	top: 95px;
	left: 630px;
	-webkit-transition: background-color 1s ease-out;
  -moz-transition: background-color 1s ease-out;
  -o-transition: background-color 1s ease-out;
  transition: background-color 1s ease-out;
	position: absolute;
}

#flower3_5:hover {
  background-color: yellow;
  cursor: pointer;
}

#flower3_4 {
	width: 43px;
	height: 15px;
	-webkit-transform: rotate(69deg);
	-ms-transform: rotate(69deg);
	transform: rotate(69deg);
	border-radius: 50%;
	background-color: orange;
	top: 95px;
	left: 618px;
	-webkit-transition: background-color 1s ease-out;
  -moz-transition: background-color 1s ease-out;
  -o-transition: background-color 1s ease-out;
  transition: background-color 1s ease-out;
	position: absolute;
}

#flower3_4:hover {
  background-color: yellow;
  cursor: pointer;
}

#triangle3 {
	width: 0;
	height: 0;
	border-left: 17px solid transparent;
	border-right: 17px solid transparent;
	border-bottom: 10px solid green;
	-webkit-transform: rotate(180deg);
	-ms-transform: rotate(180deg);
	transform: rotate(180deg);
	position: absolute;
	top: 120px;
	left: 630px;
}

#stem1 {
	width: 10px;
	height: 320px;
	background: green;
	top: 115px;
	left: 561.5px;
	position: absolute;
}

#stem2 {
	width: 10px;
	height: 320px;
	background: green;
	top: 115px;
	left: 642px;
	position: absolute;
}

#stem3 {
	width: 10px;
	height: 300px;
	background: green;
	top: 115px;
	left: 601.5px;
	position: absolute;
}
