.at-perlapa-attestazioni {
  margin: 1.5rem 0;
}

.at-perlapa-riga {
  display: flex;
  align-items: center;
  gap: 1.25rem;
  padding: 1rem;
  margin: 0 0 .75rem;
  background: #f7f9fb;
  border: 1px solid #e1e5e8;
  border-radius: .5rem;
}

.at-perlapa-anno {
  display: flex;
  align-items: center;
  min-width: 235px;
  padding: .8rem 1.25rem;
  font-size: 1.15rem;
  font-weight: 700;
  color: #fff;
  background: #0655a3;
  border-radius: .25rem;
}

.at-perlapa-anno::before {
  content: "▣";
  display: inline-block;
  margin-right: .75rem;
  font-size: 1.25rem;
}

.at-perlapa-azioni {
  display: flex;
  align-items: center;
  gap: 1rem;
  flex-wrap: wrap;
}

.at-perlapa-link {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 180px;
  padding: .75rem 1.25rem;
  border: 1px solid;
  border-radius: .5rem;
  font-weight: 700;
  text-decoration: none !important;
  transition:
    background-color .15s ease-in-out,
    border-color .15s ease-in-out,
    box-shadow .15s ease-in-out;
}

.at-perlapa-link::before {
  display: inline-block;
  margin-right: .65rem;
  font-size: 1.2rem;
}

.at-perlapa-link-perlapa {
  color: #0667c9 !important;
  background: #eaf4ff;
  border-color: #7bb6ee;
}

.at-perlapa-link-perlapa::before {
  content: "↗";
  font-size: 1.45rem;
}

.at-perlapa-link-perlapa:hover,
.at-perlapa-link-perlapa:focus {
  color: #034f9c !important;
  background: #d9edff;
  border-color: #0667c9;
  box-shadow: 0 0 0 .2rem rgba(6, 103, 201, .15);
}

.at-perlapa-link-attestazioni {
  color: #08783e !important;
  background: #ebf8ef;
  border-color: #78c898;
}

.at-perlapa-link-attestazioni::before {
  content: "▤";
  font-size: 1.35rem;
}

.at-perlapa-link-attestazioni:hover,
.at-perlapa-link-attestazioni:focus {
  color: #055f31 !important;
  background: #dcf3e4;
  border-color: #08783e;
  box-shadow: 0 0 0 .2rem rgba(8, 120, 62, .15);
}

@media (max-width: 767.98px) {
  .at-perlapa-riga {
    align-items: stretch;
    flex-direction: column;
    gap: .75rem;
  }

  .at-perlapa-anno {
    min-width: 0;
    width: 100%;
  }

  .at-perlapa-azioni {
    width: 100%;
    gap: .75rem;
  }

  .at-perlapa-link {
    min-width: 0;
    flex: 1 1 160px;
  }
}
