/* css per colorare le barre di scorrimento del browser! */
/* Firefox */
html {
    /*scrollbar-width: thin; tolto per lasciare la barra dello spessore standard */
    scrollbar-color: #bdbdbd #f5f5f5;
}

html:hover {
    scrollbar-color: #0C96B4 #f5f5f5;
}

/* Chrome, Edge, Safari */
::-webkit-scrollbar {
    width: 8px;
}

::-webkit-scrollbar-track {
    background: #f5f5f5;
}

::-webkit-scrollbar-thumb {
    background: #bdbdbd;
    border-radius: 999px;
    transition: background-color 0.2s ease;
}

/* quando si passa sopra la scrollbar */
::-webkit-scrollbar-thumb:hover {
    background: #0A7F98;
}

/* quando si trascina */
::-webkit-scrollbar-thumb:active {
    background: #086A80;
}
/* FINE css per colorare le barre di scorrimento del browser! */
/* == TIPOGRAPHY == */
h1, h2, h3, p {
    font-family: 'InterDisplay-Light' !important;
}
h1 {
    font-size: 2rem;
}
.article-details .article-header h1 {
    font-size: 2rem;
}
/* da 2 a 1.6 */
.h2, h2 {
    font-size: 1.6rem;
}
/* da 1.75 a 1.4 */
.h3, h3 {
    font-size: 1.4rem;
}
@media only screen and (max-width: 576px) {
h1 {
    font-size: 1.6rem;
}
  .article-details .article-header h1 {
    font-size: 1.6rem;
}
.h2, h2 {
    font-size: 1.4rem;
}
}
@media only screen and (max-width: 1099px) {
.h3, h3 {
    font-size: 1.2rem;
}
}
/* font custom */
@font-face {
    font-family: 'InterDisplay-Light';
    src: url('../fonts/InterDisplay-Light.woff2') format('woff2');
}
/* nuovo font anche per gli elenchi puntati */
ul {
    font-family: 'InterDisplay-Light';
}
/* == FINE TIPOGRAPHY == */
/* custom hr con margini top e bottom aumentati */
hr {
        margin: 30px 0;
}
/* custom link */
a {
  color: #0C96B4;
  text-decoration: none;
  font-weight: bold;
}
a:hover {
  color: #0C96B4;
  text-decoration: underline;
}
/* questa per far sì che le regole qui sopra non si applichino anche al footer custom */
#sp-footer-custom a {
  text-decoration: none;
  font-weight: normal;
}
/* questa per far sì che le regole qui sopra non si applichino anche al footer col copyright */
#sp-footer a {
  text-decoration: none;
  font-weight: normal;
}
/* per normalizzare i link del breadcrumb */
.breadcrumb a {
  text-decoration: none;
  font-weight: normal;
}
/* per normalizzare i link dei bottoni e cambiare il colore di sfondo a mouse over... */
.btn:hover {
  text-decoration: none;
  background-color: #0C96B4;
  border-color: #0C96B4;
}
/* per normalizzare i link del menu off-canvas... */
.offcanvas-menu.border-menu .offcanvas-inner ul.menu > li > a, .offcanvas-menu.border-menu .offcanvas-inner ul.menu > li > .nav-header {
  text-decoration: none;
  font-weight: normal;
}
/* per normalizzare i link delle card pagina docenti */
.uk-card-body .uk-scope .uk-link, .uk-scope a {
    font-weight: 500;
}
/* FINE custom link */
/* == CUSTOM MENU DESKTOP CSS == */
/* un bel background blu-logo a mouse hover delle voci di menu principali */
.sp-megamenu-parent > li:hover > a {
    color: white !important;
    background-color: #0C96B4;
    height: 32px;
    line-height: 32px;
    display: flex;
    align-items: center;
    padding: 0 20px;
    margin: 0 1px;
    border-radius: .15em;
}
/* un bel background blu-logo alla voce di menu principale attiva. lo stesso blu-logo del mouse hover */
.sp-megamenu-parent > li.active > a {
    font-weight: 500;
    background-color: #0C96B4; 
    color:white !important;
    height: 32px;
    line-height: 32px;
    display: flex;
    align-items: center;
    padding: 0 20px;
    margin: 0 1px;
    border-radius: .15em;
}
.sp-megamenu-parent > li > a {
    font-weight: 500;
    height: 32px;
    line-height: 32px;
    display: flex;
    align-items: center;
    padding: 0 20px;
    margin: 0 1px;
    letter-spacing: .15em;
}
/* la regola qui sotto vale per i submenu */
.sp-megamenu-parent > li.active > a, .sp-megamenu-parent > li.active:hover > a {
    color: #A82606;
}
/* codice per il padding dell'ultima voce di menu a destra */
.sp-megamenu-parent>li:last-child>a {
    padding: 0px 15px 0px 15px; /* di default 0px 0px 0px 15px */
}
/* == END CUSTOM MENU DESKTOP CSS == */
/* css menu burger open e colse icon offcanvas */
/* cambio colore */
.burger-icon > span {background-color: #00718C;}
.offcanvas-active .burger-icon > span,
#modal-menu-toggler.active .burger-icon > span 
{ background-color: #00718C;}
/* cambio dimensioni */
.burger-icon { width: 30px; } 
 .burger-icon > span {height: 3px; }
/* FINE css menu burger open e colse icon offcanvas */
/* regole per header */
#sp-header {
    background: #ffffff;
}
#sp-header.full-header {
  padding-left: 25px !important;
  padding-right: 25px !important;
}
@media (max-width: 576px) {
  #sp-header.full-header {
    padding-left: 5px !important;
    padding-right: 5px !important;
  }
}
/* FINE regole per header */
/* regole per il footer - quello col copyright */
#sp-footer {
    background: #003846;
    color: lightgray;
    border-top: 1px solid lightgray;
    font-size: .8em;
}
#sp-footer .container-inner {
  padding: 15px 0;
  border-top: 0px solid rgba(255,255,255,.1);
}
#sp-footer p {
    margin-bottom: .5rem;
    font-size: .9rem;
}
#sp-footer a {
    color: white !important;
}
#sp-footer a:hover {
    color: lightgray !important;
}
/* fine regole per il footer */
/* regole per il footer-custom */
#sp-footer-custom {
    background: #00718C; /* era #007895 più chiaro */
    color: #fff;
    padding: 20px 0 10px;
}
#sp-footer-custom p {
    margin-bottom: .5rem;
    font-size: .85rem;
}
#sp-footer-custom a {
    color: white !important;
}
#sp-footer-custom a:hover {
    color: lightgray !important;
}
/* fine regole per il footer-custom */
/* css sezione slide */
/* #sp-slide-top {
  background-color: #F4F3F4;
  padding: 5px 0;
} */
/* css bottoni back docenti */
.customback {
  border-color: #0C96B4;
  color: #0C96B4;
}
.customback:hover {
  color: white;
  background-color: #0C96B4;
  border-color: #0C96B4;
}
/* custom breadcrumb */
.breadcrumb {
    background-color: transparent;
    border-radius: 0;
    line-height: 1px;
    font-size: .8rem;
    float: right;
}
@media only screen and (max-width: 768px) {
.breadcrumb {
    float: left !important;
}
    }
