/* preset
_________________________________________*/

/*    reset globale cross browser
____________________________________________ */
html, body, div, span, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, address, cite, code, img, strong, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, header, nav, article, aside, footer, hgroup, section {
  margin:0;
  padding:0;
  border:0;
  outline:0;
  font-size:100%;
  font-weight:inherit;
  font-style:inherit;
  font-family:inherit;
  text-decoration:none;	
}

section, article, header, footer, nav, aside, hgroup { 
  display:block; 
}


/*    correzioni aggiuntive
____________________________________________ */

/* correzione per visualizzazione pulsanti submit e box radio in iOS  - inizio */
input[type="submit"],
input[type="button"]{
  -webkit-appearance: none!important;
}
/* correzione per visualizzazione pulsanti submit e box radio in iOS  - fine */



/*    set box model type 
_________________________________________*/
* {
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
}


/*    font embedding 
_________________________________________*/
@font-face {
  font-family: 'MateRegular';
  src: url('/grafagrafa/struttura/font/Mate-Regular-webfont.eot');
  src: url('/grafagrafa/struttura/font/Mate-Regular-webfont.eot?#iefix') format('embedded-opentype'),
       url('/grafagrafa/struttura/font/Mate-Regular-webfont.woff') format('woff'),
       url('/grafagrafa/struttura/font/Mate-Regular-webfont.ttf') format('truetype'),
       url('/grafagrafa/struttura/font/Mate-Regular-webfont.svg#MateRegular') format('svg');
  font-weight: normal;
  font-style: normal;
}

@font-face {
  font-family: 'MateItalic';
  src: url('/grafagrafa/struttura/font/Mate-Italic-webfont.eot');
  src: url('/grafagrafa/struttura/font/Mate-Italic-webfont.eot?#iefix') format('embedded-opentype'),
       url('/grafagrafa/struttura/font/Mate-Italic-webfont.woff') format('woff'),
       url('/grafagrafa/struttura/font/Mate-Italic-webfont.ttf') format('truetype'),
       url('/grafagrafa/struttura/font/Mate-Italic-webfont.svg#MateItalic') format('svg');
  font-weight: normal;
  font-style: normal;
}

@font-face {
  font-family: 'MateSCRegular';
  src: url('/grafagrafa/struttura/font/MateSC-Regular-webfont.eot');
  src: url('/grafagrafa/struttura/font/MateSC-Regular-webfont.eot?#iefix') format('embedded-opentype'),
       url('/grafagrafa/struttura/font/MateSC-Regular-webfont.woff') format('woff'),
       url('/grafagrafa/struttura/font/MateSC-Regular-webfont.ttf') format('truetype'),
       url('/grafagrafa/struttura/font/MateSC-Regular-webfont.svg#MateSCRegular') format('svg');
  font-weight: normal;
  font-style: normal;
}


@font-face {
    font-family: 'grafagrafatrattiregular';
    src: url('/grafagrafa/struttura/font/grafagrafatratti-webfont.eot');
    src: url('/grafagrafa/struttura/font/grafagrafatratti-webfont.eot?#iefix') format('embedded-opentype'),
         url('/grafagrafa/struttura/font/grafagrafatratti-webfont.woff2') format('woff2'),
         url('/grafagrafa/struttura/font/grafagrafatratti-webfont.woff') format('woff'),
         url('/grafagrafa/struttura/font/grafagrafatratti-webfont.ttf') format('truetype'),
         url('/grafagrafa/struttura/font/grafagrafatratti-webfont.svg#grafagrafatrattiregular') format('svg');
    font-weight: normal;
    font-style: normal;
}
       

/* contesto generale 
_________________________________________*/

/*    basi generali 
_________________________________________*/
html {
  background: url(/grafagrafa/struttura/immagini/fab_vergata_fondo.jpg) repeat;
}

body {  
   
  max-width:960px;
  margin:0 auto;
  padding: 10px;
  font-family: 'MateRegular', Georgia, serif;
  color:rgba(255, 255, 255, 0.5);
  font-size:62.5%; 
  line-height:1.2em; 
  text-rendering: optimizeLegibility;
  word-wrap: break-word; 
}


h1, h2, h3, h4, h5, h6 { 
  font-family:'MateSCRegular', Georgia, serif;    
}

em {
    font-style: normal;
	font-family:'MateItalic', Georgia, serif;
}

a { text-decoration:none;}
a:link, a:visited { color:rgba(255, 255, 255, 0.7);}
a:hover, a:focus, a:active { color:rgba(255, 255, 255, 1); }


dl { display:inline; } 
dt { display:inline; margin-right:0; } 
dd { display:inline; margin-right:1em; }

mark { background:rgba(15, 135, 15, 0.1); }

/*apici e pedici  es. note in articoli*/
sup, sub { vertical-align:baseline; position:relative; top:-0.4em; } 
sub { top:0.4em; } 

/*intarsi*/
.hyp_auto {
  -moz-hyphens: auto;
  -webkit-hyphens: auto;
  -ms-hyphens: auto;    
  hyphens: auto;
}

.asx {
  text-align:left;
}

.adx {
  text-align:right;
}

.lapide {
  text-align:center;
}

.giustificato {
  text-align:justify;
}

/*toglie il rientro di default dei paragrafi diversi dal primo  senza dover usare <br>*/
.no_rientro {text-indent:0em !important;} 

/* titoletti di 4 livello in maiuscoletto */
h4 {
 margin:0;
 font-family:'MateSCRegular', Georgia, serif;
 font-size:1em;  /* mantiene 16px  */
 font-weight: normal;
 color:rgba(0, 0, 0, 0.8);
}

/*titoletti di 5 livello in sanguigna corsivo*/
h5 {
  margin:0;
  font-family:'MateItalic', Georgia, serif;
  font-size:1em;  /* mantiene 16px  */
  font-weight: normal;
  color:rgba(102, 0, 0, 0.8);
}

.corsivo {
  font-family:'MateItalic', Georgia, serif;
}

.maiuscoletto {
font-family:'MateSCRegular', Georgia, serif;
}

.maiuscoletto_rientrato01 {
font-family:'MateSCRegular', Georgia, serif;
margin: 0 0 0 -0.1em;
display: inline-block;
}

.maiuscoletto_rientrato02 {
font-family:'MateSCRegular', Georgia, serif;
margin: 0 0 0 -0.2em;
display: inline-block;
}

.maiuscoletto_rientrato03 {
font-family:'MateSCRegular', Georgia, serif;
margin: 0 0 0 -0.3em;
display: inline-block;
}

.maiuscoletto_rientrato04 {
font-family:'MateSCRegular', Georgia, serif;
margin: 0 0 0 -0.4em;
display: inline-block;
}

.maiuscoletto_rientrato05 {
font-family:'MateSCRegular', Georgia, serif;
margin: 0 0 0 -0.5em;
display: inline-block;
}

.maiuscoletto_rientrato06 {
font-family:'MateSCRegular', Georgia, serif;
margin: 0 0 0 -0.6em;
display: inline-block;
}


.talquale {
padding: 0px!important;
-webkit-box-shadow: 1px 1px 5px 0px rgba(0, 0, 0, 0)!important;
-moz-box-shadow: 1px 1px 5px 0px rgba(0, 0, 0, 0)!important;
box-shadow: 1px 1px 5px 0px rgba(0, 0, 0, 0)!important;
}

.senza_bordi {
padding: 0px!important;
}

.marginato_su {
margin-top: 20px!important;
}

.senza_bordi_marginato_su {
padding: 0px!important;
margin-top: 20px!important;
}

.grassetto {
	font-weight: bold;
	opacity:     0.8;
}

.sanguigna { 
  color:rgba(102, 0, 0, 0.8);
}

.evidenzia_1 { 
  font-family:'MateItalic', Georgia, serif;
  color:rgba(102, 0, 0, 0.8);
}

.evidenzia_2 { 
  font-family:'MateSCRegular', Georgia, serif;
  color:rgba(102, 0, 0, 0.8);
}

.date_cronologia {
  font-family:'MateItalic', Georgia, serif;
  width:100%;
  padding: 41.6px 0 4px 0;
  border-bottom:2px solid rgba(0, 0, 0, 0.1);
}

