/* Reset */
*{
margin: 0;
padding: 0;
border: 0;
font-size: 100%;
}

/*----------------------------------------------------------------------------------------------------*/

/* Homepage */
.clear{
clear: both;
}
    
body{
font-family: 'Domine', serif;
font-weight: 400;
font-size: 14px;
line-height: 21px;
}

.fascia{
background-color: #3E3E3D;
}

.container{
width: 960px;
margin: 0 auto;
}

/* Header */
header{
height: 60px;
background-color: #3E3E3D;
}

header img{
float: left;
padding: 15px 0px;
margin-left: 20px;
z-index: 10;
position: relative;
}

nav{
color: white;
float: left;
padding: 20px 0px;
margin-left: 50px;
z-index: 10;
position: relative;
}

nav ul li{
list-style: none;
display: inline;
margin-right: 20px;
}

nav ul li a{
color: white;
text-decoration: none;
}

nav ul li a:hover{
border-bottom: #1C7EBD solid 2px;
}

.attivo{
border-bottom: #1C7EBD solid 2px;
}

/* Banner */
#banner{
height: 500px;
border-bottom: #1C7EBD solid 2px;
}

#foto{
margin-top: -60px;
}
        
#box{
width: 390px;
height: 140px;
background-color: #1C7EBD;
opacity: 0.9;
border-radius: 20px 20px 0px 0px;
padding: 30px;
margin: -205px 0px 0px 20px;
color: white;
line-height: 25px;
transition: ease all 0.5s;
}

#box:hover{
border-radius: 0px;
}
    
#box a{
text-transform: uppercase;
font-family: Helvetica, Arial;
font-size: 10px;
color: white;
float: right;
text-decoration: none;
}
        
#box a:hover{
border-bottom: 1px solid white;
}

#box h4{
font-weight: 400;
}

/* Corpo pagina */
#centrale{
padding: 30px 0; /* Gestisce lo spazio verticale (sopra/sotto) */
}

h1{
font-size: 50px;
color: #1C7EBD;
margin: 20px;
}

a{
text-decoration: none;
color: inherit;
}
            
.colonna{
margin: 0 15px; /* Gestisce lo spazio orizzontale (dx/sx) */
float: left;
}
            
#centrale .colonna{
width: 290px;
text-align: center;
}

.img{
width: 250px;
height: 250px;
background-color: #ccc;
border-radius: 20px;
margin: auto;
margin-top: 30px;
transition: ease all 0.5s;
}

.img:hover{
border-radius: 0px;
}
        
.colonna h3{
color: #1C7EBD;
font-family: Helvetica, Arial, sans-serif;
font-weight: 700;
font-size: 20px;
padding: 10px;
}
    
.freccia{
font-size: 30px;
color: #1C7EBD;
}

#tornasu{
color: #1C7EBD;
text-transform: uppercase;
text-align: center;
font-family: Helvetica, Arial;
font-size: 10px;
padding: 10px;
}

#tornasu a{
list-style: none;
text-decoration: none;
color: #1C7EBD;
}

/* Footer */
footer{
height: 60px;
background-color: #3E3E3D;
color: white;
}
        
footer p{
font-family: Helvetica, Arial;
font-size: 12px;
padding: 19px 0px;
margin-left: 20px;
float: left;
}

#social{
float: right;
z-index: 9;
position: relative;
}

#social li{
list-style: none;
float: left;
margin-right: 20px;
width: 30px;
height: 40px;
}

#social li a{
display: block;
height: 60px;
text-indent: -9999%;
background-position: center center;
background-repeat: no-repeat;
opacity: 0.6;
}

#social li a:hover{
opacity: 1;
}

#fb{
background-image: url(img/fb.png);
}

#tw{
background-image: url(img/tw.png);
}

#gp{
background-image: url(img/g+.png);
}



.spaziotesto{
margin-bottom: 15px;
}

hr {
border: 0;
height: 0;
border-top: 1px solid rgba(0, 0, 0, 0.1);
border-bottom: 1px solid rgba(255, 255, 255, 0.3);
margin-top: 15px;
}

/*----------------------------------------------------------------------------------------------------*/

/* Chi è */
#centrale_chi{
padding: 30px 0;
}      

 #centrale_chi img{
border-radius: 20px;
margin-top: 30px;      
}

/*----------------------------------------------------------------------------------------------------*/

/* Opere */
#lista_opere li{
padding: 20px 0;
float:right;
}

#lista_opere {
list-style: none;
margin: 20px 15px 0 15px;;
}