@media only screen and (max-width: 371px) {
    .breadcrumb {
        padding-left: 0 !important;
        font-size: .7rem;
    }
}
/* FINE custom breadcrumb */
/* cambiato il colore della voce home del breadcrumb */
.pathway {
    color: #0C96B4;  
}
/* tolta l'icona che compare al posto del "sei qui" nel breadcrumb */
.divider.icon-location.icon-fw {
    display: none;
}
/* aggiunta icona fontawesome */
.breadcrumb::before {
  font-family: "Font Awesome 6 Free";
  font-weight: 900;
  content: "\f111";
  color: #0C96B4;
  padding-right: 5px;
  padding-top: 2px;
  font-size: .3rem;
}
/* FINE custom breadcrumb */
/* css WIDGETKIT */
/* diminuito il padding nelle card della grid */
@media (min-width: 1200px) {
  .uk-scope .uk-card-body {
    padding: 15px 15px !important;
  }
}
.uk-scope .uk-card-body {
  display: flow-root;
  padding: 15px 15px !important;
}
/* tolto margin-bottom tag p nel contenuto delle card grid categorie docenti */
.uk-scope p {
  margin: 0px !important;
  font-weight: normal;
}
/* css per le card grid categorie docenti */
.uk-card.uk-card-default.uk-card-hover.uk-transition-toggle:hover {
    background-color: #0C96B4;
    color: white;
}
/* messo un bordo chiaro alle card-default */
.uk-scope .uk-card-default {
  border: solid 1px #c1c1c1;
}
/* stondato gli spigoli delle card */
.uk-scope .uk-card-default {
  border-radius: .3em;
  overflow: hidden;
}
/* css come classe pagina home per la grid */
.gridhome .uk-scope .uk-grid {
    justify-content: space-around;
}
/* ridotto font-size h3 */
.uk-scope .uk-h3, .uk-scope h3 {
    font-size: 1.35rem !important;
}
/* FINE css WIDGETKIT */
/* classe per box-shadow foto docenti */
.customshadow {
  box-shadow: rgba(0, 0, 0, 0.35) 2.4px 2.4px 3.2px;
}
/* css accordion bootstrap 5 pagina faq */
/* icona prima del testo nell'header dellìaccordion */
/*.accordion-button::before {
  font-family: "Font Awesome 6 Free";
  font-weight: 900;
  content: "\f111";
  color: #000;
  padding-right: 1.3em;
  padding-top: 2px;
  font-size: .3rem;
}*/
.accordion-item,
.accordion-button {
  border-left: 0 !important;
  border-right: 0 !important;
  border-radius: 0 !important;
}
.accordion-button:not(.collapsed) {
  color: whitesmoke; /* Colore del testo scuro di default */
  background-color: #0C96B4; /* Sfondo bianco di default */
  box-shadow: inset 0 -1px 0 rgba(0, 0, 0, .125); /* Mantiene la riga divisoria inferiore */
}
.accordion-button.collapsed:hover {
    color: whitesmoke;
    background-color: #0C96B4;
    box-shadow: inset 0 -1px 0 rgba(0, 0, 0, .125);
}
.accordion-button::after {
  background-image: none !important;
  content: "+"; /* Mostra il segno più di default */
  font-size: 2em; /* Regola la dimensione del segno - era 1.5rem */
  font-weight: normal; /* era bold */
  line-height: 1;
  display: flex;
  align-items: center;
  justify-content: center;
  transform: none !important; /* Impedisce la rotazione della freccia originale */
}
/* Cambia il segno in meno quando l'accordion è aperto */
.accordion-button:not(.collapsed)::after {
  content: "-"; /* Usa il carattere corretto del segno meno (HTML −) */
  font-size: 4em; /* Regola la dimensione del segno */
  font-weight: normal;
  line-height: 1;
}
/* FINE css accordion bootstrap 5 pagina faq */
/* css off-canvas */
/* colori voci di menu */
.offcanvas-menu .offcanvas-inner ul.menu li.active a  { background-color: #0C96B4; 
    color: white !important;  } 