.verderedazione { 
 color:rgba(15, 135, 15, 0.8);
}

.unoedue {
 font-size:1.2em; 
}

.spaziounoecinque {
  line-height:1.5em!important;
}

.filigrana_1 {
 font-family:'MateItalic', Georgia, serif;
 font-size:2em;
 color:rgba(0, 0, 0, 0.3);
 text-align:center;
 line-height:1em;
}

.filigrana_2 {
 margin:0 0 -20.8px 0;
 font-family:'MateItalic', Georgia, serif;
 font-size:1.2em;
 color:rgba(0, 0, 0, 0.3);
 text-align:center;
 line-height:1em;
}

.marca{
color:rgba(125,255,0,0.8)!important;
}

.marca2{
color:rgba(255,216,0,0.8)!important;
}

#manutenzione_spot {
 position: absolute;
 font-family:'MateSCRegular', Georgia, serif;
 font-size:2em;
 color:rgba(255, 255, 255, 0.3); 
}

.tratti { 
 font-family:'grafagrafatrattiregular', Georgia, serif!important; 
 font-size:1.2em;
}

.ro90 {
  transform: rotate(90deg);
  display:inline-block;
} 

.greco_tondo {
 font-family: TimesNewRoman, "Times New Roman", Times, Baskerville, Georgia, serif;
 font-weight: normal;
 font-style: normal;
}

.greco_corsivo {
  font-family: TimesNewRoman, "Times New Roman", Times, Baskerville, Georgia, serif;
  font-weight: normal;
  font-style: italic;
} 


h2[title="listastatistiche"]>h3>li>span { color:rgba(102, 0, 0, 0.8);} 


/*    struttura principale
____________________________________________________________________ */


#testata {
  width:100%;  
  margin:20px 0 10px 0; 
}


#navigazione {
  width:100%;   
  margin-bottom:30px; 
  padding:2px 0 3px 0; 
  background:rgba(255, 255, 255, 0.14);
  -webkit-border-radius: 5px;
  -moz-border-radius: 5px;
  border-radius:5px;
  line-height:2em;
}

#titolazione {
  width:100%;
  margin-bottom:40px;
}


#contenuti {
  width:100%;
  margin-bottom:40px;
}

#piedipagina {
  width:100%;
  margin-bottom:20px;
  border-top:2px solid rgba(255, 255, 255, 0.5);
}

.boxtotale {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex; 
  -webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
  -webkit-flex-direction: row;
  -ms-flex-direction: row;
  flex-direction: row;
  -webkit-flex-wrap: nowrap;
  -ms-flex-wrap: nowrap;
  flex-wrap: nowrap;  
}

.boxtotale_r {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;  
  -webkit-box-orient: horizontal;
  -webkit-box-direction: reverse;
  -webkit-flex-direction: row-reverse;
  -ms-flex-direction: row-reverse;
  flex-direction: row-reverse;
  -webkit-flex-wrap: nowrap;
  -ms-flex-wrap: nowrap;
  flex-wrap: nowrap;
}

.sx  {
  max-width:670px;
  margin:0; 
  padding:0 30px 0 0;
  -webkit-box-flex:1;
  -webkit-flex:1;
  -ms-flex:1;
  flex:1;   
}

.dx {
  width:270px;
  margin:0; 
  padding:0; 
}


/* SPECIFICAZIONI
____________________________________________________________________ */



/*   TESTATA - sx descrizione istituzionale, dx logo
     ________________________________________________________________*/
#testata #logo { 
  /* precedente non + necessario 
  padding:0 10px 0 0;
  font-family:'MateItalic', Georgia, serif;
  font-size: 6em;  /
  line-height:1.25em; 
  text-align:left;
  color:rgba(137, 167, 235, 0.9); */
 
  /* implementazione logo in background */
  background-image: url(/grafagrafa/struttura/immagini/logografagrafa.png);
  background-position: top left;
  background-repeat: no-repeat;
  background-size: 168px auto;
  height:123px;
  opacity:0.8; 
}

#testata #istituzionale h1 {
  padding:12px 0 0 10px;
  font-family:'MateItalic', Georgia, serif;
  font-size:2.2em;  /* 19px  */
  line-height:1.3em; 
  text-align:right;
  color:rgba(255, 255, 255, 0.5);
}

#testata #istituzionale h2 {
  padding:0 0 0 10px;
  font-family:'MateRegular', Georgia, serif;
  font-size:1.9em;  /* 19px  */
  line-height:1.2em; 
  text-align:right;
  color:rgba(255, 255, 255, 0.5);
}


/*    NAVIGAZIONE - sx pulsanti                                                
_____________________________________________________________________
      - stile generale lista  pulsanti                                              
_____________________________________________________________________*/

#navigazione #pulsanti ul { 
  margin:0 -20px 0 0;
  padding:0 10px 0 0;
  float:right;
  display:inline;
  text-align:right;
  font-size:2.1em;  /* 21px  */
  letter-spacing:0.08em;
  line-height:1.2em; /*25.2px */
}

#navigazione #pulsanti li { 
  display:inline;
}

#navigazione #pulsanti li a { 
  padding:1px 8px 2px 8px; 
  font-family:'MateSCRegular', Georgia, serif; 
  -webkit-border-radius:5px;
  -moz-border-radius:5px;
  border-radius:5px;
}

/*    - stile pulsanti standard                                                
_____________________________________________________________________*/
#navigazione #pulsanti a { 
  color:rgba(229, 219, 164, 0.9); 
  background:rgba(255, 255, 255, 0.1);
}

#navigazione #pulsanti  a:link, 
#navigazione #pulsanti a:visited  { 
  color:rgba(229, 219, 164, 0.7);  
  background:rgba(255, 255, 255, 0);
}

#navigazione #pulsanti a:hover,
#navigazione #pulsanti a:active { 
  color:rgba(229, 219, 164, 0.9); 
  background:rgba(255, 255, 255, 0.1);
}

#navigazione #pulsanti a:focus { 
  color:rgba(229, 219, 164, 1); 
  background:rgba(255, 255, 255, 0.15);
}


/*    - stili pulsanti verso homepage di sezione utilizzato in pagine articoli singoli                                                
_______________________________________________________________________________________*/
#navigazione #pulsanti > ul > span > #homesezione > a {
  color:rgba(229, 219, 164, 0.9); 
  background:rgba(255, 255, 255, 0.1); 
}
#navigazione #pulsanti > ul > span > #homesezione > a:link,
#navigazione #pulsanti > ul > span > #homesezione > a:visited {
  color:rgba(229, 219, 164, 0.9); 
  background:rgba(255, 255, 255, 0.1); 
}

#navigazione #pulsanti > ul > span > #homesezione > a:hover,
#navigazione #pulsanti > ul > span > #homesezione > a:active {
  color:rgba(229, 219, 164, 1); 
  background:rgba(255, 255, 255, 0.15); 
}


#navigazione #pulsanti > ul > span > #homesezione > a:focus {
  color:rgba(229, 219, 164, 1); 
  background:rgba(255, 255, 255, 0.5); 
}

/*    - stile pulsante non linkato che evidenzia sezione/pagina attiva 
        (utilizzato in pagine diverse da pagina articolo singolo)                                                
_____________________________________________________________________*/
.p_corrente { 
  padding:1px 8px 2px 8px;
  font-family:'MateSCRegular', Georgia, serif; 
  color:rgba(229, 219, 164, 0.9); 
  background:rgba(255, 255, 255, 0.1);
  -webkit-border-radius:5px;
  -moz-border-radius:5px;
  border-radius:5px;
  display:inline;
}

/*    - stili pulsante riferito alla home page del sito                        
_____________________________________________________________________*/
.p_home_corrente { 
 font-family:'grafagrafatrattiregular', Georgia, serif!important; 
 font-size:1.2em;  /* 21px  */ 
}

.p_home_link { 
  font-family:'grafagrafatrattiregular', Georgia, serif !important; 
  font-size:1.2em;  /* 21px  */
}



/* sottomenų navigazione dx con form - vedi gest_articoli_landing*/
#esplicativosezione_form form {
  margin:0 0 0 0;
  padding:1px 0px 2px 0px;
  background:rgba(255, 255, 255, 0.14);
  color:rgba(229, 219, 164, 0.7);  
  font-family:'MateSCRegular', Georgia, serif; 
  font-size:1em;
  text-align:right;
  letter-spacing:0.08em;
  -webkit-border-radius: 5px;
  -moz-border-radius: 5px;
  border-radius:5px;
  line-height:1.4em;  
}

