@font-face {
    font-family: Abril_Display_Bold;
    src: url(/assets/fonts/Abril_Display_Bold.otf);
}

@font-face {
    font-family: Abril_Display_Italic;
    src: url(/assets/fonts/Abril_Display_Italic.otf);
}

@font-face {
    font-family: Lora_Regular;
    src: url(/assets/fonts/Lora-Regular.ttf);
}

@font-face {
    font-family: Fira_Sans;
    src: url(/assets/fonts/FiraSans-Light.ttf);
}

@font-face {
    font-family: Fira_Sans_Bold;
    src: url(/assets/fonts/FiraSans-Bold.ttf);
}

@font-face {
    font-family: Fira_Sans_Italic;
    src: url(/assets/fonts/FiraSans-LightItalic.ttf);
}

.page-wrapper .main-nav-one {
    background-color: #ac9c7b;
}

.page-wrapper .inner-container .main-nav__main-navigation a {
    color: white;
}

.cta-two {
    padding-bottom: 50px;
    background-color: white;
}

.cta-two .inner-container {
    margin-top: -100px;
    position: relative;
    z-index: 11;
    background: none;
    box-shadow: none;
}

.cta-two__box {
    text-align: center;
    padding-top: 0px;
    padding-bottom: 0px;
    border: none;
    background-color: #ac9c7b;
    overflow: hidden;
}

[class*="col-"]:nth-child(1) .cta-two__box {
    background-color: #ac9c7b;
}

[class*="col-"]:nth-child(2) .cta-two__box {
    background-color: #ac9c7b;
}

[class*="col-"]:nth-child(3) .cta-two__box {
    background-color: #ac9c7b;
}

.banner-bianco {
    width: 100%;
    background-color: white;
}

.banner-blu {
    background-color: #8e1f1d;
    z-index: 2;
}

.banner-marrone {
    height: 10px; /* Altezza della striscia */
    background-color: #bb9f69;
}

footer .musei-icons img {
    width: 200px; /* Regola la larghezza dell'immagine secondo le tue esigenze */
    height: auto; /* Mantiene le proporzioni dell'immagine */
}

.inner-container .row {
    display: flex;
    flex-wrap: wrap;
}

.inner-container .col-lg-3 {
    flex: 1;
    margin: 0 5px; /* Aggiungi margini per separare le colonne */
}

.cta-two__box {
    height: 100%; /* Fai in modo che il contenuto si estenda per riempire l'altezza */
    display: flex;
    flex-direction: column;
}

.cta-two__box > * {
    flex: 1;
}

.about-one .container {
    padding-bottom: 30px;
}

.cta-two .cta-two__box .text-italic {
    font-family: Abril_Display_Italic;
    font-style: italic;
    color: black;
}

.about-one .about-one__highlighted-text {
    font-family: Fira_Sans;
    font-size: 20px;
}

.about-one .about-one__highlighted-text .float-lg-right {
    font-family: Fira_Sans_Italic;
}

.banner-blu h4, .banner-blu h5 {
    font-family: Abril_Display_Bold;
    font-style: normal;
    color: #155b65;
}

.about-one .block-title h3 {
    font-family: Abril_Display_Italic;
    font-style: italic;
    font-size: 40px;
    color: #bf1e2d;
}

.collection-two .block-title h3 {
    font-family: Fira_Sans_Bold;
    color: #bf1e2d;
}

.cta-two__box .banner-bianco h4 {
    font-family: Abril_Display_Bold;
    color: #bf1e2d;
}

.cta-two__box {
    -webkit-box-shadow: 0px 10px 13px -7px #000000, 5px 5px 15px 5px rgba(0,0,0,0);
    box-shadow: 0px 10px 13px -7px #000000, 5px 5px 15px 5px rgba(0,0,0,0);
}

.banner-blu {
    -webkit-box-shadow: 0px 10px 13px -7px #000000, 5px 5px 15px 5px rgba(0,0,0,0);
    box-shadow: 0px 10px 13px -7px #000000, 5px 5px 15px 5px rgba(0,0,0,0);
}

