body {
	max-width:1024px;
	min-width:480px;
	margin:0px auto;	
	padding:0px;

/*	background:#d5cbbf url(../images/bg_texture.png) 0 0 repeat;*/
	background-color:white;
	color:#654;
	font-family: Verdana, Geneva, Tahoma, sans-serif, Arial;
}

#wrapper {
	width:100%;
	min-width:480px;
	height:auto;
	margin:0px auto;	
	padding:0px;
	text-align:left;
	background-color:beige;			
}

div#navigazione {	
	position:relative;
	margin:0px 0px 0px 5px;;
	width:95%;
	
}

.navigazioneH1 {
	font: bold 35px;
	margin:0px 0px 0px 15px;
	padding:0px 0px 15px 0px;
}

.navigazioneH2 {
	font: bold 25px;
	margin:0px 0px 0px 15px;
	padding:0px 0px 15px 0px;
}


h1 img {
	margin:50px 0px 15px 0px;
}

h2 {
	text-align: left;
	font-size:10px;
	font: bold 25px;
	line-height:1;
}

.menu {
	width:50%
	height:220px;
	left:20px;
	top:0;
	position:absolute;
	background:rgb(150,140,130);
	background:rgba(150,140,130,.33);
}
.menu, .menu li {
	list-style-type:none;	
	margin:0;
	padding:0;
	width:75px;
}
.menu li {
 	margin:10px 0 0 0;
}
.menu a {
	margin:0 auto;
	display: block;
/*	font: bold 55px "Cabin Sketch", Arial;*/
	text-decoration: none;
	color:#654;
	width:60px;
	height:60px;	
	-webkit-border-radius: 30x;
	-moz-border-radius: 30px;
	border-radius: 30px;
	background:rgb(150,140,130);
	background:rgba(150,140,130,.5);
}

.menu .facebook:hover {
	background:#3b5998;	
	color:#fff;
}
.menu .twitter:hover {
	background:#bbd6e4;	
	color:#f0f0f0;
}
.menu .email:hover {
	background:#fff;
	color:#09f;
}
.menu:after {
	position:absolute;	
	content:"";	
	top:194px;
	left:11px;
	width:2px;
	height:2px;
	-moz-transform: rotate(45deg); 
	-webkit-transform: rotate(45deg); 
	-o-transform:  rotate(45deg); 
	transform: rotate(45deg);	
	-ms-transform: matrix(.7071, .7071, -.7071, .7071, 0, 0); 
	border-width:25px;
	border-style:solid;
	border-color: transparent rgba(150,140,130,.33) rgba(150,140,130,.333) transparent;
}

.portfolio {
	float: left; 
	list-style: none;
	border:0;
	padding:0;
	margin:0;	
}

.portfolio li {
	float:left; 
	text-align:left;
	width:220px; 
	height:200px;
	margin:0; 
	padding:0;
	position: relative;	
}

div#contenuto li {
	float:left; 
	text-align:left;
	width:220px; 
	height:200px;
	margin:0px 10px; 
	padding:0px 5px;
	position: relative;	
}


.portfolio li a img {
	border:10px solid rgb(150,140,130);
	border-color:rgba(150,140,130,.5) rgba(150,140,130,.505);
}

.portfolio div {
	opacity:0;
	position:absolute; 
	left:0;
	bottom:30px;
	height:170px; 
	width:220px;
	overflow:hidden;
	color:#FFF;
}

.portfolio li:hover div,
.portfolio li:active div,
.portfolio li:focus div {
	opacity:1;
	position:absolute; 
	left:0;	
	bottom:30px;
	height:0px; 
	width:220px;
	text-align:left;
	background: rgb(150,140,130);
	background: rgba(150,140,130,.90); 	
	color:#FFF;
	
/*	-webkit-animation-name: slide;
	-webkit-animation-duration:10s;
	-webkit-animation-iteration-count:1;
	-moz-animation-name:slide;
	-moz-animation-duration:10s;
	-moz-animation-iteration-count:1;
	animation-name: slide;
	animation-duration:10s;
	animation-iteration-count:1;
*/}

/*@-webkit-keyframes slide {
	0% {		height:0px;		}
	25% {		height:170px;	}
	75% {		height:170px;	}
	100% {	height:0px;	}	
}
*/

.portfolio div h3,
.portfolio div p {
	color:#FFF;
	margin: 10px 20px 20px 20px;
	padding:0;
}

.portfolio div h3 {
	margin-top:30px;
}


@media only screen and (max-width: 1024px) {
	#portfolio {	
		width:50%;	
	}
	h1, h2 {
		font: bold 50px;  /* "Cabin Sketch", Arial;*/
	}
	h1 {
		padding:20px 0 0 0;
		margin:0 0 50px 125px;		
	}
	h1 img {
		margin:10px 15px 5px 0;
	}
	h2 {
		font-size:29px;
	}
	.menu {
		left:0px;
	}
}

@media only screen and (max-width: 480px) {

	#portfolio {	
		width:98%;	
	}

	div#contenuto {	
		width:98%;	
	}

	div#contenuto li {
		float:left; 
		text-align:left;
/*		width:220px; 
		height:200px;
*/		margin:0px 3px; 
		padding:0px 0px;
	}

	h1 {
		line-height:.9;	
		font-size:25px;
		padding:5px 0 0 0;
		margin:0 0 5px 5px;			
	}
	h2 {
		font-size:18px;
	}
	.menu {
		height:50px;
		left:0;
	}
	.menu, .menu li {
		width:120px;
	}
	.menu a {
		font-size:20px;
		width:100px;
		height:40px;	
		-webkit-border-radius: 20x;
		-moz-border-radius: 20px;
		border-radius: 20px;
	}
	.menu:after {	
/*		top:141px;*/
		left:7px;
		width:2px;
		height:2px;
		border-width:18px;
	}
}

.clearfix:after {
    content: "."; 
    display: block; 
    height: 0; 
    clear: both; 
    visibility: hidden;
}

/* IE-Patch für IE 7*/
*:first-child+html .clearfix { min-height: 0; } 

/* Hides from IE-mac \*/
* html .clearfix {height: 1%;}
.clearfix {display: block;}
/* End hide from IE-mac */

a {
	outline:none;	
}