:root {
   --testi-contenuti: #303030;
   --titoli: #0d0000;
   --grigio-logo: #65656c;
   --grigino: #e6e9ec;
   --arancioWMA: #ff5500;
   --bianco: #ffffff;
   --blu-logo: #043f71;
   --celeste-logo: #7ecced;
   --verde-scuro-logo: #16a148;
   --verde-chiaro-logo: #bace15;
   --rosso-logo: #e8531c;
   --giallo-logo: #ffe400;
}
/** file css per sito wma **/
*,
::after,
::before {
   box-sizing: border-box;
   -webkit-box-sizing: border-box;
   -moz-box-sizing: border-box;
}
html {
   -moz-osx-font-smoothing: grayscale;
   -webkit-font-smoothing: antialiased;
   text-rendering: optimizeLegibility;
   -webkit-text-size-adjust: 100%;
   -moz-text-size-adjust: 100%;
   text-size-adjust: 100%;
}
body {
   font-family: "Montserrat", sans-serif;
   font-optical-sizing: auto;
   font-weight: 300;
   font-style: normal;
   font-size: 1.0em;
   color: var(--testi-contenuti);
   margin: 0;
   padding: 0;
   background-color: var(--grigino);
}
h1,
h2,
h3 {
   font-family: "Titillium Web", sans-serif;
   font-weight: 600;
   font-style: normal;
}
.page-header h1 {
   color: var(--blu-logo);
   font-size: 3.0rem;
   text-align: center;
}
.item-page p {
   text-align: justify;
   font-weight: 500;
   line-height: 1.5rem;
}
.item-page a {
   color: var(--rosso-logo);
}
.alternating-colors a {
   color: var(--blu-logo);
}
.risposte h3 a {
   color: var(--blu-logo);
}
.item-page ul {
   font-weight: 500;
   line-height: 1.5rem;
   color: var(--testi-contenuti);
}
ul.lista {
   color: var(--blu-logo);
   font-size: 1.1rem;
}
ul.lista a {
   color: var(--verde-scuro-logo);
   font-size: 1.1rem; 
}
.moduletable>h2 {
   text-align: center;
   color: var(--blu-logo);
}
.moduletable>h3 {
   text-align: center;
}
.osmap-items {
   margin: 10px 0 25px 60px;
}
#osmap a {
   color: var(--rosso-logo);
   font-weight: 600;
}
/*************************** menu ***************************/
/* Stile di base per la nav bar */
.mod-menu {
   /*  background-color: #333; */
   overflow: hidden;
   padding: 0;
   margin: 30px 0 0 0;
   display: flex;
   justify-content: center;
   /* Centra gli elementi orizzontalmente */
   font-family: "Titillium Web", sans-serif;
}
.mod-menu .nav-item {
   list-style-type: none;
   margin: 0;
   padding: 0;
}
.mod-menu .nav-item a {
   display: block;
   padding: 14px 20px;
   text-align: center;
   color: var(--blu-logo);
   text-decoration: none;
   font-weight: 600;
   font-style: normal;
}
.mod-menu .nav-item a:hover {
   background-color: #ddd;
   color: black;
}
/* Stile per il burger menu */
.burger-menu {
   display: none;
   /* Nasconde il menu burger di default */
   cursor: pointer;
   padding: 10px;
   position: absolute;
   top: 10px;
   right: 10px;
   z-index: 20;
}
.burger-menu .bar {
   width: 25px;
   height: 3px;
   background-color: #212121;
   margin: 5px 0;
   transition: 0.4s;
}
/************************ Varie *************************/
header.testata {
   position: fixed;
   /*overflow: hidden;*/
   top: 0;
   width: 100%;
   background-color: #ffffff;
   box-shadow: 0px 5px 10px -2px #212121;
   z-index: 10;
}
.logo {
   margin-left: 20px;
   float: left;
   position: relative;
   z-index: 20;
}
.logo img {
   max-width: 199px;
}
.infocontatto {
   font-size: 12px;
   font-weight: 600;
}
.infocontatto a {
   color: var(--grigio-logo);
}
.infocontatti {
   display: flex;
   flex-wrap: wrap;
   justify-content: space-around;
   align-items: flex-start;
   position: relative;
   z-index: -2;
}
.social {
   display: flex;
   align-content: flex-start;
   justify-content: center;
   align-items: center;
   column-gap: 5px;
   flex-wrap: wrap;
   margin-right: 20px;
   font-size: 2rem;
}
.superslider img {
   /* height: calc(100vh - 104px);*/
   height: 100vh;
   object-fit: cover;
}
.fullimg {
   width: 100%;
}
.fullimg img {
   width: 100%;
   height: auto;
}
figure {
   padding: 0;
   margin: 0;
}
.com-content-article__body {
   width: 80%;
   margin: 0 auto;
   margin-top: 76px;
   padding-bottom: 100px;
}
.footer {
   background-image: url(../images/sfondo-footer.jpg);
   background-size: cover;
   color: var(--bianco);
}
footer a {
   color: var(--bianco);
}
ul.indirizzo {
   list-style: none;
   padding: 0;
}
.copyright p {
   text-align: center;
   font-size: 0.8rem;
   font-weight: 500;
   line-height: 3rem;
   padding: 0;
   margin: 0;
}
.colonne {
   display: flex;
   justify-content: space-evenly;
   align-content: flex-start;
   flex-wrap: wrap;
   padding-top: 25px;
}
.gotopbtn {
   position: fixed;
   width: 50px;
   height: 50px;
   background-color: var(--giallo-logo);
   bottom: 30px;
   right: 30px;
   text-decoration: none;
   text-align: center;
   line-height: 50px;
   color: var(--blu-logo);
   font-size: 22px;
   border-radius: 4px;
   z-index: 4000;
}
.imgtxtcentrato {
   position: relative;
   text-align: center;
   color: var(--bianco);
   font-family: "Titillium Web", sans-serif;
   font-size: 5rem;
   font-weight: 600;
}
.txt-centrato {
   position: absolute;
   top: 50%;
   left: 50%;
   transform: translate(-50%, -50%);
}
.txt-centrato span {
   font-size: 4rem;
}
.mar100 {
   margin-bottom: 100px;
}
.com-content-article.item-page figure.fullimg.item-image img {
   margin-top: 114px;
}
/************************* lista domande ************************/
p.margr {
   margin-left: 40px;
}
ol.alternating-colors {
   padding-left: 50px;
}
.alternating-colors li {
   color: var(--testi-contenuti);
   padding-left: 16px;
   margin-top: 28px;
   position: relative;
   font-size: 16px;
   line-height: 20px;
}
.alternating-colors li:before {
   content: "";
   display: block;
   height: 42px;
   width: 42px;
   border-radius: 50%;
   border: 2px solid #ddd;
   position: absolute;
   top: -12px;
   left: -39px;
}
.alternating-colors li::marker {
   font-weight: 700;
   color: var(--titoli);
}
.alternating-colors h3 {
   color: var(--testi-contenuti);
}
ol.alternating-colors li:nth-child(odd):before {
   border-color: var(--blu-logo);
}
ol.alternating-colors li:nth-child(even):before {
   border-color: var(--blu-logo);
}
.slash-2 {
   height: 8px;
   color: var(--blu-logo);
   background-image: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" width="3px" height="3px" viewBox="0 0 3 3" fill="steelblue"><polygon points="0,0.5 0,1.5 1.5,3 2.5,3"/><polygon points="2.5,0 1.5,0 3,1.5 3,0.5"/></svg>');
   background-size: 3px 3px;
   width: 65%;
}
/**************************** menu footer  ************************/
.mod-menu.piede {
   display: flex;
   flex-direction: column;
   align-items: flex-start;
}
.mod-menu.piede li a {
   color: var(--bianco);
   padding: 6px 0;
}
.mod-menu.piede li a:hover {
   background-color: transparent;
   color: var(--giallo-logo);
   text-decoration: underline;
}
/*********************************** carte ************************/
.contenitore-carte {
   /* max-width: 1100px;*/
   width: 100%;
   position: relative;
   z-index: 5;
}
.contenitore-carte i {
   height: 50px;
   width: 50px;
   color: var(--bianco);
   background: var(--blu-logo);
   text-align: center;
   line-height: 50px;
   border-radius: 50%;
   cursor: pointer;
   position: absolute;
   top: 50%;
   font-size: 1.25 rem;
   transform: translateY(-50%);
   box-shadow: 0 3px 6px rgba(0, 0, 0, 0.23);
}
.contenitore-carte i:first-child {
   left: -22px;
}
.contenitore-carte i:last-child {
   right: -22px;
}
.contenitore-carte .carosello {
   display: grid;
   grid-auto-flow: column;
   grid-auto-columns: calc((100% / 3) - -5px);
   gap: 16px;
   overflow-x: auto;
   scroll-snap-type: x mandatory;
   scroll-behavior: smooth;
   scrollbar-width: 0;
}
.carosello::-webkit-scrollbar {
   display: none;
}
.carta {
   padding: 10px;
}
.carosello :where(.carta, .imgcarta) {
   display: flex;
   align-items: center;
   justify-content: center;
}
.carosello.dragging {
   scroll-snap-type: none;
   scroll-behavior: auto;
}
.carosello.no-transition {
   scroll-behavior: auto;
}
.carosello.dragging .carta {
   cursor: grab;
   user-select: none;
}
.carosello .carta {
   scroll-snap-align: start;
   height: 476px;
   list-style: none;
   background: var(--bianco);
   display: flex;
   cursor: pointer;
   width: 98%;
   padding-bottom: 15px;
   align-items: center;
   justify-content: flex-start;
   flex-direction: column;
   border: 1px dashed var(--testi-contenuti);
}
/*
 .carta .imgcarta {
   background: green;
   width: 145px;
   height: 145px;
   border-radius: 50%;
 }
 */
