body {
	margin: 0px 0;
	padding: 0;
	background: #CCCCCC;
}

div, p {
	margin:0;
	padding:0;
}
.container {
	margin:0 auto;
	border:0;
	padding:32px;
	width:840px;
}
.wrapper { width:850px; text-align:center;
}
.header { 
width:840px; 
border: 0px solid #333333;
background-image:url(images/headerbg.gif);
background-repeat:repeat-x;
}
.headercontent { 
width:300px;
padding-top:10px;
}
.samplehead { 
   padding-top:5px;
   vertical-align:middle;
   font: bold 14px 'Trebuchet MS', Tahoma, verdana,  sans-serif;
 	color: #FFFFFF;
  	padding-bottom:5px;
 	padding-left:5px;
	padding-right:5px;
	background-color:#000000;
}
.sampletitle { 
   padding-top:5px;
   vertical-align:middle;
   font: bold 12px 'Trebuchet MS', Tahoma, verdana,  sans-serif;
 	color: #ffffff;
  	padding-bottom:5px;
 	padding-left:5px;
	padding-right:5px;
	text-align:center;
	background-color:#666666;
	height:30px;
	
}
.sample_img{
border:solid #666666 2px;
}
.sample_div{
width:150px;
padding-left:5px;
padding-right:5px;
padding-top:5px;
float:left;
}
.sample_caption { 
   vertical-align:middle;
   font: bold 12px 'Trebuchet MS', Tahoma, verdana,  sans-serif;
 	color: #ffffff;
  	text-align:center;
	background-color:#666666;
	height:30px;
	width:154px;
padding-top:5px;
float:left;	
}
.sample_table{
border-right: #666666 1px solid;
border-left: #666666 1px solid;
}
.sample_side{
border-left: #666666 1px solid;
}
.sample_bottom{
border-top: #666666 1px solid;
border-bottom: #666666 1px solid;
}
.headertext{
background-color:#FFFFFF;
font-family:Geneva, Arial, Helvetica, sans-serif;
font-size:13px;
}
a.title{
	color: #000;
	text-decoration:none;
	}
	a.title:hover{
	color: #000;
	text-decoration:underline;
	}
.logo { 
width:275px; 
height:125px;
padding-top:10px;
}
.bodytext{
font-family:Geneva, Arial, Helvetica, sans-serif;
font-size:13px;
color:#000000;

}
.bodytextw{
font-family:Geneva, Arial, Helvetica, sans-serif;
font-size:13px;
color:#fff;

}
.content { 
width:800px;
background:#222; border:4px solid #666666;padding:6px 0;
}
.innercontent {
background-color:#CCCCCC;
padding:15px;border:1px solid #666666;
/*height:350px;*/
font-family:Geneva, Arial, Helvetica, sans-serif;
font-size:13px;
text-align:left;
}
.frontimg_left {
	padding: 0 0px 0px 0;
	margin: 4px;
	float: left;
	border: 2px solid #3A3A3A;
}
.frontimg_right {
	border: 2px solid #3A3A3A;
	padding: 0 0 0px 00px;
	float: right;
	margin: 4px;
}
.frontimg_center {
	border: 2px solid #3A3A3A;
	padding: 0 0 0px 00px;
	margin: 4px;
	float: right;
	}
.scrollimg {
	border: 1px solid #3A3A3A;
	padding-right:20px;
	margin: 12px;
}
.contenttable { 
background-image:url(images/contentbg.gif); 
background-repeat:no-repeat;
border-right: #666666 1px solid;
border-left: #666666 1px solid;
border-bottom: #666666 1px solid;
background-color:#FFFFFF;
}
.toptable{
border-right: #666666 1px solid;
border-left: #666666 1px solid;
background-color:#FFFFFF;
}
.footer{
height:45px;
background-color:#999999;
border-top: #666666 1px solid;
}
.footertext{
color: #fff;
font-family:Geneva, Arial, Helvetica, sans-serif;
font-size:12px;
text-align:center;

}

#left {
	width: 750px;
	height: 100px;
	overflow: hidden;
	border: 0px solid black;
	padding: 0px;
	clear:both;
	
	}

/* Immagini */
#left img {
	height: 100px;
	margin: 0px;
	border: 0px solid #999999;
	clear:both;
	padding-right:25px;
	}

td.nav {
  background: url(images/navend.gif);
  height:34px;
  width:850px;
  
}

