*{
    box-sizing: border-box;
   }
  body{
    margin: 0;
    background-color: #222;
    min-height: 100vh;
    display: grid;
    place-items: center;
  }
  .logo{
    width: 400px;
    height: 400px;
    background-color: #00acee;
    border-radius: 50%;
    position: relative;
  }
  
  .twtr{
    width: 100%;
    height: 100%;
    position: absolute;
    top: 55%;
    left: 50%;
    transform: translate(-50%,-50%);
   }
   .head{
      width: 25%;
      height: 25%;
      background-color: white;
      border-radius: 50%;
      position: absolute;
      left: 55%;
      top: 20%;
   }
   .head::after{
     content: "";
     width: 85%;
     height: 35%;
     border-radius: 50%;
     top: 10%;
     left: 40%;
     position: absolute;
     border-bottom: 22px solid #fff;
     transform: rotate(-5deg);
   }
   .head::before{
     content: "";
     width: 85%;
     height: 35%;
     border-radius: 50%;
     top: -7%;
     left: 38%;
     position: absolute;
     border-bottom: 20px solid #fff;
     transform: rotate(-15deg);
  }
  .wing1{
    width: 50%;
    height: 40%;
    border-radius: 50%;
    border-bottom: 60px solid white;
    position: absolute;
    top: 9%;
    left: 22%;
    transform: rotate(15deg);
  }
  .wing1::after{
    content: "";
    width: 90%;
    height: 70%;
    border-radius: 50%;
    border-bottom: 50px solid #fff;
    position: absolute;
    top: 75%;
    left: 5%;
    transform: rotate(-5deg);
  }
  .wing1::before{
    content: "";
    width: 70%;
    height: 60%;
    border-radius: 50%;
    border-bottom: 45px solid #fff;
    position: absolute;
    top: 120%;
    left: 20%;
    transform: rotate(-20deg);
   }
   .tail{
    width: 70%;
    height: 60%;
    border-radius: 50%;
    border-bottom: 60px solid #fff;
    position: absolute;
    top: 15%;
    left: 14%;
    transform: rotate(-30deg);
  }
  .filler{
    width: 30%;
    height: 15%;
    background-color: white;
    position: absolute;
    top: 40%;
    left: 45%;
    transform: rotate(-40deg);
  }