#hbf {
  position: relative;
  width: 100%;
  height: 560px;
  overflow: hidden;
}

#banner-bg {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}

#home-banner {
  background: #1955a3;
  position: absolute;
  left: 50%;
  margin: 0 0 0 -400px;
  width: 800px;
  height: 560px;
  overflow: hidden;
}

#homebanner-text {
  height: 100%;
  display: -ms-flexbox;
  display: -webkit-flex;
  display: flex;
  -webkit-flex-direction: row;
  -ms-flex-direction: row;
  flex-direction: row;
  -webkit-flex-wrap: nowrap;
  -ms-flex-wrap: nowrap;
  flex-wrap: nowrap;
  -webkit-justify-content: center;
  -ms-flex-pack: center;
  justify-content: center;
  -webkit-align-content: center;
  -ms-flex-line-pack: center;
  align-content: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  opacity: 0;
  -webkit-animation: bannerText 1s 1.4s 1;
  -moz-animation: bannerText 1s 1.4s 1;
  animation: bannerText 1s 1.4s 1;
  -webkit-animation-fill-mode: forwards;
  -moz-animation-fill-mode: forwards;
  animation-fill-mode: forwards;
}

@-webkit-keyframes bannerText {
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}
@-moz-keyframes bannerText {
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}
@keyframes bannerText {
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}
@media all and (min-width: 768px) {
  #home-banner {
    width: 100%;
    position: relative;
    left: auto;
    margin: 0;
  }

  #homebanner-text p {
    width: 430px;
    margin: 0 auto;
  }
}
.wing,
.wing-yellow {
  position: absolute;
  width: 100%;
  height: 500px;
}

.wing:nth-child(2) {
  top: -100px;
  left: -20%;
}

.wing-yellow,
.wing:nth-child(3) {
  right: 80%;
  top: 70%;
  -webkit-transform: rotateY(180deg) translate(-100%, -100%);
  transform: rotateY(180deg) translate(-100%, -100%);
  animation-fill-mode: forwards;
  -webkit-animation-fill-mode: forwards;
}

