body {
    font-family: var(--font-principale);
    font-size:  var(--size-principale);
    /*line-height: 22px !important*/
}



/*
a:link, a:visited {
    font-family: var(--font-principale);
    font-weight: 400;
    text-decoration: none;
    color:#000099
}
a:hover {
    text-decoration: underline
}
*/
@media screen and (max-width: 1400px) {
    .container {
        max-width: none
    }
}    
#div-nonattiva {
    display: none
}
    
@media screen and (max-width: 700px) {
    #div-attiva {
        display: none
    }
    #div-nonattiva {
        display: block
    }
}    


#principale {
    /*font-family: var(--font-principale);*/
    /*font-size:20px;*/
    min-height: 500px;
    margin-bottom: 100px;
    margin-left: 5%;
    margin-right: 5%
}
.prima{
    background-color: white;
    height: 70px;             
    background: linear-gradient(to bottom, #A8A8A8 0%, #FFFFFF 40px, #FFFFFF 100%);  
    position: relative;
    top:10px
    /*top:-15px*/

}



div.titolo-pagina {
    margin: 0px 5% 30px 5%;
    font-family: var(--font-principale);
    font-size: 35px;
    font-weight: 300;
    color:var(--rossoscuro)
}

.div-testo div {
    font-family: var(--font-principale);
    font-size: var(--size-principale);
    font-weight: 300
}
@media screen and (max-width: 576px) {
    .div-testo div {
        font-size: var(--size-mini);
        text-align: left !important
    }    
}

.quoted {
    /* citazioni o allusioni */
    /*color:#dd4f4c;*/
    background-color: #f1f1f1;    
    /*font-weight: bold*/
}

/* tendine */
.dropdown-menu li a, td.HI, td.HIlink, .labelCampo, .btn-custom  {
    font-family: var(--font-principale);
    font-size: var(--size-mini);
    /*font-size: 18px;*/    
    font-weight: 400;
}



/* Colore durante il clic; nessun cambiamento */
.dropdown-menu li > a:active,
.dropdown-menu li.active > a:active,
.dropdown-menu li.selected > a:active {
  color: #000 !important;
  background-color: #fff !important;
  outline: none !important;
  box-shadow: none !important;
}

/* checkbox in cui non la label non va sotto la casella */
.div-checkbox {
    display: flex;
    align-items: flex-start;
}
.div-checkbox label {
  display: inline-block;
  padding-left: 0px;      /* distanza dalla checkbox */
  text-indent: -5px;     /* rientro della seconda riga */
  margin-left: 5px;      /* compensa il text-indent */
}
.div-checkbox input {
    margin-top: 9px !important;
}
/* corregge il margin-top dell'input in questo caso */
#ul-commenti li div input {
    margin-top: 4px !important
}






a:link.attivo, a:visited.attivo, a:link.attivo:hover  {
    /*background:#dd4f4c !important;*/
    font-weight: 600 !important;
    color:#fff !important;
}


/* pulsanti */
.btn-success {
    font-family: var(--font-principale);
    font-size: var(--size-principale);
    /*background: #dd4f4c;*/ 
    background: var(--rossoscuro); 
    border: none;
    padding: 6px 15px 6px 15px;
    border-radius: 20px;
    white-space: nowrap
}

.btn-success:hover {
    background:#bf0001 !important
}
.btn-success:disabled {
    background:#da8b8d !important
}
.btn-primary {
    color:#285d7d !important
}
.btn-big {
    padding: 10px 20px 10px 20px;
    font-size: 20px
}
	
/* personalizzazione del popover */	
.popover-dark {
  background-color: #000;
  color: #fff;
  border: 1px solid #555;
  --bs-popover-bg: #000;
  --bs-popover-border-color: #555;
  --bs-popover-header-bg: #111;
  --bs-popover-header-color: #eee;
  --bs-popover-body-color: #fff;
  font-size: 17px;
  padding: 0
}
.popover-dark .popover-arrow::before {
  border-top-color: #000 !important;
}

/* sottolineatura della glossa con popover*/
.glossa-popover {
	border-bottom: .5px solid #999;
	cursor: help
}
	
	
.panel {
  margin-bottom: 20px;
  background-color: #fff;
  border: 1px solid #dedede;
  border-radius: 4px;
  -webkit-box-shadow: 0 1px 1px rgba(0, 0, 0, .05);
  box-shadow: 0 1px 1px rgba(0, 0, 0, .05);
}       



/* testo del commento per occorrenze */
.commentatore{
    /* pannello a fondo rosa con il contesto breve */
    /*background-color: #eea6a4;*/
    background-color: #f1f1f1;
    padding: 30px 30px 20px 30px;
    margin-bottom: 10px        
}
.commentatore .titolo, .testo-glossa .titolo {
    font-family: var(--font-principale);
    font-weight: 600;
    font-size: var(--size-principale);
}
.commentatore .luogo, .testo-glossa .luogo {
    font-family: var(--font-principale);
    font-size: 20px;
    font-weight: 300;
}

.commentatore .glossa, .testo-glossa .glossa {
    font-family: var(--font-principale);
    font-size:var(--size-mini);
    cursor: pointer
}


a:link.espandi, a:visited.espandi, a:link.riduci, a:visited.riduci  {
    font-family: var(--font-principale);
    font-weight: 400;
    text-decoration: none;
    color:#000099
}
a:hover.espandi, a:hover.riduci {
    text-decoration: underline
}