/* Nuova classe per immagine HERO di sfondo ad un'area DIV */
.hero-image-home {
  background: linear-gradient(to right, rgba(0, 0, 0, 0.8), rgba(0, 0, 0, 0.1)) ,url(img/camper.jpg) no-repeat center; 
  background-size: cover;  /* Cover vuol dire che l'immagine di sfondo riempie completamente l'area in cui è contenuta
                              ma alcune parti potrebbero essere tagliate */
  
  height: 600px;
  width: 100%;
  position: relative;
  padding: 0px;
  margin: 0px;
}


.video-gallery video {
    margin-bottom: 20px;
    border-radius: 10px;
    box-shadow: 0 0 10px rgba(0, 0, 0, 0.2);
}



/* Nuova classe per il testo sopra un'immagine Hero */
.hero-text {
  text-align: left;
  position: absolute;
  top: 20%;
  left: 2%;
  color: white;
  width: 60%;
  opacity: 1;
  
  }

.hero-text h1{
	font-size: 50px;
	text-align: left; 
}

.hero-text h3{
	font-size: 35px;
}


main {
    flex: 1;
}

footer {
    width: 100%;
}

.container-custom {
            min-height: 80vh; /* Imposta l'altezza minima a tutto lo schermo */
            display: flex;
            align-items: center; /* Centra verticalmente */
        }
		
		


.navbar-toggler {
  color:#1a75bb; /* Cambia colore bordo */
  border-color:#1a75bb
}



.custom-bg-color {
	background-color: #1a75bb;
}

.custom-line {
  width: 80%;                 /* Imposta la larghezza della linea al 80% dello schermo */
  height: 3px;                /* Imposta lo spessore della linea */
  background-color: #1a75bb;  /* Colore della linea (sostituisci con il colore che preferisci) */
  border-radius: 10px;        /* Bordo arrotondato */
  border: none;               /* Rimuove eventuali bordi predefiniti */
  margin: 35px auto;          /* Distanza sopra e sotto la linea, centrato orizzontalmente */
  opacity: 1,
}

h1{
	text-align: center; 
	padding-top: 30px; 
}




.nav-item a {
    display: inline-block; /* Evita che lo sfondo copra tutto */
    padding: 8px 12px; /* Aggiunge spazio attorno */
    border-radius: 12px; /* Mantiene l'angolo arrotondato */
    transition: background-color 0.3s ease-in-out;
	color: #1a75bb;
}

.nav-item a:hover {
    background-color: rgba(24, 191, 159, 0.75);
	
}





.c{
    color: #1a75bb;
}




.gallery-container {
            display: grid;
            grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
            gap: 10px;
            padding: 20px;
            max-width: 1200px;
            margin: auto;
        }

        .gallery-container img {
            width: 100%;
            height: auto;
            border-radius: 8px;
            object-fit: cover;
            transition: transform 0.3s ease-in-out;
        }

        .gallery-container img:hover {
            transform: scale(1.05);
        }


.service-section {
            padding: 50px 0;
        }

        .service-img {
            width: 80%;
            height: auto;
            border-radius: 10px;
        }

        .service-text {
            display: flex;
            flex-direction: column;
            justify-content: center;
        }