.tree {
  display: block;
  margin: 0 auto;
  position: relative;
  top: 5px;
}
.tree .branches-top {
  width: 0px;
  border-bottom: 120px solid #44B859;
  border-right: 100px solid transparent;
  border-left: 100px solid transparent;
  margin: 0 auto;
}
.tree .branches-top .ornament-1 {
  position: relative;
  top: 130px;
  left: -20px;
  content: "";
  width: 10px;
  height: 10px;
  border-radius: 10px;
  background: #ED001D;
}
.tree .branches-top .ornament-2 {
  position: relative;
  top: 110px;
  left: 27px;
  content: "";
  width: 10px;
  height: 10px;
  border-radius: 10px;
  background: #ED001D;
}
.tree .branches-top .star {
      /*
shout-out to CSS-Tricks for the article: https://css-tricks.com/the-shapes-of-css/
      */
  margin: 0 auto;
  border-right: 60px solid transparent;
  /*100%*/
  border-left: 60px solid transparent;
  /*100%*/
  border-bottom: 42px solid #FFD700;
  /*70%*/
  -webkit-transform: rotate(35deg);
          transform: rotate(35deg);
  position: relative;
  left: -57.5px;
  top: 20px;
}
.tree .branches-top .star:before {
  border-bottom: 48px solid #FFD700;
  /*80%*/
  border-left: 18px solid transparent;
  /*30%*/
  border-right: 18px solid transparent;
  /*30%*/
  position: absolute;
  top: -27px;
  /*45%*/
  left: -39px;
  /*65%*/
  display: block;
  content: "";
  -webkit-transform: rotate(-35deg);
          transform: rotate(-35deg);
}
.tree .branches-top .star:after {
  position: absolute;
  left: -63px;
  /*-105%*/
  border-right: 60px solid transparent;
  /*100%*/
  border-left: 60px solid transparent;
  /*100%*/
  border-bottom: 42px solid #FFD700;
  /*70%*/
  -webkit-transform: rotate(-70deg);
          transform: rotate(-70deg);
  content: "";
}
.tree .branches-mid {
  width: 150px;
  border-bottom: 100px solid #44B859;
  border-right: 60px solid transparent;
  border-left: 60px solid transparent;
  margin: 0 auto;
  margin-top: -40px;
}
.tree .branches-mid .ornament-3 {
  position: relative;
  top: 70px;
  left: -15px;
  content: "";
  width: 10px;
  height: 10px;
  border-radius: 10px;
  background: #ED001D;
}
.tree .branches-mid .ornament-4 {
  position: relative;
  top: 80px;
  left: 90px;
  content: "";
  width: 10px;
  height: 10px;
  border-radius: 10px;
  background: #ED001D;
}
.tree .branches-mid .ornament-5 {
  position: relative;
  top: 55px;
  left: 30.5px;
  content: "";
  width: 10px;
  height: 10px;
  border-radius: 10px;
  background: #ED001D;
}
.tree .branches-mid .ornament-6 {
  position: relative;
  top: 40px;
  left: 125px;
  content: "";
  width: 10px;
  height: 10px;
  border-radius: 10px;
  background: #ED001D;
}
.tree .branches {
  width: 200px;
  border-bottom: 100px solid #44B859;
  border-right: 60px solid transparent;
  border-left: 60px solid transparent;
  margin: 0 auto;
  margin-top: -60px;
}
.tree .branches .ornament-7 {
  position: relative;
  top: 55px;
  left: 93.5px;
  content: "";
  width: 10px;
  height: 10px;
  border-radius: 10px;
  background: #ED001D;
}
.tree .branches .ornament-8 {
  position: relative;
  top: 70px;
  left: 114.5px;
  content: "";
  width: 10px;
  height: 10px;
  border-radius: 10px;
  background: #ED001D;
}
.tree .branches .ornament-9 {
  position: relative;
  top: 65px;
  left: 5px;
  content: "";
  width: 10px;
  height: 10px;
  border-radius: 10px;
  background: #ED001D;
}
.tree .branches .ornament-10 {
  position: relative;
  top: 90px;
  left: 183.5px;
  content: "";
  width: 10px;
  height: 10px;
  border-radius: 10px;
  background: #ED001D;
}
.tree .branches .ornament-11 {
  position: relative;
  top: 100px;
  left: 94.5px;
  content: "";
  width: 10px;
  height: 10px;
  border-radius: 10px;
  background: #ED001D;
}
.tree .branches .ornament-12 {
  position: relative;
  top: 50px;
  left: 23.5px;
  content: "";
  width: 10px;
  height: 10px;
  border-radius: 10px;
  background: #ED001D;
}
.tree .stump {
  width: 50px;
  height: 100px;
  background: #572E1C;
  margin: 0 auto;
}
.tree .pot {
  margin: 0 auto;
  border-top: 100px solid #934F2F;
  border-right: 25px solid transparent;
  border-left: 25px solid transparent;
  height: 0;
  width: 100px;
  text-align: center;
}
.tree .pot .pot-rim {
  height: 20px;
  width: 160px;
  background: #B8623B;
  border-radius: 10px;
  position: relative;
  top: -110px;
  left: -30px;
  z-index: 2;
}