html {font-size:72%;}
body {font-family: Verdana, Arial, Helvetica, sans-serif;color:#444;line-height:1.5;}
h1, h2, h3, h4, h5, h6 {font-family: Verdana, Arial, Helvetica, sans-serif;}
body, div, fieldset, form {margin:0;padding:0;}
fieldset {width:auto;border:none;}
label {display:block;font-weight:normal;}
label span {font-weight:normal;color:#666;}
h1 {text-align:left;font-size:15px;color:#194739;}
h2 {font-size:14px;color:#333;}
h3 {font-size:13px;}
h4 {color:#194739;font-size:12px;}
h5 {font-size:11px;}
h6 {font-size:10px;}
a {text-decoration:none;color:#333;}
a:hover {text-decoration:underline;}
a img {border:none;}
a.cancel, a.ok {padding:2px 5px;}
ul {list-style: square;}
ul li ul {margin-bottom:5px;}
input, textarea, select {border: 1px solid #ccc; margin:1px;font-size:11px;width:70%;}
button {background:#b09c2d;margin:3px;font-size:10px;font-weight:bold;color:#fff;}

textarea {width:97%;}
table {width:97%;padding:0;border-collapse:collapse;border-spacing:0;font-size:inherit;}
tr {border-bottom: 1px solid #ccc;}
td {margin:	1px 0 0 1px;padding: 1px 5px;vertical-align: top;}

/* classes */
.clear {clear: both;}
.xcenter {width:auto;margin:10px auto;text-align:center;}
.xbig {font-size:1.4em;font-weight:bold;}
.xsmall {font-size:0.9em;}
p .xsmall, li .xsmall, td .xsmall {color:#666;}
.aright {text-align:right;}
.fleft {float:left;}
.fright {float:right;}
input.cbox {border:none;}
h4.sbox {margin-bottom:-3px;}

/* containers */
#page {width:900px;margin:0 auto;}
#head {width:900px;height:131px;background:url(../img/bg_head.jpg) top left no-repeat;}
#loghi{float:left;margin-top:24px;}

#topic {float:left;width:700px;padding-right:10px;}
#topic p {font-size:11px;color:#333}

#fsearch {margin-bottom:10px;}
#search {width:200px;}

#menutop {float:right;width:350px;margin-top:8px;}
#menutop ul {margin:0;list-style:none;text-align:right;}
#menutop ul li {display:inline;height:30px;margin-right:15px;}
#menutop ul li img {margin:0;vertical-align:top;}
#menutop a {color:#157892;font-size:11px;text-transform:lowercase;}
#menutop a:hover {text-decoration:underline;}

#flags {margin-top:60px;text-align:right;}
#flags a {margin-right:10px;}

#menu_giallo{float:left;text-align:left;width:174px;height:481px;background:#f6edc0 url(../img/bg_mano.jpg) left bottom no-repeat;}
#menu_giallo ul {margin:5px 5px 0 5px;padding:15px 0 0 3px;list-style:none;text-align:left;}
#menu_giallo ul li {margin:1px;color:#fff;}
#menu_giallo ul li img {margin:0;vertical-align:top;}
#menu_giallo a {color:#fff;font-size:11px;font-weight:bold;background-color:#00a94e;padding:5px;display:block;}
#menu_giallo a:hover {text-decoration:underline;}

#menu_private {margin:25px 5px 0 5px;padding:15px 0 0 3px;list-style:none;text-align:left;}
#menu_private ul li {margin:1px;color:#fff;}
#menu_private ul li img {margin:0;vertical-align:top;}
#menu_private a {color:#fff;font-size:11px;font-weight:bold;background-color:#00a94e;padding:5px;display:block;}
#menu_private a:hover {text-decoration:underline;}


#submenu ul {margin:0;padding:0 0 0 8px;list-style:none;text-align:left;}
#submenu ul li {margin:3px;}
#submenu ul li img {margin:0;vertical-align:top;}
#submenu a {color:#3e4032;font-size:11px;font-weight:normal;background-color:#d7ca86;padding:5px;}
#submenu a:hover {text-decoration:underline;}
#submenu a.special {color:#3e4032;font-size:11px;font-weight:normal;background-color:#f6edc0;}
#submenu a.special:hover {text-decoration:underline;}

#breadcrumb{float:left;}
#breadcrumb a, #breadcrumb a:visited {font-size:11px;color:#00a94e;text-decoration:underline;}
#breadcrumb a:hover {text-decoration:underline;}

#sitesearch{text-align:right;margin:0;}
#sitesearch label {display:inline;}

#moduli{width:180px;float:right;margin:0;text-align:left;}
#sbox{margin:0;text-align:left;}

#visual{margin-bottom:10px;border-top:7px solid #ae9d2b;border-bottom:7px solid #ae9d2b;}


.map {font-size:11px;}

#bottom {clear:both;height:64px;background:url(../img/bg_bottom.jpg);margin-top:15px;}
#menubottom {padding:8px 0 3px 0;}
#menubottom ul {height:29px;margin:0;list-style:none;text-align:left;}
#menubottom ul li {display:inline;margin:0;padding:10px 15px 5px 5px;}
#menubottom a {color:#4c4c4c;font-size:11px;text-transform:lowercase;}
#menubottom a:hover {text-decoration:underline;}

#foot {padding-top:2px;text-align:center;color:#666;}
#foot p span {line-height:10px;color:#888;font-size:0.9em;}

#unique_pop {background:#f6edc0;padding:10px;}
#unique_pop textarea {width:90%;height:30px;}

/* news */

div.newsmenu {text-align:right;border-bottom:1px dotted #ccc;}
h3.newstitle {font-size:12px;color:#194739;margin-bottom:0;font-weight:normal;text-transform:uppercase;}
h3.chtitle {font-weight:bold;font-family:Verdana,Arial,Helvetica,sans-serif;color:#333;font-size:10px;margin-bottom:0;}
a.newstag:hover {font-weight:bold;}
p.newstags {clear:both;color:#666;border-top:1px dotted #ccc;padding:2px 5px;}
p.newstags span {font-weight:bold;}

/* tag cloud */
.txxs {font-size:0.7em;}
.txs {font-size:1em;}
.ts {font-size:2em;}
.tm {font-size:3em;}
.tl {font-size:4em;}
.txl {font-size:5em;}
.txxl {font-size:6em;}

/* pagination */
#pager {margin-bottom:10px;}
#pager div.xsmall {display:inline;margin-right:10px;}
#pager span.n {color:#fff;background:#00a94e;padding:0 4px;margin:0 4px;}
#pager a {font-weight:bold;margin:0 4px;}

/* bb */
#bb div.navbar {font-weight:bold;font-size:1.1em;}
#bb a.link {font-size:12px;}
#bb h3.bbtitle {font-size:12px;color:#194739;margin-bottom:0;font-weight:normal;text-transform:uppercase;}
#bb p {font-size:11px;color:#666;line-height:14px;}
#bb .bbdata {margin:0 0 -10px 0;}

#bb td.line {padding-left:15px;border-left:1px solid #bbb;}
#bb td a {font-weight:bold;}
#bb .quote {color:#369;}

/* cface */
#cface input, #cface select {width:150px;}
#cface textarea {height:80px;}
#cface a {text-decoration:underline;color:#4c4b4c;font-weight:bold;}

/* uls */
ul.h {list-style:none;margin:0;padding-left:0;}
ul.h li {display:inline;margin-left:15px;}
ul.h li a.on {font-weight:bold;}
/* cface */
.thumb {max-width:100px;margin:5px;vertical-align:middle;}
.underline {text-decoration:underline;}
th a {color:#fff;}
/* multiupload */
div.multiupload {}
div.multiupload div.list {}
div.multiupload div.list div.item {margin:1px;background: #ccc;}
div.multiupload div.list div.item:hover {background: #ccc;}
div.multiupload div.list div.item span {float:left;width:300px;margin:0 10px;}
div.multiupload div.list img {float:left;margin:3px;vertical-align:middle;cursor:pointer;}

/**
Stylesheet: Slideshow.css
	CSS for Slideshow.

License:
	MIT-style license.

Copyright:
	Copyright (c) 2008 [Aeron Glemann](http://www.electricprism.com/aeron/).
	
HTML:
	<div class="slideshow">
		<div class="slideshow-images" />
		<div class="slideshow-captions" />
		<div class="slideshow-controller" />
		<div class="slideshow-loader" />
		<div class="slideshow-thumbnails" />
	</div>
	
Notes:
	These next four rules are set by the Slideshow script.
	You can override any of them with the !important keyword but the slideshow probably will not work as intended.
*/
#show {width:593px;margin:0 auto 0 auto;}
.slideshow {display: block;position: relative;z-index: 0;}
.slideshow-images {display: block;overflow: hidden;position: relative;}
.slideshow-images img {display: block;position: absolute;z-index: 1;}
.slideshow-thumbnails {overflow: hidden;}

#flags {float:right;text-align:right;margin:80px 0 0 100px;color:#333;width:100px;}
#flags a {color:#fff;margin-left:15px;}
#flags a.flagged {text-decoration:underline;}
#flags img {border:none;}


/**
HTML:
	<div class="slideshow-images">
		<img />
		<img />
	</div>
	
Notes:
	The images div is where the slides are shown.
	Customize the visible / prev / next classes to effect the slideshow transitions: fading, wiping, etc.
*/

.slideshow-images {height: 300px;width: 540px;}
.slideshow-images-visible {opacity: 1;}
.slideshow-images-prev {opacity: 0;}
.slideshow-images-next {opacity: 0;}
.slideshow-images img {float: left;left: 0;top: 0;}

/**
Notes:
	These are examples of user-defined styles.
	Customize these classes to your usage of Slideshow.
*/

.slideshow {height: auto;margin: 0 auto;width: 750px;}
.slideshow a img {border: 0;}

/**
HTML:
	<div class="slideshow-captions">
		...
	</div>
	
Notes:
	Customize the hidden / visible classes to affect the captions animation.
*/

.slideshow-captions {
	background: #000;
	bottom: 0;
	color: #FFF;
	font: normal 12px/22px Arial, sans-serif;
	left: 0;
	overflow: hidden;
	position: absolute;
	text-indent: 10px;
	width: 100%;
	z-index: 10000;
}
.slideshow-captions-hidden {height: 0;opacity: 0;}
.slideshow-captions-visible {height: 22px;opacity: .7;}

/**
HTML:
	<div class="slideshow-controller">
		<ul>
			<li class="first"><a /></li>
			<li class="prev"><a /></li>
			<li class="pause play"><a /></li>
			<li class="next"><a /></li>
			<li class="last"><a /></li>
		</ul>
	</div>
	
Notes:
	Customize the hidden / visible classes to affect the controller animation.
*/

.slideshow-controller {
	background: url(../img/controller.png) no-repeat;
	height: 42px;
	left: 50%;
	margin: -21px 0 0 -119px;
	overflow: hidden;
	position: absolute;
	top: 50%;
	width: 238px;
	z-index: 10000;
}
.slideshow-controller * {margin: 0;padding: 0;}
.slideshow-controller-hidden {opacity: 0;}
.slideshow-controller-visible {opacity: 1;}
.slideshow-controller a {cursor: pointer;display: block;height: 18px;overflow: hidden;position: absolute;top: 12px;}
.slideshow-controller a.active {background-position: 0 18px;}
.slideshow-controller li {list-style: none;}
.slideshow-controller li.first a {background-image: url(../img/controller-first.gif);left: 33px;width: 19px;}
.slideshow-controller li.last a {background-image: url(../img/controller-last.gif);left: 186px;width: 19px;}
.slideshow-controller li.next a {background-image: url(../img/controller-next.gif);left: 145px;width: 28px;}
.slideshow-controller li.pause a {background-image: url(../img/controller-pause.gif);left: 109px;width: 20px;}
.slideshow-controller li.play a {background-position: 20px 0;}
.slideshow-controller li.play a.active {background-position: 20px 18px;}
.slideshow-controller li.prev a {background-image: url(../img/controller-prev.gif);left: 65px;width: 28px;}

/**
HTML:
	<div class="slideshow-loader" />
	
Notes:
	Customize the hidden / visible classes to affect the loader animation.
*/

.slideshow-loader {height: 28px;right: 0;position: absolute;top: 0;width: 28px;z-index: 10001;}
.slideshow-loader-hidden {opacity: 0;}
.slideshow-loader-visible {opacity: 1;}

/**
HTML:
	<div class="slideshow-thumbnails">
		<ul>
			<li><a class="slideshow-thumbnails-active" /></li>
			<li><a class="slideshow-thumbnails-inactive" /></li>
			...
			<li><a class="slideshow-thumbnails-inactive" /></li>
		</ul>
	</div>
	
Notes:
	Customize the active / inactive classes to affect the thumbnails animation.
	Use the !important keyword to override FX without affecting performance.
*/

.slideshow-thumbnails {bottom: -65px;height: 65px;left: 0;position: absolute;width: 100%;}
.slideshow-thumbnails * {margin: 0;padding: 0;}
.slideshow-thumbnails ul {height: 65px;left: 0;position: absolute;top: 0;width: 10000px;}
.slideshow-thumbnails li {float: left;list-style: none;margin: 5px 5px 5px 0;position: relative;}
.slideshow-thumbnails a {display: block;float: left;padding: 0;position: relative;}
.slideshow-thumbnails a:hover {background-color: #FF9 !important;opacity: 1 !important;}
.slideshow-thumbnails img {display: block;}
.slideshow-thumbnails-active {background-color: #9FF;opacity: 1;}
.slideshow-thumbnails-inactive {background-color: #FFF;opacity: .5;}
