CSS Battle #14

Battle: #14

<div class="up1"></div>
<div class="up2"></div>
<div class="down1"></div>
<div class="down2"></div>

<style>
  .down1 {
    z-index: -10;
    top: 85px;
    left: 190px;
    width: 0;
    height: 0;
    border-left: 75px solid transparent;
    border-right: 75px solid transparent;
    border-bottom: 130px solid #ff6d00;
  }
  .down2 {
    z-index: -9;
    top: 85px;
    left: 170px;
    width: 0;
    height: 0;
    border-left: 75px solid transparent;
    border-right: 75px solid transparent;
    border-bottom: 130px solid #fd4602;
  }
  .up1 {
    z-index: -9;
    top: 85px;
    left: 80px;
    width: 0;
    height: 0;
    border-left: 75px solid transparent;
    border-right: 75px solid transparent;
    border-top: 130px solid #fd4602;
  }
  .up2 {
    z-index: -9;
    top: 85px;
    left: 60px;
    width: 0;
    height: 0;
    border-left: 75px solid transparent;
    border-right: 75px solid transparent;
    border-top: 130px solid #ff6d00;
  }
  div {
    position: absolute;
  }
  body {
    margin: 0;
    background: #f2f2b6;
  }
</style>