body{
    background: url('https://savioli.madeword.it/images/BG.png') no-repeat center fixed;
    background-size: cover;
    z-index: -1; /* Keeps it behind everything */
}

.container-header {
    background: rgba(255, 255, 255, 0.9);    
  //background-image: url('https://savioli.madeword.it/images/headers/head.png'); /* Immagine personalizzata */
    background-size: cover; /* Adatta l'immagine all'header */
    background-position: center; /* Centra l'immagine */
    background-repeat: no-repeat; /* Non ripete l'immagine */
    height: 120px; /* Riduce l'altezza per renderlo più sottile */
    position: relative !important; /* Assicura che scorra con la pagina */
    box-shadow: inset 0 5px 5px rgba(0, 0, 0, 0.08);
    display: flex;
    align-items: center; /* Centra il contenuto verticalmente */
    justify-content: center; /* Centra il contenuto orizzontalmente */
}


.article-home {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    gap: 20px;
    padding: 20px;
}

.article-home .section {
    background: rgba(255, 255, 255, 0.9);
    padding: 20px;
    border-radius: 10px;
    box-shadow: 0px 4px 8px rgba(0, 0, 0, 0.2);
    width: 30%;
    text-align: center;
}

/* Per mobile, le sezioni vanno una sotto l'altra */
@media (max-width: 991px) {
    .article-home {
        flex-direction: column;
        align-items: center;
    }

    .article-home .section {
        width: 90%;
    }
}
/* Full-width sections */
/* Adjust section layout - Make text take more space */
.full-section {
     background: rgba(255, 255, 255, 0.9); /* Light gray/white background */
   padding: 40px;
    border-radius: 10px;
    box-shadow: 0px 4px 8px rgba(0, 0, 0, 0.2);
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 40px;
    gap: 30px; /* Space between text and image */
}

/* Give more space to text and shrink the image */
.full-content {
    flex: 2; /* 2x bigger than image */
}

.full-section img {
    flex: 1; /* Shrinks image space */
    max-width: 40%; /* Reduce image size */
    border-radius: 8px;
    box-shadow: 0px 4px 8px rgba(0, 0, 0, 0.2);
}

/* Mobile view: Stack text above image */
@media (max-width: 991px) {
    .full-section {
        flex-direction: column;
        text-align: center;
    }

    .full-section img {
        max-width: 80%;
        margin-top: 15px;
    }
}

/* Make sure text remains dark for readability */
.full-section h2, 
.full-section p {
    color: #333; /* Dark gray text for contrast */
}

.container-sidebar-right {
    display: none !important;
}

/* Make the main content area full width */
.container-component {
    width: 100% !important;
    max-width: 100%;
}

/* If the parent container is causing spacing issues */
.site-grid {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
}

/* Optional: If the sidebar space is still reserved, remove padding/margins */
.grid-child.container-sidebar-right {
    display: none !important;
}
/* Ensure the main content has some padding on the sides */
.container-component {
    max-width: 1200px; /* Adjust width to prevent full stretch */
    margin: 0 auto; /* Centers the content */
    padding: 20px; /* Adds spacing on smaller screens */
}

.teca-search-box {
    background: rgba(255, 255, 255, 0.15); /* Semi-transparent white */
    padding: 15px 20px;
    border-radius: 10px;
    text-align: center;
    display: inline-block;
    margin: 20px auto; /* Centers the box */
    box-shadow: 0px 4px 8px rgba(255, 255, 255, 0.2); /* Light glow effect */
}

/* Stylish button */
.teca-search-button {
    color: white;
    font-size: 20px;
    font-weight: bold;
    text-decoration: none;
    padding: 12px 20px;
    background: #b02e0c; /* Theatrical red */
    border-radius: 8px;
    transition: all 0.3s ease-in-out;
    display: inline-block;
}

/* Hover effect */
.teca-search-button:hover {
    background: #8d260a; /* Darker red on hover */
    transform: scale(1.05); /* Slight zoom effect */
}

/* Hide the page title "Archivio Aggeo Savioli" */
.page-header h1 {
    display: none !important;
}

/* Make "Sei qui:" text white */
.mod-breadcrumbs__here {
    color: white !important;
    font-weight: bold;
}

/* Make entire breadcrumb text white */
.mod-breadcrumbs__wrapper,
.mod-breadcrumbs__here,
.mod-breadcrumbs__item {
    color: white !important;
}

/* Ensure links in breadcrumbs are also white */
.mod-breadcrumbs__item a {
    color: white !important;
    text-decoration: none; /* Optional: Remove underline */
}

/* Add hover effect for better visibility */
.mod-breadcrumbs__item a:hover {
    color: #d3d3d3 !important; /* Light gray on hover */
}

/* Center the search form and style it */
.tecaSearchForm {
    background: rgba(255, 255, 255, 0.9); /* Match section backgrounds */
    padding: 20px;
    border-radius: 10px;
    box-shadow: 0px 4px 8px {rgba}(0, 0, 0, 0.2); /* Soft shadow */
    text-align: center;
    max-width: 600px; /* Keep it neat */
    margin: 40px auto; /* Center it on the page */
}

/* Style the legend */
.tecaSearchForm legend {
    font-size: 20px;
    font-weight: bold;
    color: #333; /* Dark text for readability */
    margin-bottom: 15px;
}

/* Style the input field */
.tecaSearchForm input[type="text"] {
    width: 80%;
    padding: 12px;
    font-size: 16px;
    border-radius: 8px;
    border: 2px solid #ccc;
    outline: none;
}

