A-J-C/index.html

## index.html
<body>
  <div id="press_button">Press</div>
  <div id="space"><div id="line"></div><div id="time"></div>Don't for get to read all the articles on how to be a better person.  It might come in handy!  Or not...</div>
</body>

## script.js
/*--- Old man gets ready to tell a story ---*/
$(document).ready(function(){
/*---  One day ---*/
/*--- Act one, button press ---*/
 var press_button = false;
 $("#space").fadeOut(0);
 $("#press_button").click(function(){
   if (press_button === false){
     $("#press_button").css("box-shadow", "0px 10px 20px #9ac0ff");
     $("#press_button").css("text-shadow", "0px 0px 10px #9ac0ff");
     $("#space").fadeIn(1000);
       setTimeout(function(){
        $("#space").css("box-shadow","0px 10px 20px #9ac0ff"); }, 1000);
     //
       setTimeout(function(){
        $("#space").css("text-shadow","8px 8px 8px #9ac0ff"); }, 1000);
     //
       setTimeout(function(){
        $("#line").css("box-shadow","8px 8px 8px #9ac0ff"); }, 1000);
     //
     press_button = true;
   }
   else{

     $("#press_button").css("box-shadow", "0px 0px 0px #9ac0ff");
     $("#press_button").css("text-shadow", "0px 0px 0px #9ac0ff");
     $("#space").css("box-shadow", "0px 0px 0px #9ac0ff");
     setTimeout(function(){
       $("#space").fadeOut(100);},500);
     $("#space").css("text-shadow","0px 0px 0px #9ac0ff");
     $("#line").css("box-shadow","0px 0px 0px #9ac0ff")

     press_button = false;
   }
 });
/*--- End of Act one, button press ---*/

/*--- Act two, tik toc ---*/
function updateTime() {
        var currentTime = new Date();
        var hours = currentTime.getHours();
        var minutes = currentTime.getMinutes();
        //var seconds = currentTime.getSeconds();
        if (minutes < 10){
            minutes = "0" + minutes;
        }
        //if (seconds < 10){
       //     seconds = "0" + seconds;
       // }
        var real_hours = hours - 12;
        if (hours > 11){
          real_hours - 12;
        } else {
          real_hours = hours;
        }
   if (real_hours === 0) {
    real_hours = real_hours + 12;
 }


        var v = real_hours + ":" + minutes + " ";

        if(hours > 11){
            v+="PM";
        } else {
            v+="AM"
        }
        setTimeout("updateTime()",1000);
        document.getElementById('time').innerHTML=v;
    }
    updateTime();

/*--- End of Act two, tik toc*/

/*--- The End ---*/
});

## style.css
@import url(http://fonts.googleapis.com/css?family=Atomic+Age|Press+Start+2P|Quantico);


body{
  background:#525252 ;
}

#press_button{
  width: 100px;
  height: 100px;
  border-radius: 50px;
  background: #1e1f1e;
  margin: 10px 10px;
  color: white;
  font-size: 25px;
  line-height: 100px;
  text-indent: 17px;
  font-family: 'Quantico', sans-serif;
  position: absolute;
  z-index: 1;
}

#space{
  width: 400px;
  height: 180px;
  border-radius: 20px;
  margin: 50px 150px;
  position: absolute;
  z-index: 0;
  background: #1e1f1e;
  padding: 70px;
  font-family: 'Quantico', sans-serif;
  color: white;
  font-size: 25px;

}

#time{
  z-index: 0;
  color: white;
  font-size: 14px;
  font-family: 'Quantico', sans-serif;
}

#line{
  width:400px;
  height:10px;
  background: white;
  position: absolute;
  margin-top: 200px;
  z-index: -1;
  border-radius: 5px;
}
	<body>
	<div id="press_button">Press</div>
	<div id="space"><div id="line"></div><div id="time"></div>Don't for get to read all the articles on how to be a better person. It might come in handy! Or not...</div>
	</body>
	/--- Old man gets ready to tell a story ---/
	$(document).ready(function(){
	/--- One day ---/
	/--- Act one, button press ---/
	var press_button = false;
	$("#space").fadeOut(0);
	$("#press_button").click(function(){
	if (press_button === false){
	$("#press_button").css("box-shadow", "0px 10px 20px #9ac0ff");
	$("#press_button").css("text-shadow", "0px 0px 10px #9ac0ff");
	$("#space").fadeIn(1000);
	setTimeout(function(){
	$("#space").css("box-shadow","0px 10px 20px #9ac0ff"); }, 1000);
	//
	setTimeout(function(){
	$("#space").css("text-shadow","8px 8px 8px #9ac0ff"); }, 1000);
	//
	setTimeout(function(){
	$("#line").css("box-shadow","8px 8px 8px #9ac0ff"); }, 1000);
	//
	press_button = true;
	}
	else{

	$("#press_button").css("box-shadow", "0px 0px 0px #9ac0ff");
	$("#press_button").css("text-shadow", "0px 0px 0px #9ac0ff");
	$("#space").css("box-shadow", "0px 0px 0px #9ac0ff");
	setTimeout(function(){
	$("#space").fadeOut(100);},500);
	$("#space").css("text-shadow","0px 0px 0px #9ac0ff");
	$("#line").css("box-shadow","0px 0px 0px #9ac0ff")

	press_button = false;
	}
	});
	/--- End of Act one, button press ---/

	/--- Act two, tik toc ---/
	function updateTime() {
	var currentTime = new Date();
	var hours = currentTime.getHours();
	var minutes = currentTime.getMinutes();
	//var seconds = currentTime.getSeconds();
	if (minutes < 10){
	minutes = "0" + minutes;
	}
	//if (seconds < 10){
	// seconds = "0" + seconds;
	// }
	var real_hours = hours - 12;
	if (hours > 11){
	real_hours - 12;
	} else {
	real_hours = hours;
	}
	if (real_hours === 0) {
	real_hours = real_hours + 12;
	}


	var v = real_hours + ":" + minutes + " ";

	if(hours > 11){
	v+="PM";
	} else {
	v+="AM"
	}
	setTimeout("updateTime()",1000);
	document.getElementById('time').innerHTML=v;
	}
	updateTime();

	/--- End of Act two, tik toc/

	/--- The End ---/
	});
	@import url(http://fonts.googleapis.com/css?family=Atomic+Age\|Press+Start+2P\|Quantico);


	body{
	background:#525252 ;
	}

	#press_button{
	width: 100px;
	height: 100px;
	border-radius: 50px;
	background: #1e1f1e;
	margin: 10px 10px;
	color: white;
	font-size: 25px;
	line-height: 100px;
	text-indent: 17px;
	font-family: 'Quantico', sans-serif;
	position: absolute;
	z-index: 1;
	}

	#space{
	width: 400px;
	height: 180px;
	border-radius: 20px;
	margin: 50px 150px;
	position: absolute;
	z-index: 0;
	background: #1e1f1e;
	padding: 70px;
	font-family: 'Quantico', sans-serif;
	color: white;
	font-size: 25px;

	}

	#time{
	z-index: 0;
	color: white;
	font-size: 14px;
	font-family: 'Quantico', sans-serif;
	}

	#line{
	width:400px;
	height:10px;
	background: white;
	position: absolute;
	margin-top: 200px;
	z-index: -1;
	border-radius: 5px;
	}