body{
    font-family: "Sora", sans-serif;
    color: #171717;
  }

  .overflowh{
    overflow: hidden;
  }

  h1{
    font-size: 90px;
  }

  h2{
    font-size: 40px;
  }

  h3{
    font-size: 30px;
  }

  p{
    font-size: 16px;
    line-height: 21px;
  }

  .mr-5{
    margin-right: 5px;
  }

  .padding-section{
    padding-top: 61px;
    padding-bottom: 61px;
  }

  .hero-h1{
    color: #FFFFFF;
    font-size: 90px;
  }

  .sora{
    font-family: "Sora", sans-serif;
  }

  .playflair{
    font-family: "Playfair Display", serif;
    font-weight: 500;
    font-style: italic;
  }

  .hero p{
    max-width: 700px;
    color: #FFFFFF;
  }

  h3{
    font-weight: 500;
  }


  .bg-green-hero{
    background: transparent radial-gradient(closest-side at 30% 28%, #0A500A39 0%, #0A500AA2 100%) 0% 0% no-repeat padding-box;
    opacity: 0.8;
  }

  .bg-green{
    background-color: #01662C;
  }

  .bg-green-dark{
    background-color: #032C03;
  }

  .text-green{
    color: #01662C;
  }   

  .text-green-light{
    color: #C4F7C5;
  }

  .text-blu{
    color: #006EA8;
  }

  .quote{
    font-size: 30px;
    line-height: 39px;
  }


  .noparking-bg{
    background-color: #F4F9FD !important;
  }

  .w-60{
    width: 60%;
  }

  .rounded-img{
    border-radius: 19px;
  }

  .btn-outline-white {
    border: 2px solid #fff;
    color: #fff;
  }

  .btn-outline-white:hover {
    background-color: #fff;
    border: 2px solid #fff;
    color: #01662C;
  }

  .btn-success{
    color: #fff;
    background-color: #01662C;
    border: 2px solid #01662C;
  }

  .btn-outline-success{
    border: 2px solid #01662C;
    color: #01662C;
  }

  .btn-outline-success:hover{
    border: 2px solid #01662C;
    color: #01662C;
    background-color: #FFFFFF;
  }

  .btn-light{
    color: #01662C;
    border: 2px solid #01662C;
    background-color: #FFFFFF;
  }

  .btn-light:hover{
    color: #fff;
    background-color: #01662C;
  }

  .btn-blu{
    color: #006EA8;
    border: 2px solid #006EA8;
    background-color: #FFFFFF;
  }

  .btn-blu:hover{
    color: #fff;
    background-color: #006EA8;
  }

  #partecipa{
    padding-top: 50px;
    padding-bottom: 50px;
  }
  
  .elem-1{
    position: absolute;
    right: -100px;
    top: -100px;
    z-index: 1;
  }
  
  .elem-2{
    position: absolute;
    left: -60px;
    bottom: 0px;
    z-index: 1;
  }
  
  .elem-3{
    position: absolute;
     right: -50px;
     bottom: 0px;
     z-index: 1;
  }
  
  .elem-4{
     position: absolute;
     left: -50px;
     bottom: -150px;
     z-index: 1;

  }

  .card-eventi {
    border: 2px solid #01662C;
    border-radius: 25px;
  }

  .card-eventi .card-title {
    color: #01662C;
  }

  .card-municipio,
  .card-tipo-evento {
      font-weight: 700;
  }

  .card-via{
      padding: 0px;
  }

  .map__filters {
      border-top: 2px solid #01662C;
      border-bottom: 2px solid #01662C;
  }

  .form-select {
      border: 0px;
      padding: .875rem 2.5rem .875rem 0rem;
      font-weight: 700;
      line-height: 1.35;
      background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='currentColor' class='bi bi-caret-down-fill' viewBox='0 0 16 16'%3E%3Cpath d='M7.247 11.14 2.451 5.658C1.885 5.013 2.345 4 3.204 4h9.592a1 1 0 0 1 .753 1.659l-4.796 5.48a1 1 0 0 1-1.506 0z'/%3E%3C/svg%3E");
      background-size: 9px 14px;
  }

  .btn-green {
      color: #fff;
      border: 2px solid #01662C;
      background-color: #01662C;
  }

  .btn-green:hover {
      color: #01662C;
      border: 2px solid #01662C;
      background-color: #FFFFFF;
  }

  .text-green {
      color: #01662C;
      font-weight: 700;
  }

  .pl-30 {
      padding-left: 30px;
  }

  @media (max-width: 940px) {
      h1,
      .hero-h1{
      font-size: 48px;
    }

    h2 {
      font-size: 32px;
    }

    h3 {
        font-size: 22px;
    }
    p {
      padding: 20px 0;
    }

    .carousel-item img{
      width: 100%;
    }

    .elem-3{
      opacity: 0.2;
    }

    .elem-4{
      opacity: 0.2;
      left: 200px !important;
    }

    .quote{
      font-size: 23px;
      line-height: 34px;
    }
  
  }


  @media (min-width: 1400px) {
    .container {
      max-width: 1200px; /* Ad esempio, impostiamo la larghezza massima a 1200px */
      margin-left: auto;
      margin-right: auto;
      padding-left: 15px;
      padding-right: 15px;
    }
  }

/* Stile delle card */
.card-eventi {
  border: 2px solid #01662C;
  border-radius: 25px;
  margin-right: 10px; /* Spazio tra le card */
}

.well {
  height: 75vh;
  overflow-y: auto; /* Abilita la scrollbar verticale */
  overflow-x: hidden; /* Nasconde la scrollbar orizzontale */
}

/* Stile specifico per mobile */
@media (max-width: 768px) {
  .well {
      height: auto;
      display: flex;
      flex-wrap: nowrap; /* No wrapping delle card */
      overflow-x: auto; /* Abilita lo scorrimento orizzontale */
      padding-bottom: 10px; /* Spazio inferiore per evitare tagli */
  }

  .well .card-eventi {
      min-width: 80%; /* Larghezza minima delle card */
      flex: 0 0 auto; /* Assicura che le card rimangano affiancate */
  }

  .well::-webkit-scrollbar {
      height: 8px; /* Altezza della scrollbar orizzontale */
  }

  .well::-webkit-scrollbar-thumb {
      background-color: #01662C; /* Colore della scrollbar */
      border-radius: 4px; /* Arrotondamento della scrollbar */
  }

  .card-subtitle{
    font-size: 17px;
  }

  .card-eventi .card-title {
    font-size: 20px;
  }

  .card-eventi{
    width: 85%;
  }

  #map_canvas{
    margin-top: 40px;
  }
}