@import url(https://fonts.googleapis.com/css?family=Exo:100);
/* Background data (Original source: https://subtlepatterns.com/grid-me/) */
/* Animazioni migliorate per loop continuo */

canvas {
  display: block; 
  vertical-align: bottom;
}

body {
  margin: 0;
  font:normal 75% Arial, Helvetica, sans-serif;
  color: #212529;

}

#particles-js {
  position: fixed;
  width: 100%;
  height: 100%;
  background-color: #f8f9fa;
  z-index: -1;
  }

.center {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}

.image {
  border-radius: 50%;
}

.header1 {
  font-family: "Righteous", cursive;
  font-size: 6vw;
}

.header2 {
  font-family: "Ubuntu Mono", monospace;
  font-size: 1.4vw;
}

.header3 {
  font-family: "Ubuntu Mono", monospace;
  font-size: 2.2vw;
}

.link1 {
  font-family: "Ubuntu Mono", monospace;
  font-size: 2.8vw;
  color: inherit;
  margin: 0px 5px 0px 5px;
  transition: 0.5s;
}

.link1:hover {
  color: #fd7e14;
}

@media screen and (max-width: 785px) {
  .header1 {
    font-size: 8vw;
  }
  .link1 {
    font-size: 4vw;
  }
  .image {
    width: 65%;   /* Imposta una larghezza fissa per i dispositivi mobili */
    height: auto;  /* Mantiene le proporzioni */
  }
}

@media screen and (max-width: 765px) {
  body {
    text-align: center;
  }
  .header1 {
    font-size: 9vw;
  }
  .header2 {
    font-size: 2.5vw;
  }
  .link1 {
    font-size: 5vw;
  }
  .image {
    width: 65%;  /* Imposta una larghezza fissa per i dispositivi mobili */
    height: auto;  /* Mantiene le proporzioni */
  }
}

@media screen and (min-width: 1390px) {
  .header2 {
    font-size: 1.1vw;
  }
}

@-webkit-keyframes bg-scrolling-reverse {
  100% {
    background-position: 0px 0px;
  }
}
@-moz-keyframes bg-scrolling-reverse {
  100% {
    background-position: 0px 0px;
  }
}
@-o-keyframes bg-scrolling-reverse {
  100% {
    background-position: 0px 0px;
  }
}
@keyframes bg-scrolling-reverse {
  100% {
    background-position: 0px 0px;
  }
}

@-webkit-keyframes bg-scrolling {
  0% {
    background-position: 0px 0px;
  }
  100% {
    background-position: 100px 100px;
  }
}
@-moz-keyframes bg-scrolling {
  0% {
    background-position: 0px 0px;
  }
  100% {
    background-position: 100px 100px;
  }
}
@-o-keyframes bg-scrolling {
  0% {
    background-position: 0px 0px;
  }
  100% {
    background-position: 100px 100px;
  }
}
@keyframes bg-scrolling {
  0% {
    background-position: 0px 0px;
  }
  100% {
    background-position: 100px 100px;
  }
}