@charset "UTF-8";
/* CSS Document */

body
{margin:0;
 padding:0;
 background:url(../pattern.png) repeat;
 font-family: 'Francois One', sans-serif;
 color:#222;
 line-height:1.5em;
 font-size:15px;
}


#header
{background-color:#FFF;
 padding:20px 0;}
	
.contenitore
{width:960px;
margin:auto;
position:relative;
}

#copertina
{width:960px;
height:334px;
margin-top:5px;
margin-bottom:5px;
 background:url(../immagini/copertinaritaglio);}
 
#copertina.aboutme
{width:960px;
height:334px;
margin-top:5px;
 background:url(../immagini/aboutme.jpg);}
 
#copertina.contact
{width:960px;
height:334px;
margin-top:5px;
 background:url(../immagini/contact.jpg);}
 
#copertina.photos
{width:960px;
height:334px;
margin-top:5px;
 background:url(../immagini/photos.jpg);}

#copertina.illustration
{width:960px;
height:334px;
margin-top:5px;
 background:url(../immagini/illustration.jpg);}

#copertina.video
{width:960px;
height:334px;
margin-top:5px;
 background:url(../immagini/video.jpg);}       

#logo a	
{display:block;
width:200px;
height:36px;
background:url(../immagini/logo.png) 0 -35px;
text-indent:-9999px;
}

#logo a:hover	
{background-position:0 0;
}

#navigazione
{position:absolute;
 top:10px;
 left: 300px;
}

#navigazione a
{color:rgba(0,0,0,0.5);
text-decoration:none;}

#navigazione a:hover
{color:#000;
}

#navigazione ul
{list-style:none;
margin:0;
padding:0;
}

#navigazione li
{float:left;
padding:0 10px 0 0;
margin: 0 10px 0 0;
border-right:solid 2px rgba(0,0,0,0.4);
}

#navigazione li:last-child
{float:left;
padding:0;
margin: 0;
border:none;
}

#social ul
{list-style:none;

}

#social li
{float:left;
margin:0 20px 0 0;
}

#social a
{text-indent:-9999px;
 
}

#social a.facebook
{display:block;
 width:30px;
 height:30px;
 background:url(../immagini/ic_circle_social_icon_set.png) -146px -96px;
 }
 
#social a.facebook:hover
{display:block;
 width:30px;
 height:30px;
 background:url(../immagini/ic_circle_social_icon_set.png) -146px 0;
 }
 
 #social a.twitter
{display:block;
 width:30px;
 height:30px;
 background:url(../immagini/ic_circle_social_icon_set.png) -36px -96px;
 }
 
#social a.twitter:hover
{display:block;
 width:30px;
 height:30px;
 background:url(../immagini/ic_circle_social_icon_set.png) -36px 0;
 }
 
#social
{position:absolute;
 top:-10px;
 right: 10px;
}



.colonna
{width:300px;
 margin-left:10px;
 margin-right:10px;
 margin-top:5px;
 float:left;
 background:rgba(255,255,255,0.5);
}

h2
{ /*font-family: 'Open Sans Condensed', sans-serif;*/
  margin-top:5px;;
  text-align:center;
 }
  
.colonna a
{text-decoration:none;
 color:#444;
}



.colonna a:hover
{
 color:#000;
}

p.didascalia
{font-family: 'Oxygen', sans-serif;
width:280px;
margin-left:10px;
color:rgba(0,0,0,0.6);
font-size:14px;
text-align:center;
}

#sfondo
{background:#fff;
 width:960px;
 float:left;
 margin-top:0px;}
#contenuto
{height:500px;} 

#photos ul
{list-style:none;
margin:0;
padding:0;
}

#photos li a
{display:block;
 width:200px;
 height:200px;
 margin-left:50px;
 margin-right:50px;
 background:url(../immagini/photos.png) 0 0;
 text-indent:-9999px;}

#photos li a:hover
{background-position:0 -200px;}

#illustration ul
{list-style:none;
margin:0;
padding:0;
}

#illustration li a
{display:block;
 width:200px;
 height:200px;
 margin-left:50px;
 margin-right:50px;
 background:url(../immagini/illustration.png) 0 0;
 text-indent:-9999px;}

