A Pen by digital-doodle.

index.haml

%h1 get 
%h3 in 
%h2 touch

script.js

var $body = $(document.body),cycle;

(cycle = function() {
   $body.delay(1000)
   .animate({backgroundColor:"#87211c", color:"#fefefe"}, 'slow')
       .delay(1000)
   .animate({
     backgroundColor:"#FFF", 
     color:"#fefefe"
   }, 'slow',cycle);
})();

style.scss

@import "compass/css3";
@import url(http://fonts.googleapis.com/css?family=Source+Sans+Pro:200,400,900);

@font-face {
  font-family: 'Source Sans Pro', sans-serif;
  font-weight:900;
  src:url(http://fonts.googleapis.com/css?family=Erica+One);
}

$colour:#87211c;
body{
  /*max-width:320px;*/
  margin:0 auto;
}
h1{
  font:{
    family:'Source Sans Pro', sans-serif;
    weight:900;
    size:7em;
  }
  line-height:0em;
  text:{
    transform:uppercase;
    align:center;
  }
 /* color:tint($colour, 90%);*/
  text-shadow:3px 3px 0px $colour,
    -3px -3px 0px $colour,
    3px -3px 0px $colour,
    -3px 3px 0px $colour;
}

h3{
  @extend h1;
  font-size:1.5em;
}



.newstyle{
  @extend h1;
  font:{
    weight: 200;
    size:2em;
  }
  text:{
    align:center;
    shadow:10px 10px 10px shade($colour, 20%);
  }
}


h2{
  @extend h1;
}

wmxhp.markdown

wmxhp

A Pen by digital-doodle on CodePen.

License.