Cacher is the code snippet organizer for pro developers

  .om
  {
   
    text-align: center;
    padding: 10px;
    width: 755px;
    margin: auto;
    height: 667px;
        background: url(http://images.ticiz.com/2603690_w0_h120_hnn1i...bv9ettdv9dsbugw0py.png) no-repeat;
    background-position: center 201px;

  }

  .do
  {
background: #efebeb;
    width: 23px;
    margin: auto;
    position: relative;
    top: 265px;
    border-radius: 50%;
    padding: 20px 24px;
    border: 5px solid rgb(156, 156, 150);
}

  

  .sp
  {
    background: black;
    border-radius: 80%;
    padding: 6px 9px;
        color: #fff;
  }


.w
{
      padding: 10px;
    background: green;
    width: 25px;
    height: 162px;
    margin: auto;
    position: relative;
    right: 116px;
    top: 73px;
    transform: rotate(-62deg);
    border-radius: 12px 10px 10px 10px;
    background: linear-gradient(to right, rgb(255, 255, 255), rgba(65, 60, 124, 0.8));
}


.e
{
         padding: 10px;
    background: black;
    width: 25px;
    height: 164px;
    margin: auto;
    position: relative;
    left: 117px;
    top: -109px;
    transform: rotate(62deg);
    border-radius: 12px 10px 10px 10px;
    background: linear-gradient(to bottom, rgb(0, 0, 0), rgba(255, 0, 212, 0.63));
}


.sy
{
     padding: 10px;
    background: blue;
    width: 25px;
    height: 164px;
    margin: auto;
    border-radius: 12px 10px 10px 10px;
    position: relative;
    bottom: 103px;
        background: linear-gradient(to top, rgb(0, 102, 255), rgba(0, 208, 255, 0.8));
}


.add
{
     padding: 10px;
   
    width: 610px;
    height: 93%;
    margin: auto;
    border-radius: 50%;
    transform: rotate(53deg);
    transition: .9s;
    transition: all 29s cubic-bezier(0, 0, 0.74, 0.41);

}




.uuu
{
    width: 59px;
    height: 36px;
    padding: 2px;
    border-radius: 9px;
    /* margin: auto; */
    background: linear-gradient(to right, rgba(0, 255, 255, 0.41), rgba(0, 161, 255, 0.76));
    position: relative;
    top: 300px;
   
}


.mu
{
  background: #020202;
    border-radius: 65%;
    position: relative;
    top: 11px;
    padding: 8px;
}

.om:active .add
{
  transform: rotate(54443deg);

}

<div class="om">
  <div class="uuu">
    

    <button class="mu"></button>
  </div>
 
  <div class="add">

<div class="do">
  


<button class="sp">o</button>





</div>




<div class="w"></div>

<div class="e"></div>


<div class="sy"></div>

</div>