/* coding=UTF-8 */

/* FORM FLUIDI CON UN CAMPO PER RIGA E LABEL SOPRA O A SINISTRA */

/* Form trasparente da mettere in un contenitore, del quale riempie completamente lo spazio utile interno senza aggiungere margine o padding. */
form.t { margin: 0px; padding: 0px; text-align: left; }
form.t.color-b { background-color: #EDEDFB; margin: -10px -15px -10px -15px; padding: 10px 15px 10px 15px; }

/* Form bordato con colore di sfondo, senza margini esterni, da usare autonomamente o in un contenitore. Ha un doppio bordo che riprende lo sfondo della riga del/dei titoli (legend) di raggruppamento. */
form.b { margin: 0px; border: 1px solid #4682B4; padding: 0px; text-align: left; }   /* Eredita lo sfondo del suo contenitore, per i titoli. */
form.b fieldset.maingroup { margin: 0px 0px 0.796em 0px; border: none; padding: 0px 4px 4px 4px; }   /* Il padding determina l'ampiezza dell'ulteriore bordo. Margin-bottom lo spazio dopo il fieldset colorato che separa l'elemento che segue, in genere un bottone di invio o un altro fieldset. */
form.b legend.maingroup {
	padding: 4px 0px 2px 6px;
	font-size: 132%;
	line-height: 132%;
	font-weight: bold; font-style: normal; font-variant: small-caps;
	text-align: left;
	color: #808080;
	display: inline; }   /* Aggiunto per fare andare a capo le scritte lunghe in IE. */
form.b legend.maingroup span.low { font-size: 86%; font-weight: normal; font-style: normal; font-variant: normal; }   /* Testo ausiliario del titolo che si vuole evidenziare di meno. */
/* Contenitore con tutti i campi solo per i form bordati, usato per creare un padding (bordo) del colore di sfondo del fieldset. I form trasparenti sono già inseriti in un contenitore di livello superiore con il suo padding (agendo sul legend si distanziano i campi ma non con il colore di sfondo del form). */
form.b fieldset div.pad-fset { padding: 10px 15px 10px 15px; }
.pad-fset { background-color: #EDEDFB; }   /* L'assegnazione del colore di sfondo è stata separata e assegnata con una classe generica, perché altrimenti, con una classe più specifica, prevale su un'eventuale classe usata per cambiare colore al seguito del fieldset, assegnata insieme a "pad-fset". */
.pad-subfset { background-color: #EFEBE7; border-radius: 12px; }   /* Colore di sfondo di default usato per i sub-form inclusi in quello principale (relazioni 1:n obbligatorie e con "n" piccolo), classe assegnata insieme a "pad-fset". */
.pad-subfset-transp { background-color: transparent; }   /* Classe per l'annullamento del colore di sfondo per i sub-form inclusi in quello principale (usata anche nei report-form di output), classe assegnata insieme a "pad-fset". */

.color-b2 { background-color: #FFEFD5; }   /* Colore di sfondo alternativo per i form, da usare quando il form si compone di più parti e le si vuole evidenziare con colori differenti. */

/* Contenitori dei singoli campi con label a sinistra (contenitori a piena larghezza). */
form.t div.campo, form.b fieldset div.campo { width: 100%; text-align: left; }   /* Il padding laterale del contenitore di campo nei fieldset non funzionerebbe. La spaziatura verticale dei campi bisogna darla sui campi, in quanto qui non avrebbe effetto per quelli con la label sopra che non hanno una div dedicata ma sono tutti in un unica div. */
form.t div.campo.line-radiocheck, form.b fieldset div.campo.line-radiocheck { margin-bottom: 7px; }   /* Margine inferiore quando il contenitore è per dei radio-button o checkbox disegnati in linea senza riquadro di contenimento. */

/* Label a sinistra dei campi (input e textarea). */
/* Nell'HTML label non deve contenere il campo. Per avere label a sinistra a larghezza determinata con i campi quindi allineati verticalmente lungo il loro bordo sinistro.
   Tale allineamento è ottenuto rendendo float (da inline) le label, per potergli assegnare una larghezza. Se si accetta la condizione di campi larghi tutti uguali si può tenere il campo dentro la label (inline) ed allineare il tutto a destra. */
form label.line { float: left; text-align: right; margin-top: 0.23em; }
/* Con "line-height: 23px" si allineano le scritte fuori e dentro il campo, ma non quando si agisce variando la "dimensione testo" dal menu del browser.
   Con "line-height: 180%" si migliora l'allineamento al variare della dimensione. Con il valore dato ancora meglio (per IE8, variato per gli altri). */
/* Label eventuale aggiuntiva a destra dei campi per delle note esplicative, sia per campi con label a sinistra che per campi a larghezza definita con label sopra,
   ed anche classe della label non "float" per quando il campo non è in una divisione di contenimento (standard div=campo), ma tutto in linea nel flusso del documento,
   la clausola "text-align:left" non produce effetto in quanto in questo caso la label è un elemento inline con larghezza definita dal contenuto. */
form label.post-line { text-align: left; vertical-align: top; position: relative; }   /* Agendo con margin-top o line.height non si ottiene risultato in quanto questo elemento inline è nel flusso del documento insieme al campo quindi la loro reciproca posizione varia (nel caso) insieme. Allo stesso modo non si allineano usando vertical-align per la divisione che li contiene. */
/* Label a sinistra dei campi (select-option). Si può usare anche la classe .line ma con questa si ottiene un migliore allineamento orizzontale del testo della label con quello del campo. */
form label.linelist { float: left; text-align: right; margin-top: 0.159em; }
form label.post-linelist { text-align: left; vertical-align: top; position: relative; }
/* Alle label a sinistra bisogna dare un attributo aggiuntivo "width: <nr>em" per definirne la larghezza. L'assenza determina larghezza in funzione del contenuto, quindi label allineate a sinistra e campi frastagliati (label+campo=inline).
Anzichè farlo nel file CSS che dovrebbe prevedere i diversi valori desiderati con una classe aggiuntiva, si può definire tale classe in un foglio di stile incorporato nell'HTML dove c'è il form, oppure
in un foglio in linea (attributo style) per ogni label a sinistra definita nel form (scelta questa soluzione per i form generati dalle funzioni PHP in JoLib_FuncForm.inc.php).*/
/* --- Classi aggiuntive assegnate nella costruzione della pagina (in PHP) se viene rilevato il Browser indicato nella classe. --- */
/* Servono ad allineare il contenuto dei campi con le etichette poste prima e dopo. "top" viene usata quando l'etichetta è dichiarata "display: block;". */
form label.line.ie7 { margin-top: 0.32em; }   /* Classe assegnata per 'IE<=7'. */
form label.line.firefox21 { margin-top: 0.16em; top: 1px; }   /* Classe assegnata per 'Firefox<=21'. */
form label.line.firefox { margin-top: 0.16em; top: -1px; }
form label.line.safari, form label.line.chrome { margin-top: 0.265em; }
/* Il parametro "top" di posizionamento non può essere assegnato ad un valore di default (per IE) e poi alterato per gli altri Browser. Quindi va definito singolarmente (IE compreso). */
form label.post-line.ie7 { top: 0.32em; }   /* Classe assegnata per 'IE<=7'. */
form label.post-line.ie8, form label.post-line.opera { top: 0.23em; }   /* Classe assegnata per 'IE>=8'. */
form label.post-line.firefox50 { top: 0.16em; }   /* Classe assegnata per 'Firefox<=50', notando che per Firefox 88 questo valore è errato. */
form label.post-line.firefox { top: 0.26em; }
form label.post-line.safari, form label.post-line.chrome { top: 0.265em; }
/*  */
form label.linelist.ie7 { margin-top: 0.245em; }   /* Classe assegnata per 'IE<=7'. */
form label.linelist.firefox50 { margin-top: 0.225em; }   /* Classe assegnata per 'Firefox<=50'. */
form label.linelist.safari, form label.linelist.chrome { margin-top: 0.19em; }   /* Con Safari sarebbe 0.1em se non fosse applicato l'aumento del font-size (classe:form select.safari) per risolvere in parte un difetto con i ListBox. Per i ListBox alti più di una riga ci vorrebbe 0.1em in quanto a loro non è applicato l'aumento del font-size, ma è poco evidente il disallineamento. */
form label.linelist.ie8multiple { margin-top: 0.076em; }   /* Classe assegnata per 'IE>=8' e listbox con selezione multipla, che sono disegnati in maniera diversa. Assegnata da codice (JoLib_FuncForm.inc.php) al posto del default. */
form label.linelist.operamultiple { margin-top: 0.23em; }
form label.linelist.safarimultiple, form label.linelist.chromemultiple { margin-top: 0.12em; }
/*  */
form label.post-linelist.ie7 { top: 0.245em; }   /* Classe assegnata per 'IE<=7'. */
form label.post-linelist.ie8, form label.post-linelist.opera { top: 0.159em; }   /* Classe assegnata per 'IE>=8'. */
form label.post-linelist.firefox50 { top: 0.225em; }   /* Classe assegnata per 'Firefox<=50'. */
form label.post-linelist.firefox { top: 0.159em; }
form label.post-linelist.safari, form label.post-linelist.chrome { top: 0.19em; }   /* Con Safari sarebbe 0.1em se non fosse applicato l'aumento del font-size (classe:form select.safari) per risolvere in parte un difetto con i ListBox. Per i ListBox alti più di una riga ci vorrebbe 0.1em in quanto a loro non è applicato l'aumento del font-size, ma è poco evidente il disallineamento. */
form label.post-linelist.ie8multiple { top: 0.076em; }   /* Classe assegnata per 'IE>=8' e listbox con selezione multipla, che sono disegnati in maniera diversa. Assegnata da codice (JoLib_FuncForm.inc.php) al posto della precedente. */
form label.post-linelist.operamultiple { top: 0.23em; }
form label.post-linelist.safarimultiple, form label.post-linelist.chromemultiple { top: 0.12em; }
/* --- Fine classi. --- */

/* Label sopra i campi. */
/* Nell'HTML label non dovrebbe contenere il campo. Per avere label sopra e campo sotto (se il campo è full=width:100% andrebbe comunque sotto, se invece è nofull andrebbe di seguito.
 - Invece per i campi full=width:100% bisogna adottare la scrittura con <label> che contiene <input>, per ovviare ad un difetto di IE, Firefox e Safari, che allungano di 6px i campi larghi quanto la riga.
   In questo modo si può ridurre a destra l'area occupata da label e di conseguenza dell'input che contiene. L'azione diretta con un margine o padding sul campo non funziona.
 - Una prima soluzione aggiungeva un padding destro di 6px ai contenitori dei campi in entrambi i tipi di form, ottenendo così un margine dx=sx per IE/Firefox/Safari e dx>sx per gli altri. Però i riquadri di fieldset, disegnati correttamente anche in IE/Firefox/Safari, risultavano più stretti dei campi.
 - I campi a larghezza definita, ma con la label sopra, devono essere scritti con <input> che segue <label> per avere la possibilità d'affiancarne più d'uno con la label unica sopra. */
form label.top { display: block; }   /* Il margine inferiore non distanzierebbe i campi full che sono dentro label, quindi nelle funzioni di disegno dei campi il contenuto di <label> è dentro un paragrafo <p> con la classe seguente, a cui si possono dare i margini voluti. Un'altra soluzione sarebbe stato riportare solo sui campi full un margine superiore, che non poteva andare anche nei campi nofull in quanto avrebbe disallineato campo e post-label. */
form p.top-label-nohelp { margin-bottom: 5px; }   /* Nelle funzioni di disegno dei campi, il paragrafo con questa classe viene generato solo se è assente l'immagine con il balloon di help, perché se è presente essa è già sufficiente per spaziare il titolo dal campo. Non è stato usato "line-height: 2em;", perché se la label la si vuole scrivere su più linee, con <br />, verrebbero spaziate anch'esse. */
/* --- Classi aggiuntive assegnate nella costruzione della pagina (in PHP) se viene rilevato il Browser indicato nella classe. --- */
/* Le classi seguenti vengono attribuite in relazione al Browser solo se il campo di cui questa è la label è a piena larghezza (input class="full").
   Oltre al fatto che in tal caso <input> viene scritto dentro <label> per poterne gestire la dimensione ed ovviare ad un difetto dei Browser (eccetto Opera). */
form label.top.ie, form label.top.firefox, form label.top.safari, form label.top.chrome { margin-right: 6px; }
form label.top.opera { margin-right: 0px; }
/* NOTA. Questa situazione crea un problema in Opera con i campi textarea, per i quali, se la label è composta da più parole va a capo con l'ultima scrivendola a sinistra del campo textarea che quindi eccede a destra.
         Dando un senso di blocco unico alla label, racchiudendo il suo testo, ad esempio, con un semplice tag di divisione o con un tag di paragrafo dotato di opportuna clesse che annulli i margini, si sistema Opera ma Firefox torna a fare il campo più lungo.
         Senza alcuna azione nell'HTML, più semplicemente, è stato dato il senso di blocco ai campi class="full" (input e textarea), che restano quindi su una riga autonoma con tutti i browser. */
/* --- Fine classi. --- */

/* Campi (testo) a destra della label. La lunghezza del campo può essere definita con l'attributo size nell'HTML. */
form.t input.line, form.t textarea.line, form.t select.line, form.b input.line, form.b textarea.line, form.b select.line, div.campo select.line { width: auto; vertical-align: top; margin: 0px 7px 7px 4px; }   /* Margine destro fornito per non avere campi (input e select) troppo vicini nel caso di affiancamento (es.: richiesta data) e pure per le eventuali label di destra per le note. */
/* Campi (testo) a destra della label, lunghi per l'intera larghezza del contenitore, una divisione di contenimento del campo che si estende a destra della label. */
form.t input.linefull, form.t textarea.linefull, form.t select.linefull, form.b input.linefull, form.b textarea.linefull, form.b select.linefull { width: 100%; vertical-align: top; margin: 0px 0px 7px 0px; }
/* Classe specifica per i campi ed i ListBox scritti in linea rispetto al flusso del documento, senza una divisione monolinea che li contenga (caso tipico: ListBox a scelta attiva-JavaScript). */
form input.line-inline, form select.line-inline { width: auto; vertical-align: top; margin: 0px 4px 0px 4px; }   /* Gli stessi margini verticali sono riportati in "button.inline", per allineare un eventuale bottone dopo il campo. Lasciato un margine sinistro uguale al destro, che serve per distanziare elementi eventuali seguenti, per mantenere il bottone centrato nel contenitore. Se Safari disallinea verticalmente il campo in relazione alle label provare ad azzerare i margini laterali. */
/* Larghezza delle celle/colonne delle tabelle usate per i campi multipli in linea. La larghezza deve essere proporzionata al contenuto, eccetto che per la prima cella che contiene la "label" del primo campo, che avrà una larghezza assegnatagli dal codice di programmazione con "style", più una colonna, in genere l'ultima, che usa lo spazio rimanente con il testo che può anche andare a capo. La versione non HTML5 usava una tabella a piena larghezza (width="100%") e (width="1%") in <td> e per l'ultima cella (width="*").
   E' stato usato "div.campo" come riferimento all'elemento contenitore, al posto di "form", per rendere valide le formattazioni seguenti anche per i campi di output (divisioni fluide che somigliano ai form). */
div.campo table.fields_intable { width: 100%; }   div.campo table.fields_intable td { width: auto; }   div.campo table.fields_intable td.remaining_width { width: 100%; text-align: left; padding-bottom: 0.7em; }   /* Sull'ultima nota, scritta nell'ultima cella della tabella, viene messo un padding-bottom per mantenerla distanziata quando viene scritta su più righe. */
/* Campi (testo) sotto la label, lunghi per l'intera larghezza del contenitore. */
form.t input.full, form.t textarea.full, form.b input.full, form.b textarea.full { width: 100%; margin-bottom: 12px; display: block; }   /* "display: block" è stato dato per un problema di Opera quando <input> è dentro <label> con i 'campi textarea class="full"' (vedere note precedenti in merito). Teoricamente è superfluo, ma male non fa. */
/* Campi (testo) sotto la label, con lunghezza definibile con l'attributo size nell'HTML. */
form.t input.nofull, form.t textarea.nofull, form.t select.nofull, form.b input.nofull, form.b textarea.nofull, form.b select.nofull { width: auto; vertical-align: top; margin: 0px 4px 12px 0px; }
/* Per gli attributi dei campi precedenti è stata usata la misura fissa in pixel per il margine inferiore, al posto di em, per ridurre gli arrotondamenti che sfasano di un pixel ogni tanto le sequenze verticali di campi (0.5em=>7px e 0.6em=>8px). */
form input.nofull.seqline, form select.nofull.seqline { margin-left: 4px; }   /* Classe aggiuntiva per i campi seguenti il primo sulla stessa linea, ma con la label sopra. Usata per spaziarli in modo equilibrato anche se c'è del testo tra loro. */
form.t select optgroup, form.b select optgroup { background-color: #B0E0E6; color: #696969; }   /* Colore di sfondo delle voci di testata/gruppo nei campi ListBox. Aggiunto il colore del testo per uniformare i browser (Opera faceva in bianco). Non usato lo sfondo grigio in quanto Safari preseleziona in grigio. (font-style e font-weight non hanno effetto). */
form.t select option, form.b select option { background-color: #FFFFFF; color: #000000; }   /* Colore delle voci/campi nei ListBox (standard nero su bianco). */
form.t select option.special, form.b select option.special { background-color: #F5DEB3; color: #8B4513; }   /* Colore delle voci/campi nei ListBox a cui vengono attribute funzioni speciali, tipo la prima voce con significato "nessun valore scelto". */
form.t select option.extra, form.b select option.extra { background-color: #F5FFFA; color: #006600; }   /* Colore delle voci/campi nei ListBox a cui vengono attribute funzioni particolari, tipo la voce per l'ordinamento alfabetico. */
form.t select option[disabled], form.b select option[disabled] { font-style: italic; background-color: #F5F5F5; color: #2F4F4F; }   /* Formato delle voci/campi disabilitate nei ListBox. */
form.t select option[selected], form.b select option[selected] { font-weight: bold; }   /* Evidenzia la voce/campo inzialmente selezionata nei ListBox. */
form select.safari { font-size: 130%; }   /* Classe specifica aggiuntiva usata per correggere un difetto del Browser Safari nella visualizzazione dei ListBox di una riga (per i dettagli vedere la funzione dei ListBox in JoLib_FuncForm.inc.php). */
/* Contenitore esterno e componenti per i campi di upload-file dotati della funzione drag&drop. */
.drop-field { margin: 0px; padding: 0px; }
.drop-area { border: 2px dashed #A9A9A9; border-radius: 15px; padding: 15px; background-color: white; }
.drop-area.highlight { border-color: purple; background-color: lemonchiffon;  }   /* Se la drop-area fosse colorata: backdrop-filter: brightness(1.1); */
.drop-area .header { pointer-events: none; margin-bottom: 1em; }
.drop-area .messageDeD p { pointer-events: none; font-weight: bold; font-style: normal; color: #FF6347; margin-top: 0.5em; }   /* grassetto + color-tomato */
.drop-field .infoDeD { padding: 0.6em 15px; border-left: 2px solid #A9A9A9; border-right: 2px solid #A9A9A9; background-color: #FFFFB3; }
.drop-field .infoDeD ol { margin: 0.4em 0px; padding-left: 2em; }   /* Con "padding-left: 0px" il numero sarebbe esterno, tutto a sinistra. */
.drop-field .progressDeD { padding: 0.6em 15px 12px 15px; border-left: 2px solid #A9A9A9; border-right: 2px solid #A9A9A9; background-color: #FFFFB3; }
.drop-field .progressDeD progress.odd { accent-color: royalblue; }    /* Cambia il colore standard generato dalla user-interface del Browser. */
.drop-field .progressDeD progress.even { accent-color: deepskyblue; } /* (Chrome 93 - Edge 93 - Firefox 92 - Opera 79 - Safari 15.4)          */
.drop-field .galleryFileDeD { padding: 0px 15px 5px 15px; border-left: 2px solid #A9A9A9; border-right: 2px solid #A9A9A9; background-color: #FFFFB3; }
.drop-field .galleryFileDeD div.preview { float: left; margin-right: 10px; margin-bottom: 10px; height: 120px; width: auto; position: relative; }   /* Tutti i tag seguenti vengono visualizzati in galleryFileDeD contenuti dentro questo tag <div class="preview">. "position: relative;" serve per posizionare eventuali elementi multipli al suo interno. */
.drop-field .galleryFileDeD img { height: auto; max-height: 100%; margin-right: 16px; }   /* In questo modo le immagini mantengono la proporzione, non eccedono l'altezza del loro contenitore <div> e se sono più piccole mantengono la loro altezza. Il margine destro serve per ospitare la "X" per la cancellazione. */
.drop-field .galleryFileDeD audio { width: 270px; margin: 40px 16px auto 0px; }   /* Affinché i comandi vengano mostrati nella loro interezza, serve almeno questa larghezza (tasto play/pause + barra di riproduzione + tempo riprodotto + tempo totale + mute + volume). */
.drop-field .galleryFileDeD video { min-width: 300px; height: 120px; border: thin solid black; margin-right: 16px; }   /* Affinché i comandi vengano mostrati nella loro interezza, serve almeno questa larghezza (tasto play/pause + barra di riproduzione + tempo riprodotto + tempo totale + mute + volume + schermo intero). */
.drop-field .galleryFileDeD p.preview { border: thin solid black; height: 40px; padding: 15px; margin: 25px 16px auto 0px; text-align: center; }
.drop-field .galleryFileDeD p.previewFont { border: thin solid black; height: 60px; padding: 15px; margin: 15px 16px auto 0px; text-align: center; }
.drop-field .resizeDeD { padding: 0.6em 15px; border-left: 2px solid #A9A9A9; border-right: 2px solid #A9A9A9; border-top: 2px solid #A9A9A9; background-color: #FFFFB3; }
.drop-field .endDeD { padding: 0.6em 15px; border-left: 2px solid #A9A9A9; border-right: 2px solid #A9A9A9; border-bottom: 2px solid #A9A9A9; border-radius: 0px 0px 15px 15px; background-color: #FFFFB3; }   /* Il bordo superiore viene aggiunto il PHP solo quando in questa divisione viene inserito il bottone di modifica. */

/* Stili disponibili per la visualizzazione dell'interfaccia JavaScript abbinata ai campi di input di tipo "data e ora". */
/*.DTP_default { display: flex; flex-direction: row; align-items: flex-start;   /* Flex container, gli elementi blocco contenuti vengono allineati orizzontalmente senza alcuna regola a loro attribuita. Si può ottenere lo stesso effetto assegnando alle tabelle "display: inline-table;", che le allinea già "top". Usando "display: inline-block; vertical-align: top;", che con accorgimenti potrebbe essere reso compatibile anche con Browser molto datati (IE 6-7), gli elementi <table> non vengono riconosciuti come tabelle e quindi si perde la possibilità di usare delle formattazioni CSS tipiche delle tabelle (es. "border-spacing"). */
div.DTP_default { border: 1px solid #808080; border-radius: 0.4em; padding: 0px 0.4em 0.3em 0.4em; background-color: #FFFFFF; font-family: "normal Verdana", Geneva, sans-serif; color: #000000; }
div.DTP_default.shadow-down { box-shadow: 8px 8px 5px #A9A9A9; }
div.DTP_default.shadow-up { box-shadow: 8px -8px 5px #A9A9A9; }
div.DTP_default table { border: none; border-collapse: separate; border-spacing: 4px; padding: 0px; }
div.DTP_default table.inline { display: inline-table; vertical-align: top; }
div.DTP_default table th { border: none; text-align: center; font-weight: normal; font-style: normal; font-variant: small-caps; font-family: "Trebuchet MS", Helvetica, sans-serif; color: #00589B; }
div.DTP_default table td { border: 2px solid transparent; box-sizing: border-box; border-radius: 6px; padding: 1px 3px; text-align: center; }   /* Lo spessore del bordo trasparente si aggiunge al padding, fintantoché non viene colorato e viene conteggiato in "width". */
div.DTP_default table.tab-secoli { width: 50px; }   /* 42 + 4x2 */
div.DTP_default table.tab-secoli td { background-color: gainsboro; }
div.DTP_default table.tab-decenni { width: 62px; }   /* 54 + 4x2 */
div.DTP_default table.tab-decenni td { background-color: lavender; }
div.DTP_default table.tab-anni td { background-color: thistle; }   /* La larghezza della tabella viene assegnata nell'HTML, a seconda che sia di una o due colonne. */
div.DTP_default table.tab-mesi { width: 152px; }   /* 70x2 + 4x3 */
div.DTP_default table.tab-mesi td { width: 50%; background-color: paleturquoise; padding-left: 4px; padding-right: 4px; }
div.DTP_default table.tab-mesi td.disabled { background-color: #E1F9F9; }   /* +63% chiaro. */
div.DTP_default table.tab-mesi td.disabled:hover { background-color: #E1F9F9 !important; cursor: default !important; }
div.DTP_default table.tab-giorni { width: 228px; }   /* 28x7 + 4x8 */
div.DTP_default table.tab-giorni td { width: 28px; background-color: palegreen; padding-left: 0px; padding-right: 0px; }
div.DTP_default table.tab-giorni td.disabled { color: dimgray; background-color: #D9FED9; }   /* +63% chiaro. */
div.DTP_default table.tab-giorni td.disabled:hover { background-color: #D9FED9 !important; cursor: default !important; }
div.DTP_default table.tab-giorni td.sabato { background-color: #81D581; }   /* -15% scuro. */
div.DTP_default table.tab-giorni td.domenica { background-color: #72BC72; }   /* -25% scuro. */
div.DTP_default table.tab-giorni td.today { border-color: blue; }   /* Questo colore del bordo è più specifico di quello assegnato alle celle selezionate "td.cell-sel", perché riguarda la tabella "table.tab-giorni" e non genericamente "table". Quindi, se si seleziona la data odierna, avrà il bordo di questo colore. */
div.DTP_default table.tab-outvalInsDate { background-color: transparent; width: 160px; }
div.DTP_default table.tab-outvalInsTime { background-color: transparent; }
div.DTP_default table td span.inputSelectedDate, div.DTP_default table td span.inputSelectedTime { font-weight: bold; color: red; }
div.DTP_default table.tab-ore { background-color: paleturquoise; border-radius: 6px; margin: 12px 0px 6px 0px; padding: 0px; border-spacing: 4px; width: 724px; }
div.DTP_default table.tab-ore td,
	div.DTP_default table.tab-minuti td,
	div.DTP_default table.tab-subminuti td,
	div.DTP_default table.tab-secondi td,
	div.DTP_default table.tab-subsecondi td
		{ padding-left: 0px; padding-right: 0px; font-family: "Trebuchet MS", Helvetica, sans-serif; }
div.DTP_default table.tab-ore td.am-nr { width: 26px; background-color: darkturquoise; }
div.DTP_default table.tab-ore td.pm-nr { width: 26px; background-color: darkturquoise; }
div.DTP_default table.tab-ore td.am { background-color: #DCDCDC; }
div.DTP_default table.tab-ore td.pm { background-color: #C0C0C0; }
div.DTP_default table.tab-minuti { background-color: paleturquoise; border-radius: 6px; margin: 2px; padding: 0px; border-spacing: 0px; width: 720px; }   /* Se non viene assegnata la dimensione alla tabella, non vengono rispettate le dimensioni assegnate poi alle colonne. */
div.DTP_default table.tab-subminuti { background-color: transparent; margin: 2px; padding: 0px; border-spacing: 0px; width: 720px; }
div.DTP_default table.tab-minuti td.minuti { width: 20px; background-color: darkturquoise; }
div.DTP_default table.tab-subminuti td.minuti { width: 20px; background-color: #B1DFFC; }   /* +35% chiaro di Light sky blue. */
div.DTP_default table.tab-secondi { background-color: paleturquoise; border-radius: 6px; margin: 2px; padding: 0px; border-spacing: 0px; width: 720px; }   /* Se non viene assegnata la dimensione alla tabella, non vengono rispettate le dimensioni assegnate poi alle colonne. */
div.DTP_default table.tab-subsecondi { background-color: transparent; margin: 2px; padding: 0px; border-spacing: 0px; width: 720px; }
div.DTP_default table.tab-secondi td.secondi { width: 20px; background-color: darkturquoise; }
div.DTP_default table.tab-subsecondi td.secondi { width: 20px; background-color: #DBF0FE; }   /* +70% chiaro di Light sky blue. */
div.DTP_default table.tab-secoli td:hover,
	div.DTP_default table.tab-decenni td:hover
		{ background-color: mistyrose; cursor: pointer; }
div.DTP_default table.tab-anni td:hover,
	div.DTP_default table.tab-mesi td:hover,
	div.DTP_default table.tab-giorni td:hover,
	div.DTP_default table.tab-ore td.am-nr:hover,
	div.DTP_default table.tab-ore td.pm-nr:hover,
	div.DTP_default table.tab-minuti td.minuti:hover,
	div.DTP_default table.tab-subminuti td.minuti:hover,
	div.DTP_default table.tab-secondi td.secondi:hover,
	div.DTP_default table.tab-subsecondi td.secondi:hover
		{ background-color: yellow; cursor: pointer; }
div.DTP_default table.tab-secoli td.cell-sel, div.DTP_default table.tab-decenni td.cell-sel { background-color: mistyrose !important; }
div.DTP_default table td.cell-sel { background-color: yellow !important; color: #00589B !important; border-color: hotpink; }
div.DTP_default table td.cell-sel:hover { cursor: default !important; }

div table.tab-minuti td.space1,
	div table.tab-subminuti td.space1,
	div table.tab-secondi td.space1,
	div table.tab-subsecondi td.space1
		{ width: 10px; background-color: transparent; }
div table.tab-minuti td.space2,
	div table.tab-subminuti td.space2,
	div table.tab-secondi td.space2,
	div table.tab-subsecondi td.space2
		{ width: 20px; background-color: transparent; }
div table.tab-minuti td.space3,
	div table.tab-subminuti td.space3,
	div table.tab-secondi td.space3,
	div table.tab-subsecondi td.space3
		{ width: 30px; background-color: transparent; }
div table.tab-minuti td.space4,
	div table.tab-subminuti td.space4,
	div table.tab-secondi td.space4,
	div table.tab-subsecondi td.space4
		{ width: 40px; background-color: transparent; }
div table.tab-minuti td.space4-5,
	div table.tab-subminuti td.space4-5,
	div table.tab-secondi td.space4-5,
	div table.tab-subsecondi td.space4-5
		{ width: 45px; background-color: transparent; }
div table.tab-minuti td.space5,
	div table.tab-subminuti td.space5,
	div table.tab-secondi td.space5,
	div table.tab-subsecondi td.space5
		{ width: 50px; background-color: transparent; }
div table.tab-minuti td.space5-5,
	div table.tab-subminuti td.space5-5,
	div table.tab-secondi td.space5-5,
	div table.tab-subsecondi td.space5-5
		{ width: 55px; background-color: transparent; }
/* FINE --- Stili disponibili per la visualizzazione dell'interfaccia JavaScript abbinata ai campi di input di tipo "data e ora". */

/* Radio/checkbox (scritti dentro label) su un'unica linea.
   Da usare dentro un fieldset (riquadro) con una legend (sopra) esplicativa per il gruppo.
   Oppure nei form con le label dei campi a sinistra per avere i radio/checkbox dietro il loro titolo di gruppo (label aggiuntiva autonoma), titolo con larghezza dichiarata ed allineato a destra come le label degli altri campi del form. */
/* Label a larghezza definita a sinistra dei radio/checkbox. */
form label.lineradio { float: left; text-align: right; line-height: 1.96em; }   /* Allinea meglio la label scritta sulla stessa linea di una sequenza orizzontale di radio-button/checkbox. */
/* Agendo con uno spostamento indotto dal margine superiore (abbinato ai margini della divisione di contenimento per distanziare un poco le righe), si ha un maggiore disallineamento in IE variando la dimensione del testo. */
/* Radio/checkbox in sequenza orizzontale. */
form span.nowrap { white-space: nowrap; display: -moz-inline-stack; display: inline-block; *display: inline; }   /* Elemento di contenimento per il radio/checkbox e la sua label, usato per impedire che vengano separati andando a capo in modo inopportuno. Per display: inline-block; cross-browser: "display: -moz-inline-stack;" è per Firefox 2 e meno, IE 7 e meno necessiterebbero "*display: inline; zoom: 1;" ma siccome "zoom: 1;" è segnalato come "non standard" nei moderni Browser e sarebbe da sostituire con "transform: scale(1); transform-origin: 0 0;", che però non viene riconosciuto in IE7, è stata eliminata la compatibilità con IE7. */
form label.radio_o { margin-right: 1.4em; vertical-align: baseline; line-height: 1.96em; }   /* Label a destra del radio/checkbox (descrittiva del valore). */
form label.radio_o.legend { margin-right: -5px; }   /* Label a sinistra dei radio/checkbox, che inizia dal bordo sinistro (non a larghezza definita). */
form input.radio { margin: 0px 5px 0px 5px; position: relative; }   /* Il margine destro determina la distanza tra il radio-button/checkbox e la scritta (IE di default distanzia di più degli altri di circa 4 px, a sinistra e destra). */
form div.check-dx { float: right; text-align: right; vertical-align: top; margin-top: 1.025em; }   /* Checkbox (opzionale) a destra del bottone di conferma del form. Fuori dal fieldset nei form bordati. */
form.b div.check-dx { margin-top: 0.225em; padding-right: 21px; }   /* Non usato margin-right per il bug (IE) che raddoppia i margini concordi al float di un elemento. Soluzioni: padding; div aggiuntivo; dichiarare display:inline, non ha effetti se non sistemare il bug. */
/* --- Classi aggiuntive assegnate nella costruzione della pagina (in PHP) se viene rilevato il Browser indicato nella classe. --- */
form label.lineradio.ie7 { line-height: 2.1em; }   /* Allinea meglio con la dimensione standard del testo, se però questo viene esteso agli altri browser la maggiore altezza della label rispetto al campo sposta verso destra il campo nella riga seguente. */
form label.lineradio.ie8 { line-height: 2em; }
/*  */
form input.radio.ie7 { margin: 0px 2px 0px 1px; top: 0.15em; }
form input.radio.ie8 { margin: 0px 2px 0px 2px; top: 0.24em; }
form input.radio.firefox[type=radio] { top: 0.15em; }   /* Sposta solo i radio-button, non i checkbox. */
form input.radio.firefox[type=checkbox] { top: 0.1em; }   /* Sposta solo i checkbox, non i radio-button. Ad un certo punto delle versioni ho notato che era meglio (-0.1), prima e dopo ok (0.1). */
form input.radio.safari[type=radio] { top: 0.1em; }   /* Sposta solo i radio-button, non i checkbox. */
/* form input.radio.chrome { top: 0.25em; }   Vecchio Chrome */
form input.radio.chrome[type=radio] { top: 0.25em; }   /* Sposta solo i radio-button, non i checkbox. */
/*  */
form.t div.check-dx.ie7 { margin-top: 0.75em; }
form.t div.check-dx.ie8 { margin-top: 0.877em; }
form.t div.check-dx.safari { margin-top: 0.95em; }
form.b div.check-dx.ie7 { margin-top: -0.05em; }
form.b div.check-dx.ie8 { margin-top: 0.08em; }
form.b div.check-dx.chrome { margin-top: 0.25em; }
form div.check-dx input.ie { margin: 0px 2px 0px 2px; top: 0.229em; }
form div.check-dx input.chrome { top: 0.25em; }
/* --- Fine classi. --- */

/* Contenitore/riquadro di radio/checkbox con il loro titolo di gruppo (usabile in entrambi i tipi di form). */
fieldset.radio-box { margin-top: 0.3em; margin-bottom: 0.77em; border: 1px solid #C0C0C0; padding: 0px 15px 0.8em 15px; }   /* Questi riquadri sono sempre a piena larghezza, quindi sono stati distanziati un poco di più in entrambi i tipi di form. Sia nel margine inferiore, che aggiungendovi un margine superiore per abbassare la loro legend dal campo che li precede. */
fieldset.radio-box_v { padding-bottom: 1.28em; }
fieldset.radio-box_js { margin-top: -1.1em; }
legend.radio-box { font-size: 117%; margin-left: 0.25em; padding-bottom: 0.079em; font-weight: normal; font-style: normal; font-variant: small-caps; }   /* Tolta l'attribuzione di un colore alla scritta, così si può usare anche una classe generica di assegnazione di un colore quando si chiama la funzione di disegno del box. */
/* --- Classi aggiuntive assegnate nella costruzione della pagina (in PHP) se viene rilevato il Browser indicato nella classe. --- */
legend.radio-box.ie7 { margin-left: -0.25em; }
legend.radio-box.safari, legend.radio-box.chrome { margin-left: 0.35em; }
legend.radio-box.opera { margin-left: 0.4em; }
/* --- Fine classi. --- */

/* Radio/checkbox in verticale sotto il loro titolo (usabili in entrambi i tipi di form). */
form div.radio_v { padding-top: 0.225em; }
form label.radio_v { margin-left: 0.2em; }
/* Alle righe dei radio/checkbox in verticale bisogna dare un attributo aggiuntivo "margin-left: <nr>em", per definirne la larghezza per portare i bottoni ad allinearsi verticalmente con i campi nella struttura label e campo sulla stessa riga. L'assenza determina un allineamento verticale a sinistra con margine di circa 1.3em.
   Anzichè farlo nel file CSS che dovrebbe prevedere i diversi valori desiderati con una classe aggiuntiva, si può definire tale classe in un foglio di stile incorporato nell'HTML dove c'è il form, oppure
   in un foglio in linea (attributo style) per ogni riga definita nel form (scelta questa soluzione per i form generati dalle funzioni PHP in JoLib_FuncForm.inc.php).
/* --- Classi aggiuntive assegnate nella costruzione della pagina (in PHP) se viene rilevato il Browser indicato nella classe. --- */
form div.radio_v.firefox, form div.radio_v.opera, form div.radio_v.safari, form div.radio_v.chrome { padding-top: 0.5em; }

/* Classi che è possibile aggiungere con JavaScript alle righe/elementi da evidenziare quando il cursore gli passa sopra. */
form span.js-evid1, form div.js-evid1 { background-color: #00FFCC; }   /* Colore evidente (usato per le righe delle tabelle). */
form span.js-evid2, form div.js-evid2 { background-color: #C0C0C0; }   /* Colore elegante. */
form span.js-evid3, form div.js-evid3 { color: #FF1493; }   /* Colore evidente. */
form span.js-evid4, form div.js-evid4 { color: #A0522D; }   /* Colore elegante. */
/* --- Fine classi. --- */

/* ATTENZIONE Opera CREA ERRORI DI VISUALIZZAZIONE SE UN COMMENTO HTML E' POSTO DIETRO (SULLA STESSA LINEA) A <fieldset> NON PARE AVERE PROBLEMI CON <div>. */

/* Contenitore/riquadro per raggruppare campi nei form e nei report-form (usabile in tutti i tipi di form) [valgono le stesse note della classe radio-box]. */
fieldset.campi-box { margin-top: 0.88em; margin-bottom: 0.77em; padding: 0px 15px 0.64em 15px; border-width: 2px; border-style: solid; }
legend.campi-box { font-size: 117%; margin-left: 0px; margin-right: 0px; padding-left: 0.4em; padding-right: 0.4em; padding-bottom: 0.238em; font-weight: normal; font-style: normal; font-variant: small-caps; }   /* "margin-bottom" funziona solo su IE, Firefox lo interpreta come padding (spostando anche in alto la label rispetto al bordo del fieldset), gli altri Browser lo ignorano. */
legend.campi-box span { font-size: 72%; text-align: left; position: relative; top: -0.2em; padding: 0px 0px 2px 1.6em; font-weight: normal; font-style: normal; font-variant: normal; border: none; }
form.t fieldset.campi-box.colorset-t1, div.t div.fieldset-like.colorset-t1 { border-color: #3CB371; }
form.t fieldset.campi-box.colorset-t2, div.t div.fieldset-like.colorset-t2 { border-color: #32CD32; }
form.t fieldset.campi-box.colorset-t3, div.t div.fieldset-like.colorset-t3 { border-color: #DAA520; }
form.t fieldset.campi-box.colorset-t4, div.t div.fieldset-like.colorset-t4 { border-color: #A9A9A9; }
form.t fieldset.campi-box.colorset-b1, div.t div.fieldset-like.colorset-b1 { border-color: #FF1493; background-color: #FFE4E1; }
form.t fieldset.campi-box.colorset-b2, div.t div.fieldset-like.colorset-b2 { border-color: #FA8072; background-color: #FFDAB9; }
form.b fieldset.campi-box.colorset-t1, div.b div.fieldset div.fieldset-like.colorset-t1, div.b-t div.fieldset div.fieldset-like.colorset-t1 { border-color: #7B68EE; }
form.b fieldset.campi-box.colorset-t2, div.b div.fieldset div.fieldset-like.colorset-t2, div.b-t div.fieldset div.fieldset-like.colorset-t2 { border-color: #32CD32; }
form.b fieldset.campi-box.colorset-t3, div.b div.fieldset div.fieldset-like.colorset-t3, div.b-t div.fieldset div.fieldset-like.colorset-t3 { border-color: #DAA520; }
form.b fieldset.campi-box.colorset-t4, div.b div.fieldset div.fieldset-like.colorset-t4, div.b-t div.fieldset div.fieldset-like.colorset-t4 { border-color: #A9A9A9; }
form.b fieldset.campi-box.colorset-b1, div.b div.fieldset div.fieldset-like.colorset-b1, div.b-t div.fieldset div.fieldset-like.colorset-b1 { border-color: #FF1493; background-color: #FFE4E1; }
form.b fieldset.campi-box.colorset-b2, div.b div.fieldset div.fieldset-like.colorset-b2, div.b-t div.fieldset div.fieldset-like.colorset-b2 { border-color: #FA8072; background-color: #FFDAB9; }
form.t legend.campi-box.colorset-t1, div.t div.fieldset-like span.title.colorset-t1, div.t div.fieldset-like span.titlelink.colorset-t1 { color: #2E8B57; }
form.t legend.campi-box.colorset-t2, div.t div.fieldset-like span.title.colorset-t2, div.t div.fieldset-like span.titlelink.colorset-t2 { color: #228B22; }
form.t legend.campi-box.colorset-t3, div.t div.fieldset-like span.title.colorset-t3, div.t div.fieldset-like span.titlelink.colorset-t3 { color: #D2691E; }
form.t legend.campi-box.colorset-t4, div.t div.fieldset-like span.title.colorset-t4, div.t div.fieldset-like span.titlelink.colorset-t4 { color: #696969; }
form.t legend.campi-box.colorset-b1, div.t div.fieldset-like span.title.colorset-b1, div.t div.fieldset-like span.titlelink.colorset-b1 { color: #C71585; background-color: #FFCCFF; }
form.t legend.campi-box.colorset-b2, div.t div.fieldset-like span.title.colorset-b2, div.t div.fieldset-like span.titlelink.colorset-b2 { color: #A0522D; background-color: #FFCC99; }
form.b legend.campi-box.colorset-t1, div.b div.fieldset div.fieldset-like span.title.colorset-t1, div.b div.fieldset div.fieldset-like span.titlelink.colorset-t1, div.b-t div.fieldset div.fieldset-like span.title.colorset-t1, div.b-t div.fieldset div.fieldset-like span.titlelink.colorset-t1 { color: #6A5ACD; }
form.b legend.campi-box.colorset-t2, div.b div.fieldset div.fieldset-like span.title.colorset-t2, div.b div.fieldset div.fieldset-like span.titlelink.colorset-t2, div.b-t div.fieldset div.fieldset-like span.title.colorset-t2, div.b-t div.fieldset div.fieldset-like span.titlelink.colorset-t2 { color: #228B22; }
form.b legend.campi-box.colorset-t3, div.b div.fieldset div.fieldset-like span.title.colorset-t3, div.b div.fieldset div.fieldset-like span.titlelink.colorset-t3, div.b-t div.fieldset div.fieldset-like span.title.colorset-t3, div.b-t div.fieldset div.fieldset-like span.titlelink.colorset-t3 { color: #D2691E; }
form.b legend.campi-box.colorset-t4, div.b div.fieldset div.fieldset-like span.title.colorset-t4, div.b div.fieldset div.fieldset-like span.titlelink.colorset-t4, div.b-t div.fieldset div.fieldset-like span.title.colorset-t4, div.b-t div.fieldset div.fieldset-like span.titlelink.colorset-t4 { color: #696969; }
form.b legend.campi-box.colorset-b1, div.b div.fieldset div.fieldset-like span.title.colorset-b1, div.b div.fieldset div.fieldset-like span.titlelink.colorset-b1, div.b-t div.fieldset div.fieldset-like span.title.colorset-b1, div.b-t div.fieldset div.fieldset-like span.titlelink.colorset-b1 { color: #C71585; background-color: #FFCCFF; }
form.b legend.campi-box.colorset-b2, div.b div.fieldset div.fieldset-like span.title.colorset-b2, div.b div.fieldset div.fieldset-like span.titlelink.colorset-b2, div.b-t div.fieldset div.fieldset-like span.title.colorset-b2, div.b-t div.fieldset div.fieldset-like span.titlelink.colorset-b2 { color: #A0522D; background-color: #FFCC99; }
/* NOTA. Campi class="full". Prima dell'applicazione del margine destro per risolvere il problema nei form, quando venivano messi in un riquadro 'campi-box', lo facevano estendere a destra.
         Dopo, l'estensione era limitata ad un allungamento anomalo, a destra, del bordo superiore del riquadro, solo con IE, e la loro larghezza pareva risentire della riduzione applicata a livello superiore se non si dava un esplicito width alla label contenitiva del campo.
         L'estensione del bordo superiore è eliminabile con width:99.6% (o meno) assegnato alla label contenitiva o width:99% al campo o dichiarando insieme per la label { width: 100%; margin-right: 0px; } che riporta l'allungamento eccessivo del campo nel riquadro ma toglie quello del bordo superiore del riquadro, che pare prodotto dalla dichiarazione di margine destro assunta dalla label per la dichiarazione generale fuori dal riquadro. */
fieldset.campi-box label.top.ie { width: 99.5%; }   /* Per risolvere il problema è introdotta questa classe solo per IE e solo per le label superiori dei campi solo quando sono dentro un riquadro 'campi-box'. Il campo è abbastanza equilibrato, torna fuori l'eccedenza di 6px ma è ridotta dal width. */
/* Per "label.top" viene sempre aggiunta una classe con il nome del browser (vedere sopra), quindi questa dichiarazione ha effetto automaticamente quando "label.top" è dentro "fieldset.campi-box". */

/* Riquadro <div> per distinguere un gruppo di campi nei form e nei report-form (usabile in tutti i tipi di form). */
form.b div.quadro1, div.b div.quadro1 { padding: 7px 7px 0px 7px; margin-bottom: 7px; border-radius: 8px; box-shadow: 0px 3px 6px 0px rgba(0,0,0,0.2), 0px 5px 15px 0px rgba(0,0,0,0.19); background-color: #FFE4E1; }
form.b div.quadro2, div.b div.quadro2 { padding: 7px 7px 0px 7px; margin-bottom: 7px; border-radius: 8px; box-shadow: 0px 3px 6px 0px rgba(0,0,0,0.2), 0px 5px 15px 0px rgba(0,0,0,0.19); background-color: #FFDAB9; }

.linea-separatrice { background-color: #CCFFCC; color: #008000; font-size: 125%; margin: 1em 0em 0.4em; padding: 0.4em 3em; }   /* Classe da usare in genere per un paragrafo che funge da separatore visivo nei form e titolo per quanto segue. */

/* Evidenzia (oltre che grassetto) un segnale riportato nel form. In genere (*) per indicare i campi obbligatori. */
form.t b, form.b b { color: #FF8C00; }
/* Classi/stile aggiuntivo da applicare alle singole label dei campi per evidenziarle, oppure velarle visivamente, in rapporto alle altre che non lo hanno. Usabile ad esempio per indicare i campi obbligatori o quelli non obbligatori. */
form.t label.evid, form.t legend.evid, form.b label.evid, form.b legend.evid, span[lang="JoID-01"] { font-weight: bold; font-style: normal; font-variant: normal; }   /* E' stato aggiunto il normale <span> con un attributo fittizio, per riportare il medesimo stile come esempio in testa al form, nelle spiegazioni. */
form.t label.unevid, form.t legend.unevid, form.b label.unevid, form.b legend.unevid { font-weight: normal; font-style: italic; font-variant: normal; }

/* Bottone di conferma del form, in genere in coda, in una riga autonoma. Fuori dal fieldset nei form bordati. Questa classe non viene aggiunta ai bottoni "in linea" con un campo. */
form.t button.std { margin: 0.8em 4px; }   /* Imposta dei margini laterali pari a quelli dati ai campi di input per distanziarli dal testo in linea prima e dopo. Per mantenere l'allineamento verticale a sinistra del bottone con i campi. */
form.b button.std { margin: 0px 23px 0.96em 23px; }   /* Annulla il margine superiore per il bottone, in quanto il fieldset bordato ha già un margine inferiore per tenere distanziati eventuali fieldset in sequenza. Aggiunge poi un margine laterale pari all'ampiezza del bordino chiaro che circonda il fieldset (4) più il padding (15) del fieldset, da cui il bottone è fuori. */
form.b fieldset button.std { margin: 0.8em; }   /* Aggiunge un margine superiore per il bottone quando è dentro il fieldset. */
form.t button.bottone-vicino, form.b fieldset button.bottone-vicino { margin-top: 0px; }   /* Azzera il margine superiore con una classe aggiuntiva da usare quando si vuole avvicinare il bottone al campo superiore. */
/* Classe specifica per i bottoni scritti in linea rispetto al flusso del documento (caso tipico: form semplice con un campo e bottone a seguire). */
form span.inline_butt { vertical-align: top; margin-top: 0px; margin-bottom: 0px; margin-right: 0px; position: relative; top: -3px; }   /* Sono riportati gli stessi margini verticali dei campi scritti in linea rispetto al flusso del documento (form input.line-inline, form select.line-inline), per ottenere un corretto allineamento degli elementi. Più uno spostamento verso l'alto per allineare i bottoni di cancellazione dei campi-singoli-multipli, che sono dentro (label class="linelist") e (div class="campo"). */
form legend span.inline_butt { top: 0px; font-size: 94%; }   /* Spostamento per allineare i bottoni di cancellazione dei campi-record-multipli (ogni record è in un fieldset con legend). Assestamento della dimensione, perché legend è +117 poi span è -72. */
form span.inline_butt button { vertical-align: top; margin: 0px; }
/* --- Classi aggiuntive assegnate nella costruzione della pagina (in PHP) se viene rilevato il Browser indicato nella classe. --- */
form span.inline_butt.ie8 { top: -1px; }
/* Correzioni applicate quando il bottone è dopo un ListBox (con o senza post-label). */
form select.line-inline+span.inline_butt.ie8, form label.post-linelist+span.inline_butt.ie8 { top: -2px; }
form select.line-inline+span.inline_butt.ie7, form select.line-inline+span.inline_butt.opera, form select.line-inline+span.inline_butt.chrome,
form label.post-linelist+span.inline_butt.ie7, form label.post-linelist+span.inline_butt.opera, form label.post-linelist+span.inline_butt.chrome { top: -1px; }
/* Correzioni applicate quando il bottone è dopo del testo, all'interno di un tag <p>. */
form p>span.inline_butt { top: -3px; }
/* --- Fine classi. --- */
/* --- Bottoni con aspetto alternativo a quello standard, dotati di effetto "hover". --- */
.button-green { color: black; background-color: #97D19A; border: 2px solid #449E48; border-radius: 0.8em; -moz-box-shadow: 5px 5px 3px #A9A9A9; -webkit-box-shadow: 5px 5px 3px #A9A9A9; box-shadow: 5px 5px 3px #A9A9A9; padding: 0.25em 0.8em; text-align: center; text-decoration: none; -webkit-transition-duration: 0.3s; -moz-transition-duration: 0.3s; -o-transition-duration: 0.3s; transition-duration: 0.3s; }
.button-green:hover { background-color: #C6E5F0; border: 2px solid #81B8CB; -moz-box-shadow: 4px 4px 2px #9EB7C0 inset; -webkit-box-shadow: 4px 4px 2px #9EB7C0 inset; box-shadow: 4px 4px 2px #9EB7C0 inset; }   /* L'ombra interna è stata fatta scurendo del 20% il colore di sfondo. */
.button-blue { color: black; background-color: #8FCCE1; border: 2px solid #1294BF; border-radius: 0.8em; -moz-box-shadow: 5px 5px 3px #A9A9A9; -webkit-box-shadow: 5px 5px 3px #A9A9A9; box-shadow: 5px 5px 3px #A9A9A9; padding: 0.25em 0.8em; text-align: center; text-decoration: none; -webkit-transition-duration: 0.3s; -moz-transition-duration: 0.3s; -o-transition-duration: 0.3s; transition-duration: 0.3s; }
.button-blue:hover { background-color: #CAE8CB; border: 2px solid #88BC8B; -moz-box-shadow: 4px 4px 2px #A2BAA2 inset; -webkit-box-shadow: 4px 4px 2px #A2BAA2 inset; box-shadow: 4px 4px 2px #A2BAA2 inset; }   /* L'ombra interna è stata fatta scurendo del 20% il colore di sfondo. */
.button-green.vicino, .button-blue.vicino { margin-top: 0px; }   /* Azzera il margine superiore con una seconda classe, per avvicinare il bottone al campo superiore. */
.button-reddel { color: white; font-family: Verdana, Geneva, sans-serif; font-size: 1.5em; font-weight: bold; line-height: 0.8; background-color: #FF6600;
	border: 2px solid #FF0000; border-radius: 1.55em; -moz-box-shadow: 3px 3px 2px 1px #A9A9A9; -webkit-box-shadow: 3px 3px 2px 1px #A9A9A9; box-shadow: 3px 3px 2px 1px #A9A9A9;
	padding: 0.25em 0.3em; text-align: center; text-decoration: none;
	-webkit-transition-duration: 0.3s; -moz-transition-duration: 0.3s; -o-transition-duration: 0.3s; transition-duration: 0.3s; }
.button-reddel:hover { background-color: #FF0000; border: 2px solid #0000FF;
	-moz-box-shadow: 3px 3px 2px 1px #87CEFA; -webkit-box-shadow: 3px 3px 2px 1px #87CEFA; box-shadow: 3px 3px 2px 1px #87CEFA; }
.button-reddel.small { font-size: 1em; }   /* Classe aggiuntiva per visualizzare il bottone di cancellazione più piccolo. */
.button-reddel.big { font-size: 2.4em; }   /* Classe aggiuntiva per visualizzare il bottone di cancellazione più grande. */
.button-green-low { color: black; background-color: #CCFF99; border: 2px solid #A3CC7A; border-radius: 0.4em; padding: 0.1em 0.6em 0.25em 0.6em; text-align: center; text-decoration: none; -webkit-transition-duration: 0.3s; -moz-transition-duration: 0.3s; -o-transition-duration: 0.3s; transition-duration: 0.3s; }
.button-green-low:hover { background-color: #FFFF66; }
.button-blue-low { color: black; background-color: #D1F5F5; border: 2px solid #A7C4C4; border-radius: 0.4em; padding: 0.1em 0.6em 0.25em 0.6em; text-align: center; text-decoration: none; -webkit-transition-duration: 0.3s; -moz-transition-duration: 0.3s; -o-transition-duration: 0.3s; transition-duration: 0.3s; }
.button-blue-low:hover { background-color: #FFFF66; }
.button-rosachiaro { color: black; background-color: mistyrose; border: 2px solid; border-color: #DDDDDD #979797 #979797 #DDDDDD; border-radius: 0.4em; -webkit-transition-duration: 0.3s; -moz-transition-duration: 0.3s; -o-transition-duration: 0.3s; transition-duration: 0.3s; }
.button-rosachiaro:hover { background-color: navajowhite; border: 2px solid; border-color: #979797 #DDDDDD #DDDDDD #979797; }
.button-rosa { color: black; background-color: pink; border: 2px solid; border-color: #DDDDDD #979797 #979797 #DDDDDD; border-radius: 0.4em; -webkit-transition-duration: 0.3s; -moz-transition-duration: 0.3s; -o-transition-duration: 0.3s; transition-duration: 0.3s; }
.button-rosa:hover { background-color: burlywood; border: 2px solid; border-color: #979797 #DDDDDD #DDDDDD #979797; }
.button-salmone { color: black; background-color: lightsalmon; border: 2px solid; border-color: #CCCCCC #666666 #666666 #CCCCCC; border-radius: 0.4em; -webkit-transition-duration: 0.3s; -moz-transition-duration: 0.3s; -o-transition-duration: 0.3s; transition-duration: 0.3s; }
.button-salmone:hover { background-color: tan; border: 2px solid; border-color: #666666 #CCCCCC #CCCCCC #666666; }
/* --- Fine bottoni con aspetto alternativo. --- */
form div.center { text-align: center; }   /* Classe per centrare i contenuti di qualsiasi divisione usata nei form. */
form.t button span.sub, form.b button span.sub { font-size: 70%; }   /* Didascalia in piccolo da mettere dopo la scritta principale del bottone (con Safari la scritta è un poco più piccola degli altri Browser). */

input.required-bg, textarea.required-bg, select.required-bg, span.required-bg { background-color: #CCFFFF; }   /* Evidenzia campi obbligatori. */
input.optional-bg, textarea.optional-bg, select.optional-bg, span.optional-bg { background-color: #CCFFCC; }   /* Evidenzia campi opzionali. */
input.error-bg, textarea.error-bg, select.error-bg, span.error-bg { background-color: #FFFF00; }   /* Evidenzia campi con errori. Tonalità chiara di arancione usabile=#FFD17D, sfondo giallo dei messaggi di errore=#FAFAD2 (troppo chiaro), giallo brillante=FFFF00. */

/* Piccoli bottoni da usare dietro i ListBox attivi per consentire l'invio anche senza JavaScript. Hanno un posizionamento personalizzato per questo scopo. */
/* Bottone con il carattere ">>" al posto del testo. */
form button.go { width: 31px; margin: 0px; vertical-align: middle; position: relative; }   /* Dimensione per centrare l'immagine in tutti i browser, che senza width farebbero il bottone di diverse larghezze. */
form button.go.ie7 { top: -1px; margin-left: 4px; }
form button.go.ie8 { top: -2px; }
form button.go.opera, form button.go.chrome { top: -1px; }
form button.go span  { font: 2em arial, sans-serif; font-weight: bold; color: #4682B4; vertical-align: bottom; line-height: 0.6em; position: relative; }   /* Colore: Steelblue. */
form button.go span.ie7 { top: -9px; left: -2px; }
form button.go span.ie8 { top: -2px; left: -3px; }
form button.go span.firefox, form button.go span.safari { top: -2px; }
form button.go span.opera { top: -2px; left: -2px; }
form button.go span.chrome { top: -3px; left: -2px; }
/* Classi alternative di posizionamento per il bottone precedente qualora sia "font-size:85%"/class="text-small2" (barra comandi del pager). */
form button.go-s2 { width: 28px; margin: 0px; vertical-align: middle; position: relative; }
form button.go-s2.ie7 { top: -1px; margin-left: 4px; }
form button.go-s2.ie8 { top: -2px; }
form button.go-s2.opera, form button.go-s2.chrome { top: -1px; }
form button.go-s2 span  { font: 1.92em arial, sans-serif; font-weight: bold; color: #4682B4; vertical-align: bottom; line-height: 0.6em; position: relative; }
form button.go-s2 span.ie7 { top: -9px; left: -2px; }
form button.go-s2 span.ie8, form button.go-s2 span.chrome { top: -3px; left: -3px; }
form button.go-s2 span.firefox { top: -2px; }
form button.go-s2 span.opera { top: -2px; left: -2px; }
form button.go-s2 span.safari { top: -1px; }

/* Bottone con dentro una piccola immagine (">") al posto del testo. */
form button.pic { width: 24px; height: 22px; margin: 0px; vertical-align: middle; position: relative; }
form button.pic.ie7 { top: 0px; margin-left: 4px; }
form button.pic.ie8, form button.pic.opera, form button.pic.chrome { top: -1px; }
form button.pic img, form button.pic-s2 img { position: absolute; }
form button.pic img.ie7 { top: 3px; left: 6px; }
form button.pic img.ie8 { top: -4px; left: 6px; }
form button.pic img.firefox9 { top: -6px; left: -2px; }   /* Da verificare che fino alla v9 compresa vada bene questo posizionamento. Per la v13 va bene quello di Chrome. */
form button.pic img.chrome, form button.pic img.firefox { top: 4px; left: 7px; }
form button.pic img.opera { position:relative; top: -1px; left: -1px; }
form button.pic img.safari { top: 6px; left: 7px; }
/* Classi alternative di posizionamento per il bottone precedente qualora sia "font-size:85%"/class="text-small2". */
form button.pic-s2 { width: 24px; height: 19px; margin: 0px; vertical-align: middle; position: relative; }
form button.pic-s2.ie8, form button.pic-s2.opera, form button.pic-s2.chrome { top: -1px; }
form button.pic-s2 img.ie8 { top: -4px; left: 6px; }
form button.pic-s2 img.firefox { top: -5px; left: -2px; }
form button.pic-s2 img.opera { position:relative; left: -1px; }
form button.pic-s2 img.safari { top: 4px; left: 7px; }
form button.pic-s2 img.chrome { top: 3px; left: 7px; }

/* Immagine usata come bottone (alta 17px). Cerchio con ">" dentro. */
form input.img01, form input.img01-s2, form input.img01-r { margin: 0px; vertical-align: middle; position: relative; }
form input.img01.ie7, form input.img01.opera { top: 1px; }
form input.img01.ie { top: -2px; }
/* Classi alternative di posizionamento per il bottone precedente qualora sia "font-size:85%"/class="text-small2" (scelta lingua dal menu). */
form input.img01-s2.ie7 { top: 1px; }
/* Classi alternative di posizionamento per il bottone precedente quando è usato nei riquadri di radio-button/checkbox (abbassando il bottone di 25px va sul riquadro, però è anche stato alzato il riquadro, per limitare l'interlinea). */
form input.img01-r.ie7, form input.img01-r.opera { top: 8px; }
form input.img01-r.ie, form input.img01-r.firefox { top: 5px; }

p.titolo-in-balloon { padding: 0.6em 1em; margin-top: 0.96em; font-weight: bold; font-style: normal; background-color: #DCDCDC; color: #696969; }
div.info-in-balloon { margin: 0px; padding: 0.6em; background-color: #F5F5F5; font-size: 86%; }
ul.infoctrl-in-balloon { margin: 0px 0px 0px 1.2em; padding: 0px; list-style-type: disc; background-image: none; }
p.infotipo-in-balloon { margin: 0px 0px 0.96em 0px; padding: 0px; }

/* DIVISIONI FLUIDE CHE SOMIGLIANO AI FORM PER PRESENTARE I DATI DEI FORM IN SOLA VISUALIZZAZIONE (REPORT) */

/* Trasparente da mettere in un contenitore, del quale riempie completamente lo spazio utile interno senza aggiungere margine o padding. */
div.t { margin: 0px; padding: 0px; text-align: left; }
div.t p.title {   /* Titolo. Nel corpo della maschera può essercene più d'uno. */
	margin: 0px 0px 0.6em 0px;
	padding-left: 15px;
	font-size: 132%;
	font-weight: bold; font-style: normal; font-variant: small-caps;
	text-align: left;
	color: #808080; }
div.t p.title span.low { font-size: 86%; font-weight: normal; font-style: normal; font-variant: normal; }   /* Testo ausiliario del titolo che si vuole evidenziare di meno. */

/* Bordata con colore di sfondo o trasparente, senza margini esterni, da usare autonomamente o in un contenitore. Ha un doppio bordo che riprende lo sfondo della riga del/dei titoli di raggruppamento. */
div.b, div.b-t { margin: 0px; border: 1px solid #4682B4; padding: 4px; text-align: left; }   /* Eredita lo sfondo del suo contenitore, per i titoli. Il padding determina l'ampiezza dell'ulteriore bordo. */
div.b p.legend {   /* Titolo dei raggruppamenti, assimilabili a "legend" dei form. */
	margin: 0px;
	padding: 2px 0px 2px 15px;
	font-size: 132%;
	line-height: 132%;
	font-weight: bold; font-style: normal; font-variant: small-caps;
	text-align: left;
	color: #808080; }
div.b-t p.legend {   /* Titolo dei raggruppamenti, assimilabili a "legend" dei form. */
	margin: 0px;
	padding: 2px 0px 2px 15px;
	font-size: 132%;
	line-height: 132%;
	font-weight: bold; font-style: normal; font-variant: small-caps;
	text-align: left;
	color: #808080;
	background-color: #F5F5F5;
	border-bottom-style: solid; border-bottom-width: 1px; border-bottom-color: #808080; }
div.b p.legend span.low, div.b-t p.legend span.low { font-size: 86%; font-weight: normal; font-style: normal; font-variant: normal; }   /* Testo ausiliario del titolo che si vuole evidenziare di meno. */
div.b div.fieldset {   /* Riquadro colorato con i dati dei raggruppamenti, assimilabile a "fieldset" dei form. */
	background-color: #EDEDFB;
	margin: 0px;
	border: none;
	padding: 10px 15px 13px 15px; }
div.b div.pad-subfset { background-color: #EFEBE7; border-radius: 12px; }   /* Colore di sfondo di default usato per i sub-gruppi di campi inclusi in quello principale (relazioni 1:n obbligatorie e con "n" piccolo), classe assegnata insieme a "fieldset". */
div.b-t div.fieldset {   /* Riquadro con i dati dei raggruppamenti, assimilabile a "fieldset" dei form. */
	background-color: transparent;
	margin: 0px;
	border: none;
	padding: 10px 15px 13px 15px; }

/* Contenitori dei singoli campi con label a sinistra (contenitori a piena larghezza). */
div.t div.campo, div.b div.fieldset div.campo, div.b-t div.fieldset div.campo { width: 100%; margin: 0px; text-align: left; }
/* Label a sinistra dei campi (campi allineati verticalmente lungo il loro bordo sinistro).
   Per avere label a sinistra a larghezza determinata bisogna rendendere float (da inline) il contenitore (span), per potergli assegnare una larghezza. */
span.label-line { float: left; line-height: 240%; text-align: right; }
/* div.campo table { margin-top: 9px; margin-bottom: 9px; } --- Spaziatura per quando gli elementi del campo sono in una tabella, a causa della nota lunga dopo il campo. Agisce anche per i campi di input (form). Eliminata quando è stato reso di default il layout tabellare. */
span.label-line-tb { float: left; line-height: 240%; text-align: right; }   /* Con l'aggiunta di "white-space: nowrap;", se la larghezza della label fosse data alla cella della tabella (<td>) si otterrebbe che i testi eccedenti non vanno a capo ma spostano a destra il campo seguente, con la larghezza della label data al tag <span> dentro la cella di tabella si otterrebbe che la parte eccedente viene nascosta/coperta dal campo seguente. Senza "white-space: nowrap;" il testo eccedente va a capo. */
/* Alle label a sinistra bisogna dare un attributo aggiuntivo "width: <nr>em" per definirne la larghezza. L'assenza determina larghezza in funzione del contenuto, quindi label allineate a sinistra e campi frastagliati (label+campo=inline).
   Anzichè farlo nel file CSS che dovrebbe prevedere i diversi valori desiderati con una classe aggiuntiva, si può definire tale classe in un foglio di stile incorporato nell'HTML, oppure
   in un foglio in linea (attributo style) per ogni label a sinistra definita nel form (scelta questa soluzione per le maschere generate dalle funzioni PHP in JoLib_FuncReport.inc.php).*/
/* Campi a destra della label. */
span.fld-line { line-height: 240%; margin: 0px 7px 0px 4px; padding: 0.2em 0.5em; }   /* Margine destro fornito per non avere campi troppo vicini nel caso di affiancamento e pure per le eventuali label di destra per le note. */
span.fld-line-tb { line-height: 240%; margin: 0px 7px 0px 4px; padding: 0.2em 0.5em; white-space: nowrap; }
span.fld-line-bg { background-color: #FFFFE0; }   /* Colore di sfondo fornito come classe a parte per sostituirlo con una classe a scelta nella visualizzazione. */
span.post-line { line-height: 240%; }
p.post-line-tb { position: relative; top: 0.6em; margin-bottom: 0.6em; }
/* Layout fluido a 2 colonne. Colonna di sinistra a dimensione fissa con la label del campo, a destra divisione fluida per il campo multi-righe. */
div.label-left { float: left; text-align: right; padding: 0.2em 0.5em 0.2em 0px; margin-right: 4px; }   /* Da programma va aggiunto "width: <nr>em" con la larghezza voluta per la label. La spaziatura tra la label ed il campo (4px + 0.5em), che nei campi monoriga è assegnata al campo, qui deve essere nella label. */
div.campo table td.label-left { white-space: nowrap; padding: 0.2em 0.3em 0.2em 0px; }   /* Layout tabellare per quando la label deve iniziare dal bordo sinistro. */
div.fld-right { padding-left: 4px; }   /* Da programma va aggiunto "margin-left: <nr>em" la larghezza voluta per la label. padding-left definisce la distanza tra i contenuti delle 2 colonne. */

/* Label sopra i campi. */
p.label-top { margin: 3px 0px 0px 0px; line-height: 185%; }   /* Lo spazio sotto la label è ottenuto con l'altezza maggiorata della riga, che la porta ad altezza simile a quella dell'icona di help, che è più alta della riga, così anche quando l'icona di help è assente la distanza verticale tra label e contenuto è uguale. */
/* Campi sotto la label, con larghezza proporzionata al contenuto. */
p.fld-riga-dati { margin-bottom: 1em; }   /* Paragrafo di contenimento. */
span.fld-nofull { margin: 0px 4px 0px 0px; padding: 0.2em 0.5em; line-height: 190%; vertical-align: top; }   /* line-height è usato per ottenere il margine inferiore che non funziona con margin-bottom. */
span.fld-nofull.seqline { margin-left: 4px; }   /* Classe aggiuntiva per i campi seguenti il primo sulla stessa linea, ma con la label sopra. Usata per spaziarli in modo equilibrato anche se c'è del testo tra loro. */
span.fld-nofull-bg { background-color: #FFFFE0; }   /* Colore di sfondo fornito come classe a parte per sostituirlo con una classe a scelta nella visualizzazione. */
/* Campi ampi multilinea sotto la label, lunghi per l'intera larghezza del contenitore. Ed anche campo analogo a destra della label scritto in un layout fluido a 2 colonne. */
div.fld-full { width: 100%; margin: 0px 0px 1em 0px; background-color: #FFFFE0; padding: 0.2em 0px 0.4em 0.5em; }   /* Tolto il padding-laterale-destro=0.5em, perché IE vecchio < 11 ed anche il nuovo FireFox 51, aumentano la larghezza e fanno comparire la barra di scorrimento orizzontale. Per provare ad evitare questo problema il padding era stato messo nei paragrafi <p> dentro la divisione. => p.fld-full { padding: 0.2em 0.5em; } -> Non è stato possibile usare solo <p> per il difetto di disegno con width:100%, che è stato trovato e documentato per i form. Però, questa soluzione non produceva i paragarafi come desiderato se il campo era formattato in HTML con dei paragrafi senza la classe "fld-full". Quindi è stata definita un'ulteriore divisione di contenimento, nelle funzioni di disegno dei campi, solo per creare un margine destro, in modo che il contenuto non tocchi il lato destro. */

/* Classi/stile aggiuntivo da applicare ai singoli oggetti per evidenziarli, oppure velarli visivamente, in rapporto agli altri che non lo hanno. */
div.t span.evid, div.t p.evid, div.t div.evid, div.b span.evid, div.b p.evid, div.b div.evid, div.b-t span.evid, div.b-t p.evid, div.b-t div.evid, div.campo table td.evid { font-weight: bold; font-style: normal; font-variant: normal; }
div.t span.unevid, div.t p.unevid, div.t div.unevid, div.b span.unevid, div.b p.unevid, div.b div.unevid, div.b-t span.unevid, div.b-t p.unevid, div.b-t div.unevid, div.campo table td.unevid { font-weight: normal; font-style: italic; font-variant: normal; }
/* Come sopra quando l'oggetto è dentro un form. */
form.t span.evid, form.t p.evid, form.t div.evid, form.b span.evid, form.b p.evid, form.b div.evid { font-weight: bold; font-style: normal; font-variant: normal; }
form.t span.unevid, form.t p.unevid, form.t div.unevid, form.b span.unevid, form.b p.unevid, form.b div.unevid { font-weight: normal; font-style: italic; font-variant: normal; }

/* Riquadro di contenimento usato a scopo estetico per raggruppamento, simile ad un fieldset in un form. */
div.fieldset-like {
	margin: 1.8em 0px 0.8em 0px;
	border: 2px solid #7B68EE;
	padding: 0px 15px 0px 15px;   /* Il padding-top serve a distanziare i contenuti, ma va aggiunto (in negativo) allo spostamento in alto del titolo del riquadro. */
	position: relative;   /* Serve per fare funzionare z-index. */
	z-index: 20;
	background-color: inherit; }   /* Deve essere presente il colore di sfondo per consentire che il titolo del riquadro (<span> nidificato) possa ereditarlo. A sua volta questo elemento lo eredita dal genitore (riquadro assimilabile a "fieldset" dei form). */
div.fieldset-like span.title {   /* Riducendo line-height (<100%) sale la scritta e cala quindi il margine interno superiore del riquadro, ma solo con IE. */
	font-size: 117%;
	font-weight: normal; font-style: normal; font-variant: small-caps;
	text-align: left;
	position: relative;
	top: -0.8em;
	z-index: 50;
	margin: 10px 0px 10px 0px;   /* Sposta a destra l'etichetta. Il margine laterali devono essere sostituiti con padding per non fare apparire il bordo del riquadro, a sinistra e tra i 2 <span> (title e titlelink). */
	padding: 0px 0.4em 2px 0.4em;   /* Altezza e larghezza del riquadro dell'etichetta. */
	background-color: inherit; }   /* Va opacizzato con un colore di sfondo, altrimenti si vede la linea del bordo del riquadro di cui è titolo. Qui viene ereditato il colore di sfondo del form/pagina, che va bene quando il "fieldset-like" è trasparente, altrimenti si può usare il colore del box contenuto o contenitore a piacere. */
div.fieldset-like span.titlelink {
	font-size: 86%;
	text-align: left;
	position: relative;
	top: -1.2em;
	left: -0.4em;
	z-index: 50;
	margin-left: 0px; margin-right: 0px;
	padding: 0px 0.4em 2px 1em;
	background-color: inherit; }   /* Va opacizzato con un colore di sfondo, altrimenti si vede la linea del bordo del riquadro di cui è titolo. Qui viene ereditato il colore di sfondo del form/pagina, che va bene quando il "fieldset-like" è trasparente, altrimenti si può usare il colore del box contenuto o contenitore a piacere. */
div.fieldset-like div.contenuti {   /* Riquadro dei contenuti, usato per traslare verso l'alto tutto, per ridurre il margine superiore che risulta ampio a causa della prima linea (titolo) spostata in alto. */
	position: relative;
	top: -0.6em;
	margin: 0px;
	padding: 0px;}

/* MESSAGGI EVIDENZIATI, usati in input e output. Input: paragrafo di testo sotto il bottone di conferma, per messaggi importanti e segnalazione errori. */

form.t p.msg, form.b p.msg, div.t p.msg, div.b p.msg, div.b-t p.msg {
	margin: 0px 0px 0.8em 0px;
	padding: 0.5em 1em;
	font-size: 117%;
	line-height: 117%;
	font-weight: bold; font-style: normal; font-variant: small-caps;
	text-align: left;
	color: #DC143C;
	background-color: #FAFAD2; }
form p.msg span.unevid, div p.msg span.unevid { font-size: 86%; font-weight: normal; font-style: normal; font-variant: normal; }   /* Testo ausiliario del messaggio che si vuole evidenziare di meno. */
form.b p.msg, div.b p.msg, div.b-t p.msg { margin-left: 4px; margin-right: 4px; }   /* Margini laterali pari all'ampiezza del bordino chiaro che circonda il fieldset, da cui il paragrafo è fuori. */