#esplicativosezione_form a { 
  padding:1px 10px 2px 10px;
  -webkit-border-radius:5px;
  -moz-border-radius:5px;
  border-radius:5px;
}

#esplicativosezione_form a:link,
#esplicativosezione_form a:visited { 
  color:rgba(229, 219, 164, 0.7);  
  background:rgba(255, 255, 255, 0);
}

#esplicativosezione_form a:hover,
#esplicativosezione_form a:active {
  color:rgba(229, 219, 164, 0.9); 
  background:rgba(255, 255, 255, 0.1);
}

#esplicativosezione_form a:focus {
  color:rgba(229, 219, 164, 1); 
  background:rgba(255, 255, 255, 0.15);
}

#esplicativosezione_form span {
  padding:1px 10px 2px 10px;
  -webkit-border-radius:5px;
  -moz-border-radius:5px;
  border-radius:5px;
  color:rgba(229, 219, 164, 0.9); 
  background:rgba(255, 255, 255, 0.1);
  
}

#esplicativosezione_form .tieni_uniti {
  padding:1px 0 2px 0;
  background:none;
  display:inline-block;
}

#esplicativosezione_form form input,
#esplicativosezione_form form textarea { 
  width:120px;
  margin:0 0px 0 0;
  padding:0 5px;
  border:none;
  -webkit-border-radius: 5px;
  -moz-border-radius:5px;
  border-radius: 5px;
  display:inline; 
  background:rgba(255,255,255,0.6);
  color:rgba(0,0,0,0.8); 
  font-family:'MateItalic', Georgia, serif;
  font-size:0.9em; 
  text-align:left;
  overflow:hidden;  
}

#esplicativosezione_form form input[type="search"] { 
  -webkit-appearance:textfield;
}

#esplicativosezione_form form input:focus, 
#esplicativosezione_form form textarea:focus { 
  background:rgba(255, 255, 255, 1);
}

#esplicativosezione_form form input[type="submit"],
#esplicativosezione_form form input[type="reset"] {
	width:52px;
    margin:0 13px 0 0;
	padding:0 10px;
	color:rgba(255,255,255,0.8);
	background:rgba(0,0,0,0.3);
	display:inline;
	letter-spacing:0.08em;
	text-align: center;
}

#esplicativosezione_form form input[type="submit"]:hover,
#esplicativosezione_form form input[type="reset"]:hover {
  color:rgba(255, 255, 255, 1);
  background:rgba(0, 0, 0, 0.6);
}

#esplicativosezione_form form input[type="submit"]:active,
#esplicativosezione_form form input[type="reset"]:active {
  color:rgba(0, 0, 0, 0.8);
  background:rgba(255, 180, 0, 0.6);
}



/*  NAVIGAZIONE - dx form                                                
_____________________________________________________________________*/
#navigazione #ricerca hr {
display:none;
}

#navigazione #ricerca form {
  width:100%;
  margin-top:3px;  
  padding:0;  
  float:left;
  display:inline;
}

#navigazione #ricerca form input,
#navigazione #ricerca form textarea { 
  width:170px;
  margin:0 12px 0 0;
  padding:0 5px;
  border:none;
  -webkit-border-radius: 5px;
  -moz-border-radius:5px;
  border-radius: 5px;
  display:inline; 
  background:rgba(255,255,255,0.6);
  color:rgba(0,0,0,0.8); 
  font-family:'MateItalic', Georgia, serif;
  font-size:1.4em; /*14px*/
  text-align:left;
  overflow:hidden;  
}

#navigazione #ricerca form input[type="search"] { 
  -webkit-appearance:textfield;
}

#navigazione #ricerca form input:focus, 
#navigazione #ricerca form textarea:focus { 
  background:rgba(255, 255, 255, 1);
}

#navigazione #ricerca form input[type="submit"],
#navigazione #ricerca form input[type="reset"] {
	width:54px;
	margin:0;
	padding:0 10px;
	color:rgba(255,255,255,0.8);
	background:rgba(0,0,0,0.3);
	display:inline;
	letter-spacing:0.08em;
	text-align: center;
}

#navigazione #ricerca form input[type="submit"]:hover,
#navigazione #ricerca form input[type="reset"]:hover {
  color:rgba(255, 255, 255, 1);
  background:rgba(0, 0, 0, 0.6);
}

#navigazione #ricerca form input[type="submit"]:active,
#navigazione #ricerca form input[type="reset"]:active {
  color:rgba(0, 0, 0, 0.8);
  background:rgba(255, 180, 0, 0.6);
}



/*    TITOLAZIONE -  dx titoli                                                
_____________________________________________________________________
    - in intestazioni a piena pagina                                         
_____________________________________________________________________*/
#titolazione > #titolosezione {
  margin:0; 
  padding:0 10px 0 0;
  font-family:'MateRegular', Georgia, serif; 
  font-size:1.6em;  /* 16px*/
  line-height:1.3em; /* 20.8px  */
  text-align:left;  
} 

#titolazione > #titolosezione h1 {
  width:100%;  
  float:left;
  font-family:'MateSCRegular', Georgia, serif;
  font-size:1.5em;  /* 24px*/ 
  margin-top:-1px;
  
} 

#titolazione > #titolosezione h2 {
  width:100%;  
  float:left;
  font-family:'MateItalic', Georgia, serif;
  font-size:1.25em;  /* 20px  */  
 
} 

/*    - in colonna a dx (a fianco articoli)                                        
_____________________________________________________________________*/
#titolosezionesintetico {
  margin:0; 
  padding:0 10px 0 0;
  font-family:'MateRegular', Georgia, serif; 
  font-size:1.6em;  /* 16px*/
  line-height:1.3em; /* 20.8px  */
  text-align:left;
} 

#titolosezionesintetico > h1 {
  width:100%;  
  float:left;
  font-family:'MateSCRegular', Georgia, serif;
  font-size:1.5em;  /* 24px*/  
} 

#titolosezionesintetico > h2 {
  width:100%;  
  margin-bottom:30px;
  float:left;
  font-family:'MateItalic', Georgia, serif;
  font-size:1.25em;  /* 20px  */  
} 

.home_ico{
 font-family:'grafagrafatrattiregular', Georgia, serif !important; 
 font-size:1.1em;
} 

/* TITOLAZIONE -  sx esplicativo                                                
_____________________________________________________________________*/

/*versione standard*/
#titolazione > #esplicativosezione {
  margin:0; 
  padding:0 30px 0 10px;
  font-family:'MateItalic', Georgia, serif; 
  font-size:1.6em;  /* 16px  */
  line-height:1.3em;  /* 20.8px  */
  text-align:justify;
}

#titolazione > #esplicativosezione h3 {
  font-family:'MateItalic', Georgia, serif; 
}


/*versione con form - vedi landing gestione articoli*/
#titolazione > #esplicativosezione_form {
  margin:0; 
  padding:0 30px 0 10px;
  font-family:'MateItalic', Georgia, serif; 
  font-size:1.6em;  /* 16px  */
  line-height:1.3em;  /* 20.8px  */
  text-align:justify;
}

#titolazione > #esplicativosezione_form h3 {
  font-family:'MateItalic', Georgia, serif; 
}


/*  CONTENUTI - sx materiali                                                  
_____________________________________________________________________*/
#contenuti > #materiali  { 
  margin:0; 
  padding:0 30px 0 10px;
  font-family:'MateRegular', Georgia, serif; 
  text-align:justify;
}

/*bianchi di pagina sulla base dell'interlinea base articolo:
  em = 16px; interlinea = 1.3 em = 20.8 px*/
#contenuti #materiali > section > article { 
  margin:0; 
  padding:10.4px 62.4px 41.6px 62.4px; 
  font-size:1.6em;  /* 16px  */
  line-height:1.3em;  /*20.8px  = 1 riga; */
  color:rgba(0, 0, 0, 0.8);
  background:url(/grafagrafa/struttura/immagini/fab_vergata.jpg) repeat;
  -webkit-border-radius:3px;
  -moz-border-radius:3px;
  border-radius:3px;
  -webkit-box-shadow:5px 5px 10px 0px rgba(0, 0, 0, 0.9);
  -moz-box-shadow: 5px 5px 10px 0px rgba(0, 0, 0, 0.9);
  box-shadow:5px 5px 10px 0px rgba(0, 0, 0, 0.9); 
  
 
}