/* Style the buttons */
.tecaSearchForm input.button {
    background: #b02e0c; /* Theatrical red */
    color: white;
    padding: 12px 20px;
    border: none;
    border-radius: 8px;
    font-size: 16px;
    cursor: pointer;
    transition: background 0.3s;
    margin-top: 10px;
}

/* Hover effect */
.tecaSearchForm input.button:hover {
    background: #8d260a;
}

/* Ensure it looks good on mobile */
@media (max-width: 768px) {
    .tecaSearchForm {
        width: 90%;
    }

    .tecaSearchForm input[type="text"] {
        width: 100%;
    }

    .tecaSearchForm input.button {
        width: 80%;
    }
}

.tecaSearchNavigator {
  background: aliceblue;
}

/* Stile di base per tutte le tabelle nella sezione tecaSearchResult */
.tecaSearchResult table {
    background: rgba(255, 255, 255, 0.9);
    border-radius: 10px;
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2);
    margin: 20px auto;
    width: 100%;
    max-width: 1200px;
    padding: 20px;
}

/* Stile per le celle della tabella */
.tecaSearchResult td {
    padding: 10px;
    text-align: left;
    border-bottom: 1px solid #ddd;
}

/* Rimuove il bordo inferiore nell'ultima riga */
.tecaSearchResult tr:last-child td {
    border-bottom: none;
}

/* Specifico per la barra di navigazione */
.tecaSearchNavigator {
    background: aliceblue;
    padding: 10px;
    border-radius: 8px;
}

/* Stile per la tabella dei risultati */
.mdResultRice {
    background: rgba(255, 255, 255, 0.9);
    border-radius: 10px;
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2);
    margin: 20px 0;
}

.tecaSearchResult h1 {
    text-align: center; /* Centra il titolo */
    font-size: 24px;    /* Font più piccolo; puoi regolare il valore a piacere */
    color: #b02e0c; /* Nero per il testo */
    background: rgba(255, 255, 255, 0.7); /* Sfondo bianco con trasparenza (70%) */
    margin: 20px 0;
}

/* Trasforma il fieldset in un contenitore flex */
.tecaSearchForm {
  display: flex;
  align-items: center;
  gap: 10px;         /* Spazio tra gli elementi */
  flex-wrap: wrap;   /* Consente di andare a capo su schermi piccoli */
}

/* Il legend occupa tutta la larghezza e viene centrato */
.tecaSearchForm legend {
  flex-basis: 100%;
  text-align: center;
  margin-bottom: 10px;
}

/* La barra di ricerca si espande per occupare lo spazio disponibile */
.tecaSearchForm input.defaultText {
  flex: 1;
  min-width: 200px;
  padding: 10px;
  font-size: 16px;
  border: 2px solid #ccc;
  border-radius: 8px;
  outline: none;
}

/* Stile base per i pulsanti */
.tecaSearchForm input.button {
  padding: 10px 20px;
  cursor: pointer;
  border: none;
  border-radius: 8px;
  transition: transform 0.3s ease, background 0.3s ease;
}

/* Hover per il pulsante "Cerca" con effetto scale senza spostare il layout */
.tecaSearchForm input.button[value="Cerca"]:hover {
  background: #8d260a; /* Colore al passaggio del mouse */
  transform: scale(1.05);
}

.tecaSearchForm {
  display: flex;
  align-items: center;
  gap: 10px;
  flex-wrap: wrap;
}

.tecaSearchForm legend {
  flex-basis: 100%;
  text-align: center;
  margin-bottom: 10px;
}

/* Imposta un'altezza uniforme per tutti gli input */
.tecaSearchForm input.defaultText,
.tecaSearchForm input.button {
  height: 40px;
  padding: 0 10px;
  margin: 0;
  border: 2px solid #ccc;
  border-radius: 8px;
  box-sizing: border-box;
}

/* La barra di ricerca si espande per occupare lo spazio disponibile */
.tecaSearchForm input.defaultText {
  flex: 1;
  min-width: 200px;
}

/* Impostazioni comuni per i pulsanti */
.tecaSearchForm input.button {
  height: 40px;
  padding: 0 20px;
  cursor: pointer;
  border: 2px solid;
  border-radius: 8px;
  transition: background 0.3s ease, transform 0.3s ease, color 0.3s ease;
}

/* Pulsante Cerca: sfondo rosso con testo bianco */
.tecaSearchForm input.button[value="Cerca"] {
  background: #b02e0c; /* Rosso sangue */
  color: #fff;
  border-color: #b02e0c;
}

.tecaSearchForm input.button[value="Cerca"]:hover {
  background: #8d260a;
  transform: scale(1.05);
}

/* Pulsante Cancella: sfondo bianco, testo e bordo rossi */
.tecaSearchForm input.button[value="Cancella"] {
  background: #fff;
  color: #b02e0c;
  border-color: #b02e0c;
}

.tecaSearchForm input.button[value="Cancella"]:hover {
  background: #b02e0c;
  color: #fff;
  transform: scale(1.05);
}

/* Contenitore centrale per tutta la sezione di ricerca */
.tecaSearchResult {
    max-width: 1200px;      /* Imposta la larghezza massima desiderata */
    margin: 0 auto;         /* Centra il contenuto orizzontalmente */
    padding: 0 15px;        /* Eventuale padding per distanziare i contenuti dai bordi */
    box-sizing: border-box;
}

/* Assicura che tutte le tabelle all'interno occupino tutta la larghezza del contenitore */
.tecaSearchResult table {
    width: 100%;
    margin: 0 auto;
    box-sizing: border-box;
}


    .header.container-header {
    background: linear-gradient(to right, #000 0%, #000 80%, #1a1a1a 100%);
}




