A Pen by Kaushalya Mandaliya.

index.html

<div class="title">Story 21<sup>st</sup> March 2014</div>

<div class="title">Story 21<sup>st</sup> March 2014</div>

<div class="title">Story 21<sup>st</sup> March 2014</div>

<div class="title">Story 21<sup>st</sup> March 2014</div>

<div class="title">Story 21<sup>st</sup> March 2014</div>

Just-enjoying-writing-S(CSS).markdown

Just enjoying writing S(CSS)

A Pen by Kaushalya Mandaliya on CodePen.

License.

script.js

console.clear();

var kaushalya = '2014 by Kaushalya Mandaliya.',
    user = "You should hover the text to see the effect, Thanks. " + kaushalya;

console.log(user);

$(".title").hover(
  function() {
    console.log("Cool na??!");
  },
  function() {
    console.log("Hover it...");
  }
);


console.log("%cKaushalya Mandaliya from seebeetee.com", "color: orangered; font-size: large");

style.scss

@import "compass";
body {
  background: #333;
  color: white;
  font-family: 'Nunito', Sans-serif !important;
  font-size: 1.2em;
  margin: 0 auto !important;
  max-width: 50em;
  
  .title {
    color: rgba(blanchedalmond, 0.8);
    cursor: pointer;
    font-size: 3em;
    margin: 1em;
    text-align: center; 
    text-shadow: 0.3rem 0.3rem rgba(white, 0.4), 0.4rem 0.4rem rgba(black, 0.4);    
    @include transition(0.3s all ease-in-out);
   
    @media all and (max-width: 30em) {
      font-size: 2.5em;
    }
    
    &:hover {
      color: transparent;
    }
  }
  
  @media all and (max-width: 47.5em) {
    font-size: 0.8em;
  }
}