.offcanvas-menu .offcanvas-inner ul.menu > li a:hover  { color: #0C96B4; }
.offcanvas-menu .offcanvas-inner ul.menu > li a  { text-transform: uppercase; }
.offcanvas-menu .offcanvas-inner ul.menu > li a:hover {
    background-color: #0C96B4; 
    color: white !important; 
}
/* icone voce attiva */
/*.offcanvas-menu .offcanvas-inner ul.menu li.active a::before {
  font-family: "Font Awesome 6 Free";
  font-weight: 900;
  content: "\f068";
  color: #0C96B4;
  padding-right: 10px;
  font-size: px;
}
.offcanvas-menu .offcanvas-inner ul.menu li.active a::after {
  font-family: "Font Awesome 6 Free";
  font-weight: 900;
  content: "\f068";
  color: #0C96B4;
  padding-left: 10px;
  font-size: px;
}*/
/* sfondo off-canvas */
.offcanvas-menu {
    height: 100%;
    width: 300px;
    background-color: #fff !important;
    color: #252525;
    background: url(/../images/logo-sfondo-menu-mobile.webp);
    background-repeat: no-repeat;
    background-size: cover;
    background-position: left bottom;
    border-left: solid 2px lightgray;
}
/* FINE css off-canvas */
/* QUI SOPRA LE NUOVE REGOLE CSS */
.sp-megamenu-parent .sp-has-child.open > .sp-dropdown{ display: block; } 

/* Allinea a destra il logo nella sezione supertop */
.floatlogo {
    float: right;
}
/* Regola per centrare l'immagine nel banner in cima ad ogni pagina */
#sp-supertop {
    margin-bottom: -10px;
    padding: 5px 0 0;
}
/* Messo un bordo inferiore all'header così stacca dalla pagina! Ora tolto perché ne ho messo uno diverso per ogni sezione! 
#sp-header.header-sticky {
    border-bottom: solid 2px #7A1237;
} */
#logotest {
    display: none;
}
/* Tutte maiuscole le voci di menu principale. Quelle dei submenu restano con la sola prima lettera maiuscola */
.sp-megamenu-parent > li > a, .sp-megamenu-parent > li > span {
    text-transform: uppercase;
}
/* Ho ridotto a 30px il solito padding top e bottom da 100px! */
#sp-main-body {
    padding: 30px 0;
}


