hvIyi

hvIyi.markdown

hvIyi

A Pen by Octavian Damiean on CodePen.

License.

index.html

<div class="boob left"></div> <div class="boob right"></div>

style.less

@-webkit-keyframes bounce {
  from { -webkit-transform: translateY(0px); }
  to   { -webkit-transform: translateY(20px); }
}

.boob {
   width: 60px;
   height: 60px;
   background: rgba(239,208,207,0.9);
   box-shadow: 0px 0px 4px rgba(239,208,207,0.9),
               inset -1px -3px 16px rgba(139,107,108,.2);
   border-radius: 50%;
   position: relative;
   display: inline-block;
}

.boob:before {
  content: ' ';
  height: 30%;
  width: 30%;
  position: absolute;
  top: 35%;
  left: 35%;
  background-color: rgba(139,107,108,.3);
  box-shadow: 0px 0px 2px rgba(139,107,108,.5);
  border-radius: 50%;
}

.boob:after {
  content: ' ';
  height: 10%;
  width: 10%;
  position: absolute;
  top: 45%;
  left: 45%;
  background-color: rgba(139,107,108,.7);
  box-shadow: 0px 0px 2px rgba(139,107,108,.5);
  border-radius: 50%;
}

.left {
  -webkit-animation: bounce 0.5s 2s alternate infinite ease;
}

.right {
  -webkit-animation: bounce 0.5s 1.9s alternate infinite ease;
}