#contenuti #materiali > section > article  header  { 
  width:100%;
  margin:0;
  padding:20.8px 0 31.2px 0px;
  float:left;
  clear:both
}

#contenuti #materiali > section > article  header time { 
  width:100%;
  font-family:'MateItalic', Georgia, serif;
  margin-bottom:10.4px;
  text-align: right;
  float:right;
  clear:both;
}

#contenuti #materiali > section > article  header time[title="aggiornamento"] { 
  font-family:'MateSCRegular', Georgia, serif;
  font-size:0.7em; 
  margin-top:-10px; 
}

#contenuti #materiali > section > article  header h1 { 
  width:100%;
  float:left;
  clear:both;
  font-family:'MateSCRegular', Georgia, serif;
  font-size:1.25em;  /* 20px  */
  color:rgba(102, 0, 0, 0.9);
  text-align:left; 
  -webkit-hyphens:none;
  -moz-hyphens:none;
  -ms-hyphens: none;    
  hyphens:none;
}

#contenuti #materiali > section > article  header h2 { 
  font-family:'MateItalic', Georgia, serif;
  font-size:1.125em;  /* 18px  */
  text-align:left; 
  -webkit-hyphens:none;
  -moz-hyphens:none;
  -ms-hyphens: none;    
  hyphens:none;
}

#contenuti #materiali > section > article  header h3 { 
  width:100%;
  float:left;
  clear:both;
  padding:2em 0 0.6em 0;
  color:rgba(0, 0, 0, 0.5);
  font-family:'MateSCRegular', Georgia, serif;
  font-size:1em;  
  line-height:1em;
  text-align:left; 
  -webkit-hyphens:none;
  -moz-hyphens:none;
  -ms-hyphens: none;    
  hyphens:none;
  
}

#contenuti #materiali > section > article  p {
  -moz-hyphens: auto;
  -webkit-hyphens: auto;
  -ms-hyphens: auto;    
  hyphens: auto;
}

#contenuti #materiali > section > article  ol {
  -moz-hyphens: auto;
  -webkit-hyphens: auto;
  -ms-hyphens: auto;    
  hyphens: auto;
}

/*normalmente tutti i paragrafi dell'articolo avranno la prima riga rientrata di 1 em*/
#contenuti #materiali > section > article  p {
    text-indent:1em;
} 
/*la prima riga del primo paragrafa non avr rientro*/
#contenuti #materiali > section  article  p:first-of-type {
    text-indent:0;
} 

/*capolettera per la prima lettera del primo paragrafo */
#contenuti #materiali > section  article  p:first-of-type::first-letter {
    margin:0 0 0 0; 
    padding:0 0.1em 0 0; 
	font-size:3.3em;
	float:left;
	line-height:0.65em; /* impostazione necessaria e sufficiente per uniformare resa in webkit
	                       Gecko imposta suo valore tassativo in relazione forma e dimensione lettera) */
	
} 

/*niente rientro per i paragrafi separati da una o pių interruzione di linea aggiuntive */
#contenuti #materiali > section > article  p+br {
    text-indent:0em;
} 


#contenuti #materiali > section > article > footer { 
  margin:0;
  padding:41.6px 0 62.4px 0;
  text-align:left;
}


#contenuti  #materiali > section > article .anchor,
#contenuti  #materiali > section > article a:link,
#contenuti  #materiali > section > article a:visited { 
 color:rgba(102, 0, 0, 0.8);
}


#contenuti  #materiali > section > article a:hover,
#contenuti  #materiali > section > article a:focus,
#contenuti  #materiali > section > article a:active { 
 color:rgba(15, 135, 15, 1);
}


#contenuti  #materiali > section > article img {
 max-width:100%;
 padding: 2px;
 background: rgba(255, 255, 255, 0.0);
 -webkit-box-shadow: 1px 1px 5px 0px rgba(0, 0, 0, 0.25);
 -moz-box-shadow: 1px 1px 5px 0px rgba(0, 0, 0, 0.25);
 box-shadow: 1px 1px 5px 0px rgba(0, 0, 0, 0.25);
}

#contenuti  #materiali > section > article video {
 width:100%;
 height: auto;
 padding: 2px;
 background: rgba(255, 255, 255, 0.0);
 -webkit-box-shadow: 1px 1px 5px 0px rgba(0, 0, 0, 0.25);
 -moz-box-shadow: 1px 1px 5px 0px rgba(0, 0, 0, 0.25);
 box-shadow: 1px 1px 5px 0px rgba(0, 0, 0, 0.25);
}


/* liste a pi di pagina generate dal plugin InsertNote di Xinha */
#InsertNote_NoteList {
 font-size:0.94em;
}

/* visualizzazione anteprime home sezioni - conforma stili elementi linkati*/ 
#contenuti  #materiali > section article[title^= anteprima_] a { 
  color:rgba(0, 0, 0, 0.8)!important;
}

/* visualizzazione anteprima homepage articolo tipo&grafica - conforma stili elementi linkati*/ 
#contenuti  #materiali > section article section[title = estratto_lungo] a { 
  color:rgba(0, 0, 0, 0.8)!important;
}

#contenuti #materiali > section article[title^= anteprima_] .continua {
  font-family:'MateItalic', Georgia, serif;
  font-size:0.8em;  
  color:rgba(102, 0, 0, 0.9);
  -webkit-hyphens:none;
  -moz-hyphens:none;
  -ms-hyphens:none;
  hyphens:none;  
} 


/* foglio anteprima primo articolo in alto su homepage sezioni */
#contenuti #materiali > section > article[title^= anteprima_articolo_alto] { 
  margin:0; 
  padding:10.4px 62.4px 124.8px 62.4px; 
 
  
 
}
/* foglio anteprima articoli successivi al primo su homepage sezioni */
#contenuti #materiali > section > article[title^= anteprima_articoli_succ] { 
  margin:-104px 0 0 0; 
  padding:10.4px 62.4px 124.8px 62.4px; 
   
 
}
/* foglio anteprima articoli successivi al primo su homepage sezioni
 stile che alterna la posizione sx/dx numeri pari */
#contenuti #materiali > section > article[title^= anteprima_articoli_succ]:nth-child(even) { 
  margin:-104px -10px 0 10px; 
  padding:10.4px 62.4px 124.8px 62.4px;  
}


/* visualizzazione anteprime trova - */ 
#boxanteprime_risultati .continua {
  font-family:'MateItalic', Georgia, serif;
  font-size:0.8em;  
  color:rgba(102, 0, 0, 0.9);
  -webkit-hyphens:none;
  -moz-hyphens:none;
  -ms-hyphens:none;
  hyphens:none;  
} 



/* FORM IN FOGLIO ARTICOLO (ARTICLE) */
/* le notazioni mpc inidicano le specificazioni destinate al modulo di primo contatto */
/* base form (disposizione in pagina del form) */
#contenuti #materiali > section > article form {
  width:100%;  
  margin:50px 0px 0px 0px;
  padding:0px;
  border:0 none;
  display:block;
}

/* label form (etichette dei campi) */
#contenuti #materiali > section > article form label {
  width:100%;  
  margin:10px 0 0 0;
  padding:0px 10px 0px 10px; 
  font-family:'MateItalic', Georgia, serif; 
  font-size:0.875em; 
  color:rgba(15, 135, 15, 0.8);
  text-align:left;
  display:block;
}

/* note form (annotazioni di specificazione, sotto i campi input) */
#contenuti #materiali > section > article form .nota_form {
  padding:5px 10px 5px 10px; 
  font-family:'MateRegular', Georgia, serif;
  font-size:0.75em; /* 12.px  */
  line-height:1.3em;  /* 15.6px  */
  color:rgba(0, 0, 0, 0.6);
   -webkit-hyphens:auto;
  -moz-hyphens:auto;
  -ms-hyphens: auto;    
  hyphens:auto;
}