/* Ho modificato, snellendolo, font-size e font-weight del titolo dei moduli in posizione right */
#sp-left .sp-module .sp-module-title, #sp-right .sp-module .sp-module-title {
    margin: 0 0 30px;
    padding-bottom: 20px;
    font-size: 16px;
    font-weight: 600;
    border-bottom: 1px solid #f3f3f3;
    font-family: 'Abel', sans-serif;
}
/* Ho modificato, snellendolo, font-size e font-weight del titolo dei moduli in posizione bottom che ora sono uguali a quelli in posizione right */
#sp-bottom .sp-module .sp-module-title {
    font-weight: 600;
    font-size: 16px;
    margin: 0 0 30px;
    color: black;
}
#sp-bottom {
    background-color: #F4F3F4 !important;
    color: #0f0e0e;
}
/* margin-top per la colonna dx che altrimenti si attacca al content da mobile */
@media only screen and (max-width: 991px) {
 #sp-right .sp-module:first-child {
    margin-top: 30px;
  }
}
/* Ho modificato, snellendolo, font-weight (era 600) e text-transform 8era uppercase)delle voci di submenu del megamenu */
.sp-megamenu-parent .sp-mega-group > li > a {
    display: block;
    text-transform: none;
    font-size: 14px;
    font-weight: 100;
    margin-bottom: 10px;
}
/* Sfondo delle voci di submenu nel megamenu a mouse over */
.sp-megamenu-parent .sp-mega-group > li > a:hover {
    background-color: lightgray;
    transition: .3s;
    border-radius: .25em;
}
.sp-megamenu-parent .sp-mega-group > li > a {
    padding-left: 10px !important;
}
/* Messo un colore di sfondo del dropdown megamenu, invece del bianco originale */
.sp-megamenu-parent .sp-dropdown .sp-dropdown-inner {
    background: #f2f4f3;
}
/* Sfondo voci di submenu a mouse over */
.sp-megamenu-parent .sp-dropdown li.sp-menu-item:hover {
    background-color: lightgray;
    transition: .5s;
    border-radius: .25em;
}
.sp-megamenu-parent .sp-dropdown li.sp-menu-item a {
   padding-left: 10px !important;
}
/* abbassato il menu offcanvas */
.offcanvas-menu {
    padding-top: 30px;
}

