<div class="cir"></div>
<div class="cir cir2"></div>
<div class="line"></div>
<style>
body {
background: #EA9A52;
display: flex;
justify-content: center;
align-items: center;
margin: 0;
height: 100%;
width: 100%;
}
.cir {
position: absolute;
width: 15.5rem;
height: 15.5rem;
border-radius: 50%;
border: 2rem solid #435998;
translate: 0 -7.8rem;
z-index: 0;
}
.cir2 {translate: 0 7.8rem; z-index: 2;}
.line {
width: 1.9rem;
height: 100%;
background: #FFF;
z-index: 1;
}
</style>