html, body { height: 100%;	}

* { margin: 0 }

body {
	background-color: #666;  /*  #f49  */
	font-size: .9em;
	font-family: Arial, Helvetica, sans-serif;
	color: #333;	
}

#main {
	position:relative;
	background-color: white;
	min-height:100%;
	width:760px; /* perchè l'iPad è 768 x 1024 */
	margin-left:auto;
	margin-right:auto;
}

#sopra {
	background-color: #666;
	height:15px;
}
#testata {
	position: relative;
	height:110px;
	background-image: url(img_template/testata.jpg);
	background-repeat: no-repeat;
}

#testata #ombra {
	position: absolute;
	height:10px;
	bottom:-10px;
	width:100%;
	background-image: url(img_template/ombratestata.png);
	background-repeat:no-repeat;
}

#corpo {
	position:relative; /* per farglia allineare cose dentro */
	margin:30px;
	margin-bottom:0;   /* in basso viene megli gestito col padding */
	padding-bottom:80px; /* se il contenuto è lungo finisce sotto a #fondo */
}

#fondo {
	position: absolute;
	bottom:0px;
	width:760px; /* come #main. Non 100% perchè dà problemi in IE */
	background-image:url(img_template/ombrasotto.png);
	background-repeat:no-repeat;
	background-color:#666;
	text-align:center;
	padding:15px 0 10px 0;
	color: #999;
}

h1 { font-size: 2em; }
h1 a {
	position:absolute;
	top:5px;
	left:20px;
	padding:20px 70px;	
}
h1 a, h1 a:hover { 	text-decoration: none; /* altrimenti firefox mostra la sottolinea */ }
h1 a .invisibile { 	visibility:hidden; }

#menu {
	position:absolute;
	padding:5px;
	top:77px;
	left:30px;
	font-variant: small-caps;
	font-size:1.2em;
}
#menu2 {	
	position: absolute;
	top:84px;
	right:50px;
	font-size:.8em;
}
#menu li, #menu2 li {
	display: inline;		
}
#menu li {
	height: 50px;
	margin:10px auto;
}
#menu a, #menu2 a, #menu a:visited { 	text-decoration: none; }
#menu a, #menu a:visited { 
	padding:5px;
	padding-right:20px;
	padding-left:20px;
	border-right: 3px dotted #bbb;
}
#menu a:hover, #menu2 a:hover {  
	color: #f78;
	text-decoration: underline;
}

h2, h3, h4 {
	color: #999;
	font-weight: normal;
}
h2 {
	font-size:3em;
	border-bottom:3px dotted #bbb;
	padding-bottom:20px;
	margin-bottom:15px;
}
h3 { font-size: 1.4em;
	margin-bottom:20px;
 }
h4 { font-size: 1.1em;
	margin-top:20px;
	margin-bottom:5px;
	font-weight: bold;
 }

img { border:0; }

a, a:visited {
	color: #e39;
	cursor: pointer;
	text-decoration:none;
}

a:hover{
	color: #F4a;
	text-decoration:underline;
}
p, ul, ol { margin-top:0px;
 margin-bottom:8px;
}
small { font-size: .85em; }
blockquote { margin-left:25px;
}
#corpo ul {
	height:100%; /* per farlo stare a posto in IE */
	padding:0px;
	margin-top:-5px;
}
#corpo ul li{ 	margin-left: 25px; }

#corpo .linea { 
	position:relative; /* serve solo se la #tastiera sta dentro al DIV .linea */
	clear:both;
	border-bottom:3px dotted #bbb;
	height:10px;
	margin-bottom:10px;
}

#tastiera a img { 
	border:1px solid #bbb;
}
#tastiera a:hover img { 
	border:1px solid #e39;
}
.dubbio {
	cursor:help;
	font-size:.8em;
	font-weight:bold
}
.tip {   /*  usato solo in esamina.php  */
	position:absolute;
	left:80px;
	bottom:20px;
	z-index:1;	
	background-color: #ffc;
	visibility: hidden;
	padding:5px 10px;
	border:1px solid #bbb;
	color:#333;
	font-size:.9em
}
.evidenzia { 
	padding:15px 30px;
	margin:10px 0;
	border:1px solid #bbb;
	font-size:1.2em;
	display:inline-block
}