/* Ho aggiunto un margin-top per separare la sezione title dall'header e messo un colore di background 
    #sp-title {
    min-height: 0;
    padding-top: 20px !important;
    background-color: #F4F3F4 !important;
} */


/* messo un bordino allo scroll-to-top */
.sp-scroll-up {
    border: solid 1px lightgray;
}

/* Eliminato il copyright di default del template! 
.sp-copyright {
    display: none;
} */


/* cambio colore testo readmore a mouse over */
.article-list .article .readmore a:hover, .article-list .article .readmore a:active, .article-list .article .readmore a:focus {
    color: lightgray;
}

/* diminuito padding e messo bordo più visibile box articoli visualizzazione blog */
.article-list .article {
    padding: 10px;
    border: 1px solid #CDCDCD;
}
/* due regole per i bottoni della navigazione nella visualizzazione blog */
.pager > li a {
    border: 1px solid #CDCDCD;
}
.pager > li a {
    padding: .5rem 1rem;
    border-radius: .25em;
}
/* CSS MODULI MENU POS RIGHT!!! */
#sp-right .sp-module ul > li a:hover {
    background-color: lightgray;
    color: black;
}
#sp-right .sp-module ul > li.active a {
    background-color: #7A1237;
    color: white !important;
     border-radius: .25em;
    border: 1px solid #7A1237;
}
#sp-right .sp-module ul > li a {
    padding-left: 10px;
    border: 1px solid lightgray;
    border-radius: .25em;
}
/* FINE CSS MODULI MENU POS RIGHT! */

/* CSS MODULI POS RIGHT */
/* riduzione margin-top e padding moduli pos right */
#sp-left .sp-module, #sp-right .sp-module {
    margin-top: 15px;
    padding: 20px !important;
}
/* "abbassata" un po' tutta la colonna dx coi moduli pos right 
#sp-right .sp-module:first-child {
    margin-top: 10px !important;
} */
/* FINE CSS MODULI POS RIGHT */

/* == ICONA BURGER OPEN E CLOSE MENU OFFCANVAS == */
/* immagine burger al posto di quella fontawesome di sistema */
.fa-bars::before {
    content: "" !important;
    display: block;
    background: url(/images/burger-circle-32.png) no-repeat;
    width: 48px;
    height: 48px;
    float: right;
    margin-top: 14px;
    margin-right: -15px
}
/* immagine al posto dell'icona close fontawesome di sitema */
.fa-remove::before {
    content: "";
    display: block;
    background: url(/images/close-icon-32.png) no-repeat;
    width: 32px;
    height: 32px;
}
/* distanza dal margine destro dell'offcanvas */
body.ltr .close-offcanvas {
    right: 35px;
}
/* regola per nascondere i background dell'icona che erano impostati nel template */
.close-offcanvas {
    background: transparent !important;
}
/* == FINE ICONA BURGER E CLOSE MENU OFFCANVAS == */


/* dopo l'aggiornamento di HU 1.1 comparivano due righe/border con ampio padding sotto il titolo dell'articolo anche se non sono attivate le icone social...! Tolto il tutto...! */
.article-details .article-ratings-social-share {
    padding: 0;
    border-top: 0px solid #f5f5f5;
    border-bottom: 0px solid #f5f5f5;
    margin-bottom: 0rem;
}