.carta .imgcarta {
   width: 100%;
}
/*
 .carta .imgcarta img {
   width: 140px;
   height: 140px;
   object-fit: cover;
   border-radius: 50%;
   border: 4px solid #fff;
 }
   */
.carta .imgcarta img {
   width: 100%;
   object-fit: contain;
}
.carta h2 {
   font-family: "Titillium Web", sans-serif;
   font-weight: 600;
   font-size: 1.56rem;
   margin: 30px 0 5px;
   color: var(--blu-logo)
}
.carta span {
   color: var(--testi-contenuti);
   font-size: 0.9em;
   text-align: justify;
   font-weight: 400;
}
.carta h2 a {
   color: var(--blu-logo);
}
.carta h2 a:visited {
   color: var(--blu-logo);
}
@media screen and (max-width: 900px) {
   .contenitore-carte .carosello {
      grid-auto-columns: calc((100% / 2) - 9px);
   }
}
@media screen and (max-width: 600px) {
   .contenitore-carte .carosello {
      grid-auto-columns: 100%;
   }
}
/***************************** zona meta ****************************/
.bgimgdx {
   background-color: var(--blu-logo);
}
.meta {
   display: flex;
   color: var(--bianco);
   margin: 0px;
   font-weight: 500;
}
.meta p {
   padding: 0 50px;
}
.metasx {
   width: 50%;
   display: flex;
   flex-direction: column;
   flex-wrap: nowrap;
   align-content: center;
   justify-content: center;
   align-items: center;
}
.metasx h3 {
   font-size: 2rem;
}
.metadx {
   width: 50%;
}
.metadx img {
   width: 100%;
   height: 100%;
   object-fit: cover;
}
/***dx ***/
.bgimgsx {
   background-color: var(--grigino);
   margin-top: 50px;
}
.metadx {
   width: 50%;
   display: flex;
   flex-direction: column;
   flex-wrap: nowrap;
   align-content: center;
   justify-content: center;
   align-items: center;
}
.metadx h3 {
   font-size: 2rem;
   color: var(--blu-logo);
}
.metadx p {
   color: var(--blu-logo);
}
.metasx {
   width: 50%;
}
.metasx img {
   width: 100%;
   height: 100%;
   object-fit: cover;
}
.pulsante {
   background-color: var(--giallo-logo);
   padding: 12px 26px;
}
.pulsante a {
   color: var(--blu-logo);
   font-weight: 600;
}
/******************** social media manager *****************/
.margintop h2 {
   margin-top: 80px;
   font-size: 2.2rem;
}
.smm {
   max-height: 750px;
}
.smmsfondo {
   position: relative;
   top: 0;
   right: 0;
}
.smmsfondo img {
   width: 100%;
   height: 450px;
   object-fit: cover;
}
.smmgroup {
   position: relative;
   top: -420px;
}
.smm h3 {
   color: var(--blu-logo);
   font-size: 2rem;
}
.iconesmm {
   display: flex;
   flex-direction: row;
   flex-wrap: wrap;
   justify-content: space-evenly;
   align-items: center;
   align-content: space-between;
   margin: 60px 0;
}
.iconesmm i {
   color: var(--bianco);
   font-size: 4rem;
}
.socialcontenuti {
   width: 70%;
   margin: 0 auto;
}
.angry-smm {
   display: grid;
   grid-template-rows: 1fr;
   grid-template-columns: 1fr 1fr 1fr;
   gap: 0px;
}
#item-0 {
   background-color: var(--bianco);
   grid-row-start: 1;
   grid-column-start: 1;
   grid-row-end: 2;
   grid-column-end: 3;
   max-height: 460px;
}
#item-1 {
   background-color: var(--bianco);
   grid-row-start: 1;
   grid-column-start: 3;
   grid-row-end: 2;
   grid-column-end: 4;
   display: flex;
   flex-direction: column;
   align-content: flex-start;
   justify-content: space-evenly;
   align-items: flex-start;
   padding: 0 20px;
}
.angry-smm img {
   width: 100%;
   height: 100%;
   object-fit: cover;
}
/******************************** portfolio ************************/
.portfolio {
   display: grid;
   grid-template-columns: repeat(auto-fill, minmax(30%, 1fr));
   grid-gap: 10px;
   padding: 20px;
}
/* Animazione per gli elementi dispari */
@keyframes slideInFromLeft {
   0% {
      transform: translateX(-100%);
      opacity: 0;
   }
   100% {
      transform: translateX(0);
      opacity: 1;
   }
}
/* Animazione per gli elementi pari */
@keyframes slideInFromRight {
   0% {
      transform: translateX(100%);
      opacity: 0;
   }
   100% {
      transform: translateX(0);
      opacity: 1;
   }
}
/* Stile per i quadrati */
.quadrato {
   position: relative;
   border: 1px solid;
   box-sizing: border-box;
   opacity: 0;
   /* Gli elementi iniziano invisibili */
}
/* Applicazione delle animazioni */
.portfolio .quadrato:nth-child(odd) {
   animation: slideInFromLeft 0.6s ease forwards;
}
.portfolio .quadrato:nth-child(even) {
   animation: slideInFromRight 0.6s ease forwards;
}
/* Forzare il rapporto 1:1 */
.quadrato::before {
   content: '';
   display: block;
   padding-top: 100%;
}
.quadrato .immagine {
   position: absolute;
   top: 0;
   left: 0;
   height: 100%;
   width: 100%;
}
.portfolio figure {
   padding: 0;
   margin: 0;
}
.portfolio figure img {
   width: 100%;
   height: 100%;
   object-fit: cover;
}
.quadrato figcaption {
   background-color: #000000d9;
   position: absolute;
   width: 100%;
   z-index: 5;
   bottom: 0px;
}
.quadrato figcaption p {
   color: var(--bianco);
   text-align: center;
   font-size: 1.1rem;
   text-transform: uppercase;
}
.quadrato figcaption a {
   color: var(--bianco);
}
.quadrato figcaption a:hover {
   font-weight: 600;
}
/**************************** media query ***********************/
@media (min-width: 1921px) and (max-width: 3840px) {
   .carosello .carta {
      height: 630px;
   }
   #item-0 {
      max-height: 560px;
   }
}
/* Stile responsive (break point a 1280px) */
@media screen and (max-width: 1280px) {
   .burger-menu {
      display: block;
      /* Mostra il menu burger */
   }
   .mod-menu {
      display: none;
      /* Nasconde il menu */
      flex-direction: column;
      /* Dispone gli elementi in colonna */
      align-items: center;
      /* Allinea gli elementi al centro */
   }
   .mod-menu.show {
      display: flex;
      position: absolute;
      top: -30px;
      left: 0;
      width: 100%;
      background-color: #161515;
      z-index: 15;
      padding: 30px 0;
   }
   .mod-menu .nav-item {
      width: 100%;
      /* Gli elementi occupano tutta la larghezza */
   }
   .mod-menu .nav-item a {
      text-align: center;
      padding: 14px;
   }
   .mod-menu .nav-item a {
      color: #838383;
   }
}
@media (max-width: 720px) {
   .infocontatti {
      display: none;
   }
   .contenitore-carte .carosello {
      grid-auto-columns: calc((100% / 2) - -15px);
   }
   .meta {
      display: flex;
      color: var(--bianco);
      margin: 0px;
      font-weight: 500;
      flex-direction: column;
      align-items: center;
   }
   .metasx {
      width: 100%;
   }
   .metadx {
      width: 100%;
   }
   .pulsante {
      margin-bottom: 20px;
   }
   .socialcontenuti {
      width: 100%;
   }
   .angry-smm {
      display: flex;
      flex-direction: column;
      /* align-content: center; */
      align-items: center;
   }
   .page-header h1 {
      font-size: 2.0rem;
   }
   .com-content-article.item-page figure.fullimg.item-image img {
      margin-top: 100px;
  }
}
@media (max-width: 520px) {
   .mod-menu.show {
      top: 70px;
   }
   header.testata {
      position: fixed;
      /* overflow: hidden; */
      top: 0;
      background-color: #161515;
   }
   .burger-menu .bar {
      background-color: var(--grigio-logo);
   }
   .imgtxtcentrato {
      font-size: 2rem;
   }
   .txt-centrato span {
      font-size: 1.8rem;
   }
   .colonne {
      display: flex;
      justify-content: space-evenly;
      align-content: center;
      flex-wrap: wrap;
      padding-top: 25px;
      flex-direction: column;
   }
   .contenitore-carte .carosello {
      grid-auto-columns: calc((100% / 1) - -48px);
   }
   .page-header h1 {
      font-size: 1.7rem;
   }
}