/* from chapter 25 (dim/dim-out in master css file ) */

.letterfade{
display:inline-block;
text-indent:0;
-webkit-animation:letterfade 2.80s ease-in forwards;
   -moz-animation:letterfade 2.80s ease-in forwards;
     -o-animation:letterfade 2.80s ease-in forwards;
        animation:letterfade 2.80s ease-in forwards;
}

@-webkit-keyframes letterfade {
      0% {opacity: 1; letter-spacing:0.0em; -webkit-transform: skewX(-00deg) translate(-00px,-0.00em) scale(1.0);}
    100% {opacity: 0; letter-spacing:1.3em; -webkit-transform: skewX(-33deg) translate( 38px,-2.50em) scale(1.3);}
}
@-moz-keyframes letterfade {
      0% {opacity: 1; letter-spacing:0.0em; -moz-transform: skewX(-00deg) translate(-00px,-0.00em) scale(1.0);}
    100% {opacity: 0; letter-spacing:1.3em; -moz-transform: skewX(-33deg) translate( 38px,-2.50em) scale(1.3);}
}
@-o-keyframes letterfade {
      0% {opacity: 1; letter-spacing:0.0em; -o-transform: skewX(-00deg) translate(-00px,-0.00em) scale(1.0);}
    100% {opacity: 0; letter-spacing:1.3em; -o-transform: skewX(-33deg) translate( 38px,-2.50em) scale(1.3);}
}
@keyframes letterfade {
      0% {opacity: 1; letter-spacing:0.0em; -webkit-transform: skewX(-00deg) translate(-00px,-0.00em) scale(1.0); -moz-transform: skewX(-00deg) translate(-00px,-0.00em) scale(1.0); -o-transform: skewX(-00deg) translate(-00px,-0.00em) scale(1.0); transform: skewX(-00deg) translate(-00px,-0.00em) scale(1.0);}
    100% {opacity: 0; letter-spacing:1.3em; -webkit-transform: skewX(-33deg) translate( 38px,-2.50em) scale(1.3); -moz-transform: skewX(-33deg) translate( 38px,-2.50em) scale(1.3); -o-transform: skewX(-33deg) translate( 38px,-2.50em) scale(1.3); transform: skewX(-33deg) translate( 38px,-2.50em) scale(1.3);}
}

.heartracing{
display:inline-block;
-webkit-animation:opacity-0_2 .4s linear 45 alternate;
   -moz-animation:opacity-0_2 .4s linear 45 alternate;
     -o-animation:opacity-0_2 .4s linear 45 alternate;
        animation:opacity-0_2 .4s linear 45 alternate;
}

/* opacity-0_2 keyframes found in master stylesheet. used in lots of classes. */

.head-spinnin{
  display:inline-block;
  -webkit-animation:head-spinnin .7s linear 36 alternate;
     -moz-animation:head-spinnin .7s linear 36 alternate;
       -o-animation:head-spinnin .7s linear 36 alternate;
          animation:head-spinnin .7s linear 36 alternate;
}

@-webkit-keyframes head-spinnin {
    100% {-webkit-transform: rotateY(360deg);transform: rotateY(360deg); opacity:0.6;}
}
@-moz-keyframes head-spinnin {
    100% {-moz-transform: rotateY(360deg);transform: rotateY(360deg); opacity:0.6;}
}
@-o-keyframes head-spinnin {
    100% {transform: rotateY(360deg); opacity:0.6;}
}
@keyframes head-spinnin {
    100% {-webkit-transform: rotateY(360deg);-moz-transform: rotateY(360deg);transform: rotateY(360deg); opacity:0.6;}
}

.safari-indent{ /* because old safari doesnt indent rp-wavy correctly */
  -webkit-transform-origin: left;
     -moz-transform-origin: left;
      -ms-transform-origin: left;
       -o-transform-origin: left;
          transform-origin: left;
  -webkit-transform:translateX(72px);
     -moz-transform:translateX(36px);
      -ms-transform:translateX(36px);
       -o-transform:translateX(36px);
          transform:translateX(36px);

}

