body {
  background-color: #f8f9fa;
}

/* Headers */
header{
  margin-top: 10px;
}
.headerhome {
  background: linear-gradient(90deg, #0d6efd, #0b5ed7);
  color: white;
  padding: 30px 0;
  border-radius: 15px 15px;
}
.header-a {
  background-color: #ffa94d;
  color: white;
  padding: 30px 0;
  border-radius: 15px 15px;
}
.header-b{
  background-color: blue;
  color: white;
  padding: 30px 0;
  border-radius: 15px 15px;
}
.header-c{
  background-color: green;
  color: white;
  padding: 30px 0;
  border-radius: 15px 15px;
}
.header-giardinetti{
  background-color: yellowgreen;
  color: white;
  padding: 30px 0;
  border-radius: 15px 15px;
}
.header-lido{
  background-color: skyblue;
  color: white;
  padding: 30px 0;
  border-radius: 15px 15px;
}
.header-viterbo{
  background-color: purple;
  color: white;
  padding: 30px 0;
  border-radius: 15px 15px;
}
.header-fl1{
  background-color: skyblue;
  color: white;
  padding: 30px 0;
  border-radius: 15px 15px; 
}
.header-fl2{
  background-color: blue;
  color: white;
  padding: 30px 0;
  border-radius: 15px 15px; 
}
.header-fl3{
  background-color: brown;
  color: white;
  padding: 30px 0;
  border-radius: 15px 15px;
}
.header-fl4{
  background-color: #b87a3d;
  color: white;
  padding: 30px 0;
  border-radius: 15px 15px;
}
.header-fl5{
  background-color: yellowgreen;
  color: white;
  padding: 30px 0;
  border-radius: 15px 15px;
}

.header-fl6{
  background-color: rosybrown;
  color: white;
  padding: 30px 0;
  border-radius: 15px 15px;
}
.header-fl7{
  background-color: lightgreen;
  color: white;
  padding: 30px 0;
  border-radius: 15px 15px;
}
.header-fl8{
  background-color: #49B05F;
  color: white;
  padding: 30px 0;
  border-radius: 15px 15px;
}

/* Breadcrumb */
.bc {
  margin: 0;
  padding: 0;
}

.breadcrumb {
  background-color: #ffffff;
  padding: 10px 20px;
  border-radius: 8px;
  box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);
}

.breadcrumb-item a {
  color: #0d6efd; /* blu Bootstrap */
  text-decoration: none;
  font-weight: 500;
}

.breadcrumb-item a:hover {
  color: #0a58ca; /* blu più scuro */
  text-decoration: underline;
}

.breadcrumb-item.active {
  color: #6c757d; /* grigio per la pagina corrente */
  font-weight: bold;
}

/* Cards */
.card {
  color: #212529; 
  transition: transform 0.2s, box-shadow 0.2s;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
}

.card:hover {
  transform: translateY(-5px);
  box-shadow: 0 6px 12px rgba(0, 0, 0, 0.15);
}
.card-a {
  background-color: #ffd8a8;
  border: 2px solid #ffa94d;
}
.card-b {
  background-color: #cce5ff; /* blu chiaro */
  border: 2px solid #66b2ff;
}

.card-c {
  background-color: #ccffcc; /* verde chiaro */
  border: 2px solid #66cc66;
}

.card-lido {
  background-color: #ccf5ff; /* Azzurro chiaro */
  border: 2px solid #66d9ff; 
}

.card-giardinetti {
  background-color: #ffffcc; /* Giallo pastello */
  border: 2px solid #ffeb33; 
}

.card-viterbo {
  background-color: #eccfff; /* Viola pastello */
  border: 2px solid #a366ff; 
}
.card-title-long {
  font-size: 1.10rem; 
}
.card-fl1 { 
  background-color: #b0d4f1; 
  border: 2px solid #7cb4e0; 
} 
.card-fl2 { 
  background-color: #cce5ff;; 
  border: 2px solid #e58bbf; 
} 
.card-fl3 { 
  background-color: #cc9966; 
  border: 2px solid #b57f4b; 
} 
.card-fl4 { 
  background-color: #e6cba8; 
  border: 2px solid #d7b98c; 
} 
.card-fl5 { 
  background-color: #c8e3c2; 
  border: 2px solid #9fcf94; 
} 
.card-fl6 { 
  background-color: #f5e0b3; 
  border: 2px solid #e2c97f; 
}  
.card-fl7 { 
  background-color: #ffc9a1; 
  border: 2px solid #f5a574; 
} 
.card-fl8 { 
  background-color: 
  #b5b2f3; border: 2px solid #918be3; 
}




/* Footer */
.footer-custom {
  background-color: #444444; 
  color: white;
}

.footer-custom h5 {
  font-weight: bold;
  margin-bottom: 10px;
}

.footer-custom p {
  margin-bottom: 8px;
  font-size: 0.95rem;
}



/* Links */
a{
  text-decoration: none;
}
a:hover{
  text-decoration: underline;
}

