body { 
	background: #383737 url(../img/bg_body.gif) top repeat-x;
	color: #eaeaea;
	font: 80%/1.2 Helvetica, Arial, sans-serif;
}

/* Headings
----------------------------------------------------------------------------------------------------*/

h1 { float:left;  }
h1 span { display: none;  }
h2 { color: #ffffff; font: 200%/1.5 Helvetica, Arial, sans-serif; font-weight: bold;}
h3 { color: #f5b6c6; font: 150%/1.3 Helvetica, Arial, sans-serif; margin: 5px 0 0 0;}
h4 { color: #ffffff; font-size: 100%; display: inline; }

a { color: #F5B6C6; text-decoration: underline; }
a:hover { color: #ffffff; text-decoration: none; }

/* Layout
----------------------------------------------------------------------------------------------------*/

.content { width: 960px; margin: 0 auto;}

#header { width: 100%; height: 198px;}
#header .content { background: url(../img/bg_header.jpg) top center no-repeat;}
#header .social { float: right; width: 400px; text-align: right; padding: 150px 10px 0 0;}
#header .social img { padding: 0 3px;}

#principale { width: 100%; background: #555555; padding: 30px 0; }
#cv ul { color: #e1dfdf;  }
#cv ul .data, .tipo { color: #eaeaea; font-weight: bold;  }
#cv ul .descrizione { margin: 0 0 8px 10px; font-size: 90%; }
#cv #richiesta { margin: 20px 0 0 0; font-size: 100%; line-height: 32px; padding-left: 32px; background: url(../img/icon_cv.gif) center left no-repeat; }
#cv #richiesta a { color: #AFAFAF; text-decoration: none; font-weight: bold; }
#cv #richiesta a:hover { text-decoration: underline;}

#portfolio ul li { margin: 0 0 10px 0; padding: 0 0 8px 0; list-style-image: none; border-bottom: 1px dashed #8F8F8F;}
#portfolio .descrizione { float: left; margin: 0 5px 0 0; width: 200px;}
#portfolio h3 { font-size: 110%; margin: 0; padding: 0; font-weight: bold;}
#portfolio .descrizione ul li { font-size: 90%; margin: 0; padding: 0; border: none;}
#portfolio .descrizione li.url { font-size: 85%; margin: 5px 0 0 0;}

#portfolio .img { float: right; width: 225px; height: 72px; background: url(../img/bg_portfolio_sito.gif) top center no-repeat; 
	padding: 0; margin: 5px 0 0 0;}
#portfolio .img img { border: 1px solid #FFFFFF; }

#bio { margin: 10px 0; background: #7D1A51 url(../img/bg_bio2.gif) bottom repeat-x; padding-bottom: 5px; }
#bio #img { background: url(../img/bg_foto.jpg) top no-repeat; float: left; width: 146px; height: 150px; margin: -17px 0 0 5px; }
#bio #img img { margin: 17px 0 0 28px; }
#bio .right { width: 260px; }
#bio h2 {font-size: 160%; color: #E3E4DD; text-transform: uppercase; margin: 5px 0 0 0; line-height: normal; letter-spacing:0.1em; }
#bio ul li { list-style: none; line-height: 18px; padding-left: 20px; font-size: 100%; margin: 2px 0; font-weight: bold;}
#bio ul li .label { font-size: 85%; font-weight: normal;}
#bio ul li.mail { background: url(../img/icon_mail.gif) center left no-repeat;}
#bio ul li.skype { background: url(../img/icon_skype.gif) center left no-repeat;}
#bio a { text-decoration: none; color: #FFFFFF;}
#bio a:hover { text-decoration: underline;}
#bio .desc { color: #AF839D; letter-spacing:0.2em; font-size: 120%; font-style:italic;}
#bio .dati { color: #CFB5C5; font-stretch: semi-expanded; font-size: 110%; border-bottom: 1px solid #7F576E; padding: 0 0 5px 0; margin: 5px 0 5px 0;}

#extra { background: #693e56 url(../img/bg_extra.gif) top repeat-x; padding: 40px 0 0 0; }
#footer { background: url(../img/bg_footer.jpg) bottom center no-repeat; height: 70px; line-height: 16px; margin-top: 5px;  font-size: 85%;}
#footer .left { width: 45%; padding-top: 40px;}
#footer .right { width: 45%; padding-top: 40px; text-align: right;}
#footer .top { padding: 0 18px 0  16px; font-size:105%; background: url(../img/icon_top.gif) center right no-repeat;}
/* Elementi
----------------------------------------------------------------------------------------------------*/
.blocco { 
	margin-left: 10px;
	margin-right: 10px;
	width: 440px;	
}
.left { float: left; padding-right: 10px;}
.right { float: right; padding-left: 10px;}

#link { color: #8F5075; }
#link ul li { display: inline; list-style-image: none; margin: 0; padding: 0; line-height: 1.5em; }
#link li { padding: 0 2px; }
#link li a { color: #eaeaea; font-weight: bold; text-decoration: none; }
#link li a:hover { text-decoration: underline; }
#link p { color: #BFB3B3; font-size: 85%; margin: 5px; }
#link p a { font-weight: bold;}


/* `Clear Floated Elements
----------------------------------------------------------------------------------------------------*/

/* http://sonspring.com/journal/clearing-floats */

.clear {
	clear: both;
	display: block;
	overflow: hidden;
	visibility: hidden;
	width: 0;
	height: 0;
}

/* http://perishablepress.com/press/2008/02/05/lessons-learned-concerning-the-clearfix-css-hack */

.clearfix:after {
	clear: both;
	content: ' ';
	display: block;
	font-size: 0;
	line-height: 0;
	visibility: hidden;
	width: 0;
	height: 0;
}

.clearfix {
	display: inline-block;
}

* html .clearfix {
	height: 1%;
}

.clearfix {
	display: block;
}