/* ! Base Style */
body{font-family: 'Inter', sans-serif;}

a{text-decoration: none;}

h1, h2, h3, h4, h5, p{color:#282244; padding-bottom: 10px}


p{line-height: 28px; color:#666; font-weight: 300;}

body {background-color: #fff;}

.big-text{font-size: 50px;font-weight: 900;}
.big-text-metododemetrea{font-size: 50px;font-weight: 900;padding-top: 70px;}
.big-text1{font-size: 70px;font-weight: 900; padding-top: 250px;}
.big-text2{font-size: 40px;font-weight: 700; padding-left: 50px;padding-top: 40px;}
.med-text{font-size: 40px; font-weight: 900; padding-right: 900px; }
.med-text2{font-size: 40px;font-weight: 900; padding-left: 500px; }
.med-text3-staff{font-size: 20px;font-weight: 600;}
.med-text3-consulenza{font-size: 20px;font-weight: 600; margin-left: 100px;}
.normal-text{font-size: 20px; padding-left: 50px; padding-right: 500px;text-align: justify; }
.normal-textattivita{font-size: 20px; padding-left: 50px; padding-right: 500px;padding-top: 20px;text-align: justify; }
.normal-text-consulenza{font-size: 20px; padding-left: 70px; padding-right: 700px}
.normal-text1{font-size: 20px; padding-right: 1300px;}
.normal-text2{font-size: 20px;font-weight: 800; }
.normal-text3{font-size: 20px; padding-left: 50px; padding-right: 500px; text-align: justify;}
.normal-text-attività{font-size: 20px; padding-left: 30px; padding-right: 500px; padding-top: 550px; text-align: justify;}
.normal-text-metododemtra{font-size: 20px; padding-left: 30px; padding-right: 400px; padding-top: 550px; text-align: justify;;}
.normal-text4{font-size: 18px; font-weight: 600; padding-left: 50px; padding-right: 500px}
.normal-text5{font-size: 18px; font-weight: 400; color:white}
.small-text{font-size: 14px;padding-top: 20px;}
.small-text-staff{font-size: 15px; padding-top: 10px;line-height: 18px;}

.intro-text{text-transform: uppercase;font-size: 20px;font-weight: bold;}




form{padding-left: 20px;}


  @import url("https://fonts.googleapis.com/css2?family=Poppins:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap");

  * {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
  }

  body {
    font-family: "Poppins", sans-serif;
  }





  @media screen and (max-width: 768px) {


  div{display: block;}
  html, body {
    overflow-x: hidden;
    overflow-x:block;
    max-width: 100%;
    width: 100%;

}

   body {
    font-size: 12px;
    align-content: center;
    text-align: center;
    width: auto;
    overflow-x: hidden;

   }

   .container-fluid {
  width: 100%;
  max-width: 100vw; /* Imposta la larghezza massima al 100% della larghezza del viewport */
  padding: 10px; /* Aggiungi spazio ai lati per migliorare la leggibilità */
}

.testo-allineato {
  text-align: justify; /* Allinea il testo ai lati */
  margin-left: 30px; /* Aggiunge un margine sinistro per l'allineamento */
  margin-right: 20px; /* Aggiunge un margine destro per l'allineamento */
}



.testo-allineato h1,
.testo-allineato h3 {
  word-spacing: 2px; /* Aggiungi spazio tra le parole per migliorare l'allineamento */
}


.insta{display: none;}



   .big-text-metododemetrea{font-size: 30px;font-weight: 800px;padding-top:85px}
   .big-text{font-size: 30px;font-weight: 800;}
   .big-text2{text-align: center; font-size: 30px;font-weight: 600; padding-left: 0px;padding-top: 0px;}
   .normal-text{padding-top: 20px; padding-right: 0px; padding-left: 0px;text-align: left;}
   .normal-textattivita{padding-top: 20px; padding-right: 20px; padding-left: 20px;text-align: left;}
   .normal-text-metododemtra{ padding-right: 0px; padding-left: 0px;  padding-top: 200px;text-align: left;}
   .normal-text-consulenza{font-size: 20px; padding-left: 0px; padding-right: 0px}
   .normal-text-attività{margin-right: 20px; margin-left: 50px;text-align: left;padding-top: 200px;text-align: justify; }
   .normal-text3{text-align: center; font-size: 12px; padding-left: 10px; padding-right: 0px}
   .med-text3-consulenza{font-size: 12px;padding-right: 100px; padding-top:10px;}
   .normal-text4{font-size: 12px; font-weight: 500; padding-left: 0px; padding-right: 0px}
   .normal-text5{font-size: 12px; font-weight: 200; padding-left: 0px; padding-right:0px; color:white}
   .small-text-staff{ text-align: center; line-height: 18px;}
    .richedi-consulenza-text{padding-right: 70px;}

    h1, h2, h3, h4, h5, p{color:#282244; padding-bottom: 0px}





   .rettangolo-team{  padding: 10px;
    width: 99%;
    min-height: 200px; background-color: #CCCCCC; }

   .foto-staff-container {
           display: flex;
           flex-direction: column; /* Imposta la disposizione dei figli in colonna */
           align-items: center; /* Centra gli elementi lungo l'asse orizzontale */
           margin-top: 100px;
       }


       .foto-staff {
           margin-left: 10px;;
           margin-right: auto;
           text-align: center;
       }

       .foto-staff1 {
           margin-left: auto;
           margin-right: 350px;
           text-align: center;
           margin-top: 400px;
       }

       .foto-staff2 {
         margin-left: auto;
         margin-right: 700px;
         text-align: center;
         margin-top: 800px;
       }

       .foto-staff3 {
         margin-left: auto;
         margin-right: 170px;
         text-align: center;
         margin-top: 1200px;
       }

       .foto-staff4 {
         margin-left: auto;
         margin-right: 530px;
         text-align: center;
         margin-top: 370px;
       }


       /* Stile per l'immagine */
       .cerchio img,
           .cerchio1 img,
           .cerchio2 img,
           .cerchio3 img,
           .cerchio4 img {
               width: 100%; /* Imposta la larghezza dell'immagine al 100% del cerchio */
               height: 100%; /* Imposta l'altezza automaticamente per mantenere l'aspetto originale */
               margin-left: 40px;
               transform: scale(1.7);
           }

           .cerchio,
     .cerchio1,
     .cerchio2,
     .cerchio3,
     .cerchio4 {
         width: 100px; /* Imposta la larghezza del cerchio */
         height: 100px; /* Imposta l'altezza del cerchio */
         overflow: hidden; /* Assicura che l'immagine non fuoriesca dal cerchio */
     }



   .hero{ padding-top: 100px; margin-left: 0%; }



   .caroselli {
       flex-direction: column;
       align-items: center;
     }

     .carosello-contenitore, .carosello-contenitore2 {
       max-width: 100px; /* Imposta la larghezza massima a 250px */

     }


     .carousel-item img {
     max-width: 98%; /* Assicura che le immagini si adattino alla larghezza del carosello */
     height: auto; /* Altezza automatica */
   }

.testo-allineato
{
  margin-left: 20px;
}













   /* Imposta la posizione dei caroselli in colonna su dispositivi mobili */
   /* Imposta la posizione dei caroselli in colonna su dispositivi mobili */
     .strutture {
       display: flex;
       flex-wrap: wrap; /* Avvolgi i caroselli su più righe se lo spazio è insufficiente */
       justify-content: center; /* Centra i caroselli orizzontalmente */
     }

     /* Imposta le dimensioni dei caroselli per dispositivi mobili */
     .carosello1,
     .carosello2,
     .carosello3,
     .carosello4,
     .carosello5,
     .carosello6 {
       width: calc(50% - 20px); /* Utilizza il 50% della larghezza del contenitore padre con margine laterale */
       margin: px; /* Aggiunge margine tra i caroselli */
     }


     /* Imposta la larghezza massima dei caroselli su dispositivi mobili */
     .carosello1,
     .carosello2,
     .carosello3,
     .carosello4,
     .carosello5,
     .carosello6 {
       max-width: 340px; /* Imposta la larghezza massima dei caroselli su dispositivi mobili */
       margin: 0 auto; /* Centra i caroselli orizzontalmente */
     }



     /* Regola la dimensione del testo nei caroselli su dispositivi mobili */
       .carousel-item .small-text,
       .carousel-item .normal-text,
       .carousel-item .normal-text2 {
         font-size: 12px; /* Imposta la dimensione del testo a 16px */
       }

       /* Aggiungi spazio intorno ai testi nei caroselli su dispositivi mobili */
       .carousel-item .small-text,
       .carousel-item .normal-text,
       .carousel-item .normal-text2 {
         padding: 10px; /* Aggiungi spazio intorno ai testi */
       }









     /* Rimuovi la posizione assoluta e il margine sinistro per tutte le posizioni */

      .posizione{ position: static;
       margin-left: 0;
     margin-top: 100px;
   margin-right: 7px;}


     .posizione1{ position: static;
      margin-left: 0;
      margin-top: 1080px;
      margin-right: 507px;;
    }

    .posizione2{ position: static;
     margin-left: 0px;
     margin-top: 1080px;
     margin-right: 507px;

   }
   .posizione3{ position: static;
    margin-left: 0px;
    margin-top: 1100px;
   margin-right: 257px;

  }







  .close-button {

          position: absolute;
          margin-top: 90px; /* Regola la posizione della X */
          margin-right: 85px; /* Regola la posizione della X */
          color: #fff;
          font-size: 24px;
          cursor: pointer;
          color:white;
          z-index: 1000; /* Assicura che la X sia sopra l'immagine */
          text-shadow: 3px 3px 9px rgba(0, 0, 0, 0.9); /* Aggiungi ombra al testo */
      }






.photo-gallery{
  margin-top:1000px;
}



.foto1{margin-left: 40px;}

.foto2{display: none;}

.foto3{display: none;}







/* Stili per la sezione di richiesta di consulenza */
.richedi-consulenza-text {
  padding-top: 20px; /* Ridotto lo spazio superiore per adattarsi meglio ai dispositivi mobili */
  margin-left: 20px; /* Ridotto lo spazio sinistro per adattarsi meglio ai dispositivi mobili */
}

/* Stili per il modulo di contatto */
.contactForm {
  padding: 20px; /* Aggiunto padding uniforme su tutti i lati per adattarsi meglio ai dispositivi mobili */
  max-width: 100%; /* Imposta la larghezza massima al 100% per adattarsi alla larghezza del dispositivo */
}

/* Stili per i campi del modulo */
.form-control {
  width: calc(100% - 5px); /* Imposta la larghezza al 100% meno il padding per adattarsi alla larghezza del dispositivo */
  margin-bottom: 20px; /* Aggiunto margine inferiore per separare i campi del modulo su dispositivi mobili */
  padding: 10px; /* Aggiunto padding uniforme per migliorare l'aspetto e la leggibilità dei campi del modulo */
  box-sizing: border-box; /* Assicura che il padding non influenzi la larghezza totale del campo del modulo */
}

/* Stili per il pulsante di invio */
.btn {
  width: 100%; /* Imposta la larghezza al 100% per adattarsi alla larghezza del dispositivo */
  padding: 10px; /* Aggiunto padding uniforme per migliorare l'aspetto e l'usabilità del pulsante */
  box-sizing: border-box; /* Assicura che il padding non influenzi la larghezza totale del pulsante */
}


.btn1 {
  width: 100%; /* Imposta la larghezza al 100% per adattarsi alla larghezza del dispositivo */
  padding: 10px; /* Aggiunto padding uniforme per migliorare l'aspetto e l'usabilità del pulsante */
  box-sizing: border-box; /* Assicura che il padding non influenzi la larghezza totale del pulsante */
}



   .contat{margin-top: 500px;}


   .gd{              /* loghi & icone*/
     position:center;
     weight: 0px;
     height:40px;
     margin-left:120px;
   }

   .tt{
     position:fixed;
     margin-left: -30px;
     weight: 10px;
     height:10px;
   }

   .ig{
     position:fixed;
     margin-left: -20px;
     weight: 10px;
     height:10px;
   }

   .fb{
     position:fixed;
     margin-left:-10px;
     weight: 10px;
     height:10px;
   }


  .instagram-media{
    display: none;
  }




  .contact{
    margin-top:100px;
  }

  .link-opacity-75{text-align: center;}



  footer-container {
          flex-direction: column;
          text-align: center!important;
      }

      .contact-info {
          text-align: center!important;

      }

      .social-media {
          margin-top: 10px;
      }







  img {max-width: 99%;}



  font {max-width: 12px;}

  div {max width: 100%;}

 }

                                /*FINE MEDIA QUERY*/












/*       HERO        */



.social-icon-navbar{
  margin-bottom: 25px;
}





 .intro-text{text-transform: uppercase;font-size: 20px;font-weight: bold;}

 .rettangolo-team {
   padding: 50px; /* Spaziatura interna */
   border-radius: 10px; /* Bordi arrotondati */
   box-shadow: 0 0 10px rgba(0, 0, 0, 0.1); /* Ombra */
   background-color: #CCCCCC;
   margin-top: 80px !important; /* Spazio sopra */
 }



.insta{
 margin-left:  1200px;
 padding-top: 150px;
}

.hero{
  padding-top: 100px;
  margin-left: 1%;
}


.offcanvas{
  background-color: #282244;
}

.navbar{
  background-color: #282244;
}

.offcanvas-title{
  color: white;
}

.attività{
  margin-top: 100px;
  margin-left: 1%;
}

.immagine{
  margin-top: 20px;
}

.immagine1{
  margin-top: 10px;
}

.immagini-photogallery{
  margin-top: 30px;
  margin-left: 20px;
}

.immagini-photogallery2{
  margin-top: 30px;
  margin-left: 550px;
}

.immagini-photogallery3{
  margin-top: 30px;
  margin-left: 1080px;
}

.immagini-photogallery4{
  margin-top: 30px;
  margin-left: 1080px;
}





.strutture{
  margin-top: 100px;
  margin-left: 1%;
}


.tt{
  position:fixed;
  left:130px;
  weight: 25px;
  height:25px;
}

.ig{
  position:absolute;
  left:80px;
  weight: 25px;
  height:25px;
}

.fb{
  position:absolute;
  left:30px;
  weight: 25px;
  height:25px;
}

.gd{              /* loghi & icone*/
  position:center;
  weight: 40px;
  height:40px;
}

.wd{             /* loghi & icone*/
  position:absolute;
  right:47%;
  weight: 50px;
  height:50px;
}

.tt1{
  position:absolute;
  left:1430px;
  weight: 25px;
  height:25px;
}

.ig1{
  position:absolute;
  left:1380px;
  weight: 25px;
  height:25px;
}

.fb1{
  position:absolute;
  left:1330px;
  weight: 25px;
  height:25px;
}






.caroselli {
    display: flex;
    gap: 20px;
  }

  .carosello-contenitore, .carosello-contenitore2 {
    width: 100%;
    max-width: 400px; /* Larghezza massima dei caroselli */
  }



  .carousel-item {
    width: 100%;
    height: 100%;
    opacity: 1;
    transition: opacity 0s ease-in-out; /* Animazione di dissolvenza */
}


  .carousel-item img {
    width: 100%;
    height: 300px; /* Altezza fissa per uniformare i caroselli */
    object-fit: cover; /* Per adattare le immagini senza deformarle */
  }







.carosello1{
  height: 430px;
  width: 400px;
  shape-inside: auto;
}

.posizione1 {
  position: absolute;
  margin-left: 500px;

}

.carosello2{
  height: 430px;
  width: 400px;
  shape-inside: auto;
}



.carosello3{
  margin-top: 490px;
  height: 430px;
  width: 400px;
  shape-inside:  auto;
}


.carosello4{
  height: 430px;
  width: 400px;
  shape-inside: auto;
}

.carosello5{
  height: 430px;
  width: 400px;
  shape-inside: auto;
}

.carosello6{
  height: 430px;
  width: 400px;
  shape-inside: auto;
}



     /* Regola la dimensione del testo nei caroselli su dispositivi mobili */
       .carousel-item .small-text,
       .carousel-item .normal-text,
       .carousel-item .normal-text2 {
         font-size: 14px; /* Imposta la dimensione del testo a 16px */
       }

       /* Aggiungi spazio intorno ai testi nei caroselli su dispositivi mobili */
       .carousel-item .small-text,
       .carousel-item .normal-text,
       .carousel-item .normal-text2 {
         padding: 10px; /* Aggiungi spazio intorno ai testi */
       }










.posizione2{
  position: absolute;
  padding-top: 490px;
  margin-left: 500px;
}

.posizione3{
  position: absolute;
  padding-top: 960px;
  margin-left: 250px;
}

.photo-gallery{
  padding-top: 1450px;
  margin-left: 1%;
}


.foto1{
  height: 300px;
  width: 300px;
  padding-top: 20px;
}

.foto2{
  height: 300px;
  width: 300px;
  margin-left: 330px;
  padding-top: 20px;
}

.foto3{
  height: 300px;
  width: 300px;
  margin-left: 660px;
  padding-top: 20px;
}




.btn1{
  margin-top: 350px;
  width: 300px;
  margin-left: 40px;

}







.cerchio,
.cerchio1,
.cerchio2,
.cerchio3,
.cerchio4 {
    margin-top: 20px;
    width: 200px; /* diametro del cerchio */
    height: 200px;
    border-radius: 50%; /* rende il div un cerchio */
    overflow: hidden; /* nasconde ciò che esce dai bordi del cerchio */
    position: flex;
    display: flex;
}

        .cerchio-nome-cognome-position {
            margin-top: 20px;
            width: 200px; /* diametro del cerchio */
            height: 200px;
            border-radius: 0%; /* rende il div un cerchio */
            position: relative;
          }


          /* Stile per l'immagine */
    .cerchio img,
    .cerchio1 img,
    .cerchio2 img,
    .cerchio3 img,
    .cerchio4 img {
        width: 160%; /* riempie il cerchio con l'immagine */
        height: auto;
        display: block;
        top: 50%; /* sposta l'immagine al centro verticalmente */
        left: 50%; /* sposta l'immagine al centro orizzontalmente */
        transform: translate(-20%, -0%); /* centra l'immagine */
    }

    /* Stile per il testo (nome e cognome) */
.nome-cognome {
text-align: center;
margin-top: 5px;
}

.foto-staff{
  margin-left: 1%;
}

.foto-staff1{
  margin-left: 350px;
}

.foto-staff2{
  margin-left: 700px;
}
.foto-staff3{
  margin-left: 175px;
}

.foto-staff4{
  margin-left: 535px;
}






.contact{
  margin-left: 1%;
}


.link-opacity-75{
  color:#9370DB;
}



.gallery {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
    grid-gap: 10px;

}

.gallery-item {
    position: relative;
    overflow: hidden;
    width: 100%;
    height: 200px; /* Imposta un'altezza fissa per tutte le immagini */
    object-fit: cover; /* Scala e ritaglia l'immagine per adattarla alla dimensione specificata */
}

.gallery-item img {
  width: 100%;
  height: 200px; /* Imposta un'altezza fissa per tutte le immagini */
  object-fit: cover; /* Scala e ritaglia l'immagine per adattarla alla dimensione specificata */
  object-position: center; /* Centra l'immagine all'interno del contenitore */
}

.gallery-item:hover img {
    transform: scale(1.1);
}

.overlay {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.7);
    display: none;
    justify-content: center;
    align-items: center;
    z-index: 999;
}

.overlay img {
}

/* Stile per la modalità lightbox */
.modal {
    display: none;
    justify-content: center;
    align-items: center;
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.7); /* Aggiungi sfondo ombreggiato */
    z-index: 999;
}

.modal-content {
  width: auto; /* Ripristina la larghezza automatica dell'immagine all'interno della modalità lightbox */
  height: auto; /* Ripristina l'altezza automatica dell'immagine all'interno della modalità lightbox */
  margin-top: 55px;
  max-width: 100%;
  max-height: 100%;
  object-fit: contain; /* Scala l'immagine per adattarla alla dimensione del contenitore mantenendo l'aspetto originale */
}

.modal-content img {
    width: auto; /* Ripristina la larghezza automatica dell'immagine all'interno della modalità lightbox */
    height: auto; /* Ripristina l'altezza automatica dell'immagine all'interno della modalità lightbox */
    max-width: 100%;
    max-height: 100%;
    object-fit: contain; /* Scala l'immagine per adattarla alla dimensione del contenitore mantenendo l'aspetto originale */
}

.close-button {
    position: absolute;
    top: 60px; /* Regola la posizione della X */
    right: 100px; /* Regola la posizione della X */
    color: #fff;
    font-size: 24px;
    cursor: pointer;
    color:white;
    z-index: 1000; /* Assicura che la X sia sopra l'immagine */
    text-shadow: 3px 3px 9px rgba(0, 0, 0, 0.9); /* Aggiungi ombra al testo */
}

.close-button:hover {
    text-shadow: none; /* Rimuovi l'ombra al passaggio del mouse */
}


















body {
    display: flex;
    flex-direction: column;
    min-height: 100vh;
}

footer {
    background-color: #282244;
    color: white;
    padding: 20px 0;
    margin-top: auto;
}

.footer-container {
    display: flex;
    justify-content: space-between;
    align-items: center;
    flex-wrap: wrap;
    padding: 0 20px;
}

.contact-info {
    flex: 1;
    text-align: center; /* Align text to the left */

}

.contact-info p {
    margin: 0px 0;
}

.contact-info a {
    color: white;
    text-decoration: none;
    transition: color 0.3s;
}

.contact-info a:hover {
    color: #ddd;
}

.social-media {
    display: flex;
    justify-content: center;
    gap: 10px;
    margin-top: 40px;


}

.social-media a {
    display: inline-block;
}

.social-media img {
    width: 24px;
    height: 24px;
    transition: transform 0.3s;
}

.social-media img:hover {
    transform: scale(1.1);
}

.footer-bottom {
    text-align: center;
    margin-top: 20px;
}




















.tt1{
  position:absolute;
  left:1430px;
  weight: 25px;
  height:25px;
}

.ig1{
  position:absolute;
  left:1380px;
  weight: 25px;
  height:25px;
}

.fb1{
  position:absolute;
  left:1330px;
  weight: 25px;
  height:25px;
}



.richedi-consulenza-text{
  padding-top: 100px;
  margin-left: 70px;
}









*{
	margin:0;
	padding:0;
	box-sizing:border-box;
	font-family:sans-serif;

}

input{
	display:none;
}
.container{
	width:100%;
	text-align: center;

}
















*,
*:before,
*:after {
  -webkit-box-sizing: border-box;
     -moz-box-sizing: border-box;
          box-sizing: border-box;
}