/* Bottoni custom modificando quelli di Bootstrap4 */
.btn-mc {
    color: #ffffff;
    background-color: #C8B25E !important;
    border-color: #f8f9fa;
}
.btn-mc:hover {
    color: #e8e8e8;
    background-color: #928245 !important;
    border-color: #dae0e5;
}
.btn-ti {
    color: #ffffff;
    background-color: #1C7790 !important;
    border-color: #f8f9fa;
}
.btn-ti:hover {
    color: #e8e8e8;
    background-color: #155769 !important;
    border-color: #dae0e5;
}
/* FINE bottoni custom */
.card {
    position: relative;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-direction: column;
    flex-direction: column;
    min-width: 0;
    word-wrap: break-word;
    background-color: transparent; /* Lo sfondo era bianco */
    background-clip: border-box;
    border: 0px solid rgba(0,0,0,.125); /* ho tolto il bordo che era di 1 px */
    border-radius: .25rem;
}


/* Regole custom per iCagenda */
.ic-label {
    display: table-cell;
    font-weight: bold;
    min-width: 110px;
    display: none !important;
}
.ic-divCell {
    font-weight: bold;
    padding: 1px 5px;
    font-weight: bold;
}
.ic-info {
    background: transparent none repeat scroll 0 0;
    border-left: 0px solid #ccc;
    border-radius: 0px;
    margin-bottom: 10px;
    padding: 1%;
}
.ic-align-center {
    text-align: left;
}
#ic-list-of-dates {
    display: none;
}
/* tolta la parola DATA nel popup eventi */
.ictip-date-lbl {
    display: none
}
/* tolti i numeri dei posti e delle prenotazioni sotto il testo nella pagina evento */
.ic-divRow.ic-info-tickets-left {
   display: none;
}
.ic-divRow.ic-info-tickets {
   display: none;
}

/* cambio colore chiudi nel popup evento dal calendario */
#ictip a.close {
    color: #1C7790 !important;
}
/* tolto bottone torna all'evento nella schermata di successo della registrazione */
.ic-registration-complete-buttons .ic-btn-success {
   display: none !important;
}
/* aggiunto testo ore prima dell'ora numerica popup */
#ictip .ictip-time:before {
    content:"ore"
}
/* tolti i numeri dei posti nel popup */
.regButtons.ic-reg-buttons {
  display: none !important;
}
/* ingrandito il bottone prenota nella pagina dell'evento */
.ic-registration-box .ic-btn-small.ic-btn-success {
    padding: 3px 9px;
    font-size: 18px;
    line-height: 16px;
    background-image: linear-gradient(to bottom,#1C7790,#1C7790);
}
.ic-registration-box .ic-btn-small.ic-btn-success:hover {
    padding: 3px 9px;
    font-size: 18px;
    line-height: 16px;
	background-color: #1C7790;  
}
/* riquadro evento per la prenotazione */
#icagenda.ic-event-view {
  margin-bottom: 20px;
  border: solid 1px #C8B25E;
  border-radius: .25em;
  padding: 10px;
  background-color: rgba(221,221,221,0.3);
}
/* FINE regole custom per iCagenda */
/* Aggiunto z-index alla galleria SP Easy Image Gallery che altrimenti stava sotto al menu... */
.speasyimagegallery-modal-wrapper {
    z-index: 9999 !important;
}
/* Un semplice effetto di variazione di opacità dell'immagine con transizione tra i due stati. Usata nel modulo coi due loghi in home page. */
.opacity:hover {
    opacity: 0.8;
    filter: alpha(opacity=50); /* For IE8 and earlier */
    transition: all ease-out 0.5s;
    -webkit-transition: all ease-out 0.5s;
    transition: all ease-in 0.5s;
    -webkit-transition: all ease-in 0.5s;
}
.opacity {
    opacity: 1;
    filter: alpha(opacity=100); /* For IE8 and earlier */
    transition: all ease-out 0.5s;
    -webkit-transition: all ease-out 0.5s;
    transition: all ease-in 0.5s;
    -webkit-transition: all ease-in 0.5s;
}
q{
   quotes: "\00ab" "\00bb";
}
/* ==Classi css per prima lettera di una parola== */
/*.firstcharacter {
  color: red;
  float: left;
  font-family: Georgia;
  font-size: 60px;
  line-height: 65px;
  padding-top: 0px;
  padding-right: 8px;
  padding-left: 3px;
}*/
.firstcharacter {
  /*color: red;*/
  float: left;
  /*font-family: Georgia;*/
  font-size: 250%;
  line-height: 47px;
  padding-right: 8px;
  /*padding-left: 1%;*/
}
/* FINE==Classi css per prima lettera di una parola== */
.speasyimagegallery-gallery-item-title .paolo {
    display: none;
    color: #fff;
    margin: 0;
    padding: 0;
    font-size: 13px;
    line-height: 1.2;
    font-weight: 700;
    letter-spacing: 1px;
}

