* {
	margin:0px;
}

body {
	-webkit-text-size-adjust: auto;	
	
	background-color: black;
	font-family: 'aller_light';
}

#paperback {
	background-image: url("images/background.png");
	padding-bottom: 280px;
}

#header {
	background-color:black;
	height:155px;
	box-shadow: 0 0 30px #000;
	margin-bottom:-108px;
}

#header_shadow {
	height:155px;
	box-shadow: 0 0 10px #000;
}

#top_elements {
	/*background-color:red;*/
	position:relative;
	width:1100px;
	height:500px;
	z-index: 6;
	margin: 0 auto 0 auto;
	
}

#tinbox {
	top: 0px;
	left:0px;
	position:absolute;
	/*background-color:green;*/
	width:340px;
	height:390px;
	z-index: 16;
	margin-left: 270px;
	margin-top: 20px;
}

#video {
	top: 70px;
	position:absolute;
	/*background-color:blue;*/
	width:400px;
	height:300px;
	z-index: 6;
	margin-left: 680px;
	box-shadow: 0 0 10px #000;
}


#phone {
 	background-image:url("images/phone.png");
 	background-repeat: no-repeat;
	width:400px;
	height:680px;
 	position:absolute;
 	z-index: 100;
 	margin-left:18px;
  	top:38px;

 }


#main_text {
	background-color:none;
	position:absolute;
	width:800px;
	height:70px;
	z-index: 12;
	margin-left: 330px;
	text-align: center;
	font-size: 2em;
	line-height: 2em;
	
	margin-top: 400px;
}

#bottom_elements {
	position:absolute;
	background-color:none;
	height:300px;
	width:600px;
	margin-left:430px;
	margin-top: 475px;
}

#getnotified {
	background-image:url("images/store.png");
	background-position: center top;
	background-repeat: no-repeat;
	top: 0px;
	background-color:none;
	width:300px;
	height:100px;
	z-index: 25;
	margin-left: -150px;
	-webkit-margin-start:150px;
	position:absolute;
	
}

#viaemail {
	
	background-image:url("images/viaemail.png");
	background-position: center bottom;
	background-repeat: no-repeat;
	top: 95px;
	background-color:none;
	width:150px;
	height:50px;
	z-index: 7;
	margin-left: 30px;
	-webkit-margin-start:330px;
	position:absolute;

}

#twitterbutton {
	top: 113px;
	position:absolute;
	background-color:none;
	width:200px;
	height:50px;
	z-index: 50;
	margin-left: 117px;
}

#fb-like {
	top: 160px;
	position:absolute;
	background-color:none;
	width:250px;
	height:150px;
	z-index: 51;
	margin-left: 135px;
}

#allthirds {
	background-image:url("images/allthirds.png");
	background-position: center top;
	background-repeat: no-repeat;
	top: 30px;
	position:relative;
	/*background-color:blue;*/
	width:98px;
	height:69px;
	z-index: 7;
	margin: 0 auto 0 auto;
}

em {
	font-family: "aller_bold";
	font-style: normal;
}

#footer {
	background-image:url("images/bottom_cards.png");
	background-position: center bottom;
	background-repeat: no-repeat;
	margin-top: -80px;
	width:100%;
	height:70px;
	z-index: 7;
}

#bottomblack {
	top:0px;
	position:relative;
	background-color:black;
	width:100%;
	height:160px;
	z-index: 10;
	box-shadow: 0 0 30px #000;
}

#bottom_shadow {
	width:100%;
	height:100px;
	z-index: 1;
	box-shadow: 0 0 10px #000;
}

/*------TINBOX------*/

#lid {
 	background-image:url("images/tinbox_lid.png");
 	background-repeat: no-repeat;
width:340px;
height:340px;
 	position:absolute;
 	z-index: 18;
 	margin-left: 100px;
  	top:25px;

	-moz-animation-name: slideopen;
	-webkit-animation-name: slideopen;
  	-moz-animation-duration: 1s;
  	-webkit-animation-duration: 1s;
  	-moz-animation-delay: 1s;
  	-webkit-animation-delay: 1s;
  	-webkit-animation-fill-mode: backwards;
  	-moz-animation-fill-mode: backwards;
	-webkit-animation-timing-function: ease-in-out;
	-moz-animation-timing-function: ease-in-out;
 }


/*Lid Slide Animation*/
@-moz-keyframes slideopen {
  from {
 	  top: 65px;
  }
  to {
 	  top: 25px;
  }
}
@-webkit-keyframes slideopen {
  from {
 	  top: 65px;
  }
  to {
 	  top: 25px;
  }
}
/*----------*/




 #bottom {
 	background-image:url("images/tinbox_bottom.png");
 	background-repeat: no-repeat;
	width:340px;
	height:340px;
 	position:absolute;

 	z-index: 3;

 	margin-top: 90px;
  margin-left: 100px;
 }

 #card_red, #card_blue, #card_grey, #card_green {
 	background-repeat: no-repeat;
	width:340px;
	height:340px;
 	position: absolute;

 	z-index: 9;
  margin-left: 125px;
	-moz-animation-name: slidedown;
	-webkit-animation-name: slidedown;
  	-moz-animation-duration: 0.5s;
  	-webkit-animation-duration: 0.5s;
  	-webkit-animation-fill-mode: backwards;
  	-moz-animation-fill-mode: backwards;
 }

#card_red {
	background-image:url("images/card_red.png");
	z-index: 6;	
	top:268px;
  -moz-animation-delay: 2s;
  -webkit-animation-delay: 2s;
}

#card_grey {
	background-image:url("images/card_grey.png");
	top:277px;
	z-index: 5;
  -moz-animation-delay: 2.5s;
  -webkit-animation-delay: 2.5s;
}

#card_blue {
	background-image:url("images/card_blue.png");
	top:286px;
	z-index: 4;
  -moz-animation-delay: 3s;
  -webkit-animation-delay: 3s;
}

#card_green {
	background-image:url("images/card_green.png");
	top: 290px;
	z-index: 3;
  -moz-animation-delay: 3.5s;
  -webkit-animation-delay: 3.5s;
}

/*Card Slide-Down Animation*/
@-moz-keyframes slidedown {
  from {
 	  margin-top: -50px;
  }
  to {
 	  margin-top: 0px;
  }
}
@-webkit-keyframes slidedown {
  from {
 	  margin-top: -50px;
  }
  to {
 	  margin-top: 0px;
  }
}
/*----------*/

a.link:link { color: white; text-decoration: none;}
a.link:visited { color: white; }
a.link:hover { color: white; }