/*form - campi input */
/* input base  */
#contenuti #materiali > section > article form input {
  width:100%;
  padding:0px 5px;
  background:rgba(255, 255, 255, 0.3);
  /*border:5px dotted rgba(15, 135, 15, 0.05);*/
  border:1px solid rgba(15, 135, 15, 0.05);
  outline-style:none;
  font-family:'MateRegular', Georgia, serif; 
  font-size:1em;  /* lascia invariate le impostazioni successive singoli elementi */
  -webkit-border-radius: 5px;
  -moz-border-radius: 5px;
  border-radius:5px;
}

/* input textarea  */
#contenuti #materiali > section > article form textarea {
  width:100%;
  height:396px; /*18 righe*/
  margin:0;
  padding:5px 5px 10px 5px;
  background:rgba(255, 255, 255, 0.3);
  /*border:5px dotted rgba(15, 135, 15, 0.05);*/
  border:1px solid rgba(15, 135, 15, 0.05);
  outline-style:none;
  font-family:'MateRegular', Georgia, serif; 
  font-size:1em;  /* lascia invariate le impostazioni successive singoli elementi */
  text-align:justify;
  -webkit-hyphens:auto;
  -moz-hyphens:auto;
  hyphens:auto;
  -webkit-border-radius: 5px;
  -moz-border-radius: 5px;
  border-radius:5px; 
  resize: none; 
}

/* variazioni per campi input specifici */
/* contenitore per campo input numero di controllo (in modulo di primo contatto) mpc */
#contenuti #materiali > section > article form #controllo_numero_contatto {
  margin-top:30px;
  border:4px solid rgba(15, 135, 15, 0.05);
  padding-bottom: 15px;
}


/* domanda "addizione" per numero di controllo (in modulo di primo contatto) mpc */
#contenuti #materiali > section > article form #controllo_numero_contatto .domanda {
  padding:3px 0px 0px 10px; 
  font-family:'MateRegular', Georgia, serif;
  color:rgba(193,0,31,0.8);
  float:left; 
}


/* campo input per numero di controllo (in modulo di primo contatto) mpc */
#contenuti #materiali > section > article form #controllo_numero_contatto .obbligatorio input {
  width:2em;
  text-align:center; 
  padding:0px;
  margin: 3px 10px 80px 5px;
  float:left;
}

/* campo input compilami mpc */
#contenuti #materiali > section > article form .compilami {
 display:none;
}

/* footer ed elementi "attivi" - form */
/* piedipagina form (contenitore pulsanti invio) */
#contenuti #materiali > section > article form footer { 
  margin:0;
  padding:41.6px 0 62.4px 0;
}

/* pulsanti form - contenitore base */
#pulsanti_azione {
  width:auto;
  margin:30px 10px 5px 0;
}

/* pulsanti form - base e stati */
#contenuti #materiali > section > article form input[type=submit], 
#contenuti #materiali > section > article form input[type=button] {
  width:120px;
  margin:0 0 10px 10px;
  padding:1px 10px 4px 10px; 
  color:rgba(125,255,0, 1);
  background:rgba(0, 0, 0, 0.7);
  border:none;
  font-family:'MateSCRegular', Georgia, serif; 
  font-size:1em;
  float:right;
  text-align:center;
  letter-spacing:0.08em;
  outline-style:none; 
}

#contenuti #materiali > section > article form input[type=button] {
  color:rgba(255,255,255, 0.8);  
}

#contenuti #materiali > section > article  form input[type=submit]:hover , 
#contenuti #materiali > section > article form input[type=button]:hover {
  color:rgba(125,255,0,1); 
  background:rgba(0, 0, 0, 0.8);
}


#contenuti #materiali > section > article  form input[type=submit]:active , 
#contenuti #materiali > section > article form input[type=button]:active {
  color:rgba(125,255,0, 1); 
  background:rgba(0, 0, 0, 0.9);
}

/*serve per togliere in firefox il riquadro di evidenziazione link selezionati*/ 
#contenuti #materiali > section > article  form input[type=submit]::-moz-focus-inner , 
#contenuti #materiali > section > article form input[type=button]::-moz-focus-inner {
  border :0; 
}

/* variazioni locali alle regole css generali */
/* elimina capolettera per i paragrafi del form */
#contenuti #materiali > section  article  form p:first-of-type::first-letter {
  margin:0; 
  padding:0; 
  font-size:1em; /* - eguaglio alla misura base */ 
  float:none;
  line-height:1.3em;  /* eguaglio alla misura base */
 /* impostazione necessaria e sufficiente per uniformare resa in webkit
	Gecko imposta suo valore tassativo in relazione forma e dimensione lettera) */	
} 

/*elimina rientro prima lettera paragrafi del form */
#contenuti #materiali > section  article  form p {
  text-indent:0;
} 
    

/* stili visulaizzazione errori di compilazione - come per pagine gestione */
#errori_form {
width:100%;
margin:0 0 28.8px 0; 
padding:5px 5px 10px 5px; 
color:rgba(125,255,0,1);
font-size:1.4em;  /* 16px  */
line-height:1.2em; /* 20.8  */
border:1px solid rgba(193,0,31,1);
float:left;
clear:both;
}

#errori_form .errori_form_avviso {
font-family:'MateSCRegular', Georgia, serif !important ;
color:rgba(255,255,255,1); 
}




/* CONTENUTI - visualizzazione dati utente                                                  
_____________________________________________________________________*/ 
#dati_utente {
  padding:20.8px 0 31.2px 0px;
  display: table;
  table-layout: fixed; 
  width:100%   
}

#dati_utente p {
  display: table-row;
}
     
#dati_utente .dati_utente_col_sx {
  width:150px;
  padding: 0 10px 0 0;
  display: table-cell;
  font-family:'MateSCRegular', Georgia, serif;
  font-size:1em;
  color:rgba(102, 0, 0, 0.9);
  text-align:right;
  word-wrap: break-word;
  text-indent:0em!important;  
}

#dati_utente .dati_utente_col_dx {
  display: table-cell;
  text-align:left;
  word-wrap: break-word; 
  text-indent:0em!important;  
}


/* CONTENUTI - visualizzazione homespot                                                 
_____________________________________________________________________*/ 
#home_spt_generale {
  width:100%;
  padding: 41.6px 0 41.6px 0;
  border-bottom:2px solid rgba(0, 0, 0, 0.1);
  
} 

#home_spt_cronologia,
#home_spt_sezioni {
  width:100%;
  padding: 21.6px 0 41.6px 0;
  border-top:2px solid rgba(0, 0, 0, 0.1);
  text-align:left;
}

#home_spt_cronologia h3,
#home_spt_sezioni h3 {
margin:0;
padding:0 0 20px 0;
}

#home_spt_cronologia h4,
#home_spt_sezioni h4 {
  margin:0;
  padding:0;
}

#contenuti #materiali > section article[title^= anteprima_] .continua {
  font-family:'MateItalic', Georgia, serif;
  font-size:0.8em;  
  color:rgba(102, 0, 0, 0.9);
  -webkit-hyphens:none;
  -moz-hyphens:none;
  -ms-hyphens:none;
  hyphens:none;  
} 

#contenuti #materiali > section article .continua {
  font-family:'MateItalic', Georgia, serif;
  font-size:0.8em;  
  color:rgba(102, 0, 0, 0.9);
  -webkit-hyphens:none;
  -moz-hyphens:none;
  -ms-hyphens:none;
  hyphens:none;  
} 


/* CONTENUTI - visualizzazione memorandum date interventi gestione                                               
_____________________________________________________________________*/ 
#memorandum_date {
  width:100%;
  padding:0 0 41.6px 0;
}
#memorandum_date time {
  width:100%;
  padding: 20.8px 0 10.4px 0;
  font-family:'MateItalic', Georgia, serif;
  margin-bottom:10.4px;
  text-align: right;
  float:right;
  clear:both;
}
#memorandum_date h1 {
  width:100%;
  padding: 0 0 10.4px 0;
  font-family:'MateSCRegular', Georgia, serif;
  font-size:1.25em;  /* 20px  */
  text-align: left;
  color:rgba(102, 0, 0, 0.9);
  -webkit-hyphens:auto;
  -moz-hyphens:auto;
  hyphens:auto;
}

