cssbattle7

<div class="r">
  <div class="t a"></div>
  <div class="t b"></div>
  <div class="t c"></div>
</div>
<style>
  body {
    background: #0B2429;
    display: table;
    width: 100%;
    height: 100%;
    margin: 0;
  }
  .r {
    display: table-cell;
    vertical-align: middle;
    text-align: center;
    position: relative;
  }
  .t {
    width: 150px;
    height: 150px;
    position: absolute;
    top: 50%;
    margin-top: -75px;
    border-radius: 67% 0 67% 0;
  }
  .a {
    left: 75px;
    background: #1A4341;
  }
  .b {
    left: 125px;
    background: #998235;
  }
  .c {
    left: 175px;
    background: #F3AC3C;
  }
</style>