<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head profile="http://gmpg.org/xfn/11">
	<title>stefanoframbi.com</title>
	<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
	
	<link rel="stylesheet" type="text/css" href="blog/wp-content/themes/satorii/style.css" />
	<link rel="stylesheet" type="text/css" href="blog/wp-content/themes/satorii/css/fancy.yuic.css" />		
	<link rel="stylesheet" type="text/css" href="css/homestyle.css" />		
		
	<script type="text/javascript" src="blog/wp-content/themes/satorii/js/jquery.min.js"></script>
	<script type="text/javascript" src="blog/wp-content/themes/satorii/js/jquery.fancybox.yuic.js"></script>
	<!--[if lt IE 7]><script src="blog/wp-content/themes/satorii/js/jquery.pngFix.pack.js" type="text/javascript"></script><![endif]-->
	<script type="text/javascript" src="blog/wp-content/themes/satorii/js/satorii.js"></script>
	<script src="http://twitterjs.googlecode.com/svn/trunk/src/twitter.min.js" type="text/javascript"></script>
	<script type="text/javascript" src="http://jqueryjs.googlecode.com/files/jquery-1.3.1.js"></script>
		<script type="text/javascript">
			$(document).ready(function(){
				//To switch directions up/down and left/right just place a "-" in front of the top/left attribute
				
				//Horizontal Sliding
				$('.boxgrid.slideright').hover(function(){
					$(".cover", this).stop().animate({left:'80px'},{queue:false,duration:300});
				}, function() {
					$(".cover", this).stop().animate({left:'0px'},{queue:false,duration:300});
				});
				//Horizontal Sliding
				$('.boxgrid.slideleft').hover(function(){
					$(".cover", this).stop().animate({left:'-80px'},{queue:false,duration:300});
				}, function() {
					$(".cover", this).stop().animate({left:'0px'},{queue:false,duration:300});
				});
				//Full Caption Sliding (Hidden to Visible)
				$('.boxgrid.captionfull').hover(function(){
					$(".cover", this).stop().animate({top:'120px'},{queue:false,duration:160});
				}, function() {
					$(".cover", this).stop().animate({top:'190px'},{queue:false,duration:160});
				});
				//Full Caption Sliding (Hidden to Visible)
				$('.boxgrid.captionfulldown').hover(function(){
					$(".cover", this).stop().animate({top:'0px'},{queue:false,duration:160});
				}, function() {
					$(".cover", this).stop().animate({top:'-160'},{queue:false,duration:160});
				});
			});
			
		getTwitters('tweet', { 
		  id: 'stefanoframbi', 
		  count: 1, 
		  enableLinks: true, 
		  ignoreReplies: true, 
		  clearContents: true,
		  template: '<a href="http://www.twitter.com/stefanoframbi"><img src="http://twitter-badges.s3.amazonaws.com/t_mini-b.png" alt="Follow stefanoframbi on Twitter"/></a> "%text%" (<a href="http://twitter.com/stefanoframbi/statuses/%id%/">%time%</a>)'
		});
	</script>
</head>

<body class="">

<div id="wrapper" class="hfeed">
	<div id="header">
		<h1 id="blog-title"><span><a href="../" title="stefanoframbi.com" rel="home">stefanoframbi.com</a></span></h1>
	</div><!-- header -->
	
	<div id="mycontainer">
		<div id="mycontent">
			<a title="About me" href="blog/about/">
				<div class="boxgrid captionfull uno">
					<img src="img/about.png"/>
					<div class="cover boxcaption">
						<h3>About me</h3>
					</div>		
				</div>
			</a>
			
			<a href="blog/index.php">
				<div class="boxgrid slideright due">
					<img class="cover" src="img/blog.png"/>
					<h3>Blog</h3>
				</div>
			</a>
			
			<a title="Work" href="blog/work/">
				<div class="boxgrid slideleft tre">
					<img class="cover" src="img/work.png"/>
					<h3 align="right">Work</h3>
				</div>
			</a>
			
			<a title="Contact" href="blog/contact/">
				<div class="boxgrid captionfulldown quattro">
					<img src="img/contact.png"/>
					<div class="cover boxcaptiontop">
						<h3>Contact</h3>
					</div>
				</div>
			</a>
		</div><!-- #content -->
	</div><!-- #container -->

	<div id="footer">
		<div id="tweet" class="twitterstyle"></div>
		<p><a title="About me" href="credits.php">Credits</a> | <a title="About me" href="blog/about/">About</a> | <a href="blog/index.php">Blog</a> | <a title="Work" href="blog/work/">Work</a> | <a title="Contact" href="blog/contact/">Contact</a></p>
	</div><!-- #footer -->

</div><!-- #wrapper .hfeed -->

</body>
</html>