#memorandum_date h2 {
  padding: 10.4px 0 0 0;
  font-family:'MateSCRegular', Georgia, serif;
 font-size:1.25em;  /* 20px  */
  text-align: left;
  -webkit-hyphens:auto;
  -moz-hyphens:auto;
  hyphens:auto;
}

#memorandum_date li {
  text-align: left;
  list-style-type: none;
  text-indent: -0.5em;
}

#memorandum_date li span {
 color:rgba(102, 0, 0, 0.9);
}

/* CONTENUTI - visualizzazione risultati ricerca                                                  
_____________________________________________________________________*/ 
#boxanteprime_risultati {
  padding:41.6px 41.6px 41.6px 41.6px;
  color:rgba(0, 0, 0, 0.8);
  width:100%;  
}

/*titolo pagina risultati */
#boxanteprime_risultati h1 {
  width:100%;
  margin:0 auto;
  padding-bottom:31.2px;
  text-align:center;
  font-size:1.125em;  /* 18px */ 
}

/*risultato nullo in pagina risultati */
#boxanteprime_risultati h2 {
  width:100%;
  margin:0 auto;
  font-family:'MateRegular', Georgia, serif;
  color:rgba(102, 0, 0, 0.9);
  font-size:1.125em;  /* 20px  */
  text-align:center;
}

/*lista anteprime risultati estratti  risultati */
#boxanteprime_risultati li {
  padding-bottom:20.8px;
  list-style-type: none;
}

.ris_corrente {
  width:100%;
  float:left;
  clear:both;
  font-family:'MateSCRegular', Georgia, serif;
  font-size:1em;  /* 16px  */
  line-height:1em;  
  color:rgba(0, 0, 0, 0.5);
  text-align:left;
  -webkit-hyphens:none;
  -moz-hyphens:none;
  -ms-hyphens: none;    
  hyphens:none;
  
}

.ris_titolo {
  width:100%;
  float:left;
  clear:both;
  font-family:'MateSCRegular', Georgia, serif;
  font-size:1.25em;  /* 20px  */
  color:rgba(102, 0, 0, 0.9);
  text-align:left;
  -webkit-hyphens:none;
  -moz-hyphens:none;
  -ms-hyphens: none;    
  hyphens:none;
 

}

.ris_sottotitolo {
  font-family:'MateItalic', Georgia, serif;
  font-size:1.125em;  /* 18px */ 
  color:rgba(0, 0, 0, 0.8);
   text-align:left;
  -webkit-hyphens:none;
  -moz-hyphens:none;
  -ms-hyphens: none;    
  hyphens:none;
}

.ris_estratto {
  color:rgba(0, 0, 0, 0.8);
  padding-top:1em;
}

.cont_ris_footer {
  align:left;
  padding-top:1em;
  text-align:left;
}


.eti_ris_footer {
  color:rgba(0, 0, 0, 0.8);
  padding:0 5px  0 0;
  text-align:left;

}

.ris_footer {
  color:rgba(102, 0, 0, 0.8); 
  text-align:left; 
}

.ris_data {
  color:rgba(0, 0, 0, 0.8);
  text-align:left;
}


#boxanteprime_risultati ul li {
padding: 2em 0 ;
border-bottom:1px solid rgba(0, 0, 0, 0.1);
}


/*lista pagine risultati */
#boxpagine_risultati { 
  width:100%;
  margin:0 auto;
  padding:20.8px 0 10.4px 0;
  text-align:center;
  font-size:1em;
}

/* specifica pagina elenco attiva */
#boxpagine_risultati span { 
  color:rgba(0, 0, 0, 0.7);
  font-size:1.2em; 
}


/* CONTENUTI - dx collaterali                                                  
_____________________________________________________________________*/
#contenuti #indice { 
  margin:0; 
  padding:0 10px 0 0;
  font-family:'MateRegular', Georgia, serif; 
  text-align: left;
}

#contenuti #indice > aside  > nav > input {
    display: none;
}

#contenuti #indice > aside > #boxnav label {   /*titolo indice */
  margin:0;
  font-family:'MateSCRegular', Georgia, serif; 
  font-size: 1.6em;  /* 16px  */  
  line-height:1.3em; /* 20.8  */
  width:100%;
  display:inline-block; 
}

#contenuti #indice > aside > nav > #boxtitoli > ul { 
  margin:5.4px 0 10.4px 0; 
  padding:0; 
  font-family:'MateItalic', Georgia, serif;
  font-size:1.6em;  /* 16px  */
  line-height:1.3em; /* 20.8  */
  list-style-type:none; /* nessun elemento come marcatore */
}

/* specifica voce elenco (dx) riferita a pagina corrente - lista titoli */
#contenuti #indice > aside > nav > #boxtitoli > ul li h7 { 
   margin:0 0 0 -0.85em; 
   color:rgba(255, 255, 255, 1);  
   font-family:'MateItalic', Georgia, serif;
}
/* specifica voci elenco (dx) non riferite a pagina corrente - lista titoli */
#contenuti #indice > aside > nav > #boxtitoli > ul li h8   { 
   margin:0 0 0 -0.5em; 
}

/* specifica voci elenco (dx) da nascondere - lista titoli */
#contenuti #indice > aside > nav > #boxtitoli > ul li h9   { 
   display:none;
}



/* hack gestione margini negativi per webkit (safari + crome) */
@media all and (-webkit-min-device-pixel-ratio: 1) {

  /* specifica voce elenco (dx) riferita a pagina corrente - lista titoli */
  #contenuti #indice > aside > nav > #boxtitoli > ul li h7 { 
    margin:0 0 0 -0.53em;   
  }

  /* specifica voci elenco (dx) non riferite a pagina corrente - lista titoli */
  #contenuti #indice > aside > nav > #boxtitoli > ul li h8   { 
    margin:0 0 0 -0.51em; 
  }

}


/*lista pagine */
#contenuti #indice > aside > nav > #boxtitoli #boxpagine { 
  padding:5.4px 0 5.4px 0;
  font-size:1.4em;
  width:100%;
}

/* specifica pagina elenco attiva */
#contenuti #indice > aside > nav > #boxtitoli #boxpagine span { 
  color:rgba(255, 255, 255, 1);
  font-size:1.16em; 
}

/*link articoli precedente e successivo navigazione laterale*/
#boxarticoliprimaedopo_nav { 
  border-top:2px solid rgba(255, 255, 255, 0.2);
  padding:5.4px 0 10.4px 0;
  font-family:'MateItalic', Georgia, serif;
  font-size:1.4em;
  width:70%;
}


/*link articoli precedente e successivo sotto articolo*/
#boxarticoliprimaedopo_sotto { 
  margin-top:10px; 
  padding:0 10px 0 0;
  font-family:'MateItalic', Georgia, serif;
  font-size:1.4em;
  text-align:right;
  width:100%;
}


/* pulsante torna su */ 
.tornasu {
  position: fixed;
  top: 780px;
  font-family:'MateSCRegular', Georgia, serif; 
  font-size:1.6em; 
}

/* PIEDIPAGINA                                      
_____________________________________________________________________*/
#piedipagina a:link,
#piedipagina a:visited, 
#piedipagina a:hover, 
#piedipagina a:focus,
#piedipagina a:active { 
color:rgba(255, 255, 255, 0.5); 
}

/* PIEDIPAGINA  - sx                                           
_____________________________________________________________________*/
#piedipagina #piedesx { 
  margin:0; 
  padding:10px 40px 0 10px;
  font-family:'MateRegular', Georgia, serif; 
  font-size:1.3em;  /*14px*/
  line-height:1.3em; /* 15.6px  */  
  text-align:right;
}

#piedipagina #piedesx dl dd { 
  margin-right:0;
}


/* PIEDIPAGINA  - dx                                           
_____________________________________________________________________*/
#piedipagina #piededx { 
  margin:0; 
  padding:10px 10px 0 0;
  font-family:'MateItalic', Georgia, serif; 
  font-size:1.3em;  /*14px*/
  line-height:1.3em; /* 15.6px  */ 
  text-align:left;  
}

 .copy_piede { 
  font-family: Georgia, serif;
  padding:0 2px 0 0;
  font-size:0.9em;  /*12px*/
}