.testo_opera{
margin-top: 5px;
text-align: justify;
float:right;
width:720px;
}

.testo_opera h3{
color: #1C7EBD;
font-family: 'Domine', serif;
font-weight: 700;
font-size: 20px;
padding-bottom: 5px;
}
        
.testo_opera p{
padding-left: 10px;
}
        
.foto_opera{
width: 170px;
height: 170px;
background-color: #ccc;
border-radius: 20px;
float:left;
margin: 0 30px 0 0;
}
        
.data_opera {
padding-bottom: 10px;
}

/*----------------------------------------------------------------------------------------------------*/

/* Eventi & Omaggi - Archivio*/
#archivio{
    padding: 30px 0;
}

#archivio .colonna{
    width: 210px;
    text-align: center;
}

.fotoarchivio{
    width: 170px;
    height: 170px;
    background-color: #ccc;
    border-radius: 20px;
    margin: auto;
    margin-top: 30px;
    transition: ease all 0.5s;
}

.fotoarchivio:hover{
border-radius: 0px;
}

/*----------------------------------------------------------------------------------------------------*/

/* Eventi & Omaggi - pagina singola*/
/*  Per togliere il pixel in alto tra header e immagine banner */

#cover{
margin-top:-1px;
}

        
/* Questoè l'h1 nel box azzurro */
#titolo_post{
color:white; line-height: 44px;
font-size: 40px;
margin: 0;
}
        
/* Invece di link a > Paragrafo */        
#box p{
float:right; margin-top: 20px;
font-family: Helvetica, Arial;
font-size: 15px;
}      
        
/*Luogo, data, organizzatori, lo span è per il colore azzurro, il link rimanda alla mappa del luogo...*/ 
.tag{
font-size: 20px;
margin: 20px 0 0 50px;
color: #3E3E3D;
font-family: Helvetica, Arial;
}

.tag span{
color: #1C7EBD;
}  

/* Gestisce lo spazio verticale (sopra/sotto), Modificato perché c'era troppo bianco, nuovo nome a classe */        
#centrale_post{
padding: 10px 0;
}      

#centrale_post img{
border-radius: 20px;
margin-top: 30px;      
} 
            
/*Colonna immagini*/ 
.immagini_eventi{
margin: 0 15px; /* Gestisce lo spazio orizzontale (dx/sx) */
float: left;
width: 290px;
font-family: Helvetica, Arial;   
text-align: center;
}
        
figcaption {
margin-top: 10px;
font-size: 12px;
}      
        
/*Paragrafo di testo*/       
.testo {
text-align: justify;
float: right;
margin: 30px 15px 0 15px;
}
        
.eventi {
width: 610px;
}
        
.testo h3{
font-size: 18px;
color: #1C7EBD;
}          

/*   Immagini OPERE     */
.immagini_omaggio{
margin: 0 15px; /* Gestisce lo spazio orizzontale (dx/sx) */
float: left;
width: 450px;
font-family: Helvetica, Arial;   
text-align: center;
}
        
.omaggioimg{
width: 420px;
height: 420px;
background-color: #ccc;
border-radius: 20px;
margin: auto;
margin-top: 30px;
transition: ease all 0.5s;
}   


/*Largezza colonna TESTO DI OMAGGIO*/      
.omaggio {
width: 450px;
}
        
/*Link a sito esterno*/ 
#sitoesterno {
font-family: Helvetica, Arial;
color: #1C7EBD;
text-decoration: none;
float:right;
margin-top: 20px;
}
       
#sitoesterno:hover{
text-decoration: underline;
}  

/*----------------------------------------------------------------------------------------------------*/

/* Fondazione */
h2{
color:#1c7ebd; 
font-size: 30px;
font-weight: 700;
margin: 20px;
}
        
#centrale h3{
color: #1C7EBD;
font-weight: 700;
font-size: 20px;
padding: 10px;
}

.origini{
text-align: justify;/*allineo testo nel div origini*/
margin: 0 20px;
}

iframe{
float: left;
margin:15px 20px;
}

.indirizzo{
margin-top: 15px;
}

p img{
margin-right: 5px;
margin-bottom: -5px;
}

.staff{
width:720px; 
margin:auto;
}

.fotostaff{
    width: 170px;
    height: 250px;
    background-color: #ccc;
    border-radius: 20px;
    margin: auto;
    margin-top: 30px;
}
        
#origini{
text-decoration: none;}/*create id x link ancore*/
#dovesiamo{
text-decoration: none;}/*create id x link ancore*/
#staff{
text-decoration: none;}/*create id x link ancore*/