/**********************************************************************************************
 Riquadro principale della pagina
 
 La struttura dei blocchi principali e' piu' o meno la seguente:
 
 body
   - contenitore (imposta la larghezza e la cornice superiore)
     - pagina (raggruppa tutte le componenti interne e definisce la cornice inferiore)
	   - intestazione
	     - info (intestazioni della pagina e logo)
		 - ruota flash
	   - login (nome utente che compare dopo il login)
	   - fastmenu (link alle pagine di utlita')
	   - tree (l'ho messo alla stessa altezza di fastmenu: albero di percorso)
	   - h1 (titolo principale della pagina)
	   - corpo (il contenuto vero e proprio della pagina)
	   - void (c'era qualche problema di layout con IE, ma forse si può togliere)
   - servizio (data ultima modifica, icone w3c, cambio tema)
 
************************************/
body {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	background-color: #666666;
	color: #ffffff;
}


#contenitore {
	text-align: center;
	margin-left: auto;
	margin-right: auto;
	margin-bottom: 0px;
	padding: 15px 0px 0px 0px;
	border: 0;
	width: 830px;
	background-image: url(img/pagina_top_arancio.gif);
	background-repeat: no-repeat;
	background-position: top;
	background-color: #fff;
	color: #000;
}


#pagina {
	width: 100%;
	border: 0px solid #999999;
	background-color: #FFFFFF;
	color: black;
	padding: 0px 0px 15px 0px;
	margin: 0px 0px 0px 0px;
	background-image: url(img/pagina_bottom_arancio.gif);
	background-repeat: no-repeat;
	background-position: bottom;
}

#void {
	margin: 0px;
	padding: 0px;
	clear: both;
}

/****************** Data di modifica e icone W3C */
#servizio {
	margin-top: 30px;
	clear: both;
	font-size: .7em;
	color: #FFFFFF;
	background: inherit;
	text-align:left;
}

#servizio span{
	display: inline;
	font-size:1em;
	font-family:Arial, Helvetica, sans-serif;
	margin-right: 10px;
}

#servizio a {
	border: 0;
	text-decoration: none;
	color: #fff;
	background-color: #666666;
}

#servizio img{
	border: 0;
}
/*****************	Intestazione */
#logoisit {
	float: left;
}

#info {
	min-height: 100px;
	margin: 0px;
	padding: 0px;
	width: 730px;
	float: left;
}
#info img {
	border: 0;
}
#info address span {
	margin-left: 200px;
	margin-top: 0;
	margin-bottom: 0;
	font-style: normal;
	font-size: 0.7em;
	display: block;
}

#info h1 {
	text-align: center;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 1.3em;
	font-style: normal;
	font-weight: bold;
	padding: 0;
	margin-top: 0px;
	margin-left: 200px;
	margin-bottom: 0px;
	color: #000000;
	background-color: #FFFFFF;
	border: none;
	clear:none;
}
#info h2 {
	font-size: 1.1em;
	font-weight: bold;
	margin-top: 0px;
	margin-bottom: 0px;
	margin-left: 200px;
}
/******************  Ruota Flash   */
#ruota {
	height: 90px;
	width: 90px;
	z-index: 0;
	float: right;
	margin: 0px 0px 0px 0px;
	padding: 0px;
}

/******************  LOGIN 
  Non e' il modulo di login ma il nome utente da mettere nell'heading
*/
#login{
	font-size: 0.7em;
	color:#999999;
	background-color: #fff;
	margin:0 3px 3px 0;
	padding:0;
	clear:both;
	text-align: left;
}


/****************** Menu Link veloci  */
#fastmenu {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 0.7em;
	text-align: right;
	clear: left;
	border-top-width: 1px;
	border-bottom-width: 1px;
	border-top-style: dotted;
	border-bottom-style: none;
	border-top-color: #ff6633;
	border-bottom-color: #ff6633;
	margin-bottom: 10px;
	padding-bottom: 3px;
	background-repeat: no-repeat;
	background-position: left top;
	background-image: url(img/q_on.gif);
	background-color:#FFFFFF;
	color:#666666;
	width: 100%;
}

#fastmenu ul {
	list-style-type: none;
	margin:0;
	display: inline;
}
#fastmenu ul li {
	display: inline;
	margin: 0px;
	padding: 0px 3px 0px 0px;
}
#fastmenu a {
	color: #666666;
	background:inherit;
	text-decoration:underline;
	font-weight:normal;
}

