  /* SMARTPIXEL layout  */
  /* E' consentito prendere visione degli elementi e delle tecniche utilizzate in questo CSS e adattarle all'interno dei propri progetti, ma la combinazione unica di immagini, colori, misure, attributi tipografici e di posizionamento ("il design") č Copyright © 2010 Smartpixel e non puņ essere riprodotto. */ 
  /* Ultimo aggiornamento 9 ago 2011 */
  
@import url(reset.css);
@import url(form.css);
@import url(custom.css);

/* Elementi invisibili */
header h1 img, header h1 a span, #shortcuts h1, footer h4, footer #lang {display: none;}
/* Elementi generali di layout */
html {
  background: #ffffff url(pic/html.png) repeat-x;
  text-align: center;
}
body {
  font: 13px/20px 'Droid Sans', Arial, Helvetica, sans-serif;
  text-align: left;
  width: 960px; 
  margin: auto;
  color: #656565;
}
.wrap {
  width: 960px; 
  margin: auto;
}
h1, h3 {
  padding: 5px 0px;
  font-size: 16px;
  color: #000000;
}
p {margin-bottom: 5px;}
a {color: #000000;}
a:hover {
  text-decoration: underline;
  background-color: #ffff99;
  color: #990000;
}
a[class="pdf"] {
  background: transparent url(pic/pdf.png) no-repeat 0px 0px;
  padding: 2px 0px 2px 20px;
}
a[class="pdf"]:hover {background: #ffff99 url(pic/pdf.png) no-repeat 0px 0px;}
a[class="external"] {
  background: transparent url(pic/external.png) no-repeat scroll right 0px; 
  padding: 2px 15px 2px 0px;
}
a[class="external"]:hover {background: #ffff99 url(pic/external.png) no-repeat scroll right -20px;}
em:before, em:after {content:'"'}
small {
  font-size: 11px;
  line-height: 14px;
}
/* Header */
header#title {
  position: relative;
  padding-top: 100px;
  height: 100px;
  /*background: transparent url(pic/header.png) no-repeat 790px 50px;*/
}
header#title h1 a {
  position: absolute;
  top: 5px;
  z-index: 10;
  width: 265px;
  height: 80px;
  display: block;
  background: url(pic/brand.h1a.png) no-repeat 0px 0px;
  background-color: transparent!important;
}
header#title h1 a:hover {background-position: 0px -80px;}
header#title h2 {
  background: url(pic/header.h2.png) no-repeat 0px 5px;
  font: italic 22px/36px 'Droid Serif', Georgia, "Times New Roman", Times, serif;
	color: #aaaaaa;
  margin-left: 10px;
  text-indent: 40px;
  text-shadow: 1px 1px 1px #000000;
}
header#title h2 span {
	background: url(pic/header.h2.span.png) no-repeat 55px 5px;
	padding-right: 40px;
	padding-bottom: 5px;
}
header div {
  position: absolute;
  top: 50px;
  right: 40px;
}
header div a:hover {background-color: transparent;}
/* Strumenti di Navigazione */
nav {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  z-index: 0;
}
nav ul {
  float: right;
  height: 40px;
  width: 615px;
	-webkit-border-radius: 0  0 10px 10px;
	-moz-border-radius: 0  0 10px 10px;
	border-radius: 0 0 10px 10px;
	/*-ms-filter:  "progid:DXImageTransform.Microsoft.gradient(startColorstr=#eeeeee, endColorstr=#aaaaaa)";*/
	background: -webkit-gradient(linear, left top, left bottom, from(#eeeeee), to(#aaaaaa));
	background: -moz-linear-gradient(top,  #eeeeee,  #aaaaaa);
	background-color: #d0d0d0;
}
nav li {float: left;}
nav li:first-child {
  border-left: 1px #aaaaaa dotted;
  margin-left: 10px;
}
nav li a {
  background: url(pic/nav.hover.png) no-repeat -250px 0px;
  display: block;
  font-size: 14px;
  font-weight: bold;  
  color: #000000;
  text-transform: lowercase;
  text-decoration: none;
  text-align: center;
  padding: 10px;
  width: 70px;
  height: 20px;
  border-right: 1px #aaaaaa dotted;
  text-shadow: 0px 1px 1px #999999;
}
nav li a:hover {
  color: #ffffff; 
  text-decoration: none;
  background: url(pic/nav.hover.png) no-repeat 0px 0px;
	-webkit-transition: 0.50s;
	-moz-transition: 0.50s;
	transition: 0.50s;
}
nav li.current a, nav li.current a:hover {
  color: #ffffff;
  background: none;
	-ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorstr=#ffcc00, endColorstr=#f49e00)";
	background: -webkit-gradient(radial,50% 50%,5,50% 50%,40,from(#ffcc00),color-stop(100%, #f49e00));
	background: -moz-radial-gradient(center,  #ffcc00,  #f49e00); 
	background-color: #f49e00;
}
nav li a[accesskey="1"] {width: 40px;}
nav li a[accesskey="1"] span {
  width: 40px;
  height: 30px;
  display: block;
  overflow: hidden;
  background: url(pic/index.png) no-repeat -10px -10px!important;
  text-indent: -9999px;
}
nav li.current a[accesskey="1"] span, nav li.current a[accesskey="1"]:hover span {background: url(pic/index.png) no-repeat -10px -50px!important;}
nav li a[accesskey="1"]:hover span {background: url(pic/index.png) no-repeat -10px -50px!important;}
/*nav li a[accesskey="5"] {width: 95px;}*/
/* Area contenuti */
#content {
  margin-top: 20px;
  position: relative;
}
/* Gestione anteprime */
#content header.preview {padding: 10px;}
#content .preview {
  height: 60px;
  padding: 10px 0px;
  background: #ffffff url(pic/preview.gif) repeat-x left bottom;
	-webkit-border-radius: 10px 10px 0px 0px;
	-moz-border-radius: 10px 10px 0px 0px;
	border-radius: 10px 10px 0px 0px;
}
#content .preview li {
  float: left;
  width: 319px;
  border-left: #cacaca 1px dotted;
}
#content .preview li:first-child {border-left: none;}
#content .preview li a {
  display: block;
  color: #000000;
  font-size: 16px;
  margin: 0px 10px;
  text-decoration: none;
  padding: 5px;
  /*text-indent: 20px;*/
}
#content .preview li a:hover {
  background-color: #eeeeee!important;
  -webkit-border-radius: 5px;
	-moz-border-radius: 5px;
	border-radius: 5px;
}
#content .preview li a span {
  color: #656565;
  font-size: 11px;
}
#content .preview li a:hover span {
  color: #000000; 
  text-decoration: underline;
}
/* Gestione contenuti principali */
#content #main {
  float: left;
  width: 470px;
  padding: 0px 30px 100px 10px;
}
#content #main h1 {margin-top: 20px;}
article header.preview {margin-bottom: 20px;}
article img.thumb, form img.thumb {
  float: left;
  padding-right: 10px
}
article time {margin-bottom: 5px;}
article h2 {color: #000000;}
article ul.details {padding-bottom: 5px;}
article ul.details li {
  background: url(pic/details.png) no-repeat 0px 7px;
  padding-left: 10px;
}
article footer {
  font-size: 12px;
  position: relative;
  height: auto;
  margin: 0;
}
article section#share ul li {
  float: left;
  margin-top: 10px;
}
/* Sistema di paginazione */
section#pagination {
  position: fixed;
  width: 100%;
  left: 0px;
  bottom: 40px;
}
section#pagination ul {
  background: #ffffff;
  width: 500px;
  height: 20px;
  padding: 5px 0px 10px;
  opacity: .9;
}
section#pagination li, section#pagination li a {
  -webkit-border-radius: 5px;
	-moz-border-radius: 5px;
	border-radius: 5px;
}
section#pagination li {
  float: left;
  font-size: 11px;
  margin-left: 10px;
  border: #cacaca 1px solid;
}
section#pagination li a {
  display: block;
  padding: 0px 5px;
  text-decoration: none;
}
section#pagination li span.disabled {
  color: #aaaaaa;
  padding: 0px 5px;
}
/* Contenuti Secondari */
aside {
  margin-left: 510px;
  width: 440px;
  padding: 0px 10px 80px 0px;
}
aside div {margin-top: 20px;}
/* Area Footer */
footer {
  clear: both;
  position: fixed;
  bottom: 0;
  left: 0;
  width: 100%;
  /*margin-top: 120px;*/
}
footer .wrap {position: relative;}
footer p small {
  position: absolute;
  color: #aaaaaa;
  z-index: 10;
  margin: 15px 0px 0px 60px;
}
footer ul {
  height: 40px;
	-webkit-border-radius: 10px  10px 0px 0px;
	-moz-border-radius: 10px  10px 0px 0px;
	border-radius: 10px  10px 0px 0px;
	/*-ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorstr=#383D45, endColorstr=#000000)";
	-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(opacity=90)";*/
	background: -webkit-gradient(linear, left top, left bottom, from(#383D45), to(#000000));
	background: -moz-linear-gradient(top,  #383D45,  #000000);
	background-color: #131417;
	opacity: .9;
}
footer ul li {
  float: left; 
  margin-left: 5px;
}
footer ul li:first-child {margin-left: 10px;}
footer ul li#info {margin-left: 455px;}
footer ul li a {
  background: url(pic/footer.png) no-repeat;
  width: 40px;
  height: 40px;
  display: block;
  text-indent: -9999px;
  overflow: hidden;
}
footer ul li a:hover {background: #000000 url(pic/footer.png) no-repeat;}
footer #top a {background-position: 0px 0px;}
footer #info a {background-position: -40px 0px;}
footer #rss a {background-position: -80px 0px;}
footer #twitter a {background-position: -120px 0px;}
footer #facebook a {background-position: -160px 0px;}
footer #linkedin a {background-position: -200px 0px;}
footer #youtube a {background-position: -240px 0px;}
footer #googleplus a {background-position: -280px 0px;}
footer #html a {background-position: -320px 0px;}
footer #css a {background-position: -360px 0px;}
footer #lang {
  position: absolute;
  bottom: 6px;
  right: 15px;
}
footer #lang label {color: #aaaaaa;}
footer #lang select {
  margin: 10px 0px 0px 5px; 
  width: 128px;
  padding: 2px!important;
}
@media only screen 
and (min-device-width : 320px) 
and (max-device-width : 480px) {
#content #main {padding-bottom: 25px;}
section#pagination, footer {position: static;}
section#pagination li {margin: 25px 10px 0px 0px;}
footer ul {margin-bottom: 10px; background: none;}
footer ul li#info {margin-left: 5px;}
footer p small {margin: 45px 0px 0px 15px;}
}