/* MEDIAQUERIES  - dx                                           
_____________________________________________________________________*/

/* MOBILE PORTRAIT */
@media only screen and (max-width: 320px) {
body{
min-width:300px;
margin:0;
padding:0;	
}

}


@media only screen and (max-width: 400px){
/*body{
 font-size: 85.5%;
}*/

#navigazione #ricerca form input[type="submit"],
#navigazione #ricerca form input[type="reset"] {
  margin:0;
  padding:0;
  letter-spacing:0em;
}
}


/* MOBILE LANDSCAPE*/
@media only screen and (max-width: 480px) {

/* CONTENUTI - visualizzazione dati utente                                                  
_____________________________________________________________________*/ 
/*body{}*/

#dati_utente {
  padding:20.8px 0 31.2px 0px;
  display: block;
  width:100%
}

#dati_utente p {
  display: block;
}
     
#dati_utente .dati_utente_col_sx {
  width:auto;
  padding: 0 10px 0 0;
  display: block;
  text-align:left;
  word-wrap: break-word;
}

#dati_utente .dati_utente_col_dx {
  display: block;
  text-align:left;
  word-wrap: break-word;   
} 

/* elementi specificazione form di primo contatto */
/* input numero controllo */
/* contenitore per campo input numero di controllo (in modulo di primo contatto) mpc */
#contenuti #materiali > section > article form #controllo_numero_contatto {
  text-align:center;
}

/* domanda "addizione" per numero di controllo (in modulo di primo contatto) mpc */
#contenuti #materiali > section > article form #controllo_numero_contatto .domanda {
  float:none; 
}

/* campo input per numero di controllo (in modulo di primo contatto) mpc */
#contenuti #materiali > section > article form #controllo_numero_contatto .obbligatorio input {
  margin-bottom: 0px;
  float:none;
}

/* pulsanti form - base */
#contenuti #materiali > section > article form input[type=submit], 
#contenuti #materiali > section > article form input[type=button] {
  font-size:0.85em;
}

#navigazione #ricerca form input[type="submit"],
#navigazione #ricerca form input[type="reset"] {
	letter-spacing:0em;
}

}



/* SMALL TABLET 

@media only screen and (max-width: 600px)  { }
*/


/* TABLET/NETBOOK */


@media only screen and (max-width: 768px) { 

/* variazioni rispetto a default desktop*/

/*    basi e struttura principale
____________________________________________________________________ */

.boxtotale {
  float:right;
  display:block; 
}

.boxtotale_r {
  float:right;
  display:block;

}

.sx  {
  width:100%;
  max-width:100%;
  padding:0 20px;
  float:right;
  display:block;

}

.dx {
  width:100%;
  padding:0 20px;
  float:right;
  display:block;
}

#titolazione {
  width:100%;
  margin-bottom:20px;
}


/*    tipografia generale
____________________________________________ */

/* intarsi */
#manutenzione_spot {
 width:220px;
 left:50%;
 margin-left:-110px;
 
}


/*   TESTATA - dx logo, sx descrizione istituzionale 
     ________________________________________________________________*/
#testata #logo { 
  margin:0;
  padding:0 0 5px 0;
  text-align:center;
  /* implementazione logo in background*/
  background-position: center top; 
} 

#testata #istituzionale h1 { 
  margin:0;
  padding:0 0 0 0;
  text-align:center;  
} 

#testata #istituzionale h2 { 
  margin:0;
  padding:0 0 30px 0;
  text-align:center;  
} 



/*    NAVIGAZIONE -  sx pulsanti                                                
_____________________________________________________________________*/
#navigazione #pulsanti ul { 
  margin:0;
  padding:0;
  float:none;
  text-align:center;
}

#navigazione #pulsanti ul > span { 
  display:block;
}

#navigazione #pulsanti li a, 
.p_corrente {
padding:0px 10px 0px 10px;
line-height:1.25em; /*25.2px */ 
}

/*  NAVIGAZIONE - dx form                                                
_____________________________________________________________________*/
#navigazione #ricerca hr {
margin: 15px 0 0 0;
height:5px;
border:0px;
background-color:rgba(255, 255, 255, 0.18);
-webkit-box-shadow: inset 1px 2px 1px rgba(0, 0, 0, 0.5);
-moz-box-shadow: inset 1px 2px 1px rgba(0, 0, 0, 0.5)!important;
box-shadow: inset 1px 2px 1px rgba(0, 0, 0, 0.5);
-webkit-border-radius: 5px;
-moz-border-radius:5px;
border-radius: 5px;
display:block;
}

#navigazione #ricerca form {  
  text-align:center;
  margin-top:10px;
  padding:10px 0 6px 0;
}

#navigazione #ricerca form input,
#navigazione #ricerca form textarea { 
  width:40%;
  margin:0 10px;
}

#navigazione #form input[type="submit"],
#navigazione #ricerca form input[type="reset"] {
  margin:0 10px;
}


/*    TITOLAZIONE -  dx titoli  in intestazione a piena pagina                                            
_____________________________________________________________________*/
#titolazione > #titolosezione {
  padding:0 20px 10px 20px;
  text-align:center;  
} 

#titolazione > #titolosezione h1 {
  margin:0;
  padding:0;
  display:block;
} 

/*    TITOLAZIONE -  dx titoli  in colonna a dx (a fianco articoli)                                              
_____________________________________________________________________*/
#titolosezionesintetico {
  padding:0 20px 10px 20px;
  text-align:center;  
} 


/* TITOLAZIONE -  sx esplicativo                                                
_____________________________________________________________________*/
#titolazione > #esplicativosezione {
  padding:0 20px;
  text-align:center;
}

#titolazione > #esplicativosezione_form {
  padding:0 20px;
  text-align:center;
}

#esplicativosezione_form form {
  text-align:center;
  
}

/* CONTENUTI - dx collaterali                                                  
_____________________________________________________________________*/
#contenuti #indice { 
  height:auto;
  margin:0; 
  padding:0;
  text-align:center;
  overflow:hidden;
}
#contenuti #indice > aside > nav  { 
  width:100%;
  float:left;
  display:block;
  clear:both;
}

/* etichetta indice - si applica una label al checkbox */
#contenuti #indice > aside > nav > label { 
  position: relative;
  padding-bottom:2px; 
  display:block;
  cursor:pointer;
  color:rgba(229, 219, 164, 0.7);
  -webkit-border-radius:5px;
  -moz-border-radius:5px;
  border-radius:5px;	
  
}
/* sfondo etichetta indice - livello inferiore  */
#contenuti #indice > aside  > nav > label::before { 
  position:absolute;
  content:"";
  width:100%;
  height:100%;
  left:0;
  background:rgba(255, 255, 255, 0.14);
  -webkit-border-radius:5px;
  -moz-border-radius:5px;
  border-radius:5px;	
}

/* etichetta indice - stato hover base - colore sfondo e testo  */
#contenuti #indice > aside > nav > label:hover {
  color:rgba(229, 219, 164, 0.9); 
  background:rgba(255, 255, 255, 0.1);
}

/* etichetta indice - stato attivo base (premuto) - colore sfondo e testo  */
#contenuti #indice > aside > nav > label:active {
  color:rgba(229, 219, 164, 1); 
  background:rgba(255, 255, 255, 0.15);
}
/*etichetta indice: stato hover avanzato: frecce a comparsa sullo stato chiuso  - apri*/
#contenuti #indice > aside > nav > label:hover::after, 
#contenuti #indice > aside  > nav > input:checked + label:hover::after {
   position:absolute;
   content: "\00B7\203A \A \A \A \A \A \A \A \A \A \00B7\203A";    
   width:100%;
   height:100%;
   font-size:1.5em; 
   left:4em;/*centratura manuale frecce => 4.0 con 9(\A)+ 10(spazi) - 4.45em con 10(\A)+ 11(spazi) - 5.3em con 12(\A)+ 13(spazi) ;*/ 
   white-space:pre; 
   -webkit-transform:rotate(90deg); 
   -moz-transform:rotate(90deg);
   -o-transform:rotate(90deg); 
   -ms-transform:rotate(90deg); 
   transform:rotate(90deg); 
}
/*etichetta indice: frecce a comparsa sullo stato aperto - chiudi*/
#contenuti #indice > aside  > nav > input:checked + label:hover::after {
  content:"\2039\00B7 \A \A \A \A \A \A \A \A \A \2039\00B7"; 	
}

