14/11/2024

<style>
  body {
    display: flex;
    justify-content: center;
    align-items: center;
    height: 100%;
    margin: 0;
    flex-direction: column;
    background: #FADE8B;
  }
  .bar {
    z-index: 1;
    height: 33%;
    width: 100%;
    background: #FADE8B;
  }
  .clear {
    background: none;
    height: 44%;
  }
  .out {
    position: absolute;
    background: #61A74E;
    width: 13.7rem;
    height: 12.5rem;
    border-radius: 50%;
    display: flex;
    justify-content: start;
    align-items: center;
  }
  .in {
    background: #243D83;
    width: 11.25rem;
    height: 11rem;
    border-radius: 50%;
  }
</style>
<div class="bar"></div>
<div class="bar clear"></div>
<div class="bar"></div>
<div class="out">
  <div class="in"></div>
</div>