/* css per il form di iscrizione alla newsletter di mailchimp */
#mc_embed_signup {
    font: 16px 'PT Sans', sans-serif !important;
    line-height: 24px !important;
}
#mc-embedded-subscribe-form {
    margin-top: -20px !important;
}

/* css per far scomparire il titolo sulla miniatura immagine di SP Easy Image gallery solo nel modulo La Storia */
.galleriastoria .speasyimagegallery-gallery-item-title {
  display: none !important;
 }

/* == HOVER IMAGE EFFECT! == */
/* utilizzato nelle quattro immagini in riga nella home */
/********* Simple or original overlay *******/

/* Main container */
.overlay-image {
 position: relative;
 width: 100%;
}

/* Original image */
.overlay-image .image {
 display: block;
 width: 100%;
 height: auto;
}

/* Original text overlay */
.overlay-image .text {
 color: #fff;
 font-size: 30px;
 line-height: 1.5em;
 text-shadow: 2px 2px 2px #000;
 text-align: center;
 position: absolute;
 top: 50%;
 left: 50%;
 transform: translate(-50%, -50%);
 width: 100%;
}

/********* Overlay on hover *******/

/* New overlay on hover */
.overlay-image .hover {
 position: absolute;
 top: 0;
 height: 100%;
 width: 100%;
 opacity: 0;
 transition: .5s ease;
}

/* New overlay appearance on hover */
.overlay-image:hover .hover {
 opacity: 1;
}

/********* Background and text only overlay on hover *******/

.overlay-image .normal {
 transition: .5s ease;
}
.overlay-image:hover .normal {
 opacity: 0;
}
.overlay-image .hover {
 background-color: rgba(0,0,0,0.5);
}
/* == FINE HOVER IMAGE EFFECT! == */


/* == CSS MODULI AUDIO NPOS RIGHT == */
/* ridotto il padding standard per far entrare il player mp3 */
.audiopadding {
    padding: 10px !important;
}
/* classe per il titolo p messo a mano sul modulo */
.moduletitleaudio {
    margin: 0 0 30px;
    padding-bottom: 20px;
    font-size: 16px;
    font-weight: 600;
    border-bottom: 1px solid #f3f3f3;
}
/* classe per il titolo p messo a mano sul div negli articoli */
.titolodivaudio {
    margin: 0 0 20px;
    padding-bottom: 10px;
    font-size: 16px;
    font-weight: 600;
    border-bottom: 1px solid #f3f3f3;
}
/* css per i titoli dei pezzi */
.titlenomargin {
   margin-bottom: .1rem;
   font-style: oblique;
   font-size: 14px;
   letter-spacing: -.1px;
}

/* mediaquery per moduli audio pos right e div negli articoli */
@media only screen and (max-width: 991px) {
  .audiomodule {
    display: none;
  }
}
@media only screen and (min-width: 992px) {
  .audionoarticle {
    display: none;
  }
}


