* {
    padding: 0;
    margin: 0;
    box-sizing: border-box;
}

body {
    background: rgb(254, 253, 173);
    font-family: Arial, Helvetica, sans-serif;
}

#star-five {
    margin: 50px 0;
    position: relative;
    display: block;
    color: rgb(255, 0, 0);
    width: 0px;
    height: 0px;
    border-right: 100px solid transparent;
    border-bottom: 70px solid red;
    border-left: 100px solid transparent;
    transform: rotate(35deg);
    transition: all 0.5s ease-in;
  }
  #star-five:before {
    border-bottom: 80px solid red;
    border-left: 30px solid transparent;
    border-right: 30px solid transparent;
    position: absolute;
    height: 0;
    width: 0;
    top: -45px;
    left: -65px;
    display: block;
    content: '';
    transform: rotate(-35deg);
    transition: all 0.5s ease-in;
  }
  #star-five:after {
    position: absolute;
    display: block;
    color: red;
    top: 3px;
    left: -105px;
    width: 0px;
    height: 0px;
    border-right: 100px solid transparent;
    border-bottom: 70px solid red;
    border-left: 100px solid transparent;
    transform: rotate(-70deg);
    content: '';
    transition: all 0.5s ease-in;
  }

  #star-five.change-me {
    color: pink;
    border-bottom: 70px solid pink;
    position: relative;
    transform: translateX(200px) translateY(200px) rotate(20deg) scale(2.5);
  }

  #star-five:before.change-me {
    border-bottom: 70px solid pink;
  }