body {
  font-family: 'Open Sans', sans-serif;
}

@media (min-width: 20px) {
  #finestra {
    margin-top: 100px;
    margin-left: 10%;
    margin-right: 10%;
  }
}

@media (min-width: 576px) {
  #finestra {
    margin-top: 100px;
    margin-left: 10%;
    margin-right: 10%;
  }
}

@media (min-width: 768px) {
  #finestra {
     margin-top: 100px;
     margin-left: 20%;
     margin-right: 20%;
  }
}

@media (min-width: 992px) {
  #finestra {
     margin-top: 120px;
     margin-left: 25%;
     margin-right: 25%;
  }
}

@media (min-width: 1200px) {
  #finestra {
     margin-top: 120px;
     margin-left: 30%;
     margin-right: 30%;
  }
}

.text-lila {
  color: #603f90 !important;
}

.bg-lila {
  background-color: #603f90 !important;
}

.btn-lila {
  color: #f8f9fa;
  background-color: #603f90;
  border-color: #603f90;
}

.btn-lila:hover {
  color: #f8f9fa;
  background-color: #563881;
  border-color: #0062cc;
}

.btn-lila:focus, .btn-lila.focus {
  color: #f8f9fa;
  background-color: #563881;
  border-color: #0062cc;
  box-shadow: 0 0 0 0.2rem rgba(38, 143, 255, 0.5);
}

.btn-lila.disabled, .btn-lila:disabled {
  color: #f8f9fa;
  background-color: #603f90;
  border-color: #603f90;
}

.btn-lila:not(:disabled):not(.disabled):active, .btn-lila:not(:disabled):not(.disabled).active,
.show > .btn-lila.dropdown-toggle {
  color: #f8f9fa;
  background-color: #0062cc;
  border-color: #005cbf;
}

.btn-lila:not(:disabled):not(.disabled):active:focus, .btn-lila:not(:disabled):not(.disabled).active:focus,
.show > .btn-lila.dropdown-toggle:focus {
  box-shadow: 0 0 0 0.2rem rgba(38, 143, 255, 0.5);
}