* { margin: 0px; padding: 0px; }

body {


	text-align: center;
	font-size: 13px;
	font-family: Tahoma;
	background-color:#EAE9EE;
	color: white;

	

}
/* 
create a div that uses your profile 
image as a background image. sizing 
this div will scale the background 
images size because of the background 
size parameter 
*/

h1 {
	
	font-family: Tahoma;
	font: condensed bold;
	font-size: 13px;
	color:#3b5998 ;
	margin-top: auto;
	margin-left: auto;
	margin-right: auto;



	z-index:1;
	position: relative;
	

}


#main {
	
	width: 500px;
	height:250px;
	margin-left: auto;
	margin-right: auto;
	margin-top:200px;
	font-family: Tahoma;
	background-color: white;
	color: black;
	padding: 20px;
	


	z-index: 1;
	position: relative;

}




@keyframes marksface {

  0%   { opacity: 0; }
  100% { opacity: 1; }s

}

img {
	position: absolute;
	max-width: 300px;
	height: auto;


	/* 
	add this if you want 
	the faces to fade in 
	*/
	
	animation: marksface 3s 1;
	transition: 2s all ease;

	/* 
	make z-index lower 
	than z-index of #main */
	z-index: 0;	
}

