<div class="cir-1 com2"></div>
<div class="cap-1 com"></div>
<div class="cir-2 com2"></div>
<div class="cir-3 com2"></div>
<div class="cap-2 com"></div>
<div class="in-1 com3"></div>
<div class="in-2 com3"></div>
<div class="in-3 com3"></div>
<style>
body{
background:#F5D6B4;
}
.com{
position:absolute;
border-top-left-radius:50px;
border-top-right-radius:50px;
background:#D86F45;
}
.com2{
width: 100px;
height: 50px;
background: #D86F45;
border-radius:50%;
position:absolute;
border-radius: 150px 150px 0 0;
}
.com3{
width: 60px;
height: 60px;
background: #F5D6B4;
border-radius:50%;
position:absolute;
}
.cap-1{
width: 20px;
height: 15px;
top:140px;
left:70px;
}
.cap-2{
width: 20px;
height: 10px;
top:140px;
left:310px;
}
.cir-1{
top:100px;
left:150px;
}
.cir-2{
top:150px;
left:70px;
transform:rotate(180deg);
}
.cir-3{
top:150px;
left:230px;
transform:rotate(180deg);
}
.in-1{
top:120px;
left:170px;
}
.in-2{
top:120px;
left:90px;
}
.in-3{
top:120px;
left:250px;
}
</style>