/*******************************************************************

  ALBERO DEL PERCORSO INTERNO AL SITO
  
*******************************************************************/
#tree {
	clear: left;
	float: left;
	color: #FF6633;
	background-color:#FFFFFF;
	padding-left: 5px;
	font-weight: bold;
}
#tree a {
	color: #FF6600;
	background-color:#FFFFFF;
	font-size: 1em;
}

/************************************************************ 

		LINK 
		ci sono vari tipi di classi a seconda del documento collegato:
		- extlink (link a sito esterno all'ISIT)
		- pdflink (PDF)
		- wordlink (Word)
		- doclink (Documento generico, usato per le comunicazioni)
		- maillink (email)
*******************************************************************/

a {
	text-decoration: none;
	color:#333399;
	background-color: #fff;
	font-weight: bold;
}

a img {
	border: 0;
}
a.excellink {
	background:transparent url(img/exclink.jpg) no-repeat scroll right bottom;
	padding-right:16px;
}
a.extlink {
	padding-right: 15px;
	background: url(img/extlink.gif) right center no-repeat;
}

a.pdflink {
	padding-right: 18px;
	background: url(img/pdflink.gif) right bottom no-repeat;
}
a.wordlink {
	padding-right: 14px;
	background: url(img/wordlink.gif) right bottom no-repeat;
}
a.doclink {
	padding-right: 22px;
	background: url(img/doclink.gif) right center no-repeat;
}
a.maillink {
	padding-right: 17px;
	background: url(img/maillink.gif) right center no-repeat;
}

/********************************************

		H1 - TITOLO DELLA PAGINA

*********************************************/
h1 {
	font-family: Geneva, Arial, Helvetica, sans-serif;
	font-size: 1.7em;
	color: #ff6633;
	background-color: white;
	margin: 10px 10px 10px 10px;
	padding: 10px 0 0 10px;
	border-bottom-width: 1px;
	border-bottom-style: solid;
	border-bottom-color: #ff6633;
	text-align:left;
	clear: both;
}


/****************************************************
 ****************************************************

	CORPO DELLA PAGINA

   Oggetti interni al riquadro del corpo
   
*****************************************************
*****************************************************/


#corpo {
	margin: 0px 10px 0 10px;
	text-align:left;
	font-size: 0.9em;
	font-family:Arial, Helvetica, sans-serif;
	line-height: 3ex;
}

/**************************************************
     H2 - Sottotitolo interno alla pagina
*************************************************/
#corpo h2 { 
	font-size: 1.4em;
	color: #ff6633;
	background-color: white;
	clear: both;
}

/**************************************************
     H2 - Primo Sottotitolo interno alla pagina
*************************************************/
#corpo > h2 {
	margin-top: 3em;
}

/**************************************************
     H3 - Sottotitolo di 3^ liv interno alla pagina
*************************************************/
#corpo h3 {
	font-size: 1.2em;
	color: ;
	background-color: #fff;
}


/**************************************************
     dt  
	 usato negli elenchi dei link, dei documenti
	 in segreteria, delle comunicazioni
*************************************************/
#corpo dt {
	font-weight: bold;
	margin-top: 1.5em;
}

/**************************************************
     GRUPPOCOLONNE
	 usato per raggruppare più riquadri insieme.
	 vedi comunicazioni
*************************************************/
.gruppocolonne {
	clear: both;
	margin-top: 1em;
	margin-bottom: 1em;
	width: 100%;
}


/**************************************************
     COLONNA
	 
	 Definisce un riquadro di informazione:
	 la sequenza html e'
	   <div class="colonna">
	      <h2>Titolo riquadro</h2>
		  <div class="corpocolonna">
		      testo testo...
		  </div>
	   </div>
*************************************************/

.colonna {
	font-size: .8em;
	padding: 0px;
	width: 28%;
	margin-right: 15px;
	margin-left: 15px;
	float: left;
	margin-top: 10px;
	line-height: normal;
}
.colonna .corpocolonna {
	padding: 3px;
	border: 1px solid #ff6633;
}

#corpo div.colonna h2 {
	color: #FFFFFF;
	background: #ff6633 url(img/corner_arancio.gif) no-repeat top left;
	padding: 2px 2px 2px 12px;
	margin: 0px;
}
.doppia {
	width: 60%;
}
.tripla {
	width: 90%;
	margin-left: auto;
	margin-right: auto;
}