/* == CSS VIDEO YOUTUBE == */

    .youtube-player {
        position: relative;
        padding-bottom: 56.23%;
        /* Use 75% for 4:3 videos */
        height: 0;
        overflow: hidden;
        max-width: 100%;
        background: #000;
        margin: 5px;
    }
    
    .youtube-player iframe {
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        z-index: 100;
        background: transparent;
    }
    
    .youtube-player img {
        bottom: 0;
        display: block;
        left: 0;
        margin: auto;
        max-width: 100%;
        width: 100%;
        position: absolute;
        right: 0;
        top: 0;
        border: none;
        height: auto;
        cursor: pointer;
        -webkit-transition: .4s all;
        -moz-transition: .4s all;
        transition: .4s all;
    }
    
    .youtube-player img:hover {
        -webkit-filter: brightness(75%);
    }
    
    .youtube-player .play {
        height: 72px;
        width: 72px;
        left: 50%;
        top: 50%;
        margin-left: -36px;
        margin-top: -36px;
        position: absolute;
        background: url("//i.imgur.com/TxzC70f.png") no-repeat;
        cursor: pointer;
    }

/* == FINE CSS VIDEO YOUTUBE == */

/* == LAYOUT BLOG == */
.article-list .article .article-intro-image {
    margin: 0;
}
.article-list .article .article-intro-image img {
    margin-bottom: 20px;
    margin-right: 10px;
}
.article-list .article {
    padding: 5px;
    overflow: hidden;
}
.article-introtext .readmore  {
   margin: 20px 0 10px
}
.article-info {
    background-color: #DCDCDC;
    border-radius: 0.25em;
    padding: 0px 10px 2px 10px;
    color: #7A1237;
    display: inline-block;
    font-weight: 600;
    letter-spacing: 1px;
}
.article-info::before {
    font-family: "Fontawesome";
    content: "\f133";
    color: #252525;
    padding-right: 5px;
    margin-top: 1px;
    font-size: 12px;
    color: #7A1237;
}
/* custom readmore! */
.article-list .article .readmore a {
    padding: .1rem 0rem .3rem 0rem;
background-color: #7A1237;
font-size: .9rem !important;
color: white;
border-radius: .25em;
width: 160px;
display: inline-block;
text-align: center;
letter-spacing: 1px;
}
/* == CSS MINIFRONTPAGE NEWS */
/* css card di minifrontpage news home page versione desktop! */
.mfp_mid_195.mfp_default_skin_card .mfp_default_item .mfp_default_title a {
  font-weight: 500 !important;
  font-size: .9rem !important;
}
.mfp_mid_195.mfp_default_skin_card .mfp_default_item .mfp_default_title {
  line-height: 1rem;
}
.mfp_mid_195.mfp_default_skin_card .mfp_default_item .mfp_date {
  font-size: .7em;
}
.mfp_mid_195.mfp_default_skin_card .mfp_default_item .mfp_thumb_pos_top {
  margin: 0;
}
/* css card di minifrontpage news home page versione mobile! */
.mfp_mid_197.mfp_default_skin_card .mfp_default_item .mfp_default_title a {
  font-weight: 500 !important;
  font-size: 1.1rem !important;
}
.mfp_mid_197.mfp_default_skin_card .mfp_default_item .mfp_default_title {
  line-height: 1.3rem;
}
.mfp_mid_197.mfp_default_skin_card .mfp_default_item .mfp_date {
  font-size: .7em;
}
/* bordo a mouse over sulle immagini delle card */
.mfp_default_skin_card .mfp_default_item .mfp_thumb_pos_top img:hover {
  border: 2px solid #184674;
}
/* == CSS MINIFRONTPAGE NEWS */
/* css per i menu ad ancore! */
#target1 { padding-top: -50px; margin-top: 50px;} #target2 { padding-top: -50px; margin-top: 50px;}