#fade-to-black1{
display:inline-block;
-webkit-animation:fade-to-black1 2.0s 5.9s forwards;
   -moz-animation:fade-to-black1 2.0s 5.9s forwards;
     -o-animation:fade-to-black1 2.0s 5.9s forwards;
        animation:fade-to-black1 2.0s 5.9s forwards;
}
#fade-to-black2{
display:inline-block;
-webkit-animation:fade-to-black2 2.2s 5.9s forwards;
   -moz-animation:fade-to-black2 2.2s 5.9s forwards;
     -o-animation:fade-to-black2 2.2s 5.9s forwards;
        animation:fade-to-black2 2.2s 5.9s forwards;
}
#fade-to-black3{
display:inline-block;
-webkit-animation:fade-to-black3 2.4s 5.9s forwards;
   -moz-animation:fade-to-black3 2.4s 5.9s forwards;
     -o-animation:fade-to-black3 2.4s 5.9s forwards;
        animation:fade-to-black3 2.4s 5.9s forwards;
}

@-webkit-keyframes fade-to-black1 {
    100% {-webkit-transform: scaleX(1.25) translateX(0.4em);transform: scaleX(1.25) translateX(0.4em); letter-spacing: 2px;}
}
@-moz-keyframes fade-to-black1 {
    100% {-moz-transform: scaleX(1.25) translateX(0.4em);transform: scaleX(1.25) translateX(0.4em); letter-spacing: 2px;}
}
@-o-keyframes fade-to-black1 {
    100% {-o-transform: scaleX(1.25) translateX(0.4em);transform: scaleX(1.25) translateX(0.4em); letter-spacing: 2px;}
}
@keyframes fade-to-black1 {
    100% {-webkit-transform: scaleX(1.25) translateX(0.4em);-moz-transform: scaleX(1.25) translateX(0.4em);-o-transform: scaleX(1.25) translateX(0.4em);transform: scaleX(1.25) translateX(0.4em); letter-spacing: 2px;}
}
@-webkit-keyframes fade-to-black2 {
    100% {-webkit-transform: scaleX(1.75) translateX(0.67em);transform: scaleX(1.75) translateX(0.67em); letter-spacing: 2px;}
}
@-moz-keyframes fade-to-black2 {
    100% {-moz-transform: scaleX(1.75) translateX(0.67em);transform: scaleX(1.75) translateX(0.67em); letter-spacing: 2px;}
}
@-o-keyframes fade-to-black2 {
    100% {-o-transform: scaleX(1.75) translateX(0.67em);transform: scaleX(1.75) translateX(0.67em); letter-spacing: 2px;}
}
@keyframes fade-to-black2 {
    100% {-webkit-transform: scaleX(1.75) translateX(0.67em);-moz-transform: scaleX(1.75) translateX(0.67em);-o-transform: scaleX(1.75) translateX(0.67em);transform: scaleX(1.75) translateX(0.67em); letter-spacing: 2px;}
}
@-webkit-keyframes fade-to-black3 {
    100% {-webkit-transform: scaleX(2.65) translateX(26px);transform: scaleX(2.65) translateX(26px); letter-spacing: 2px;}
}
@-moz-keyframes fade-to-black3 {
    100% {-moz-transform: scaleX(2.65) translateX(26px);transform: scaleX(2.65) translateX(26px); letter-spacing: 2px;}
}
@-o-keyframes fade-to-black3 {
    100% {-o-transform: scaleX(2.65) translateX(26px);transform: scaleX(2.65) translateX(26px); letter-spacing: 2px;}
}
@keyframes fade-to-black3 {
    100% {-webkit-transform: scaleX(2.65) translateX(26px);-moz-transform: scaleX(2.65) translateX(26px);-o-transform: scaleX(2.65) translateX(26px);transform: scaleX(2.65) translateX(26px); letter-spacing: 2px;}
}