cssbattle3

<div class="q">
  <div class="c1">
      <div class="c2">
          <div class="c3"></div>
      </div>
  </div>
</div>
<style>
  * {
    background: #6592CF;
    position: relative;
  }
  .q {
    width: 300px;
    height: 150px;
    background: #243D83;
    position: absolute;
    left: 50%;
    top: 50%;
    margin: -75px 0px 0px -150px;
  }
  .c1 {
    width: 250px;
    height: 250px;
   	background: #6592CF;
    border-radius: 50%;
    position: absolute;
    left: 50%;
    top: 50%;
    margin: -125px 0px 0px -125px;
  }
  .c2 {
  	background: #243D83;
    border-radius: 50%;
    width: 150px;
    height: 150px;
    position: absolute;
    left: 50%;
    top: 50%;
    margin: -75px 0px 0px -75px;
  }
  .c3 {
  	background: #EEB850;
    border-radius: 50%;
    width: 50px;
    height: 50px;
    position: absolute;
    left: 50%;
    top: 50%;
    margin: -25px 0px 0px -25px;
  }
</style>