JSFiddle - React, Tailwind, and code Playground

by mdares

HTML

<div>
    <div id="bin">
        <div id="inner-bin"></div>
        <div id="inner-bin_2"></div>
        <div id="hello"></div>
    </div>
</div>

CSS

#bin {
    border-radius:100%;
    margin:40px;
    position:relative;
    height:500px;
    width:500px;
    background-color:#013249
}
#inner-bin {
    height:120px;
    width:120px;
    position:absolute;
    top:100px;
    left:108px;
    border-radius:100%;
    background-color:#58A3C8;
}
#inner-bin_2 {
    height:120px;
    width:120px;
    position:absolute;
    top:100px;
    left:280px;
    border-radius:100%;
    background-color:#58A3C8;
}
#hello {
    height:120px;
    width:10px;
    position:absolute;
    top: 300px;
    left:108px;
    border-radius:100%;
    background-color:#58A3C8;
}