@media all and (min-width: 768px) {
  .wing:nth-child(2) {
    top: -180px;
    left: -20%;
  }

  .wing-yellow,
  .wing:nth-child(3) {
    top: 50%;
    right: 80%;
  }
}
@media all and (min-width: 1600px) {
  .wing:nth-child(2) {
    top: -300px;
  }

  .wing-yellow,
  .wing:nth-child(3) {
    top: 20%;
    right: 90%;
  }
}
.feather {
  height: 100px;
  width: 100%;
  position: absolute;
  border-bottom-right-radius: 100%;
  border-top-left-radius: 100%;
  -webkit-transform-origin: top left;
  -moz-transform-origin: top left;
  -ms-transform-origin: top left;
  -o-transform-origin: top left;
  transform-origin: top left;
}
.feather:nth-of-type(1) {
  -webkit-transform: rotate(0deg) translateX(0px);
  -moz-transform: rotate(0deg) translateX(0px);
  -ms-transform: rotate(0deg) translateX(0px);
  -o-transform: rotate(0deg) translateX(0px);
  transform: rotate(0deg) translateX(0px);
  -webkit-animation: wave1 2.5s 1;
  -moz-animation: wave1 2.5s 1;
  animation: wave1 2.5s 1;
  -webkit-animation-fill-mode: forwards;
  -moz-animation-fill-mode: forwards;
  animation-fill-mode: forwards;
  height: 121px;
}
@-webkit-keyframes wave1 {
  50% {
    -webkit-transform: rotate(11deg) translateX(20px);
  }
  100% {
    -webkit-transform: rotate(10deg) translateX(20px);
  }
}
@-moz-keyframes wave1 {
  50% {
    -moz-transform: rotate(11deg) translateX(20px);
  }
  100% {
    -moz-transform: rotate(10deg) translateX(20px);
  }
}
@keyframes wave1 {
  50% {
    -webkit-transform: rotate(11deg) translateX(20px);
    -moz-transform: rotate(11deg) translateX(20px);
    -ms-transform: rotate(11deg) translateX(20px);
    -o-transform: rotate(11deg) translateX(20px);
    transform: rotate(11deg) translateX(20px);
  }
  100% {
    -webkit-transform: rotate(10deg) translateX(20px);
    -moz-transform: rotate(10deg) translateX(20px);
    -ms-transform: rotate(10deg) translateX(20px);
    -o-transform: rotate(10deg) translateX(20px);
    transform: rotate(10deg) translateX(20px);
  }
}
@media all and (min-width: 992px) {
  .feather:nth-of-type(1) {
    height: 151px;
  }
}
@media all and (min-width: 1600px) {
  .feather:nth-of-type(1) {
    height: 181px;
  }
}
.feather:nth-of-type(2) {
  -webkit-transform: rotate(0deg) translateX(0px);
  -moz-transform: rotate(0deg) translateX(0px);
  -ms-transform: rotate(0deg) translateX(0px);
  -o-transform: rotate(0deg) translateX(0px);
  transform: rotate(0deg) translateX(0px);
  -webkit-animation: wave2 2.5s 1;
  -moz-animation: wave2 2.5s 1;
  animation: wave2 2.5s 1;
  -webkit-animation-fill-mode: forwards;
  -moz-animation-fill-mode: forwards;
  animation-fill-mode: forwards;
  height: 122px;
}
@-webkit-keyframes wave2 {
  50% {
    -webkit-transform: rotate(22deg) translateX(40px);
  }
  100% {
    -webkit-transform: rotate(20deg) translateX(40px);
  }
}
@-moz-keyframes wave2 {
  50% {
    -moz-transform: rotate(22deg) translateX(40px);
  }
  100% {
    -moz-transform: rotate(20deg) translateX(40px);
  }
}
@keyframes wave2 {
  50% {
    -webkit-transform: rotate(22deg) translateX(40px);
    -moz-transform: rotate(22deg) translateX(40px);
    -ms-transform: rotate(22deg) translateX(40px);
    -o-transform: rotate(22deg) translateX(40px);
    transform: rotate(22deg) translateX(40px);
  }
  100% {
    -webkit-transform: rotate(20deg) translateX(40px);
    -moz-transform: rotate(20deg) translateX(40px);
    -ms-transform: rotate(20deg) translateX(40px);
    -o-transform: rotate(20deg) translateX(40px);
    transform: rotate(20deg) translateX(40px);
  }
}
@media all and (min-width: 992px) {
  .feather:nth-of-type(2) {
    height: 152px;
  }
}
@media all and (min-width: 1600px) {
  .feather:nth-of-type(2) {
    height: 182px;
  }
}
.feather:nth-of-type(3) {
  -webkit-transform: rotate(0deg) translateX(0px);
  -moz-transform: rotate(0deg) translateX(0px);
  -ms-transform: rotate(0deg) translateX(0px);
  -o-transform: rotate(0deg) translateX(0px);
  transform: rotate(0deg) translateX(0px);
  -webkit-animation: wave3 2.5s 1;
  -moz-animation: wave3 2.5s 1;
  animation: wave3 2.5s 1;
  -webkit-animation-fill-mode: forwards;
  -moz-animation-fill-mode: forwards;
  animation-fill-mode: forwards;
  height: 123px;
}
@-webkit-keyframes wave3 {
  50% {
    -webkit-transform: rotate(33deg) translateX(60px);
  }
  100% {
    -webkit-transform: rotate(30deg) translateX(60px);
  }
}
@-moz-keyframes wave3 {
  50% {
    -moz-transform: rotate(33deg) translateX(60px);
  }
  100% {
    -moz-transform: rotate(30deg) translateX(60px);
  }
}
@keyframes wave3 {
  50% {
    -webkit-transform: rotate(33deg) translateX(60px);
    -moz-transform: rotate(33deg) translateX(60px);
    -ms-transform: rotate(33deg) translateX(60px);
    -o-transform: rotate(33deg) translateX(60px);
    transform: rotate(33deg) translateX(60px);
  }
  100% {
    -webkit-transform: rotate(30deg) translateX(60px);
    -moz-transform: rotate(30deg) translateX(60px);
    -ms-transform: rotate(30deg) translateX(60px);
    -o-transform: rotate(30deg) translateX(60px);
    transform: rotate(30deg) translateX(60px);
  }
}
@media all and (min-width: 992px) {
  .feather:nth-of-type(3) {
    height: 153px;
  }
}
@media all and (min-width: 1600px) {
  .feather:nth-of-type(3) {
    height: 183px;
  }
}
.feather:nth-of-type(4) {
  -webkit-transform: rotate(0deg) translateX(0px);
  -moz-transform: rotate(0deg) translateX(0px);
  -ms-transform: rotate(0deg) translateX(0px);
  -o-transform: rotate(0deg) translateX(0px);
  transform: rotate(0deg) translateX(0px);
  -webkit-animation: wave4 2.5s 1;
  -moz-animation: wave4 2.5s 1;
  animation: wave4 2.5s 1;
  -webkit-animation-fill-mode: forwards;
  -moz-animation-fill-mode: forwards;
  animation-fill-mode: forwards;
  height: 124px;
}
@-webkit-keyframes wave4 {
  50% {
    -webkit-transform: rotate(44deg) translateX(80px);
  }
  100% {
    -webkit-transform: rotate(40deg) translateX(80px);
  }
}
@-moz-keyframes wave4 {
  50% {
    -moz-transform: rotate(44deg) translateX(80px);
  }
  100% {
    -moz-transform: rotate(40deg) translateX(80px);
  }
}
@keyframes wave4 {
  50% {
    -webkit-transform: rotate(44deg) translateX(80px);
    -moz-transform: rotate(44deg) translateX(80px);
    -ms-transform: rotate(44deg) translateX(80px);
    -o-transform: rotate(44deg) translateX(80px);
    transform: rotate(44deg) translateX(80px);
  }
  100% {
    -webkit-transform: rotate(40deg) translateX(80px);
    -moz-transform: rotate(40deg) translateX(80px);
    -ms-transform: rotate(40deg) translateX(80px);
    -o-transform: rotate(40deg) translateX(80px);
    transform: rotate(40deg) translateX(80px);
  }
}
@media all and (min-width: 992px) {
  .feather:nth-of-type(4) {
    height: 154px;
  }
}
@media all and (min-width: 1600px) {
  .feather:nth-of-type(4) {
    height: 184px;
  }
}
.feather:nth-of-type(5) {
  -webkit-transform: rotate(0deg) translateX(0px);
  -moz-transform: rotate(0deg) translateX(0px);
  -ms-transform: rotate(0deg) translateX(0px);
  -o-transform: rotate(0deg) translateX(0px);
  transform: rotate(0deg) translateX(0px);
  -webkit-animation: wave5 2.5s 1;
  -moz-animation: wave5 2.5s 1;
  animation: wave5 2.5s 1;
  -webkit-animation-fill-mode: forwards;
  -moz-animation-fill-mode: forwards;
  animation-fill-mode: forwards;
  height: 125px;
}
@-webkit-keyframes wave5 {
  50% {
    -webkit-transform: rotate(55deg) translateX(100px);
  }
  100% {
    -webkit-transform: rotate(50deg) translateX(100px);
  }
}
@-moz-keyframes wave5 {
  50% {
    -moz-transform: rotate(55deg) translateX(100px);
  }
  100% {
    -moz-transform: rotate(50deg) translateX(100px);
  }
}
@keyframes wave5 {
  50% {
    -webkit-transform: rotate(55deg) translateX(100px);
    -moz-transform: rotate(55deg) translateX(100px);
    -ms-transform: rotate(55deg) translateX(100px);
    -o-transform: rotate(55deg) translateX(100px);
    transform: rotate(55deg) translateX(100px);
  }
  100% {
    -webkit-transform: rotate(50deg) translateX(100px);
    -moz-transform: rotate(50deg) translateX(100px);
    -ms-transform: rotate(50deg) translateX(100px);
    -o-transform: rotate(50deg) translateX(100px);
    transform: rotate(50deg) translateX(100px);
  }
}
@media all and (min-width: 992px) {
  .feather:nth-of-type(5) {
    height: 155px;
  }
}
@media all and (min-width: 1600px) {
  .feather:nth-of-type(5) {
    height: 185px;
  }
}
.feather:nth-of-type(6) {
  -webkit-transform: rotate(0deg) translateX(0px);
  -moz-transform: rotate(0deg) translateX(0px);
  -ms-transform: rotate(0deg) translateX(0px);
  -o-transform: rotate(0deg) translateX(0px);
  transform: rotate(0deg) translateX(0px);
  -webkit-animation: wave6 2.5s 1;
  -moz-animation: wave6 2.5s 1;
  animation: wave6 2.5s 1;
  -webkit-animation-fill-mode: forwards;
  -moz-animation-fill-mode: forwards;
  animation-fill-mode: forwards;
  height: 126px;
}
@-webkit-keyframes wave6 {
  50% {
    -webkit-transform: rotate(66deg) translateX(120px);
  }
  100% {
    -webkit-transform: rotate(60deg) translateX(120px);
  }
}
@-moz-keyframes wave6 {
  50% {
    -moz-transform: rotate(66deg) translateX(120px);
  }
  100% {
    -moz-transform: rotate(60deg) translateX(120px);
  }
}
@keyframes wave6 {
  50% {
    -webkit-transform: rotate(66deg) translateX(120px);
    -moz-transform: rotate(66deg) translateX(120px);
    -ms-transform: rotate(66deg) translateX(120px);
    -o-transform: rotate(66deg) translateX(120px);
    transform: rotate(66deg) translateX(120px);
  }
  100% {
    -webkit-transform: rotate(60deg) translateX(120px);
    -moz-transform: rotate(60deg) translateX(120px);
    -ms-transform: rotate(60deg) translateX(120px);
    -o-transform: rotate(60deg) translateX(120px);
    transform: rotate(60deg) translateX(120px);
  }
}
@media all and (min-width: 992px) {
  .feather:nth-of-type(6) {
    height: 156px;
  }
}
@media all and (min-width: 1600px) {
  .feather:nth-of-type(6) {
    height: 186px;
  }
}
.feather:nth-of-type(7) {
  -webkit-transform: rotate(0deg) translateX(0px);
  -moz-transform: rotate(0deg) translateX(0px);
  -ms-transform: rotate(0deg) translateX(0px);
  -o-transform: rotate(0deg) translateX(0px);
  transform: rotate(0deg) translateX(0px);
  -webkit-animation: wave7 2.5s 1;
  -moz-animation: wave7 2.5s 1;
  animation: wave7 2.5s 1;
  -webkit-animation-fill-mode: forwards;
  -moz-animation-fill-mode: forwards;
  animation-fill-mode: forwards;
  height: 127px;
}
@-webkit-keyframes wave7 {
  50% {
    -webkit-transform: rotate(77deg) translateX(140px);
  }
  100% {
    -webkit-transform: rotate(70deg) translateX(140px);
  }
}
@-moz-keyframes wave7 {
  50% {
    -moz-transform: rotate(77deg) translateX(140px);
  }
  100% {
    -moz-transform: rotate(70deg) translateX(140px);
  }
}
@keyframes wave7 {
  50% {
    -webkit-transform: rotate(77deg) translateX(140px);
    -moz-transform: rotate(77deg) translateX(140px);
    -ms-transform: rotate(77deg) translateX(140px);
    -o-transform: rotate(77deg) translateX(140px);
    transform: rotate(77deg) translateX(140px);
  }
  100% {
    -webkit-transform: rotate(70deg) translateX(140px);
    -moz-transform: rotate(70deg) translateX(140px);
    -ms-transform: rotate(70deg) translateX(140px);
    -o-transform: rotate(70deg) translateX(140px);
    transform: rotate(70deg) translateX(140px);
  }
}
@media all and (min-width: 992px) {
  .feather:nth-of-type(7) {
    height: 157px;
  }
}
@media all and (min-width: 1600px) {
  .feather:nth-of-type(7) {
    height: 187px;
  }
}
.feather:nth-of-type(8) {
  -webkit-transform: rotate(0deg) translateX(0px);
  -moz-transform: rotate(0deg) translateX(0px);
  -ms-transform: rotate(0deg) translateX(0px);
  -o-transform: rotate(0deg) translateX(0px);
  transform: rotate(0deg) translateX(0px);
  -webkit-animation: wave8 2.5s 1;
  -moz-animation: wave8 2.5s 1;
  animation: wave8 2.5s 1;
  -webkit-animation-fill-mode: forwards;
  -moz-animation-fill-mode: forwards;
  animation-fill-mode: forwards;
  height: 128px;
}
@-webkit-keyframes wave8 {
  50% {
    -webkit-transform: rotate(88deg) translateX(160px);
  }
  100% {
    -webkit-transform: rotate(80deg) translateX(160px);
  }
}
@-moz-keyframes wave8 {
  50% {
    -moz-transform: rotate(88deg) translateX(160px);
  }
  100% {
    -moz-transform: rotate(80deg) translateX(160px);
  }
}
@keyframes wave8 {
  50% {
    -webkit-transform: rotate(88deg) translateX(160px);
    -moz-transform: rotate(88deg) translateX(160px);
    -ms-transform: rotate(88deg) translateX(160px);
    -o-transform: rotate(88deg) translateX(160px);
    transform: rotate(88deg) translateX(160px);
  }
  100% {
    -webkit-transform: rotate(80deg) translateX(160px);
    -moz-transform: rotate(80deg) translateX(160px);
    -ms-transform: rotate(80deg) translateX(160px);
    -o-transform: rotate(80deg) translateX(160px);
    transform: rotate(80deg) translateX(160px);
  }
}
@media all and (min-width: 992px) {
  .feather:nth-of-type(8) {
    height: 158px;
  }
}
@media all and (min-width: 1600px) {
  .feather:nth-of-type(8) {
    height: 188px;
  }
}
.feather:nth-of-type(9) {
  -webkit-transform: rotate(0deg) translateX(0px);
  -moz-transform: rotate(0deg) translateX(0px);
  -ms-transform: rotate(0deg) translateX(0px);
  -o-transform: rotate(0deg) translateX(0px);
  transform: rotate(0deg) translateX(0px);
  -webkit-animation: wave9 2.5s 1;
  -moz-animation: wave9 2.5s 1;
  animation: wave9 2.5s 1;
  -webkit-animation-fill-mode: forwards;
  -moz-animation-fill-mode: forwards;
  animation-fill-mode: forwards;
  height: 129px;
}
@-webkit-keyframes wave9 {
  50% {
    -webkit-transform: rotate(99deg) translateX(180px);
  }
  100% {
    -webkit-transform: rotate(90deg) translateX(180px);
  }
}
@-moz-keyframes wave9 {
  50% {
    -moz-transform: rotate(99deg) translateX(180px);
  }
  100% {
    -moz-transform: rotate(90deg) translateX(180px);
  }
}
@keyframes wave9 {
  50% {
    -webkit-transform: rotate(99deg) translateX(180px);
    -moz-transform: rotate(99deg) translateX(180px);
    -ms-transform: rotate(99deg) translateX(180px);
    -o-transform: rotate(99deg) translateX(180px);
    transform: rotate(99deg) translateX(180px);
  }
  100% {
    -webkit-transform: rotate(90deg) translateX(180px);
    -moz-transform: rotate(90deg) translateX(180px);
    -ms-transform: rotate(90deg) translateX(180px);
    -o-transform: rotate(90deg) translateX(180px);
    transform: rotate(90deg) translateX(180px);
  }
}
@media all and (min-width: 992px) {
  .feather:nth-of-type(9) {
    height: 159px;
  }
}
@media all and (min-width: 1600px) {
  .feather:nth-of-type(9) {
    height: 189px;
  }
}
.feather:nth-of-type(10) {
  -webkit-transform: rotate(0deg) translateX(0px);
  -moz-transform: rotate(0deg) translateX(0px);
  -ms-transform: rotate(0deg) translateX(0px);
  -o-transform: rotate(0deg) translateX(0px);
  transform: rotate(0deg) translateX(0px);
  -webkit-animation: wave10 2.5s 1;
  -moz-animation: wave10 2.5s 1;
  animation: wave10 2.5s 1;
  -webkit-animation-fill-mode: forwards;
  -moz-animation-fill-mode: forwards;
  animation-fill-mode: forwards;
  height: 130px;
}
@-webkit-keyframes wave10 {
  50% {
    -webkit-transform: rotate(110deg) translateX(200px);
  }
  100% {
    -webkit-transform: rotate(100deg) translateX(200px);
  }
}
@-moz-keyframes wave10 {
  50% {
    -moz-transform: rotate(110deg) translateX(200px);
  }
  100% {
    -moz-transform: rotate(100deg) translateX(200px);
  }
}
@keyframes wave10 {
  50% {
    -webkit-transform: rotate(110deg) translateX(200px);
    -moz-transform: rotate(110deg) translateX(200px);
    -ms-transform: rotate(110deg) translateX(200px);
    -o-transform: rotate(110deg) translateX(200px);
    transform: rotate(110deg) translateX(200px);
  }
  100% {
    -webkit-transform: rotate(100deg) translateX(200px);
    -moz-transform: rotate(100deg) translateX(200px);
    -ms-transform: rotate(100deg) translateX(200px);
    -o-transform: rotate(100deg) translateX(200px);
    transform: rotate(100deg) translateX(200px);
  }
}
@media all and (min-width: 992px) {
  .feather:nth-of-type(10) {
    height: 160px;
  }
}
@media all and (min-width: 1600px) {
  .feather:nth-of-type(10) {
    height: 190px;
  }
}
.feather:nth-of-type(11) {
  -webkit-transform: rotate(0deg) translateX(0px);
  -moz-transform: rotate(0deg) translateX(0px);
  -ms-transform: rotate(0deg) translateX(0px);
  -o-transform: rotate(0deg) translateX(0px);
  transform: rotate(0deg) translateX(0px);
  -webkit-animation: wave11 2.5s 1;
  -moz-animation: wave11 2.5s 1;
  animation: wave11 2.5s 1;
  -webkit-animation-fill-mode: forwards;
  -moz-animation-fill-mode: forwards;
  animation-fill-mode: forwards;
  height: 131px;
}
@-webkit-keyframes wave11 {
  50% {
    -webkit-transform: rotate(121deg) translateX(220px);
  }
  100% {
    -webkit-transform: rotate(110deg) translateX(220px);
  }
}
@-moz-keyframes wave11 {
  50% {
    -moz-transform: rotate(121deg) translateX(220px);
  }
  100% {
    -moz-transform: rotate(110deg) translateX(220px);
  }
}
@keyframes wave11 {
  50% {
    -webkit-transform: rotate(121deg) translateX(220px);
    -moz-transform: rotate(121deg) translateX(220px);
    -ms-transform: rotate(121deg) translateX(220px);
    -o-transform: rotate(121deg) translateX(220px);
    transform: rotate(121deg) translateX(220px);
  }
  100% {
    -webkit-transform: rotate(110deg) translateX(220px);
    -moz-transform: rotate(110deg) translateX(220px);
    -ms-transform: rotate(110deg) translateX(220px);
    -o-transform: rotate(110deg) translateX(220px);
    transform: rotate(110deg) translateX(220px);
  }
}
@media all and (min-width: 992px) {
  .feather:nth-of-type(11) {
    height: 161px;
  }
}
@media all and (min-width: 1600px) {
  .feather:nth-of-type(11) {
    height: 191px;
  }
}
.feather:nth-of-type(12) {
  -webkit-transform: rotate(0deg) translateX(0px);
  -moz-transform: rotate(0deg) translateX(0px);
  -ms-transform: rotate(0deg) translateX(0px);
  -o-transform: rotate(0deg) translateX(0px);
  transform: rotate(0deg) translateX(0px);
  -webkit-animation: wave12 2.5s 1;
  -moz-animation: wave12 2.5s 1;
  animation: wave12 2.5s 1;
  -webkit-animation-fill-mode: forwards;
  -moz-animation-fill-mode: forwards;
  animation-fill-mode: forwards;
  height: 132px;
}
@-webkit-keyframes wave12 {
  50% {
    -webkit-transform: rotate(132deg) translateX(240px);
  }
  100% {
    -webkit-transform: rotate(120deg) translateX(240px);
  }
}
@-moz-keyframes wave12 {
  50% {
    -moz-transform: rotate(132deg) translateX(240px);
  }
  100% {
    -moz-transform: rotate(120deg) translateX(240px);
  }
}
@keyframes wave12 {
  50% {
    -webkit-transform: rotate(132deg) translateX(240px);
    -moz-transform: rotate(132deg) translateX(240px);
    -ms-transform: rotate(132deg) translateX(240px);
    -o-transform: rotate(132deg) translateX(240px);
    transform: rotate(132deg) translateX(240px);
  }
  100% {
    -webkit-transform: rotate(120deg) translateX(240px);
    -moz-transform: rotate(120deg) translateX(240px);
    -ms-transform: rotate(120deg) translateX(240px);
    -o-transform: rotate(120deg) translateX(240px);
    transform: rotate(120deg) translateX(240px);
  }
}
@media all and (min-width: 992px) {
  .feather:nth-of-type(12) {
    height: 162px;
  }
}
@media all and (min-width: 1600px) {
  .feather:nth-of-type(12) {
    height: 192px;
  }
}
.feather:nth-of-type(13) {
  -webkit-transform: rotate(0deg) translateX(0px);
  -moz-transform: rotate(0deg) translateX(0px);
  -ms-transform: rotate(0deg) translateX(0px);
  -o-transform: rotate(0deg) translateX(0px);
  transform: rotate(0deg) translateX(0px);
  -webkit-animation: wave13 2.5s 1;
  -moz-animation: wave13 2.5s 1;
  animation: wave13 2.5s 1;
  -webkit-animation-fill-mode: forwards;
  -moz-animation-fill-mode: forwards;
  animation-fill-mode: forwards;
  height: 133px;
}
@-webkit-keyframes wave13 {
  50% {
    -webkit-transform: rotate(143deg) translateX(260px);
  }
  100% {
    -webkit-transform: rotate(130deg) translateX(260px);
  }
}
@-moz-keyframes wave13 {
  50% {
    -moz-transform: rotate(143deg) translateX(260px);
  }
  100% {
    -moz-transform: rotate(130deg) translateX(260px);
  }
}
@keyframes wave13 {
  50% {
    -webkit-transform: rotate(143deg) translateX(260px);
    -moz-transform: rotate(143deg) translateX(260px);
    -ms-transform: rotate(143deg) translateX(260px);
    -o-transform: rotate(143deg) translateX(260px);
    transform: rotate(143deg) translateX(260px);
  }
  100% {
    -webkit-transform: rotate(130deg) translateX(260px);
    -moz-transform: rotate(130deg) translateX(260px);
    -ms-transform: rotate(130deg) translateX(260px);
    -o-transform: rotate(130deg) translateX(260px);
    transform: rotate(130deg) translateX(260px);
  }
}
@media all and (min-width: 992px) {
  .feather:nth-of-type(13) {
    height: 163px;
  }
}
@media all and (min-width: 1600px) {
  .feather:nth-of-type(13) {
    height: 193px;
  }
}
.feather:nth-of-type(14) {
  -webkit-transform: rotate(0deg) translateX(0px);
  -moz-transform: rotate(0deg) translateX(0px);
  -ms-transform: rotate(0deg) translateX(0px);
  -o-transform: rotate(0deg) translateX(0px);
  transform: rotate(0deg) translateX(0px);
  -webkit-animation: wave14 2.5s 1;
  -moz-animation: wave14 2.5s 1;
  animation: wave14 2.5s 1;
  -webkit-animation-fill-mode: forwards;
  -moz-animation-fill-mode: forwards;
  animation-fill-mode: forwards;
  height: 134px;
}
@-webkit-keyframes wave14 {
  50% {
    -webkit-transform: rotate(154deg) translateX(280px);
  }
  100% {
    -webkit-transform: rotate(140deg) translateX(280px);
  }
}
@-moz-keyframes wave14 {
  50% {
    -moz-transform: rotate(154deg) translateX(280px);
  }
  100% {
    -moz-transform: rotate(140deg) translateX(280px);
  }
}
@keyframes wave14 {
  50% {
    -webkit-transform: rotate(154deg) translateX(280px);
    -moz-transform: rotate(154deg) translateX(280px);
    -ms-transform: rotate(154deg) translateX(280px);
    -o-transform: rotate(154deg) translateX(280px);
    transform: rotate(154deg) translateX(280px);
  }
  100% {
    -webkit-transform: rotate(140deg) translateX(280px);
    -moz-transform: rotate(140deg) translateX(280px);
    -ms-transform: rotate(140deg) translateX(280px);
    -o-transform: rotate(140deg) translateX(280px);
    transform: rotate(140deg) translateX(280px);
  }
}
@media all and (min-width: 992px) {
  .feather:nth-of-type(14) {
    height: 164px;
  }
}
@media all and (min-width: 1600px) {
  .feather:nth-of-type(14) {
    height: 194px;
  }
}
.feather:nth-of-type(15) {
  -webkit-transform: rotate(0deg) translateX(0px);
  -moz-transform: rotate(0deg) translateX(0px);
  -ms-transform: rotate(0deg) translateX(0px);
  -o-transform: rotate(0deg) translateX(0px);
  transform: rotate(0deg) translateX(0px);
  -webkit-animation: wave15 2.5s 1;
  -moz-animation: wave15 2.5s 1;
  animation: wave15 2.5s 1;
  -webkit-animation-fill-mode: forwards;
  -moz-animation-fill-mode: forwards;
  animation-fill-mode: forwards;
  height: 135px;
}
@-webkit-keyframes wave15 {
  50% {
    -webkit-transform: rotate(165deg) translateX(300px);
  }
  100% {
    -webkit-transform: rotate(150deg) translateX(300px);
  }
}
@-moz-keyframes wave15 {
  50% {
    -moz-transform: rotate(165deg) translateX(300px);
  }
  100% {
    -moz-transform: rotate(150deg) translateX(300px);
  }
}
@keyframes wave15 {
  50% {
    -webkit-transform: rotate(165deg) translateX(300px);
    -moz-transform: rotate(165deg) translateX(300px);
    -ms-transform: rotate(165deg) translateX(300px);
    -o-transform: rotate(165deg) translateX(300px);
    transform: rotate(165deg) translateX(300px);
  }
  100% {
    -webkit-transform: rotate(150deg) translateX(300px);
    -moz-transform: rotate(150deg) translateX(300px);
    -ms-transform: rotate(150deg) translateX(300px);
    -o-transform: rotate(150deg) translateX(300px);
    transform: rotate(150deg) translateX(300px);
  }
}
@media all and (min-width: 992px) {
  .feather:nth-of-type(15) {
    height: 165px;
  }
}
@media all and (min-width: 1600px) {
  .feather:nth-of-type(15) {
    height: 195px;
  }
}
.feather:nth-of-type(16) {
  -webkit-transform: rotate(0deg) translateX(0px);
  -moz-transform: rotate(0deg) translateX(0px);
  -ms-transform: rotate(0deg) translateX(0px);
  -o-transform: rotate(0deg) translateX(0px);
  transform: rotate(0deg) translateX(0px);
  -webkit-animation: wave16 2.5s 1;
  -moz-animation: wave16 2.5s 1;
  animation: wave16 2.5s 1;
  -webkit-animation-fill-mode: forwards;
  -moz-animation-fill-mode: forwards;
  animation-fill-mode: forwards;
  height: 136px;
}
@-webkit-keyframes wave16 {
  50% {
    -webkit-transform: rotate(176deg) translateX(320px);
  }
  100% {
    -webkit-transform: rotate(160deg) translateX(320px);
  }
}
@-moz-keyframes wave16 {
  50% {
    -moz-transform: rotate(176deg) translateX(320px);
  }
  100% {
    -moz-transform: rotate(160deg) translateX(320px);
  }
}
@keyframes wave16 {
  50% {
    -webkit-transform: rotate(176deg) translateX(320px);
    -moz-transform: rotate(176deg) translateX(320px);
    -ms-transform: rotate(176deg) translateX(320px);
    -o-transform: rotate(176deg) translateX(320px);
    transform: rotate(176deg) translateX(320px);
  }
  100% {
    -webkit-transform: rotate(160deg) translateX(320px);
    -moz-transform: rotate(160deg) translateX(320px);
    -ms-transform: rotate(160deg) translateX(320px);
    -o-transform: rotate(160deg) translateX(320px);
    transform: rotate(160deg) translateX(320px);
  }
}
@media all and (min-width: 992px) {
  .feather:nth-of-type(16) {
    height: 166px;
  }
}
@media all and (min-width: 1600px) {
  .feather:nth-of-type(16) {
    height: 196px;
  }
}
.feather:nth-of-type(17) {
  -webkit-transform: rotate(0deg) translateX(0px);
  -moz-transform: rotate(0deg) translateX(0px);
  -ms-transform: rotate(0deg) translateX(0px);
  -o-transform: rotate(0deg) translateX(0px);
  transform: rotate(0deg) translateX(0px);
  -webkit-animation: wave17 2.5s 1;
  -moz-animation: wave17 2.5s 1;
  animation: wave17 2.5s 1;
  -webkit-animation-fill-mode: forwards;
  -moz-animation-fill-mode: forwards;
  animation-fill-mode: forwards;
  height: 137px;
}
@-webkit-keyframes wave17 {
  50% {
    -webkit-transform: rotate(187deg) translateX(340px);
  }
  100% {
    -webkit-transform: rotate(170deg) translateX(340px);
  }
}
@-moz-keyframes wave17 {
  50% {
    -moz-transform: rotate(187deg) translateX(340px);
  }
  100% {
    -moz-transform: rotate(170deg) translateX(340px);
  }
}
@keyframes wave17 {
  50% {
    -webkit-transform: rotate(187deg) translateX(340px);
    -moz-transform: rotate(187deg) translateX(340px);
    -ms-transform: rotate(187deg) translateX(340px);
    -o-transform: rotate(187deg) translateX(340px);
    transform: rotate(187deg) translateX(340px);
  }
  100% {
    -webkit-transform: rotate(170deg) translateX(340px);
    -moz-transform: rotate(170deg) translateX(340px);
    -ms-transform: rotate(170deg) translateX(340px);
    -o-transform: rotate(170deg) translateX(340px);
    transform: rotate(170deg) translateX(340px);
  }
}
@media all and (min-width: 992px) {
  .feather:nth-of-type(17) {
    height: 167px;
  }
}
@media all and (min-width: 1600px) {
  .feather:nth-of-type(17) {
    height: 197px;
  }
}
.feather:nth-of-type(18) {
  -webkit-transform: rotate(0deg) translateX(0px);
  -moz-transform: rotate(0deg) translateX(0px);
  -ms-transform: rotate(0deg) translateX(0px);
  -o-transform: rotate(0deg) translateX(0px);
  transform: rotate(0deg) translateX(0px);
  -webkit-animation: wave18 2.5s 1;
  -moz-animation: wave18 2.5s 1;
  animation: wave18 2.5s 1;
  -webkit-animation-fill-mode: forwards;
  -moz-animation-fill-mode: forwards;
  animation-fill-mode: forwards;
  height: 138px;
}
@-webkit-keyframes wave18 {
  50% {
    -webkit-transform: rotate(198deg) translateX(360px);
  }
  100% {
    -webkit-transform: rotate(180deg) translateX(360px);
  }
}
@-moz-keyframes wave18 {
  50% {
    -moz-transform: rotate(198deg) translateX(360px);
  }
  100% {
    -moz-transform: rotate(180deg) translateX(360px);
  }
}
@keyframes wave18 {
  50% {
    -webkit-transform: rotate(198deg) translateX(360px);
    -moz-transform: rotate(198deg) translateX(360px);
    -ms-transform: rotate(198deg) translateX(360px);
    -o-transform: rotate(198deg) translateX(360px);
    transform: rotate(198deg) translateX(360px);
  }
  100% {
    -webkit-transform: rotate(180deg) translateX(360px);
    -moz-transform: rotate(180deg) translateX(360px);
    -ms-transform: rotate(180deg) translateX(360px);
    -o-transform: rotate(180deg) translateX(360px);
    transform: rotate(180deg) translateX(360px);
  }
}
@media all and (min-width: 992px) {
  .feather:nth-of-type(18) {
    height: 168px;
  }
}
@media all and (min-width: 1600px) {
  .feather:nth-of-type(18) {
    height: 198px;
  }
}
.feather:nth-of-type(19) {
  -webkit-transform: rotate(0deg) translateX(0px);
  -moz-transform: rotate(0deg) translateX(0px);
  -ms-transform: rotate(0deg) translateX(0px);
  -o-transform: rotate(0deg) translateX(0px);
  transform: rotate(0deg) translateX(0px);
  -webkit-animation: wave19 2.5s 1;
  -moz-animation: wave19 2.5s 1;
  animation: wave19 2.5s 1;
  -webkit-animation-fill-mode: forwards;
  -moz-animation-fill-mode: forwards;
  animation-fill-mode: forwards;
  height: 139px;
}
@-webkit-keyframes wave19 {
  50% {
    -webkit-transform: rotate(209deg) translateX(380px);
  }
  100% {
    -webkit-transform: rotate(190deg) translateX(380px);
  }
}
@-moz-keyframes wave19 {
  50% {
    -moz-transform: rotate(209deg) translateX(380px);
  }
  100% {
    -moz-transform: rotate(190deg) translateX(380px);
  }
}
@keyframes wave19 {
  50% {
    -webkit-transform: rotate(209deg) translateX(380px);
    -moz-transform: rotate(209deg) translateX(380px);
    -ms-transform: rotate(209deg) translateX(380px);
    -o-transform: rotate(209deg) translateX(380px);
    transform: rotate(209deg) translateX(380px);
  }
  100% {
    -webkit-transform: rotate(190deg) translateX(380px);
    -moz-transform: rotate(190deg) translateX(380px);
    -ms-transform: rotate(190deg) translateX(380px);
    -o-transform: rotate(190deg) translateX(380px);
    transform: rotate(190deg) translateX(380px);
  }
}
@media all and (min-width: 992px) {
  .feather:nth-of-type(19) {
    height: 169px;
  }
}
@media all and (min-width: 1600px) {
  .feather:nth-of-type(19) {
    height: 199px;
  }
}
.feather:nth-of-type(20) {
  -webkit-transform: rotate(0deg) translateX(0px);
  -moz-transform: rotate(0deg) translateX(0px);
  -ms-transform: rotate(0deg) translateX(0px);
  -o-transform: rotate(0deg) translateX(0px);
  transform: rotate(0deg) translateX(0px);
  -webkit-animation: wave20 2.5s 1;
  -moz-animation: wave20 2.5s 1;
  animation: wave20 2.5s 1;
  -webkit-animation-fill-mode: forwards;
  -moz-animation-fill-mode: forwards;
  animation-fill-mode: forwards;
  height: 140px;
}
@-webkit-keyframes wave20 {
  50% {
    -webkit-transform: rotate(220deg) translateX(400px);
  }
  100% {
    -webkit-transform: rotate(200deg) translateX(400px);
  }
}
@-moz-keyframes wave20 {
  50% {
    -moz-transform: rotate(220deg) translateX(400px);
  }
  100% {
    -moz-transform: rotate(200deg) translateX(400px);
  }
}
@keyframes wave20 {
  50% {
    -webkit-transform: rotate(220deg) translateX(400px);
    -moz-transform: rotate(220deg) translateX(400px);
    -ms-transform: rotate(220deg) translateX(400px);
    -o-transform: rotate(220deg) translateX(400px);
    transform: rotate(220deg) translateX(400px);
  }
  100% {
    -webkit-transform: rotate(200deg) translateX(400px);
    -moz-transform: rotate(200deg) translateX(400px);
    -ms-transform: rotate(200deg) translateX(400px);
    -o-transform: rotate(200deg) translateX(400px);
    transform: rotate(200deg) translateX(400px);
  }
}
@media all and (min-width: 992px) {
  .feather:nth-of-type(20) {
    height: 170px;
  }
}
@media all and (min-width: 1600px) {
  .feather:nth-of-type(20) {
    height: 200px;
  }
}