.contact-one__box-social a{
    background-color: #363231;
}

.cta-two__box .text-italic p {
    line-height: 1;
}

.cta-two__box .banner-bianco h4 {
    width: 100%;
}

.musei-icons {
    background-color: #ac9c7b;
}

.color-red {
    color: #bf1e2d;
}

.color-black {
    color: #000000;
}

.about-one {
    background-color: #b6a897;
}

.logo-box {
    position: relative;
    overflow: visible; /* Per consentire all'immagine di fuoriuscire */
}

.logo-box a {
    display: block;
    position: absolute;
    left: 0;
    top: 0;
    border-radius: 50%; /* Applica un bordo circolare */
    overflow: visible; /* Nasconde il contenuto che esce dal bordo arrotondato */
}

.logo-box img {
    width: 100%; /* Riempie l'intera larghezza del contenitore */
    height: auto; /* Mantieni l'aspetto proporzionato */
    overflow: visible;
}

/* Stile per il logo nella barra di navigazione su dispositivi mobili (larghezza massima 768px) */
@media (max-width: 768px) {
    .logo-box a img {
        width: 75px; /* Riduci la larghezza del logo per adattarsi meglio ai dispositivi mobili */
    }
}

.item .row .col img {
    max-width: 100px; /* larghezza massima desiderata */
    height: auto; /* altezza automaticamente regolata proporzionalmente */
}

.text-left {
    font-family: Fira_Sans_Bold;
    font-size: 40px;
    color: #bf1e2d;
}

.m-singola-sfondo {
    background-image: url('/assets/images/m-singola-sfondo-2.png');
    background-size: auto 50%; /* Rimpicciolisci l'immagine al 50% della sua dimensione originale */
    background-position: left bottom; /* Posiziona l'immagine in basso a sinistra */
    background-repeat: no-repeat; /* Assicura che l'immagine di sfondo non si ripeta */
}



.doppia-m-sfondo {
    background-image: url('/assets/images/doppia-m-sfondo.png');
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    height: 100vh; /* Altezza pari all'altezza del viewport */

    /* Imposta overflow: hidden per evitare che il contenuto esca dal contenitore */
    overflow: hidden;
}

/* Stile per il video come sfondo del banner-carousel */
.banner-carousel {
    position: relative;
    width: 100%;
    height: 100vh; /* Imposta l'altezza del banner alla dimensione della viewport */
    overflow: hidden;
}

.video-background {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    overflow: hidden;
    z-index: -1; /* Porta il video dietro gli altri contenuti */
}

.banner-video {
    width: 100%;
    height: auto;
    min-width: 100%; /* Assicura che il video copra completamente la larghezza */
    min-height: 100%; /* Assicura che il video copra completamente l'altezza */
    object-fit: cover; /* Ridimensiona il video per coprire l'intera area mantenendo le proporzioni */
}

.main-nav-one.stricky {
    position: fixed; /* Posiziona la barra di navigazione in modo fisso */
    top: 0; /* Posiziona la barra di navigazione all'inizio della pagina */
    left: 0;
    right: 0;
    z-index: 1000; /* Imposta lo z-index superiore per sovrapporre altri elementi */
    box-shadow: 0px 2px 5px rgba(0, 0, 0, 0.1); /* Aggiungi un'ombra leggera */
}

.page-header {
    padding-bottom: 210px;
}

.collection-two img.responsive-img {
    max-width: 100%;
    height: auto;
}

.same-size {
    width: 100%;
    aspect-ratio: 16 / 9; /* Mantiene un rapporto d'aspetto di 16:9 */
    object-fit: cover;
    object-position: top;
}

.border-card {
    width: 300px;
    height: 100%;
    background-color: #dfd6ce;
    border-radius: 15px; /* Arrotonda i bordi */
    padding: 20px;
    text-align: center;
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1); /* Aggiunge un'ombra per un effetto 3D */
}

.special-school {
    font-family: Fira_Sans;
    font-size: 20px;
}

.text-align-left {
    text-align: left !important;
}