A Pen by Adam Henley.

Happy-Valentines-Day!.markdown

Happy Valentine's Day!

My full size aortic pump is pumping for you Amy :)

A Pen by Adam Henley on CodePen.

License.

index.html

<div id="heart">Amy</div>

style.less

@h:rgba(211, 69, 69,1);
@bg: lighten(@h,10%);
@import url(http://fonts.googleapis.com/css?family=Merienda:400,700);

body{background-color:@bg; }

#heart{
  font-family: 'Merienda', cursive;
  width: 376px;
  height:292px;
  position:absolute;
  top:0;right:0;bottom:0;left:0;
  margin:auto;
  line-height:250px;
  z-index:100;
  font-size:72px;
  font-weight:700;
  text-align:center;
  text-shadow:-1px -1px darken(@h,5%), 1px 1px lighten(@h,10%);
  color: lighten(@h,5%);
  .animation(text_pump 2s linear infinite);
}

#heart:before,#heart:after{
  content:'';  
  border-radius: 50% 50% 0% 0%;
  background-color:@h;
  display:block;
  position:absolute;
  width:200px; height:295px;  
  z-index:-100;
  top:-27px;  
}
#heart:before{
 .rotate(52deg);
  left:142px;
}
#heart:after{
  .rotate(-52deg);
  left:32px;
  .box-shadow(-4px -4px 5px -2px black);  
}

.text_pump_keyframes(){
    0% { .scale(1); } 
   50% { .scale(1.08,1.05); } 
  100% { .scale(1); }
}

@-webkit-keyframes text_pump  { .text_pump_keyframes(); }
   @-moz-keyframes text_pump  { .text_pump_keyframes(); }
     @-o-keyframes text_pump  { .text_pump_keyframes(); }
        @keyframes text_pump  { .text_pump_keyframes(); }