@font-face {
  font-family: 'Lexend';
  src: url('../../../assets/fonts/Lexend/Lexend-VariableFont_wght.ttf') format('truetype');
}

.footer {
  bottom: 0px;
  left: 0px;
  width: 100%;
  right: 0px;
  color: rgb(251,251,251);
  opacity: 0.8;
  position: fixed;
  z-index: 3;
  background-color: rgb(39, 39, 39);
  text-shadow: 1px 1px 2px rgba(42, 42, 42, 0.8);
  font-family: Lexend !important;
  display: grid;
  grid-template-columns: 8% 90%;
  grid-template-rows: 23% 54% 23%;
  height: 52px;
}

.footer .copyright {
  font-size: 1rem;
  grid-row: 2;
  grid-column: 2;
  display: grid;
  grid-template-columns: 20% 30% 40%;
  grid-template-rows: 10% 80% 10%;
}

.footer .copyright .copyleft-inside {
  grid-column: 1;
}

.footer .copyright .copyleft-version {
  grid-column: 2;
}

.footer .copyright .footer-contact {
  grid-column: 3;
  grid-row: 2;
  display: grid;
  grid-template-columns: 12% 88%;
  grid-template-rows: 15% 85% 15%;
}

.footer .copyright .footer-contact .footer-contact-icon {
  grid-column: 1 !important;
  color: beige;
}

.footer .copyright .footer-contact .footer-contact-link {
  grid-column: 2;
  color: white;
  text-decoration: none;
  font-size: 12px;
}