/**************************************************

   Nel caso dei comunicati ho creato un unico grande
   riquadro denominato appunto .comunicato
   
   la ridefinizione di h1, h2 e h3 serve solo per
   alcune comunicazioni (da word) che contengono
   putroppo questi tag
  
***************************************************/
.comunicato {
	overflow: auto;
}
.colonna .comunicato h1 {
	font-size: 1.1em;
	color: #000;
	background-color: #fff;
	border:0;
}
.colonna .comunicato h2, .colonna .comunicato h3 {
	font-size: 1em;
	color: #000;
	background-color: #fff;
	border:0;
}


/****************************************************

       IMMAGINI dentro il corpo della pagina
	   
****************************************************/	   
#corpo img, h1 img {
	vertical-align: middle;
	text-align: left;
}
img.centra {
	margin-left: auto;
	margin-right: auto;
	border: 0px;
	display:block;
}


/****************************************************
       FORM
****************************************************/	   

form {
	margin: 0;
	padding:0;
}

#formlogin {
	padding: 2px 0px 2px 0px;
}

.pulsante {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 0.9em;
	font-weight: bold;
	border: 1px solid #ff6633;
	color: #ff6633;
	background-color: #fff;
}

#corpo fieldset {
	padding: 5px;
	width: 80%;
	margin-left: auto;
	margin-right: auto;
	margin-top: 1.5em;
	margin-bottom: 1.5em;
	display: block;
}

#corpo fieldset table {
	margin-left: auto;
	margin-right: auto;
}

#corpo legend {
	font-weight: bold;
	color: #ff6633;
	background-color: #fff;
	font-size: 1.1em;
}

#corpo fieldset .colonna {
	padding: 5px;
}

/* 
	Le label in molti form sono allineate a sx
   	rispetto agli oggetti input seguenti
*/
#corpo .input label {
	display: block;
	margin: 0;
	width: 40%;
	float: left;
}
#corpo fieldset label {
	width: 200px;
}

/* 
	Gruppo e' utilizzato per gruppi di radio button o checkbox
*/
#corpo .gruppo {
	width: 55%;
	float: left;
	margin-bottom: 1em;
}

input[type=text], textarea, input[type=password],input[type=file]  {
	border: 1px solid #ff6633;
	padding: 3px;
}

/********************************************************
    TABELLE
*********************************************************/

#corpo caption {
	font-size: 1.2em;
	font-weight: bold;
	color:#ff6633;
	background-color:  #FFFFFF;
	caption-side:top;
	text-align:center;
	margin-left: auto;
	margin-right: auto;
}

#corpo caption.nota {
	caption-side:bottom;
	font-size: 0.8em;
	text-align: left;
}


td.centra {
	text-align: center;
	vertical-align: middle;
}


#corpo table.QuadroOrario, #corpo table {
	margin-left: auto;
	margin-right: auto;
	width: 80%;
	text-align: center;
	border-collapse:collapse;
}

table.QuadroOrario td, table.QuadroOrario th {
	border: 1px solid #ff6633;
} 

#corpo th {
	color: #FFFFFF;
	background-color:#ff6633;
	padding: 2px;
	text-align: center;
}

#corpo thead th {
	text-align: center;
}

#corpo .bordato {
	border: 1px solid #ff6633;
	border-collapse:collapse;
}

#corpo td.cellanum {
	text-align: right;
}

#corpo td {
	padding: 2px;
	text-align: left;
	font-size: .8em;
}

/***************************************************
   Il submenu e' usato per gestire alcuni 
   sottomenu di link a livello di titolo
   nelle pagine Immagini e Link
****************************************************/

#corpo .submenu {
	text-align: center;
	margin: 0 0 2em 0;
}

#corpo .submenu li{
	display: inline;
	padding: 3px 3px 3px 3px;
	margin: 0 5px 0 5px;
	border: 2px solid #ff6633;
	background-color: #fff;
	color: #000;
}

/****************************************************
  CLASSI DI USO GENERICO
****************************************************/
.centrato {
	text-align: center;
}
.scorriadx {
	float: right;
}
.centra {
	margin-left: auto;
	margin-right: auto;
}
.errore {
	color: red;
	background-color: white;
}

.noacapo {
	white-space: nowrap;
}
.umanistico {
	font-family: georgia, Times new roman, serif;
	font-size: 1.1em;
}