.wing:nth-child(2) .feather {
  background: #0084c7;
}

.wing:nth-child(3) .feather {
  background: #023084;
}

/* Yellow Wing */
.feather-yellow {
  background-color: #ffae24;
  height: 100px;
  width: 100%;
  position: absolute;
  border-bottom-right-radius: 100%;
  border-top-left-radius: 100%;
  -webkit-transform-origin: top left;
  -moz-transform-origin: top left;
  -ms-transform-origin: top left;
  -o-transform-origin: top left;
  transform-origin: top left;
}

.feather-yellow:nth-of-type(1) {
  -webkit-transform: rotate(60deg) translateX(80px);
  -moz-transform: rotate(60deg) translateX(80px);
  -ms-transform: rotate(60deg) translateX(80px);
  -o-transform: rotate(60deg) translateX(80px);
  transform: rotate(60deg) translateX(80px);
  -webkit-animation: yellowwave1 2.5s 1;
  -moz-animation: yellowwave1 2.5s 1;
  animation: yellowwave1 2.5s 1;
  -webkit-animation-fill-mode: forwards;
  -moz-animation-fill-mode: forwards;
  animation-fill-mode: forwards;
  height: 121px;
}

@-webkit-keyframes yellowwave1 {
  80% {
    -webkit-transform: rotate(10deg) translateX(20px);
    -moz-transform: rotate(10deg) translateX(20px);
    -ms-transform: rotate(10deg) translateX(20px);
    -o-transform: rotate(10deg) translateX(20px);
    transform: rotate(10deg) translateX(20px);
    opacity: 1;
  }
  100% {
    -webkit-transform: rotate(10deg) translateX(20px);
    -moz-transform: rotate(10deg) translateX(20px);
    -ms-transform: rotate(10deg) translateX(20px);
    -o-transform: rotate(10deg) translateX(20px);
    transform: rotate(10deg) translateX(20px);
    opacity: 0;
  }
}
.feather-yellow:nth-of-type(2) {
  -webkit-transform: rotate(70deg) translateX(80px);
  -moz-transform: rotate(70deg) translateX(80px);
  -ms-transform: rotate(70deg) translateX(80px);
  -o-transform: rotate(70deg) translateX(80px);
  transform: rotate(70deg) translateX(80px);
  -webkit-animation: yellowwave2 2.5s 1;
  -moz-animation: yellowwave2 2.5s 1;
  animation: yellowwave2 2.5s 1;
  -webkit-animation-fill-mode: forwards;
  -moz-animation-fill-mode: forwards;
  animation-fill-mode: forwards;
  height: 80px;
}

@-webkit-keyframes yellowwave2 {
  50% {
    -webkit-transform: rotate(60deg) translateX(40px);
    -moz-transform: rotate(60deg) translateX(40px);
    -ms-transform: rotate(60deg) translateX(40px);
    -o-transform: rotate(60deg) translateX(40px);
    transform: rotate(60deg) translateX(40px);
    opacity: 1;
  }
  100% {
    -webkit-transform: rotate(64deg) translateX(40px);
    -moz-transform: rotate(64deg) translateX(40px);
    -ms-transform: rotate(64deg) translateX(40px);
    -o-transform: rotate(64deg) translateX(40px);
    transform: rotate(64deg) translateX(40px);
    opacity: 0;
  }
}