li.main {
   display:inline;
   background: url(images/tab.gif) left top;
   padding-top:0px;
   vertical-align:middle;
   font: bold 16px 'Trebuchet MS', Tahoma, verdana,  sans-serif;
  	padding-bottom:0px;
 	padding-left:25px;
	padding-right:25px;
  
}
li.main:hover{
background-position:0% -34px;
}
a.navl {
   height:29px;
   text-decoration:none;
   color:#FFF;
	text-align:center;
	padding-top:5px;

}
a.navl:hover {
height:29px;
color:#FFF;
padding-top:5px;
}
.navlist{
	margin:0;
	padding:0;
}
.navlist ul {
	position:absolute;
	top:-999em;
	list-style:none;
	vertical-align: middle
}
.navlist ul li,
.navlist a {
	width: inherit;
}
.navlist li {
	float:left;
	position:relative;
	z-index:99;
}
.navlist a {
	display:block;
}
.navlist li:hover ul,
ul.navlist li.sfHover ul {
	left:-41px;
	top:34px;
	list-style:none;

}
.navlist li:hover li ul,
.navlist li.sfHover li ul {
	top:-999em;
}
.navlist li li:hover ul,
ul.navlist li li.sfHover ul {
	left:105px;
	top:1px;
}
.superfish li:hover ul,
.superfish li li:hover ul {
	top: -999em;
}

/*** ORIGINAL SKIN ***/
.navlist li {
	color: white;
}
.navlist a {
  	color: white;
	text-decoration:none;
  	
}
.navlist li:hover, .navlist li.sfHover,
.navlist a:focus, .navlist a:hover, .navlist a:active {
	color: white;
  	text-decoration:none;
}
.navlist li li {
	font-family:Arial, Helvetica, sans-serif;
	font-size:11px;
	background: #666666;
  	color: white;
	padding-top:4px;
  	padding-bottom:4px;
 	padding-left:5px;
	border-left: 1px #FFFFFF solid ;
  	border-right: 1px #FFFFFF solid ;
  	border-bottom:1px #FFFFFF solid ;
	width:120px;
	text-decoration:none;
	left:
}
.navlist li li:hover, .navlist li li.sfHover,
.navlist li li a:focus, .navlist li li a:hover, .navlist li li a:active {
background: #97292a;
  	color: white;
	width:120px;	
}
#screenshot{
	position:absolute;
	border:1px solid #ccc;
	background:#333;
	padding:5px;
	display:none;
	color:#fff;
	}
	#makeMeScrollable div.scrollableArea *
	{
		position: relative;
		float: left;
		margin: 0;
		padding: 0;
	}


/*	Invisible left hotspot */
div.scrollingHotSpotLeft
{
	/* 	The hotspots have a minimum width of 100 pixels 
	and if there is room the will grow and occupy 15% 
	of the scrollable area (30% combined). Adjust it 
	to your own taste. */
	min-width: 75px;
	width: 10%;
	height: 100%;
	/*	There is a big background image and it's used 
		to solve some problems I experienced
		with Internet Explorer 6. */
	background-image: url(../images/big_transparent.gif);
	background-repeat: repeat;
	background-position: center center;
	position: absolute;
	z-index: 200;
	left: 0;
	/*	When positioning the mouse over one of the hot spots, 
		the cursor should change. I've noticed that this varies 
		from browser to browser though. */
	cursor: url(../images/cursors/cursor_arrow_left.cur), w-resize;
}

/*	Visible left hotspot */
div.scrollingHotSpotLeftVisible
{
	background-image: url(../images/arrow_left.gif);				
	background-color: #fff;
	background-repeat: no-repeat;
	opacity: 0.35; /* Standard CSS3 opacity setting */
	-moz-opacity: 0.35; /* Opacity for really old versions of Mozilla Firefox (0.9 or older) */
	filter: alpha(opacity = 35); /* Opacity for Internet Explorer. */
	zoom: 1; /* Trigger "hasLayout" in Internet Explorer 6 or older versions */
}

/* Invisible right hotspot */
div.scrollingHotSpotRight
{
	min-width: 75px;
	width: 10%;
	height: 100%;
	background-image: url(../images/big_transparent.gif);
	background-repeat: repeat;
	background-position: center center;
	position: absolute;
	z-index: 200;
	right: 0;
	cursor: url(../images/cursors/cursor_arrow_right.cur), e-resize;
}

/* Visible right hotspot */
div.scrollingHotSpotRightVisible
{
	background-image: url(../images/arrow_right.gif);
	background-color: #fff;
	background-repeat: no-repeat;
	opacity: 0.35;
	filter: alpha(opacity = 35);
	-moz-opacity: 0.35;
	zoom: 1;
}

/*	The scroll wrapper is always the same width and 
	height as the containing element (div). Overflow 
	is hidden because you don't want to show all of 
	the scrollable area.
*/
div.scrollWrapper
{
	position: relative;
	overflow: hidden;
	width: 800px;
	height: 100%;
}

div.scrollableArea
{
	position: relative;
	width: auto;
	height: 100%;
}
#isologo
{background-image: url(images/150px_wide_rgb.jpg);
height:84px;
width:150px;
	}