#illustration li a:hover
{background-position:0 -200px;}

#video ul
{list-style:none;
margin:0;
padding:0;
}

#video li a
{display:block;
 width:200px;
 height:200px;
 margin-left:50px;
 margin-right:50px;
 background:url(../immagini/video.png) 0 0;
 text-indent:-9999px;}

#video li a:hover
{background-position:0 -200px;}

#footer
{font-size:12px;
margin-top:470px;
color:rgba(0,0,0,0.6);
}

#navigazione a.attivo
{color:#F00;
	font-weight:bold;}
	
h3
{ color:rgba(0,0,0,0.6);
  margin-top:20px;
  text-align:center;
}

h3 a
{text-decoration:none;
color:rgba(0,0,0,0.6)}

.bio
{color:rgba(0,0,0,0.6);
}

.colonnatestosx
{margin-left:50px;
 margin-right:25px;
 width:405px;
 float:left;
 font-family: 'Oxygen', sans-serif;
}

.colonnatestodx
{margin-left:25px;
 margin-right:50px;
 width:405px;
 float:left;
 font-family: 'Oxygen', sans-serif;
}

.menu
{float:left;
 width:200px;
 margin-left:20px;
 margin-right:10px;
 }
 
 .menu a
 {text-decoration:none;
  color:rgba(0,0,0,0.6);
  font-size:20px;}
  
 .menu a:hover
 {color:#000;}
 
 .menu ul
 {list-style:none;}
 
.menu ul a.attivo
{color:#F00;
 font-weight:bold;}
 
.menu li
{margin-bottom:10px;}
 

#gallery
{float:left;
 width:700px;
 margin-left:10px;
 margin-right:20px;}
 
#gallery ul
{list-style:none;} 
 
#gallery li
{float:left;
margin-left:10px;
margin-bottom:10px;
}

p.citazione
{color:rgba(0,0,0,0.8);
text-align:center;
margin-top:-5px;
font-family: 'Oxygen', sans-serif;
font-size:13px;
}



.videoWrapper {
	position: relative;
	padding-bottom: 56.25%; /* 16:9 */
	padding-top: 25px;
	height: 0;
}
.videoWrapper iframe {
	position: absolute;
	top: 0;
	left: 0;
	margin-top:20px;
	width: 100%;
	height: 100%;
}

@media handheld, only screen and (max-width: 767px)

{
.colonna
{float:none;
margin-left:50px;
margin-right:50px;}

#contenuto
{height:1500px;}

#copertina
{height:0;}
#copertina.aboutme
{height:0;}
 
#copertina.contact
{height:0;}
 
#copertina.photos
{height:0;}

#copertina.illustration
{height:0;}

#copertina.video
{height:0;}

.contenitore
{width:400px;
}

#header
{height:250px;
text-align:center;
padding:0;}

#logo
{position:static;}
#navigazione
{position:static;
margin-top:20px;}
#navigazione li
{float:none;
border:none;}
#navigazione li:last-child
{float:none;
margin-left:-24px;
}
#social
{position:absolute;
margin-top:30px;
margin:auto;
padding:0;}

.colonnatestosx
{margin-left:25px;
margin-right:25px;
 width:350px;
 float:none;
 font-family: 'Oxygen', sans-serif;
}

.colonnatestodx
{margin-left:25px;
margin-right:25px;
 width:350px;
 float:none;
 font-family: 'Oxygen', sans-serif;
}

#gallery
{float:none;
width:350px;
 margin-left:5px;
 margin-right:5px;}

#gallery li
{float:left;
margin-left:5px;
margin-bottom:10px;
} 

#menu
{float:none;}

#contenuto
{width:400px;}

#sfondo
{width:400px;}

.videoWrapper {
	position: relative;
	padding-bottom: 56.25%; /* 16:9 */
	padding-top: 25px;
	height: 0;
}
.videoWrapper iframe {
	position: absolute;
	top: 0;
	left: 0;
	margin-left:20px;
	margin-top:20px;
	width: 100%;
	height: 100%;
}*/




}