.scrolly {
  position: relative;
  background-color: #160d33;
  padding: 1rem 0;
}

.scrolly article {
  position: relative;
  padding: 0;
  max-width: 30rem;
  margin: 0 auto;
  margin-top: -95vh;
}

body:not(.backgroundAdv) .scrolly article {
  max-width: 40rem;
}

.scrolly figure {
  position: -webkit-sticky;
  position: sticky;
  left: 0;
  width: 100%;
  margin: 0;
  -webkit-transform: translate3d(0, 0, 0);
  -moz-transform: translate3d(0, 0, 0);
  transform: translate3d(0, 0, 0);
  z-index: 5;
  height: 100vh !important;
}

.figure_container {
  position: relative;
  height: inherit;
}

.scrolly .figure_bg_even {
  background: linear-gradient(270deg, #2d1380 0%, rgba(45, 19, 128, 0) 100%);
  transition: 0.3s all ease-out;
  height: inherit;
  position: absolute;
  top: 0;
  left: 0;
}

.scrolly .figure_bg_odd {
  background: linear-gradient(90deg, #2d1380 0%, rgba(45, 19, 128, 0) 100%);
  transition: 0.3s all ease-out;
  height: inherit;
  opacity: 0;
  position: absolute;
  top: 0;
  left: 0;
}

.bio_img {
  width: 100%;
  height: 100%;
  position: absolute;
  bottom: 0;
  opacity: 0;
  background-position: center bottom;
  background-repeat: no-repeat;
  background-size: contain;
}

.bio_img:nth-child(odd) {
  left: -20%;
}
.bio_img:nth-child(even) {
  left: 20%;
}

#bio_fam_img_0 {
  background-image: url("../img/bio/fam/0.png");
}

#bio_fam_img_1 {
  background-image: url("../img/bio/fam/1.png");
}

#bio_fam_img_2 {
  background-image: url("../img/bio/fam/2.png");
}

#bio_fam_img_3 {
  background-image: url("../img/bio/fam/3.png");
}

#bio_fam_img_4 {
  background-image: url("../img/bio/fam/4.png");
}

#bio_fam_img_5 {
  background-image: url("../img/bio/fam/5.png");
}

#bio_fam_img_6 {
  background-image: url("../img/bio/fam/6.png");
}

#bio_fam_img_7 {
  background-image: url("../img/bio/fam/7.png");
}

#bio_fam_img_8 {
  background-image: url("../img/bio/fam/8.png");
}

#bio_chiave_img_0 {
  background-image: url("../img/bio/chiave/0.png");
}

#bio_chiave_img_1 {
  background-image: url("../img/bio/chiave/1.png");
}

#bio_chiave_img_2 {
  background-image: url("../img/bio/chiave/2.png");
}

#bio_chiave_img_3 {
  background-image: url("../img/bio/chiave/3.png");
}

#bio_chiave_img_4 {
  background-image: url("../img/bio/chiave/4.png");
}

#bio_chiave_img_5 {
  background-image: url("../img/bio/chiave/5.png");
}

#bio_chiave_img_6 {
  background-image: url("../img/bio/chiave/6.png");
}

.scrolly article {
  z-index: 10;
}

.scrolly .step {
  width: 630px;
  margin: 0 auto 60vh auto;
  background: transparent;
  height: 180vh;
  display: flex;
  justify-content: center;
  align-items: end;
}

.scrolly .step:nth-child(odd) {
  margin-right: -80%;
}

.scrolly .step:nth-child(even) {
  margin-left: -80%;
}

.scrolly .step_fam:last-child {
  /* margin-bottom: 100px; */
  margin-bottom: 300px;
}

.scrolly .step_chiave:last-child {
  /* margin-bottom: 100px; */
  margin-bottom: 300px;
}

.scrolly .step_content {
  background: #2d1380;
  border: 2px solid #2d1380;
  width: inherit;
  color: #cbceef;
  padding: 30px;
}

.scrolly .step .nome_info_svg {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: center;
}

.scrolly .step .nome_info {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: flex-start;
}

.scrolly .step .nome {
  font-family: "bicyclette", sans-serif;
  font-style: normal;
  font-weight: 700;
  font-size: 32px;
  line-height: 36px;
  color: #ffffff;
  text-align: left;
}

.scrolly .step .info {
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  align-items: flex-start;
  padding: 10px 0;
  margin: 10px 0;
  border-top: 2px solid #160d33;
  border-bottom: 2px solid #160d33;
}

.scrolly .step .info_riga {
  display: flex;
  flex-direction: row;
  justify-content: flex-start;
  align-items: flex-start;
}

.scrolly .step .info_sx {
  width: 30%;
  font-family: "bicyclette", sans-serif;
  font-style: normal;
  font-weight: 700;
  font-size: 18px;
  line-height: 28px;
  color: #cfff33;
  text-align: left;
  text-transform: capitalize;
}

.scrolly .step .info_dx {
  width: 70%;
  font-style: normal;
  font-weight: 400;
  font-size: 18px;
  line-height: 28px;
  color: #cbceef;
  text-align: left;
}

.scrolly .step .bio_donut_chart {
  text-align: right;
  width: 250px;
  padding-left: 20px;
}

.scrolly .step .bio_testo {
  font-family: "bicyclette", sans-serif;
  font-style: normal;
  font-weight: 400;
  font-size: 18px;
  line-height: 28px;
  color: #cbceef;
  text-align: left;
}

.scrolly .step .bio_firma {
  font-family: "bicyclette", sans-serif;
  color: #cbceef;
  font-size: 14px;
  line-height: 16px;
  letter-spacing: 1.4px;
  text-transform: uppercase;
  text-align: left;
  padding-top: 20px;
}

/* .box_crediti {
  margin-bottom: 130px;
}

#footer_div {
  position: absolute;
  bottom: 0;
} */

@media only screen and (min-width: 820px) and (max-width: 1560px) {
  .scrolly .step:nth-child(odd) {
    margin-right: -50%;
  }

  .scrolly .step:nth-child(even) {
    margin-left: -50%;
  }

  body:not(.backgroundAdv) .scrolly article {
    max-width: 30rem;
  }
}