/* boxtitoli - base + trasformazione in chiusura (+veloce) */
#contenuti #indice > aside > nav > #boxtitoli { 
  height:0;
  margin:0;
  padding:0;
  position:relative;
  overflow:hidden;
  opacity:0;
  -webkit-transition:height 0.5s ease-in-out, opacity 0.3s ease-in-out;
  -moz-transition:height 0.5s ease-in-out, opacity 0.3s ease-in-out;
  -o-transition:height 0.5s ease-in-out, opacity 0.3s ease-in-out;
  -ms-transition:height 0.5s ease-in-out, opacity 0.3s ease-in-out;
  transition:height 0.5s ease-in-out, opacity 0.3s ease-in-out;     
}

#contenuti #indice > aside  > nav > input:checked ~ #boxtitoli {
  height: auto; 
  max-height: 400px;
  opacity:1;
  -webkit-transition:max-height 1s ease-in-out, opacity 1.5s ease-in-out;
  -moz-transition:max-height 1.5s ease-in-out, opacity 1.5s ease-in-out;
  -o-transition:max-height 1s ease-in-out, opacity 1.5s ease-in-out;
  -ms-transition:max-height 1s ease-in-out, opacity 1.5s ease-in-out;
  transition:max-height 1s ease-in-out, opacity 1.5s ease-in-out;   
  overflow-y:none;    
}

/*lista*/
#contenuti #indice > aside > nav > #boxtitoli > ul {
  height: auto;
  margin:15px 0 10.8px 0px; /*margin:15px 0 10.8px 10px;*/
  padding:0;
  overflow-y:auto; 
  display:block;
}

/*link articoli precedente e successivo navigazione laterale*/
#boxarticoliprimaedopo_nav { 
  margin:0 auto;
}

.tornasu {
  display: none;
}


/*  CONTENUTI - sx materiali                                                  
_____________________________________________________________________*/
#contenuti > #materiali  { 
  margin:0 0 0 0; 
  padding:30px 20px 0 20px;
}

/*bianchi di pagina sulla base dell'interlinea base articolo:
  em = 16px; interlinea = 1.3 em = 20.8 px*/
#contenuti #materiali > section > article { 
  margin:0; 
  padding:10.4px 41.6px 41.6px 41.6px; 
}



/* PIEDIPAGINA  - sx                                           
_____________________________________________________________________*/
#piedipagina #piedesx { 
  margin:0; 
  padding:10px 20px 0 20px;
  text-align:center;
}



/* PIEDIPAGINA  - dx                                           
_____________________________________________________________________*/
#piedipagina #piededx { 
  margin:0;
  padding:5px 20px 0 20px;
  text-align:center;
}

}

/* ALTEZZA RIDOTTA */
@media only screen and (max-height: 880px) { 

.tornasu {
  display: none;
}

}
	
/* PRINT */
@media print {
* {background: transparent !important; color: black !important; text-shadow: none !important; filter:none !important; -ms-filter: none !important}  /*Black prints faster */

#navigazione { display:none; }
#indice { display:none; }
#boxarticoliprimaedopo_sotto {display:none;}

.boxtotale {
  float:none;
  display:block; 
}

.boxtotale_r {
  float:none;
  display:block;
}

.sx  {
  width:100%;
  max-width:100%;
  padding:0 20px;
  float:none;
  display:block;
}

.dx {
  width:100%;
  padding:0 20px;
  float:none;
  display:block;
}

#titolazione { display:none; } 

#testata #logo { display:none; } 

#testata #istituzionale h1 { 
  margin:0;
  padding:0 0 0 0;
  text-align:center;  
} 

#testata #istituzionale h2 { 
  margin:0;
  padding:0 0 30px 0;
  text-align:center;  
} 

#piedipagina #piedesx { 
  margin:0;
  padding:0;
  text-align:center;
  display:none;
}

#piedipagina #piedesx dl { 
  margin:0;
  padding:0;
  text-align:center;
  display:none;
}

#piedipagina #piededx { 
  margin:0 0 0 -20px;
  padding:0;
  text-align:center;
}

#contenuti #materiali > section > article { 
  -webkit-border-radius:none;
  -moz-border-radius:none;
  border-radius:none;
  -webkit-box-shadow:none;
  -moz-box-shadow: none;
  box-shadow:none; 
}

#contenuti #materiali > section > article > footer { 
  display:none;
}

}


/*
EXTRA EXTRA EXTRA
IMMAGINI SCORREVOLI DENTRO ARTICOLO ("ARTICLE") 

!!! VEDI DETTAGLIO IN COPIA EDITOR IN SERVER SVILUPPO !!!

*/

/* contenitore generale */
.contenitore_scroll {
  margin: 0;
  box-shadow: inset 1px 1px 5px rgba(0,0,0,0.25);
  overflow: hidden;
  display: flex;
  align-items: flex-start;  
  aspect-ratio: 1 / 1; 		
  container-type: size;  	
  /*width: 100%;*/
  cursor: pointer;	
}
   
/* classi da associare alle immagini in scorrimento */
/* immagini a scorrimento: regole generali */
*/uso selettori di attributo[ ]: tutte le classi che iniziano (class^) con "immagine_scroll"*/
[class^="immagine-scroll_"]
.immagine-scroll {
  user-select: none; 			 
  pointer-events: none; 		 
  will-change: transform; 		
  animation-play-state: running; 
}

/* immagini a sviluppo orizzontale per scorrimento orizzontale "H": specificit */
.immagine-scroll_H {
  height: 100%; 									
  width: auto;  									
  max-width: none!important; 						
  animation: scroll-orizzontale 90s linear infinite;  												 	 
}

/* immagini a sviluppo verticale per scorrimento orizzontale "V": specificit */
.immagine-scroll_V {
  width: 100%;										
  height: auto;	 									
  animation: scroll-verticale 70s linear infinite;	
}

/* animazioni */
/* container-aware calc: usabile solo se supportato -> moderni browser lo supportano */
@supports (container-type: size) {

 /*imposto animazione orizzontale (da sx a dx) */
  @keyframes scroll-orizzontale {
    0%,5% { transform: translateX(0); opacity:1; }						
    92% { transform: translateX(calc(-100% + 100cqw)); opacity:1; }		
    96% { transform: translateX(calc(-100% + 100cqw)); opacity:1; }		
    98% { transform: translateX(calc(-100% + 100cqw)); opacity:0; }		
    98.1% { transform: translateX(0); opacity:0; }						
    100% { transform: translateX(0); opacity:1; }						
  }

/* imposto animazione verticale da alto a basso (analogo solo con variazione larghezza -> altezza cqw -> cqh  */
@supports (container-type: size) {
  @keyframes scroll-verticale {
    0%,5% { transform: translateY(0); opacity:1; }						
    92% { transform: translateY(calc(-100% + 100cqh)); opacity:1; }		
    96% { transform: translateY(calc(-100% + 100cqh)); opacity:1; }		
    98% { transform: translateY(calc(-100% + 100cqh)); opacity:0; }		
    98.1% { transform: translateY(0); opacity:0; }						
    100% { transform: translateY(0); opacity:1; }						
  }
} /* chiudo verifica supporto */


/* gestione stati di animazone/pausa e verso scorrimento*/
/* PAUSA: sospensione/arresto animazione */
.contenitore_scroll.pausa [class^="immagine-scroll_"] {
  animation-play-state: paused;
}
/* INVERTI: inversione del verso */
.contenitore_scroll.inverti [class^="immagine-scroll_"] {
  animation-direction: reverse;
}


/* controllo generale animazione:*/
/* prefers-reduced-motion */
/* in aderenza a preferenze utente disattivo eventualmente l'animazione 
   (alcuni utenti per motivi vari possono voler disattivati gli elementi in movimento) */
@media (prefers-reduced-motion: reduce) {
  .immagine-scroll { animation: none !important; transition: none !important; }
}

/* supporto animazione */
/* alcuni ambienti possono non supportare le animazioni css:in quel caso le disattivo per evitare effetti imprevisti */
@supports not (container-type: size) {
  .immagine-scroll { animation: none; }
}


