@import url('variables.css');

#footer {
  background: var(--footer__background-color);
  border-top: 0.2em solid var(--color-ruler);
  height: fit-content;
  padding-top: 0;
}

.footer-block {
  display: flex;
  justify-content: space-between;
}

#footer a {
  color: var(--dark-common-text);
}
.footer-requisites {
  padding: 1em;
  border-top: 0.1em solid transparent;
}
.footer-requisites__list-item {
  list-style: square;
  list-style-position: inside;
}
.footer-requisites__list-item::marker {
  color: var(--special-text);
}

.footer-phone {
  padding: 1em;
  text-align: center;
}
.footer-phone h3 {
  color: var(--special-text);
  font-weight: bold;
}

.footer-lines {
  border: 0.1em solid var(--color-ruler);
  border-right: transparent;
  padding-right: 1em;
}

.footer-socials {
  text-align: center;
  padding: 1em;
}

.footer-copyright {
  padding: 1em;
  text-align: center;
  border-top: 0.1em solid var(--color-ruler);
  margin-top: -0.1em;
}
.footer-content {
  width: 60%;
  display: flex;
  flex-direction: column;
}
.footer-logo {
  width: 35%;
  margin: auto;
  padding: 2em;
  transition: all 0.5s;
  border: 0.3em solid transparent;
}

.footer-logo:hover {
  border: 0.3em solid var(--special-text);
  border-radius: 2em;
}

.footer-space {
  width: 5%;
  background: -o-linear-gradient(
    135deg,
    rgba(230, 230, 230, 0) 48%,
    var(--color-ruler) 50%,
    rgba(230, 230, 230, 0) 52%
  );
  background: linear-gradient(
    -45deg,
    rgba(230, 230, 230, 0) 48%,
    var(--color-ruler) 50%,
    rgba(230, 230, 230, 0) 52%
  );
  background-size: 1em 1em;
  border-left: 0.1em solid var(--color-ruler);
}

.footer-logo__img {
  width: 100%;
}