html{
  scroll-behavior: smooth;
}

footer{
  color: #eee;
  background: linear-gradient(45deg, #0a0a0a, #3a4452);
  box-shadow: -.2rem -.2rem 1rem rgba(255, 255, 255, .1), .2rem .2rem .2rem rgba(0, 0, 0, .6);
  padding: 2rem;
  display: grid;
  grid-template-columns: 1fr auto;
}

.footerSx{
  padding-right: 2rem;
  font-size: .88rem;
}

.footerSx .ragioneSociale{
  font-weight: bold;
}

.footerSx .privacy{
  padding-top: .5rem;
}

footer > .footerDx{
  display: flex;
  align-items: center;
}

/* ================================================== Animazione scroll. ================================================== */

.scrollUp{
  height: 3.75rem;
  width: 2rem;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  border: .15rem solid #eee;
  border-radius: .15rem;
}

.arrow span{
  width: 1rem;
  height: 1rem;
  border: .15rem solid transparent;
  border-left-color: #eee;
  border-top-color: #eee;
  display: block;
  transform: rotate(45deg);
  animation: moveArrow 2s linear infinite;
}

@keyframes moveArrow{
  0%{
    opacity: 0;
    transform: translateY(1.5rem) rotate(45deg);
  }

  50%{
    opacity: 1;
  }

  100%{
    /* opacity: 1; */
    transform: translateY(-.5rem) rotate(45deg);
  }
}

/* _-_-_-_-_-_-_-_-_-_-_-_-_-_-_-_-_-_-_-_-_-_ Responsive design. _-_-_-_-_-_-_-_-_-_-_-_-_-_-_-_-_-_-_-_-_-_ */

@media only screen and (max-width: 500px){
  footer > .footerSx{
    display: block;
    padding-right: 0;
  }

  footer > .footerDx{
    display: none;
  }
}