#attivita {
  background-color: #dde3dc;
  padding-top: 10rem;
}

#attivita h3 {
  font-family: "Titan One", regular;
  font-size: 4em;
  color: #3AB08A;
  text-shadow: -4px 3px #72c4e4;
  text-align: center;
  margin: 0 0rem 5rem 0rem;
  letter-spacing: 0.2rem;
  font-weight: 1;
}

#fotona1 {
  display: flex;
  justify-content: right;
  align-items: center;
  background-repeat: no-repeat;
  background-size: cover;
  height: 73vh;
  width: 100vw;
    background-image: url("../assets/img/1.png");
  margin: 0 0 0 0;
  padding: 0 0 0 0;
  position: relative;
  z-index: 2;
}

#fotona2 {
  display: flex;
  justify-content: left;
  align-items: center;
  background-repeat: no-repeat;
  background-size: cover;
  height: 78vh;
  width: 100vw;
    background-image: url("../assets/img/2.png");
  margin: -5vh 0 0 0;
  padding: 0 0 0 0;
  position: relative;
  z-index: 1;
}

#fotona3 {
  display: flex;
  justify-content: right;
  align-items: center;
  background-repeat: no-repeat;
  background-size: cover;
  height: 71vh;
  width: 100vw;
    background-image: url("../assets/img/3.png");
  margin: -4vh 0 0 0;
  padding: 0 0 0 0;
  position: relative;
  z-index: 2;
}

.riquadrino {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  padding: 2.5rem 0 2.5rem 0;
  max-width: 28rem;
  background-color: rgba(218, 228, 232, 0.8);
  border-radius: 30px;
}

#fotona1 .riquadrino {
  margin: 0 8rem 0 0rem;
}

#fotona2 .riquadrino {
  margin: 0 0 0 8rem;
}

#fotona3 .riquadrino {
  margin: 0 8rem 0 0rem;
}

.riquadrino p {
  font-family: "nunito sans", sans-serif;
  font-weight: 450;
  font-size: 1.3em;
  color: #2e073f;
  margin: 0 3rem 0 3rem;
}

.riquadrino button {
  margin: 1.5rem 8rem 0 8rem;
  padding: 0.1rem 0rem 0.1rem 0rem;
  background-color: rgba(218, 228, 232, 0.6);
  color: #2e073f;
  border-radius: 30px;
  font-size: 1em;
  font-family: "nunito sans", sans-serif;
  font-weight: bold;
  border: #2e073f 2px solid;
  cursor: pointer;
}

.riquadrino button:active {
  background-color: rgba(208, 219, 224, 0.5);
  color: rgba(46, 7, 63, 0.6);
  border: rgba(46, 7, 63, 0.6) 2px solid;
}

#linkino {
  flex-direction: column;
  background-color: transparent;
  width: 100vw;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #2e073f;
  font-family: "nunito sans", sans-serif;
  font-weight: 650;
  font-size: 2.3em;
  margin-top: -2rem;
  padding-top: 1rem;
}

#linkino a {
  text-decoration: #2e073f underline 3px;
  margin-top: 7vh;
  z-index: 1;
}

#linkino a:active {
  color: rgba(47, 6, 63, 0.6);
  text-decoration-color: rgba(47, 6, 63, 0.6);
}

#linkino .ondabella {
  width: 100%;
  overflow: hidden;
  clip-path: polygon(
    100% 0%,
    0% 0%,
    0% 86.52%,
    2% 85.71%,
    4% 84.92%,
    6% 84.19%,
    8% 83.55%,
    10% 83%,
    12% 82.59%,
    14% 82.31%,
    16% 82.18%,
    18% 82.21%,
    20% 82.39%,
    22% 82.71%,
    24% 83.17%,
    26% 83.75%,
    28% 84.43%,
    30% 85.18%,
    32% 85.98%,
    34% 86.79%,
    36% 87.6%,
    38% 88.37%,
    40% 89.08%,
    42% 89.69%,
    44% 90.19%,
    46% 90.56%,
    48% 90.79%,
    50% 90.87%,
    52% 90.79%,
    54% 90.56%,
    56% 90.19%,
    58% 89.69%,
    60% 89.08%,
    62% 88.37%,
    64% 87.6%,
    66% 86.79%,
    68% 85.98%,
    70% 85.18%,
    72% 84.43%,
    74% 83.75%,
    76% 83.17%,
    78% 82.71%,
    80% 82.39%,
    82% 82.21%,
    84% 82.18%,
    86% 82.31%,
    88% 82.59%,
    90% 83%,
    92% 83.55%,
    94% 84.19%,
    96% 84.92%,
    98% 85.71%,
    100% 86.52%
  );
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: center;
  height: 10rem;
  background-color: #72c4e4;
  margin-top: -4vh;;
}

@media screen and (max-width: 600px) {
  #attivita {
    padding-top: 3.5rem;
  }

  #attivita h3 {
    font-size: 1.5em;
    text-shadow: -3px 2px #72c4e4;
    margin: 0 0rem 1.5rem 0rem;
    font-weight: 1;
  }

  #fotona1 {
    background-position-x: -32vh;
    height: 50vh;
  }

  #fotona2 {
    background-position-x: -22vh;
    height: 50vh;
  }

  #fotona3 {
    background-position-x: -29vh;
    height: 50vh;
  }

  #linkino .ondabella img {
    scale: 110%;
  }

  .riquadrino p {
    font-weight: 500;
    font-size: 0.9em;
    line-height: 1.2;
    margin: 1rem 1rem 0rem 1rem;
  }

  .riquadrino button {
    margin: 0.8rem 2rem 1rem 2rem;
    padding: 0.2rem 0rem 0.2rem 0rem;
    font-size: 0.9em;
    font-weight: 600;
    border: #2e073f 1.5px solid;
  }

  .riquadrino {
    max-width: 10rem;
    border-radius: 30px;
    padding: 0.2rem 0rem 0.2rem 0rem;
  }

  #fotona1 .riquadrino {
    margin: 0 2rem 0 0rem;
  }

  #fotona2 .riquadrino {
    margin: 0 0 0 2rem;
  }

  #fotona3 .riquadrino {
    margin: 0 2rem 0 0rem;
  }

  #linkino {
    font-size: 0.9em;
    padding-top: 0.3rem;
  }

  #linkino a {
    margin-top: 13vh;
    text-decoration: #2e073f underline 2px;
  }

  #linkino .ondabella {
    margin-top: -8vh;
  }
}

@media screen and (min-width: 2560px) {
  #attivita h3 {
    font-size: 7em;
  }

  #fotona1, #fotona2, #fotona3 {
    height: 55vh;
  }

  .riquadrino {
    padding: 2.5rem 1rem 2.5rem 1rem;
    max-width: 40rem;
  }

  .riquadrino p {
    font-size: 2.3em;
  }

  .riquadrino button {
    font-size: 1.6em;
    padding: 0.3rem 0.5rem 0.3rem 0.5rem;
  }

  #linkino .ondabella {
    height: 18vh;
  }

  #linkino a {
    margin-top: 8vh;
    font-size: 1.5em;
  }
}

@media screen and (min-width: 1024px) and (max-width: 1300px) {
  #linkino a {
    margin-top: 8.5vh;
  }
}